:root {
  /* ===== 雅致翡翠 · 主色（沿用变量名，全站 var() 自动换肤） ===== */
  --wechat-green: #0f8a5f;        /* 主翡翠 */
  --wechat-green-dark: #0b6e4a;   /* 深翡翠（hover / 按下） */
  --jade: #0f8a5f;
  --jade-dark: #0b6e4a;
  --jade-ink: #0c6b48;            /* 强调文字（统一原先各种深绿） */
  --jade-soft: #e7f4ec;           /* 浅翡翠底（hover / 选中） */
  --jade-softer: #f1f8f3;         /* 更浅翡翠底 */
  --jade-line: rgba(15,138,95,.30);
  --jade-ring: rgba(15,138,95,.45);

  /* ===== 中性 / 背景（暖灰绿，沉稳不刺眼） ===== */
  --wechat-bg: #e8ece8;           /* 中性底（侧栏 / 应用底层等仍用） */
  --chat-canvas: #ffffff;         /* 聊天区 / 消息区画布：纯白，去掉大灰背景 */
  --wechat-panel: #f3f6f2;        /* 工具条 / 输入区底 */
  --wechat-line: #dce1db;         /* 统一描边（更柔） */
  --sidebar: #f1f4f0;
  --canvas: #e2e7e1;              /* body 背景 */
  --surface: #ffffff;             /* 卡片 / 弹窗面 */
  --surface-2: #f6f8f5;           /* 次级面（条目底 / 输入框组） */
  --surface-3: #eef2ed;           /* 三级面（分段控件槽） */

  /* ===== 文本 ===== */
  --text: #20251f;
  --muted: #79817a;
  --quiet: #a8aea6;

  /* ===== 气泡 ===== */
  --bubble-me: #c8ecd6;           /* 我方 · 浅翡翠 */
  --bubble-ai: #ffffff;           /* AI · 纯白 */

  /* ===== 语义色 ===== */
  --danger: #e0574c;
  --warn: #c9821f;
  --info: #3f72c4;
  --accent2: #6d5efc;             /* 次强调：创作库 / 剧情图 / 文风（保留紫，做点缀） */

  /* ===== 圆角阶 ===== */
  --radius: 10px;
  --r-xs: 7px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-pill: 999px;

  /* ===== 阴影阶（柔和、统一） ===== */
  --shadow-xs: 0 1px 2px rgba(24,40,32,.05);
  --shadow-sm: 0 2px 8px rgba(24,40,32,.07);
  --shadow-md: 0 8px 24px rgba(24,40,32,.10);
  --shadow-lg: 0 18px 50px rgba(24,40,32,.16);
  --shadow-pop: 0 12px 34px rgba(24,40,32,.16);

  /* ===== 字体（按要求保持不变 · 灰体 / 雅黑） ===== */
  --sans: "Microsoft YaHei UI", "Segoe UI", "Noto Sans SC", sans-serif;
  --serif: "PingFang SC", "Microsoft YaHei", "Microsoft YaHei UI", "Source Han Sans SC", "Noto Sans SC", "Hiragino Sans GB", "Segoe UI", sans-serif;
  --mono: Consolas, "SFMono-Regular", Menlo, monospace;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background: #d9d9d9;
  color: var(--text);
  font-family: var(--sans);
  font-size: 14px;
  letter-spacing: 0;
}
button, input, textarea, select { font: inherit; }
button {
  border: 0;
  border-radius: var(--radius);
  background: transparent;
  color: var(--text);
  min-height: var(--ctl-h);
  min-width: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 10px;
  cursor: pointer;
}
button:hover { background: rgba(0,0,0,.06); }
button.primary { color: #fff; background: var(--wechat-green); }
button.primary:hover { background: var(--wechat-green-dark); }
button.icon { width: 34px; padding: 0; }
input, textarea, select {
  width: 100%;
  border: 1px solid transparent;
  outline: none;
  background: #fff;
  color: var(--text);
  border-radius: var(--radius);
}
input, select { height: var(--ctl-h); padding: 0 10px; }
textarea { resize: none; min-height: 82px; padding: 10px 12px; line-height: 1.55; }
input:focus, textarea:focus, select:focus { border-color: rgba(15,138,95,.45); }
svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.spinner {
  width: 14px;
  height: 14px;
  border-radius: var(--r-pill);
  border: 2px solid rgba(255,255,255,.45);
  border-top-color: #fff;
  animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.app {
  width: 100%;
  min-height: calc(100dvh * var(--app-unzoom, 1));
  margin: auto;
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr);
  background: var(--chat-canvas);
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
}
.rail {
  height: calc(100dvh * var(--app-unzoom, 1));
  width: 76px;
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 20;
  background: #2e2e2e;
  color: #ddd;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 16px 10px;
  gap: 14px;
}
.me-avatar {
  width: 44px;
  height: 44px;
  border-radius: 5px;
  background: linear-gradient(135deg, #36d983, #0a9c55);
  color: white;
  display: grid;
  place-items: center;
  font-weight: 800;
  margin: 0 auto;
}
.rail-stack { display: grid; gap: 8px; align-content: start; }
.rail button.icon {
  width: 56px;
  min-height: 54px;
  display: grid;
  place-items: center;
  gap: 2px;
  color: #d7d7d7;
  border-radius: var(--r-xs);
}
.rail button.icon span { font-size: 11px; line-height: 1; }
.rail button.icon svg { width: 20px; height: 20px; }
.rail button.active, .rail button:hover { color: #fff; background: rgba(255,255,255,.1); }
.rail button.danger:hover { background: rgba(220, 68, 68, .18); }
.conversations {
  grid-column: 1;
  height: calc(100dvh * var(--app-unzoom, 1));
  position: sticky;
  top: 0;
  background: var(--sidebar);
  border-right: 1px solid var(--wechat-line);
  perspective: 1600px;
  overflow: hidden;
  min-width: 0;
}
.conv-flip { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform .55s cubic-bezier(.4,0,.2,1); }
.conversations.flipped .conv-flip { transform: rotateY(180deg); }
.conv-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; background: var(--sidebar); overflow: hidden; }
.conv-front { display: grid; grid-template-rows: 60px auto minmax(0, 1fr); }
.conv-back { transform: rotateY(180deg); display: flex; flex-direction: column; }
.conversations:not(.flipped) .conv-back { pointer-events: none; }
.conversations.flipped .conv-front { pointer-events: none; }
.pm-head { display: flex; align-items: center; justify-content: space-between; height: 60px; padding: 0 14px; border-bottom: 1px solid var(--wechat-line); font-weight: 700; }
.pm-title { font-size: 15px; }
.pm-toolbar { display: flex; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--wechat-line); }
.pm-toolbar select { flex: 1; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 8px; font-size: 13px; }
.pm-preset-label { flex: 1; min-width: 0; font-size: 13px; font-weight: 600; color: #2b3a30; background: #f3f7f4; border: 1px solid #dbe7df; border-radius: var(--r-sm); padding: 7px 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pm-toolbar button { border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-sm); padding: 6px 10px; font-size: 12.5px; cursor: pointer; }
.pm-summary { display: flex; justify-content: space-between; padding: 8px 14px; font-size: 12px; color: var(--muted); }
.pm-list { flex: 1; min-height: 0; overflow-y: auto; padding: 0 8px 8px; }
.pm-hint { font-size: 11px; color: var(--muted); padding: 8px 14px; border-top: 1px solid var(--wechat-line); margin: 0; }
.pm-row { display: grid; grid-template-columns: 18px 18px minmax(0,1fr) auto 34px; align-items: center; gap: 8px; padding: 9px 8px; border-radius: var(--r-sm); }
.pm-row:hover { background: rgba(0,0,0,.03); }
.pm-row.off { opacity: .45; }
.pm-row.dragging { opacity: .4; }
.pm-row.drop-target { box-shadow: 0 -2px 0 0 #0f8a5f inset; }
.pm-drag { cursor: grab; color: var(--muted); text-align: center; user-select: none; }
.pm-type { text-align: center; font-size: 13px; }
.pm-type.pin { color: #e07b00; }
.pm-type.marker { color: #6d5efc; }
.pm-type.plain { color: #9aa4b2; }
.pm-name { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-tok { font-size: 11px; color: var(--muted); font-family: var(--mono); }
.pm-switch { position: relative; display: inline-block; width: 34px; height: 20px; }
.pm-switch input { opacity: 0; width: 0; height: 0; }
.pm-slider { position: absolute; inset: 0; background: #cfd2d8; border-radius: var(--r-pill); transition: .2s; }
.pm-slider::before { content: ''; position: absolute; width: 16px; height: 16px; left: 2px; top: 2px; background: #fff; border-radius: 50%; transition: .2s; }
.pm-switch input:checked + .pm-slider { background: #0f8a5f; }
.pm-switch input:checked + .pm-slider::before { transform: translateX(14px); }

/* ===== SillyTavern 风格提示词管理器（左侧实时面板 + 完整弹窗共用）===== */
.pm-actions { display: flex; gap: 6px; padding: 2px 12px 8px; flex-wrap: wrap; border-bottom: 1px solid var(--wechat-line); }
.pm-iconbtn { width: 34px; height: var(--ctl-h-sm); display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-sm); color: #5a5f6a; cursor: pointer; padding: 0; }
.pm-iconbtn:hover { background: #f3f4f6; color: #1f2329; }
.pm-iconbtn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pm-listhead { display: flex; justify-content: space-between; padding: 4px 14px 4px; font-size: 11px; color: var(--muted); letter-spacing: .5px; }
/* 当前角色 + 预设绑定状态条（让「预设按角色绑定」一目了然） */
.pm-who { padding: 6px 12px; font-size: 12px; color: #4a4f59; background: #f3f7f4; border-bottom: 1px solid var(--wechat-line); line-height: 1.5; word-break: break-all; }
/* 空预设说明（下面列的是发送时仍会注入的动态区块，只读） */
.pm-blank-note { margin: 0 12px 6px; padding: 8px 10px; font-size: 11.5px; color: #7a6a3a; background: #fcf7e8; border: 1px solid #f0e4bf; border-radius: var(--r-sm); line-height: 1.6; }

.stpm-list { display: block !important; }
.stpm-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 46px; align-items: center; gap: 6px; padding: 7px 8px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); margin-bottom: 6px; position: relative; background: #fff; }
.pm-list .stpm-row { background: transparent; border-color: #ededf0; grid-template-columns: minmax(0, 1fr) auto 38px; gap: 4px; padding: 6px 6px; margin-bottom: 4px; }
.stpm-row.off { opacity: .5; }
.stpm-row.dragging { opacity: .4; }
.stpm-row.drop-target { box-shadow: 0 -2px 0 0 var(--wechat-green) inset; }
.stpm-row.draggable { padding-left: 18px; }
.stpm-drag { position: absolute; left: 0; top: 0; height: 100%; display: flex; align-items: center; padding: 0 5px; color: #c2c6cf; cursor: grab; user-select: none; font-size: 12px; }
.stpm-drag:active { cursor: grabbing; }
.stpm-name { display: flex; align-items: center; gap: 5px; min-width: 0; }
.stpm-ticon { display: inline-flex; width: 15px; height: 15px; color: #9aa1ad; flex: 0 0 auto; }
.stpm-ticon svg { width: 15px; height: 15px; }
.stpm-label { flex: 1 1 auto; min-width: 0; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.stpm-row:not(.off) .stpm-label:hover { text-decoration: underline; }
.stpm-role { display: inline-flex; width: 13px; height: 13px; color: #b3b8c2; flex: 0 0 auto; }
.stpm-role svg { width: 13px; height: 13px; }
.stpm-depth { color: var(--muted); font-size: 11px; font-family: var(--mono); flex: 0 0 auto; }
.stpm-ctrls { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.stpm-act { width: 22px; height: 22px; min-height: 0; padding: 0; border: 0; background: transparent; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; color: #9aa1ad; opacity: .55; transition: opacity .15s ease, color .15s ease; }
.stpm-act:hover { opacity: 1; }
.stpm-act svg { width: 16px; height: 16px; }
.stpm-detach { color: #d9534f; opacity: .62; }
.stpm-detach:hover { color: var(--danger); opacity: 1; }
.stpm-edit:hover { color: #4a4f59; }
.stpm-toggle { color: #c4c8d0; opacity: 1; }
.stpm-row:not(.off) .stpm-toggle { color: var(--wechat-green); }
.stpm-ph { width: 20px; height: 20px; display: inline-block; }
.stpm-tok { text-align: right; font-size: 11.5px; color: var(--muted); font-family: var(--mono); }

/* 单条目编辑弹窗 */
.pme-modal { width: min(680px, 94vw); max-height: 92vh; }
.pme-grid { display: grid; grid-template-columns: 1fr 1fr 96px 96px; gap: 10px; }
.pme-flags { display: flex; flex-wrap: wrap; gap: 14px; margin: 12px 0; }
.pme-flags .check { font-size: 13px; }
.pme-content-field { display: flex; flex-direction: column; }
.pme-content-field textarea { width: 100%; min-height: 240px; font-family: var(--mono); font-size: 12.5px; line-height: 1.5; resize: vertical; }
.pme-id-hint { font-size: 11px; color: var(--muted); margin: 8px 0 0; }
.pme-id-hint code { font-family: var(--mono); background: #f3f4f6; padding: 1px 5px; border-radius: 4px; }
.pme-delete { color: var(--danger); }
.pme-delete:hover { background: rgba(233,79,79,.12); }
.pme-spacer { flex: 1; }
@media (max-width: 620px) { .pme-grid { grid-template-columns: 1fr 1fr; } }

/* Marker / 库 只读查看弹窗（内容来自别处，仿 SillyTavern Inspect） */
.pmi-modal { width: min(680px, 94vw); max-height: 92vh; }
.pmi-sub { font-size: 12.5px; color: var(--muted); margin: 0 0 12px; line-height: 1.65; }
.pmi-list { display: grid; gap: 10px; max-height: 64vh; overflow: auto; padding-right: 2px; }
.pmi-card { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fafafa; overflow: hidden; }
.pmi-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 9px 12px; border-bottom: 1px solid #eee; }
.pmi-name { font-size: 13px; font-weight: 700; color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pmi-role { font-family: var(--mono); font-size: 11px; color: var(--muted); text-transform: uppercase; }
.pmi-tok { font-family: var(--mono); font-size: 11px; color: var(--muted); margin-left: auto; }
.pmi-content { margin: 0; white-space: pre-wrap; word-break: break-word; font-family: var(--sans); font-size: 12.5px; line-height: 1.6; color: #333; background: #fff; padding: 10px 12px; max-height: 360px; overflow: auto; }
.pmi-empty { text-align: center; color: var(--muted); font-size: 13px; line-height: 1.9; padding: 30px 16px; border: 1px dashed #e0e0e4; border-radius: var(--r-sm); background: #fafafa; }
/* 居中 + 蒙层（仿酒馆 Inspect 的聚焦弹窗）；仅在 .show 时生效，ID 选择器提高优先级覆盖 .overlay.show 的 block */
#pmInspectModal.overlay.show { display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px; overflow: auto; background: rgba(0,0,0,.42); pointer-events: auto; z-index: 60; }
#pmInspectModal .pmi-modal { margin: auto; }
.search-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--wechat-line);
}
.search-wrap { position: relative; flex: 1; }
.search-wrap svg { position: absolute; left: 9px; top: 8px; color: var(--muted); width: 16px; height: 16px; }
.search-wrap input { padding-left: 32px; background: #e9e9e9; }
.conv-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--wechat-line); }
.conv-list {
  min-height: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.conv-list::-webkit-scrollbar { width: 0; height: 0; display: none; }
.conv-item {
  width: 100%;
  min-height: 72px;
  border-radius: 0;
  padding: 10px 12px;
  justify-content: stretch;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  text-align: left;
  border-bottom: 1px solid var(--wechat-line);
  position: relative;
}
.conv-item:hover { background: #ececec; }
.conv-item.active { background: #d9d9d9; }
.role-info-btn {
  position: absolute;
  right: 9px;
  bottom: 9px;
  width: 26px;
  min-width: 26px;
  min-height: 26px;
  opacity: 0;
  color: var(--muted);
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: var(--r-pill);
  transition: opacity .14s ease, transform .14s ease;
}
.conv-item:hover .role-info-btn { opacity: 1; }
.role-info-btn:hover { color: #111; transform: translateY(-1px); }
.avatar {
  width: 44px;
  height: 44px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  background: #678f7c;
  overflow: hidden;
  flex: 0 0 auto;
}
.avatar.image-avatar {
  background-size: cover;
  background-position: center;
  color: transparent;
  text-indent: -999px;
}
.avatar.imported { background: #587cb6; }
.conv-main { min-width: 0; }
.conv-row { display: flex; justify-content: space-between; gap: 8px; min-width: 0; }
.conv-name { font-weight: 600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.conv-time { color: var(--quiet); font-size: 12px; flex: 0 0 auto; }
.conv-preview { margin-top: 6px; color: var(--muted); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* ========== 会话分组（对话收藏夹） ========== */
.conv-group-tag {
  display: inline-block;
  max-width: 96px;
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-right: 6px;
  padding: 1px 7px;
  border-radius: var(--r-sm);
  font-size: 11px;
  line-height: 1.5;
  color: var(--wechat-green);
  background: rgba(15,138,95, .10);
}
/* 右键 / 长按 会话弹出的分组菜单 */
.ctx-menu {
  position: fixed;
  z-index: 9999;
  min-width: 176px;
  max-width: 248px;
  background: #fff;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-md);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
  padding: 6px;
  font-size: 13px;
}
.ctx-menu .ctx-title { padding: 6px 10px 2px; font-weight: 700; color: #111; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctx-menu .ctx-label { padding: 2px 10px 6px; font-size: 11px; color: var(--muted); }
.ctx-menu .ctx-item {
  display: flex; align-items: center; gap: 8px;
  width: 100%; text-align: left;
  padding: 8px 10px; border: 0; background: transparent;
  border-radius: var(--r-sm); cursor: pointer; color: #111;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ctx-menu .ctx-item:hover { background: #f0f0f0; }
.ctx-menu .ctx-item.danger { color: #cf1322; }
.ctx-menu .ctx-item .ctx-check { margin-left: auto; color: var(--wechat-green); font-weight: 700; }
.ctx-menu .ctx-empty { padding: 4px 10px 8px; color: var(--muted); font-size: 12px; }
.ctx-menu .ctx-sep { height: 1px; background: var(--wechat-line); margin: 5px 4px; }
/* 分组管理弹窗 */
.cg-add-row { display: flex; gap: 8px; margin-bottom: 12px; }
.cg-add-row input { flex: 1 1 auto; border: 1px solid var(--wechat-line); }
.cg-add-row button { flex: 0 0 auto; }
.cg-manage-list { display: flex; flex-direction: column; gap: 8px; max-height: 56vh; overflow-y: auto; }
.cg-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 24px 10px; border: 1px dashed #e0e0e4; border-radius: var(--r-sm); background: #fafafa; }
.cg-row { display: flex; align-items: center; gap: 8px; padding: 6px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); }
.cg-name-input { flex: 1 1 auto; height: var(--ctl-h-tool); border: 1px solid transparent; background: #f5f5f5; }
.cg-name-input:focus { border-color: var(--wechat-green); background: #fff; }
.cg-count { flex: 0 0 auto; font-size: 11.5px; color: var(--muted); }
.cg-actions { flex: 0 0 auto; display: flex; gap: 4px; }
.cg-mini { width: 30px; height: var(--ctl-h-sm); border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-sm); cursor: pointer; font-size: 13px; color: #555; }
.cg-mini:hover:not(:disabled) { background: #f0f0f0; }
.cg-mini:disabled { opacity: .4; cursor: default; }
.cg-mini.cg-del { width: auto; padding: 0 10px; color: #cf1322; border-color: #ffccc7; background: #fff1f0; }
.chat { grid-column: 2; min-width: 0; position: relative; display: grid; grid-template-rows: auto auto auto auto; min-height: calc(100dvh * var(--app-unzoom, 1)); background: var(--chat-canvas); }
.chat-titlebar { height: 60px; }
.chat-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-bottom: 1px solid var(--wechat-line);
  background: var(--wechat-panel);
  overflow-x: auto;
  scrollbar-width: thin;
  position: sticky;
  top: 60px;
  z-index: 20;
}
.chat-toolbar::-webkit-scrollbar { height: 6px; }
.chat-toolbar::-webkit-scrollbar-thumb { background: rgba(0,0,0,.18); border-radius: var(--r-pill); }
.chat-tool-sep { flex: 1 1 auto; }
.chat-tool-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: var(--ctl-h-tool);
  padding: 0 11px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fff;
  color: #444;
  font-size: 12.5px;
  cursor: pointer;
  white-space: nowrap;
}
.chat-tool-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.chat-tool-btn:hover { border-color: rgba(15,138,95,.5); color: #0c6b48; background: #f5fff9; }
.chat-tool-btn.danger { color: #c0504a; }
.chat-tool-btn.danger:hover { border-color: rgba(233,79,79,.5); background: rgba(233,79,79,.08); color: #c0504a; }
.chat-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 18px;
  border-bottom: 1px solid var(--wechat-line);
  background: var(--wechat-panel);
  position: sticky;
  top: 0;
  z-index: 21;
}
.title-stack { flex: 1 1 auto; min-width: 0; }
.chat-title { min-width: 0; max-width: 100%; font-size: 16px; font-weight: 700; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-meta { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-meta { color: var(--muted); font-size: 12px; margin-top: 3px; }
.top-actions { display: flex; gap: 6px; flex: 0 0 auto; align-items: center; }
.zoom-ctl { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; padding: 2px; }
.zoom-ctl button { min-height: 26px; min-width: 26px; padding: 0 6px; border-radius: var(--r-xs); font-size: 13px; color: #555; line-height: 1; }
.zoom-ctl button:hover { background: rgba(0,0,0,.06); }
#zoomResetBtn { min-width: 46px; font-size: 12px; font-variant-numeric: tabular-nums; color: #2b3a30; font-weight: 600; }
.messages {
  min-height: calc(100dvh * var(--app-unzoom, 1) - 160px);
  overflow: visible;
  padding: 18px 28px 120px 22px;
  background: var(--chat-canvas);
}
.dayline { text-align: center; color: var(--muted); font-size: 12px; margin: 6px 0 18px; }
.author-frame {
  width: 100%;
  min-height: 160px;
  height: 160px;
  max-height: 760px;
  border: 0;
  background: #fff;
  border-radius: 4px;
  display: block;
  overflow: hidden;
}
.msg {
  display: grid;
  grid-template-columns: 38px minmax(0, auto);
  gap: 10px;
  margin: 12px 0;
  align-items: start;
  max-width: min(680px, 94%);
  position: relative;
}
.msg.user { margin-left: auto; grid-template-columns: minmax(0, auto) 38px; }
.msg .avatar { width: 38px; height: 38px; font-size: 12px; }
/* 气泡底部操作行：复制 / 重生成 / 编辑 / 删除 + swipe 翻页，常驻同一行（不再悬停浮现，避免抖动） */
.msg-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(0,0,0,.06);
}
.msg.user .msg-foot { justify-content: flex-end; }
.msg-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.msg.user .msg-actions { justify-content: flex-end; }
.msg-action-btn {
  width: auto;
  min-width: 36px;
  min-height: 32px;
  padding: 0 11px;
  background: var(--surface-2, #f6f8f5);
  border: 1px solid var(--wechat-line, rgba(0,0,0,.12));
  border-radius: var(--r-pill);
  color: #58625b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  user-select: none;
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(24,40,32,.04);
  transition: background .14s ease, border-color .14s ease, color .14s ease, transform .08s ease, box-shadow .14s ease;
}
.msg-action-btn:hover { background: var(--jade-softer, #f1f8f3); border-color: var(--jade-ring, rgba(15,138,95,.45)); color: var(--jade-ink, #0c6b48); box-shadow: 0 3px 10px rgba(15,138,95,.10); }
.msg-action-btn:active { transform: translateY(1px); box-shadow: 0 1px 2px rgba(24,40,32,.05); }
.msg-action-btn:focus-visible { outline: none; box-shadow: var(--focus-ring, 0 0 0 3px rgba(15,138,95,.12)); border-color: var(--jade-ring, rgba(15,138,95,.45)); }
.msg-action-btn.danger { color: #b9554c; border-color: rgba(224,87,76,.22); background: rgba(224,87,76,.04); }
.msg-action-btn.danger:hover { color: var(--danger); border-color: rgba(224,87,76,.45); background: rgba(233,79,79,.08); box-shadow: 0 3px 10px rgba(224,87,76,.10); }
.msg-action-btn svg { width: 15px; height: 15px; }
.msg-action-btn span { font-size: 12px; line-height: 1; white-space: nowrap; }
.greeting-switcher {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e8e8e8;
}
.greeting-nav-btn {
  width: 32px;
  min-width: 32px;
  min-height: var(--ctl-h-tool);
  padding: 0;
  background: rgba(0,0,0,.03);
  border-radius: 4px;
  color: var(--muted);
}
.greeting-nav-btn:hover:not(:disabled) { background: rgba(0,0,0,.08); color: var(--text); }
.greeting-nav-btn:disabled { opacity: .3; cursor: not-allowed; }
.greeting-nav-btn svg { width: 16px; height: 16px; }
.greeting-indicator { font-size: 12px; color: var(--muted); min-width: 40px; text-align: center; }

/* swipe 切换器 */
.swipe-bar {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}
.swipe-btn {
  width: 26px;
  min-width: 26px;
  min-height: 24px;
  padding: 0;
  background: rgba(0,0,0,.03);
  border-radius: 4px;
  color: var(--muted);
}
.swipe-btn:hover:not(:disabled) { background: rgba(0,0,0,.08); color: var(--text); }
.swipe-btn:disabled { opacity: .3; cursor: not-allowed; }
.swipe-btn svg { width: 14px; height: 14px; }
.swipe-ind { font-size: 11px; color: var(--muted); font-family: var(--mono); min-width: 38px; text-align: center; }

/* 行内编辑 */
.edit-area { margin-top: 4px; display: grid; gap: 6px; }
.edit-textarea {
  width: 100%;
  min-height: 60px;
  max-height: 400px;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.6;
  padding: 8px 10px;
  border: 1px solid rgba(15,138,95,.45);
  border-radius: var(--r-xs);
  resize: vertical;
  background: #fff;
}
.edit-btns { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.edit-save, .edit-cancel { min-height: var(--ctl-h); padding: 0 16px; font-size: 13px; border-radius: var(--r-pill); cursor: pointer; font-weight: 600; }
.edit-save { background: var(--wechat-green); color: #fff; }
.edit-save:hover { background: var(--wechat-green-dark); }
.edit-save.strong { background: #0f8a5f; }
.edit-save.strong:hover { background: #0b6e4a; }
.edit-cancel { background: rgba(0,0,0,.05); color: var(--muted); }
.edit-cancel:hover { background: rgba(0,0,0,.1); }

/* 角色知识库绑定 */
.role-kb-bind h3 { font-size: 14px; margin: 0 0 4px; color: var(--text); }
.small-kb-head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.small-kb-list { display: grid; gap: 8px; align-content: start; }

/* 绑定区头：当前绑定数 + 「管理全部小库」入口 */
.kb-bound-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 2px 2px; }
.kb-bound-count { font-size: 12.5px; font-weight: 600; color: #4b6d5a; }
.kb-manage-all {
  flex: 0 0 auto; border: none; background: transparent; padding: 2px 4px;
  font-size: 12px; color: var(--muted); cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
}
.kb-manage-all:hover { color: #0c6b48; }
.kb-bound-empty { padding: 16px; font-size: 12.5px; line-height: 1.6; }

/* 已绑定的小库卡片：默认只显示一行（库名 + token + 解绑），点库名展开正文编辑 */
.small-kb-entry {
  border: 1px solid #e7e7e7;
  border-radius: var(--r-sm);
  background: #fff;
  overflow: hidden;
}
.small-kb-entry.bound { border-color: rgba(15,138,95,.45); background: #f6fffa; }
.small-kb-title { display: flex; gap: 6px; align-items: center; padding: 7px 8px 7px 10px; }
.small-kb-expand {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 6px;
  border: none; background: transparent; cursor: pointer; text-align: left; padding: 2px 0; color: var(--text);
}
.small-kb-chevron { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; transition: transform .15s; }
.small-kb-entry.open .small-kb-chevron { transform: rotate(180deg); }
.small-kb-name-label { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.small-kb-tk { flex: 0 1 auto; min-width: 0; color: var(--muted); font-family: var(--mono); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.small-kb-unbind {
  flex: 0 0 auto; height: 26px; padding: 0 11px; border-radius: var(--r-xs);
  border: 1px solid rgba(15,138,95,.5); background: #fff; color: #0c6b48;
  font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.small-kb-unbind:hover { background: #e9fbf1; }
.small-kb-body { display: none; flex-direction: column; gap: 8px; padding: 0 10px 10px; }
.small-kb-entry.open .small-kb-body { display: flex; }
.small-kb-owner { font-size: 11px; color: var(--muted); }
.small-kb-name {
  width: 100%; box-sizing: border-box; height: var(--ctl-h-tool); font-size: 13px; font-weight: 600;
}
.small-kb-edit {
  width: 100%; box-sizing: border-box; min-height: 120px; max-height: 320px; resize: vertical;
  border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 8px 10px; background: #fff;
  font-family: var(--sans); font-size: 12.5px; line-height: 1.6; display: block;
}
.small-kb-danger { display: flex; justify-content: flex-end; }
.small-kb-del {
  border: none; background: transparent; color: #c0504a;
  font-size: 12px; cursor: pointer; padding: 4px 6px; border-radius: var(--r-xs);
}
.small-kb-del:hover { background: rgba(233,79,79,.1); }
.small-kb-entries { border: 1px solid #ededed; border-radius: var(--r-xs); background: #fafafa; }
.small-kb-entries > summary { cursor: pointer; padding: 6px 10px; font-size: 12px; color: var(--muted); }
.small-kb-items { display: grid; gap: 8px; padding: 10px 12px 12px; }
.small-kb-flat-list {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
}
.small-kb-flat-item {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid #eeeeee;
  border-radius: var(--r-xs);
  background: #fff;
}
.small-kb-flat-item > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.small-kb-flat-item strong {
  min-width: 0;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.small-kb-flat-item small {
  color: var(--muted);
  font-family: var(--mono);
  font-size: 11px;
  white-space: nowrap;
}
.small-kb-flat-item p {
  margin: 0;
  max-height: 120px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  color: #333;
  line-height: 1.58;
  font-size: 12.5px;
}
.small-kb-item {
  border: 1px solid #eeeeee;
  border-radius: var(--r-xs);
  background: #fbfbfb;
}
.small-kb-item summary {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  cursor: pointer;
  font-weight: 600;
}
.small-kb-item summary small { color: var(--muted); font-family: var(--mono); font-weight: 400; }
.small-kb-item pre, .small-kb-items > pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  background: #fff;
  border-top: 1px solid #eeeeee;
  padding: 10px;
  font-family: var(--sans);
  font-size: 12.5px;
  line-height: 1.6;
  color: #333;
}
.bubble {
  position: relative;
  background: var(--bubble-ai);
  border-radius: 4px;
  padding: 10px 12px;
  line-height: 1.68;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
.author-card-msg { max-width: calc(100% - 48px); width: calc(100% - 48px); }
.author-bubble { width: 100%; padding: 0; background: var(--bubble-ai); overflow: hidden; border: 1px solid #d8d8d8; }
.author-bubble-error { padding: 16px; color: var(--muted); font-size: 13px; text-align: center; }
.author-frame.is-scrollable { border-bottom: 1px solid #d8d8d8; }
.msg.assistant .bubble::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 13px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 6px solid var(--bubble-ai);
}
.msg.user .bubble { background: var(--bubble-me); }
.msg.user .bubble::after {
  content: "";
  position: absolute;
  right: -6px;
  top: 13px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid var(--bubble-me);
}
.msg.plan .bubble {
  background: #fff8df;
  color: #5b4c20;
  border: 1px solid #ead898;
  font-size: 13px;
}
.bubble a { color: #2b6cb0; text-decoration: none; border-bottom: 1px solid rgba(43,108,176,.35); }
.bubble-media {
  display: block;
  max-width: min(520px, 100%);
  max-height: 360px;
  margin: 8px 0;
  border-radius: var(--r-xs);
  object-fit: contain;
  background: #f0f0f0;
}
.bubble-html {
  margin: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
}
/* 含脚本/超大 HTML 的「点击加载」占位（默认不自动运行，杜绝卡死） */
.bubble-html-lazy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 12px 14px;
  border: 1px dashed var(--border, #d8d8d8);
  border-radius: var(--r-sm);
  background: #fafafa;
}
.bubble-html-load-btn {
  border: 0;
  border-radius: var(--r-sm);
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--accent, #3a9d6e);
  cursor: pointer;
}
.bubble-html-load-btn:hover { filter: brightness(1.05); }
.bubble-html-lazy-hint { font-size: 12px; color: var(--text-muted, #888); line-height: 1.5; }
.bubble-html-frame {
  width: 100%;
  min-height: 60px;
  border: 0;
  display: block;
  background: #fff;
}
.bubble-html-src-toggle {
  width: 100%;
  min-height: var(--ctl-h-micro);
  font-size: 11px;
  color: var(--muted);
  background: #f5f5f5;
  border-top: 1px solid var(--wechat-line);
  border-radius: 0;
}
.bubble-html-src-toggle:hover { background: #ececec; color: var(--text); }
.bubble-html-src {
  margin: 0;
  max-height: 300px;
  overflow: auto;
  padding: 10px;
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
  background: #2b2b2b;
  color: #e0e0e0;
}
/* 状态栏面板（统一变量库渲染） + 变量更新折叠块 */
.status-panel { margin: 14px 8px 8px; border: 1px solid rgba(0,0,0,.1); border-radius: var(--r-md); background: #fbfbfa; padding: 10px 12px; font-size: 13px; overflow: hidden; }
.status-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 700; color: #6b6256; letter-spacing: .5px; margin-bottom: 8px; font-size: 12.5px; }
.status-panel-title { min-width: 0; display: flex; align-items: center; gap: 7px; color: inherit; }
.status-panel-meta { flex: 0 0 auto; padding: 1px 7px; border-radius: var(--r-pill); background: rgba(15,138,95,.08); color: var(--muted, #7d827d); font-size: 11px; font-weight: 600; letter-spacing: 0; }
.status-panel-action { flex: 0 0 auto; border: 1px solid rgba(15,138,95,.22); border-radius: var(--r-pill); background: rgba(255,255,255,.72); color: var(--jade-ink, #0c6b48); cursor: pointer; padding: 3px 9px; font-size: 11.5px; line-height: 1.45; }
.status-panel-action:hover { background: rgba(15,138,95,.1); border-color: rgba(15,138,95,.36); }
.status-summary { display: flex; flex-direction: column; gap: 5px; margin-bottom: 8px; }
.status-summary-chip { display: grid; grid-template-columns: minmax(54px, .62fr) minmax(0, 1fr); gap: 8px; align-items: center; min-height: 25px; padding: 4px 7px; border-radius: var(--r-sm); background: rgba(255,255,255,.56); border: 1px solid rgba(0,0,0,.045); }
.status-summary-k { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #8c8983; font-size: 11.5px; }
.status-summary-v { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #2c2a27; font-weight: 650; text-align: right; }
.status-summary-more { color: var(--muted, #8c8983); font-size: 11.5px; text-align: right; padding-right: 2px; }
.status-panel-detail { border-top: 1px dashed rgba(0,0,0,.08); padding-top: 6px; }
.status-panel-detail > summary { list-style: none; cursor: pointer; user-select: none; color: var(--jade-ink, #0c6b48); font-size: 12px; font-weight: 700; line-height: 1.7; }
.status-panel-detail > summary::-webkit-details-marker { display: none; }
.status-panel-detail > summary::after { content: '↓'; float: right; color: var(--muted, #8c8983); font-weight: 600; transition: transform .16s ease; }
.status-panel-detail[open] > summary::after { transform: rotate(180deg); }
.status-panel-body { max-height: min(360px, 42vh); overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding-right: 4px; margin-top: 6px; }
.status-section { margin-bottom: 10px; }
.status-section:last-child { margin-bottom: 0; }
.status-section-title { font-size: 12px; font-weight: 700; color: #43403b; margin-bottom: 5px; padding-bottom: 3px; border-bottom: 1px solid rgba(0,0,0,.08); }
.status-group { margin-bottom: 8px; }
.status-group:last-child { margin-bottom: 0; }
.status-group-name { font-size: 11.5px; color: #b08d57; font-weight: 600; margin-bottom: 4px; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 4px 12px; }
.status-cell { display: grid; grid-template-columns: minmax(54px, .55fr) minmax(0, 1fr); align-items: start; gap: 8px; padding: 3px 0; border-bottom: 1px dashed rgba(0,0,0,.06); }
.status-k { color: #8c8983; white-space: nowrap; }
.status-v { color: #2c2a27; font-weight: 600; text-align: right; word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
details.var-update { display: inline-block; max-width: 100%; margin: 6px 0 2px; border: 1px solid rgba(0,0,0,.07); border-radius: var(--r-pill); background: rgba(0,0,0,.03); padding: 2px 10px; }
details.var-update[open] { border-radius: var(--r-sm); }
details.var-update > summary { cursor: pointer; color: #9a978f; font-size: 11px; list-style: none; user-select: none; }
details.var-update > summary::-webkit-details-marker { display: none; }
details.var-update[open] { white-space: pre-wrap; color: #6b6256; font-size: 12px; line-height: 1.6; }
/* 世界地图弹窗 */
.map-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.map-switch { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #43403b; }
.map-tree { max-height: 52vh; overflow: auto; border: 1px solid rgba(0,0,0,.08); border-radius: var(--r-sm); padding: 8px; background: #fbfbfa; }
.map-node-wrap { position: relative; }
.map-node { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 7px; border-radius: var(--r-xs); }
.map-node:hover { background: rgba(0,0,0,.035); }
.map-node.is-current { background: rgba(176,141,87,.14); }
.map-node-main { min-width: 0; flex: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.map-name { font-weight: 600; color: #2c2a27; }
/* 「含 N 个下级」徽标：一眼看出这是个还套着小地点的大地点 */
.map-childcount { font-size: 11px; color: #9a8f7e; background: rgba(176,141,87,.1); border-radius: var(--r-pill); padding: 1px 8px; white-space: nowrap; }
.map-badge { font-size: 11px; color: #fff; background: #b08d57; border-radius: var(--r-pill); padding: 1px 8px; white-space: nowrap; }
/* 地点描述：完整换行显示在地点名下方（不再压成一行省略号），左边一道淡线和名字关联 */
.map-desc { color: #7c7973; font-size: 12px; line-height: 1.55; margin: 2px 0 5px 8px; padding-left: 9px; border-left: 2px solid rgba(0,0,0,.07); white-space: normal; word-break: break-word; }
/* 下级地点容器：缩进 + 左竖线 = 「大地点套小地点」的包含关系 */
.map-children { margin-left: 12px; padding-left: 13px; border-left: 2px solid rgba(176,141,87,.3); }
.map-ops { display: flex; gap: 4px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
/* 地点操作按钮：清新小药丸，柔和 hover，按功能分色，方便看也方便点 */
.map-op { font-size: 12px; padding: 3px 10px; border: 1px solid var(--wechat-line, rgba(0,0,0,.1)); border-radius: var(--r-pill); background: #fff; color: #5a5650; cursor: pointer; white-space: nowrap; line-height: 1.6; transition: background .12s, border-color .12s, color .12s; }
.map-op:hover { background: #f4f6f5; border-color: rgba(0,0,0,.18); color: #2c2a27; }
.map-op-primary { color: #0c6b48; border-color: #cfe9dc; background: #f3fbf6; }
.map-op-primary:hover { background: var(--wechat-green, #0f8a5f); color: #fff; border-color: var(--wechat-green, #0f8a5f); }
.map-op-ai { color: #6d4bd0; border-color: #ddd4f6; background: #f7f4fe; }
.map-op-ai:hover { background: #6d4bd0; color: #fff; border-color: #6d4bd0; }
.map-op-del { color: #9a8f8a; }
.map-op-del:hover { background: #fdecec; border-color: #ecc3c3; color: #c0392b; }
/* 地点「就地编辑」表单：名称 + 内容/描述 一起改 */
.map-edit-form { display: flex; flex-direction: column; gap: 6px; padding: 9px 10px; background: #f6faf7; border: 1px solid #cfe9dc; border-radius: var(--r-sm); margin: 2px 0; }
.map-edit-label { font-size: 11.5px; color: #6b7180; }
.map-edit-name, .map-edit-desc { width: 100%; box-sizing: border-box; border: 1px solid #dbe7df; border-radius: var(--r-xs); padding: 6px 9px; font-size: 13px; font-family: inherit; background: #fff; color: #2c2a27; }
.map-edit-desc { resize: vertical; line-height: 1.55; min-height: 56px; }
.map-edit-name:focus, .map-edit-desc:focus { outline: none; border-color: var(--wechat-green, #0f8a5f); }
.map-edit-btns { display: flex; gap: 6px; justify-content: flex-end; }
/* 变量面板：全局 / 角色变量库分区 —— 紧凑布局，杜绝大片空白 */
#varQuickPanel { gap: 6px; max-height: min(80vh, 720px); overflow-y: auto; padding: 12px; }
#varQuickPanel .quick-head { display: flex; align-items: center; gap: 6px; }
#varQuickPanel .quick-title { font-size: 12.5px; font-weight: 700; line-height: 1.35; }
/* 关键修复：面板里的空状态不要用全局 .empty 的 60px 大留白，改成一行紧凑提示 */
#varQuickPanel .empty { padding: 8px 10px; margin: 0; font-size: 12px; line-height: 1.5; text-align: left; color: var(--muted); background: #fafafb; border: 1px dashed var(--wechat-line); border-radius: var(--r-sm); }
#varQuickPanel .var-list { max-height: 240px; }
.var-sys-toggle { font-size: 12px; color: #8c8983; cursor: pointer; margin-left: auto; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.var-role-head { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--wechat-line); }
.var-bind-btn { font-size: 12px; padding: 3px 10px; border: 1px solid rgba(15,138,95,.4); border-radius: var(--r-xs); background: #fff; color: #07a64e; cursor: pointer; white-space: nowrap; }
.var-bind-btn:hover { background: var(--wechat-green, #0f8a5f); color: #fff; border-color: transparent; }
.var-bind-btn.active { background: rgba(15,138,95,.1); }
.var-bank-head { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: #b08d57; margin: 8px 0 4px; }
.var-bank-head .var-bank-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.var-bank-head .vb-mini { border: 0; background: none; cursor: pointer; color: var(--quiet); padding: 2px 4px; border-radius: var(--r-xs); font-size: 12px; line-height: 1; }
.var-bank-head .vb-mini:hover { background: #f0f0f2; color: var(--text); }
.var-bank-add { font-size: 12px; color: #0f8a5f; background: none; border: 1px dashed rgba(15,138,95,.4); border-radius: var(--r-xs); padding: 4px 10px; cursor: pointer; margin: 2px 0; }
.var-bank-add:hover { background: rgba(15,138,95,.08); }
.var-global-tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 2px 0 4px; }
#varQuickPanel .var-role-head .var-bind-btn { margin-left: 8px; }
/* 面板内联「绑定 / 新建变量库」选择器 */
.var-inline-picker { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px; background: #fcfcfd; display: flex; flex-direction: column; gap: 6px; }
.var-inline-picker.hidden { display: none; }
.vip-item { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: var(--r-sm); cursor: pointer; }
.vip-item:hover { background: #f3f3f5; }
.vip-item .vip-name { flex: 1; min-width: 0; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vip-item .vip-sub { font-size: 11px; color: var(--quiet); white-space: nowrap; }
.vip-item .vb-mini { border: 0; background: none; cursor: pointer; color: var(--quiet); padding: 2px 5px; border-radius: var(--r-xs); line-height: 1; }
.vip-item .vb-mini:hover { background: #e9e9ec; color: var(--text); }
.vip-new { display: flex; gap: 6px; align-items: center; padding-top: 4px; border-top: 1px dashed var(--wechat-line); }
.vip-new input { flex: 1; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 9px; font-size: 13px; }
.vip-new button { font-size: 12px; padding: 6px 12px; border-radius: var(--r-sm); background: var(--wechat-green, #0f8a5f); color: #fff; cursor: pointer; white-space: nowrap; }

/* ===== 变量中心 弹窗（全新交互：宽敞、分组、内联绑定）===== */
.vc-modal { width: min(940px, 95vw); display: flex; flex-direction: column; overflow: hidden; }
.vc-modal .modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
/* 顶部「注入 AI / 自动联动」开关条：与下面各分区一样是随内容整体滚动的普通卡片（不再 sticky 吸顶，避免滚动时盖住「当前世界状态」造成断裂/脱节感）。 */
.vc-bar { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; padding: 9px 12px; background: var(--surface, #fff); border: 1px solid var(--wechat-line); border-radius: var(--r-md); box-shadow: 0 2px 8px rgba(0,0,0,.03); }
.vc-switch { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #43403b; cursor: pointer; background: #f5f6f7; padding: 6px 12px; border-radius: var(--r-pill); white-space: nowrap; line-height: 1; }
.vc-switch input[type="checkbox"] { width: 15px; height: 15px; flex: 0 0 auto; margin: 0; accent-color: var(--wechat-green, #0f8a5f); }
.vc-switch-sm { padding: 3px 10px; font-size: 12px; }
/* 启用/注入 滑动开关（替代难看的复选框，清楚表达开/关）*/
.tgl { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; font-size: 12.5px; color: #43403b; white-space: nowrap; user-select: none; }
.tgl > input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.tgl .tgl-track { width: 38px; height: 21px; border-radius: var(--r-pill); background: #d2d2d8; transition: background .16s ease; position: relative; flex: 0 0 auto; }
.tgl .tgl-track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .16s ease; }
.tgl > input:checked + .tgl-track { background: var(--wechat-green, #0f8a5f); }
.tgl > input:checked + .tgl-track::after { transform: translateX(17px); }
.tgl > input:focus-visible + .tgl-track { box-shadow: 0 0 0 3px rgba(15,138,95,.25); }
.tgl .tgl-label { line-height: 1; }
.tgl.tgl-sm .tgl-track { width: 32px; height: 18px; }
.tgl.tgl-sm .tgl-track::after { width: 14px; height: 14px; }
.tgl.tgl-sm > input:checked + .tgl-track::after { transform: translateX(14px); }
/* 变量中心顶栏：两个开关统一大小、成组左对齐，不用竖线分隔（消除割裂感） */
.vc-bar .tgl { gap: 8px; }
/* 群聊：绑定给哪个成员 选择器 */
.vip-target { display: flex; align-items: center; gap: 8px; padding: 4px 6px 8px; border-bottom: 1px dashed var(--wechat-line); margin-bottom: 4px; }
.vip-target-label { font-size: 12.5px; color: #6a6a6a; white-space: nowrap; }
.vip-target-sel { flex: 1; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 5px 8px; font-size: 13px; background: #fff; }
/* vc-map-col 卡片化后不再需要顶部分隔线（卡片自带边框） */
.vc-map-tools { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.vc-map-tools .vc-add-row { flex: 1 1 auto; }
.vc-map-col .map-tree { max-height: min(440px, 52vh); overflow-y: auto; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px; }
.vc-spacer { flex: 1; }
.vc-btn { font-size: 13px; padding: 7px 14px; border-radius: var(--r-pill); border: 1px solid var(--wechat-line); background: #fff; color: #43403b; cursor: pointer; white-space: nowrap; }
.vc-btn:hover { background: #f3f3f5; }
.vc-btn.primary { background: var(--wechat-green, #0f8a5f); color: #fff; border-color: transparent; }
.vc-btn.primary:hover { filter: brightness(.96); }
.vc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 820px) { .vc-cols { grid-template-columns: 1fr; } }
.vc-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 12px 14px 14px; background: var(--surface, #fff); border: 1px solid var(--wechat-line); border-radius: var(--r-md); }
.vc-col-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-bottom: 9px; border-bottom: 1px solid var(--wechat-line); }
.vc-col-head h3 { margin: 0; font-size: 14px; flex: 0 0 auto; }
.vc-col-head .tgl { margin-left: auto; flex: 0 0 auto; }
.vc-col-head .vc-col-sub { flex: 1 1 100%; order: 5; margin-top: -2px; }
.vc-col-name { font-size: 13px; color: var(--wechat-green, #0f8a5f); font-weight: 600; }
.vc-col-sub { font-size: 11.5px; color: var(--quiet); line-height: 1.55; }
.vc-groups { display: flex; flex-direction: column; gap: 10px; }
.vc-empty { font-size: 12.5px; color: var(--muted); background: #fafafb; border: 1px dashed var(--wechat-line); border-radius: var(--r-sm); padding: 14px; text-align: center; line-height: 1.6; }
.vc-group { border: 1px solid var(--wechat-line); border-radius: var(--r-md); overflow: hidden; background: #fff; }
.vc-group-head { display: flex; align-items: center; gap: 6px; padding: 7px 10px; background: color-mix(in srgb, var(--wechat-green, #0f8a5f) 7%, #f7f7f9); font-size: 12.5px; font-weight: 700; color: #335c4a; border-bottom: 1px solid var(--wechat-line); }
.vc-group-head .vc-bank-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vc-group-head .vb-mini { border: 0; background: none; cursor: pointer; color: var(--quiet); padding: 3px 6px; border-radius: var(--r-xs); font-size: 12px; line-height: 1; }
.vc-group-head .vb-mini:hover { background: #ececef; color: var(--text); }
.vc-rows { display: flex; flex-direction: column; padding: 4px; }
.vc-vrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 8px; border-radius: var(--r-sm); }
.vc-vrow:hover { background: #fafafb; }
.vc-vrow .vc-chk { accent-color: var(--wechat-green, #0f8a5f); width: 16px; height: 16px; flex: 0 0 auto; }
.vc-vrow input.vc-name { flex: 1 1 40%; min-width: 96px; }
.vc-vrow input.vc-value { flex: 1 1 40%; min-width: 80px; }
.vc-vrow input.vc-note { flex: 1 1 100%; }
.vc-vrow input { border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 6px 9px; font-size: 13px; }
.vc-vrow input.vc-note { font-size: 12px; color: #6a6a6a; background: #fcfcfd; }
.vc-vrow input:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.vc-vrow .vc-del { flex: 0 0 auto; border: 0; background: none; cursor: pointer; color: var(--quiet); width: 26px; height: 26px; border-radius: var(--r-xs); display: inline-flex; align-items: center; justify-content: center; }
.vc-vrow .vc-del:hover { background: #fdecec; color: var(--danger); }
.vc-vrow .vc-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.vc-vrow .vc-promote { font-size: 14px; line-height: 1; }
.vc-vrow .vc-promote:hover { background: #e9f7f0; color: var(--wechat-green, #0f8a5f); }
/* 变量行就地区间判定：⚖️ 切换按钮 + 行下展开的区间编辑卡 */
.vc-vrow-wrap { display: flex; flex-direction: column; }
.vc-vrow .vc-judgetoggle { font-size: 13px; line-height: 1; }
.vc-vrow .vc-judgetoggle.has { color: var(--wechat-green, #0f8a5f); }
.vc-vrow .vc-judgetoggle.open { background: #eef4ff; color: #3b6fd4; }
.vc-vrow-judge { padding: 0 4px 8px 16px; }
.vc-vrow-judge .vc-group { margin-bottom: 0 !important; }
/* 数值变量卡（名+值+含义+区间判定，三合一）+ 事件变量两段式 */
.vc-seg-head { font-size: 12px; font-weight: 600; color: #9a8050; margin: 12px 4px 6px; padding-bottom: 4px; border-bottom: 1px solid var(--wechat-line, #ececed); }
.vc-subgroup { font-size: 11.5px; color: #9a8050; padding: 4px 6px 2px; }
.vc-numvar { border: 1px solid var(--wechat-line, #ececed); border-radius: 9px; padding: 8px; margin: 0 0 8px; background: #fff; }
.vc-numvar:hover { border-color: #e0e0e6; }
.vc-numvar-top { display: flex; align-items: center; gap: 6px; }
.vc-numvar-top .vc-chk { accent-color: var(--wechat-green, #0f8a5f); width: 16px; height: 16px; flex: 0 0 auto; }
.vc-numvar-top input.vc-name { flex: 1 1 50%; min-width: 90px; }
.vc-numvar-top input.vc-value { flex: 1 1 30%; min-width: 64px; }
.vc-numvar-top input { border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 6px 9px; font-size: 13px; }
.vc-numvar-top input:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.vc-numvar-top .vc-del { flex: 0 0 auto; border: 0; background: none; cursor: pointer; color: var(--quiet); width: 26px; height: 26px; border-radius: var(--r-xs); display: inline-flex; align-items: center; justify-content: center; }
.vc-numvar-top .vc-del:hover { background: #fdecec; color: var(--danger); }
.vc-numvar-top .vc-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.vc-numvar-top .vc-promote { font-size: 14px; }
.vc-numvar-top .vc-promote:hover { background: #e9f7f0; color: var(--wechat-green, #0f8a5f); }
.vc-numvar .vc-numvar-note { width: 100%; margin: 6px 0 4px; border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 5px 8px; font-size: 12px; color: #6a6a6a; background: #fcfcfd; }
.vc-numvar .vc-judge-now { margin: 2px 0 4px; }
.vc-numvar .vc-band-row { padding: 4px 0; }
.vc-numvar .vc-add-band-sub { margin-top: 2px; }
/* 发送框旁「🎭 强调变量」浮窗：只读挑选 + ＋发送框 */
.var-pick-row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: var(--r-sm, 6px); }
.var-pick-row:hover { background: #fafafb; }
.var-pick-info { flex: 1; min-width: 0; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.var-pick-note { color: #9a9a9a; font-size: 12px; }
.var-pick-inj { flex: 0 0 auto; font-size: 12px; color: var(--wechat-green, #0f8a5f); background: none; border: 1px solid rgba(15,138,95,.4); border-radius: var(--r-sm, 6px); padding: 4px 10px; cursor: pointer; }
.var-pick-inj:hover { background: #f0faf5; border-color: var(--wechat-green, #0f8a5f); }
.vc-add-row { font-size: 12.5px; color: #0f8a5f; background: none; border: 1px dashed rgba(15,138,95,.4); border-radius: var(--r-sm); padding: 8px; cursor: pointer; }
.vc-add-row:hover { background: rgba(15,138,95,.07); }
.vc-group .vc-add-row { margin: 2px 4px 6px; border-radius: var(--r-xs); padding: 5px; font-size: 12px; }
/* 全局变量面板：当前世界状态卡 + 地图说明 + 当前所在地条 + 「在这」徽标 */
.vc-world-state { display: block; }
.vc-world-state .qr-world { margin: 0; }
.vc-map-tip { margin: 0 0 4px; font-size: 11.5px; line-height: 1.6; color: var(--quiet); }
.map-curbar { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: 12.5px; color: #2b3a30; padding: 6px 9px; margin-bottom: 6px; background: rgba(176,141,87,.1); border: 1px solid rgba(176,141,87,.22); border-radius: var(--r-sm); }
.map-curbar b { color: #b08d57; }
.map-curbar-tip { color: var(--quiet); font-weight: 400; }
.map-here { font-size: 12px; color: #0c6b48; background: #e6f6ee; border: 1px solid #c7e8d7; border-radius: var(--r-xs); padding: 2px 8px; white-space: nowrap; }
/* 世界地图：世界背景（题材，非地点）输入框 */
.vc-map-bg-wrap { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.vc-map-bg-label { font-size: 12px; font-weight: 600; color: #b08d57; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.vc-map-bg-hint { font-size: 11px; font-weight: 400; color: var(--quiet); }
.vc-map-bg { width: 100%; box-sizing: border-box; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 9px; font-size: 12.5px; font-family: inherit; line-height: 1.6; resize: vertical; background: #fcfcfd; }
.vc-map-bg:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; background: #fff; }
.vc-map-bg:disabled { background: #f3f3f5; color: #aaa; }
/* 输入框上方「世界状态条」（方案①·状态直控） */
.world-state-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 2px 2px 7px; }
.world-state-bar.hidden { display: none; }
.wsb-pill { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-pill); padding: 3px 11px; font-size: 12.5px; color: #43403b; cursor: pointer; line-height: 1.5; transition: border-color .12s, background .12s, color .12s; font-family: inherit; }
.wsb-pill:hover { border-color: var(--wechat-green, #0f8a5f); color: #0c6b48; background: #f3fbf6; }
.wsb-pill .wsb-ic { font-size: 12px; line-height: 1; }
.wsb-pill.wsb-place { color: #b06a3a; }
.wsb-pill.wsb-place:hover { border-color: #d98b4a; color: #b06a3a; background: #fdf6ef; }
/* 「📮 推进剧情」：主色强调，和只改状态的药丸区分开（点它会带剧情诉求发给 AI） */
.wsb-pill.wsb-push { border-color: var(--wechat-green, #0f8a5f); background: #eaf7f0; color: #0c6b48; font-weight: 600; }
.wsb-pill.wsb-push:hover { background: var(--wechat-green, #0f8a5f); color: #fff; border-color: var(--wechat-green, #0f8a5f); }
.wsb-pop { position: fixed; z-index: 9999; background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); box-shadow: 0 8px 28px rgba(0,0,0,.16); padding: 5px; min-width: 150px; max-height: 52vh; overflow-y: auto; display: flex; flex-direction: column; gap: 1px; }
.wsb-pop-item { text-align: left; border: 0; background: none; border-radius: var(--r-xs); padding: 7px 10px; font-size: 13px; color: #43403b; cursor: pointer; white-space: nowrap; font-family: inherit; }
.wsb-pop-item:hover { background: #f0f7f3; color: #0c6b48; }
.wsb-pop-item.active { background: rgba(176,141,87,.14); color: #b08d57; font-weight: 600; }
.wsb-pop-sep { font-size: 11px; color: var(--quiet); padding: 5px 10px 2px; border-top: 1px solid var(--wechat-line); margin-top: 2px; }
.wsb-pop-sep:first-child { border-top: 0; margin-top: 0; padding-top: 2px; }
/* 工具栏「全局变量」按钮上的计数徽标 */
.chat-tool-btn .tool-count { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; padding: 0 4px; margin-left: 4px; border-radius: var(--r-sm); background: var(--wechat-green, #0f8a5f); color: #fff; font-size: 10.5px; line-height: 1; font-weight: 600; }
.chat-tool-btn .tool-count:empty { display: none; }
.vc-bind-bar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px; background: #fafafb; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); }
.vc-chip { display: inline-flex; align-items: center; gap: 4px; background: #fff; border: 1px solid #d8e8de; color: #2c8a5b; border-radius: var(--r-pill); padding: 3px 6px 3px 11px; font-size: 12.5px; }
.vc-chip .vb-mini { border: 0; background: none; cursor: pointer; color: #9bb3a7; padding: 1px 5px; border-radius: var(--r-pill); line-height: 1; font-size: 12px; }
.vc-chip .vb-mini:hover { background: #eef6f1; color: #2c8a5b; }
.vc-bind-add { font-size: 12.5px; padding: 4px 12px; border-radius: var(--r-pill); border: 1px dashed rgba(15,138,95,.5); background: #fff; color: #0f8a5f; cursor: pointer; }
.vc-bind-add:hover { background: rgba(15,138,95,.08); }
.vc-bind-add.active { background: rgba(15,138,95,.12); }
.vc-bind-pop { width: 100%; margin-top: 6px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
/* 全局变量弹窗：单栏、窄一点 */
.vc-modal-global { width: min(600px, 94vw); }
/* ===== ⚖️ 状态判定区 ===== */
.vc-judge-opts { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; padding: 8px 10px; background: color-mix(in srgb, var(--wechat-green, #0f8a5f) 4%, #fafafb); border: 1px solid var(--wechat-line); border-radius: var(--r-sm); }
.vc-judge-opts .vc-add-row { width: auto; margin: 0; padding: 4px 12px; }
.vc-judge-preview { font-size: 12.5px; line-height: 1.7; background: #fbfbfd; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 10px 12px; color: #555; max-height: 180px; overflow: auto; }
.vc-judge-preview .vj-empty { color: var(--muted); }
.vc-judge-preview .vj-active-head { font-weight: 700; color: #b08d57; margin-bottom: 5px; }
.vc-judge-preview .vj-line { display: flex; align-items: baseline; gap: 6px; padding: 2px 0; flex-wrap: wrap; }
.vc-judge-preview .vj-line.vj-on { background: rgba(176,141,87,.1); border-radius: 6px; padding: 3px 7px; margin: 2px -5px; }
.vc-judge-preview .vj-name { color: #777; word-break: break-all; }
.vc-judge-preview .vj-val { font-weight: 700; color: #333; }
.vc-judge-preview .vj-arrow { color: #c4c4c8; }
.vc-judge-preview .vj-label { font-weight: 700; color: var(--wechat-green, #0f8a5f); background: rgba(15,138,95,.1); border-radius: 5px; padding: 1px 9px; }
.vc-judge-preview .vj-reason { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--wechat-line); color: #555; white-space: pre-wrap; }
.vc-judge-preview .vj-reason b { color: #b08d57; }
/* 判定区间编辑行：min ~ max ：结论，单行紧凑（不复用 vc-vrow 的整行换行规则）*/
.vc-band-row { display: flex; align-items: center; gap: 5px; padding: 5px 8px; }
.vc-band-row:hover { background: #fafafb; }
.vc-band-row input { border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 5px 6px; font-size: 12.5px; background: #fff; }
.vc-band-row input:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.vc-band-row .vc-band-num { width: 46px; flex: 0 0 auto; text-align: center; }
.vc-band-row .vc-band-sep { color: #bbb; flex: 0 0 auto; }
.vc-band-row .vc-band-label { flex: 1 1 auto; min-width: 56px; color: #5a4a2a; }
.vc-band-row .vc-del { flex: 0 0 auto; border: 0; background: none; cursor: pointer; color: var(--quiet); width: 26px; height: 26px; border-radius: var(--r-xs); display: inline-flex; align-items: center; justify-content: center; }
.vc-band-row .vc-del:hover { background: #fdecec; color: var(--danger); }
.vc-band-row .vc-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }

/* 判定区（整合进角色变量库卡片）：数值区间 + 事件反应 */
.vc-bank-judge { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--wechat-line); }
.vc-judge-summary { cursor: pointer; font-size: 12px; font-weight: 700; color: #9a8050; padding: 4px 2px; list-style: none; user-select: none; }
.vc-judge-summary::-webkit-details-marker { display: none; }
.vc-judge-summary::before { content: '▸ '; color: #c4a86a; }
details[open] > .vc-judge-summary::before { content: '▾ '; }
.vc-judge-body { display: flex; flex-direction: column; gap: 6px; padding-top: 4px; }
.vc-judge-now { font-size: 11.5px; color: var(--wechat-green, #0f8a5f); background: rgba(15,138,95,.08); border-radius: 6px; padding: 3px 8px; align-self: flex-start; }
.vc-judge-now b { color: var(--wechat-green, #0f8a5f); }
.vc-band-row.band-hit { background: rgba(15,138,95,.1); border-radius: 6px; box-shadow: inset 2px 0 0 var(--wechat-green, #0f8a5f); }
.vc-judge-subhead { font-size: 12px; font-weight: 700; color: #9a8050; margin-top: 4px; }
.vc-judge-hint { font-size: 11.5px; color: var(--muted, #999); line-height: 1.5; }
.vc-er-row { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.vc-er-cond, .vc-er-react { flex: 1 1 90px; min-width: 76px; border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 5px 7px; font-size: 12px; background: #fff; }
.vc-er-cond:focus, .vc-er-react:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.vc-er-arrow { flex: 0 0 auto; color: #c4a86a; font-weight: 700; }
.vc-er-target { flex: 0 0 auto; border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 5px 4px; font-size: 11.5px; background: #fff; color: #555; }
.vc-er-target:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.vc-er-row .vc-del { flex: 0 0 auto; border: 0; background: none; cursor: pointer; color: var(--quiet); width: 26px; height: 26px; border-radius: var(--r-xs); display: inline-flex; align-items: center; justify-content: center; }
.vc-er-row .vc-del:hover { background: #fdecec; color: var(--danger); }
.vc-er-row .vc-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.vc-er-row.er-off { opacity: .5; }
.vc-er-chk { flex: 0 0 auto; width: 15px; height: 15px; }
.vc-er-target.er-writer { color: var(--wechat-green, #0f8a5f); border-color: rgba(15,138,95,.4); }
.vc-er-target.er-planner { color: #b08d57; border-color: rgba(176,141,87,.5); }
.act-date.date-bad { border-color: var(--danger, #e5534b); background: #fff6f5; }
.vc-varnpc-hint:not(:empty) { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: #8a6d3b; background: #fff8ec; border: 1px solid #f0e0c0; border-radius: var(--r-sm); padding: 7px 10px; }
.vc-varnpc-hint .vc-add-row { color: #b8860b; border-color: rgba(184,134,11,.4); }
.vc-varnpc-hint .vc-add-row:hover { background: rgba(184,134,11,.08); }
/* 发送框变量浮窗顶部的判定摘要（状态回写） */
.var-quick-judge { font-size: 12px; color: #5a4a2a; background: #fbf7ee; border: 1px solid #efe4cc; border-radius: var(--r-sm); padding: 6px 10px; margin: 0 0 6px; cursor: pointer; }
.var-quick-judge:hover { background: #f6efe0; }
.var-quick-judge b { color: #b8860b; }
.var-quick-judge .vqj-more { color: #a98c5a; font-size: 11px; }
/* 角色小变量浮窗底部的「全局变量在顶栏」提示 */
.quick-foot-hint { font-size: 11px; color: var(--quiet); padding: 7px 2px 0; margin-top: 4px; border-top: 1px solid var(--wechat-line); line-height: 1.5; }
.bubble-audio {
  display: block;
  width: min(420px, 100%);
  margin: 8px 0;
}
.composer { border-top: 1px solid var(--wechat-line); background: #f6f6f6; padding: 10px 14px 14px; display: grid; gap: 8px; position: sticky; bottom: 0; z-index: 3; }
.composer-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
.composer-send-group { display: flex; gap: 8px; align-items: stretch; }
.composer-mini {
  flex: 0 0 auto; width: 44px; display: grid; place-items: center;
  border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #0c6b48; cursor: pointer;
}
.composer-mini:hover:not(:disabled) { background: #eafdf2; border-color: rgba(15,138,95,.5); }
.composer-mini:disabled, .composer-mini.busy { opacity: .55; cursor: progress; }
.composer-mini svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; }
.composer textarea { min-height: 72px; max-height: 220px; }
.composer-tools { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 12px; }
/* 一键回到最新（滚到底部）：放在发送框上方工具行右侧 */
.scroll-bottom-btn { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--wechat-line); background: #fff; color: var(--muted); border-radius: var(--r-pill); padding: 3px 10px 3px 8px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.scroll-bottom-btn:hover { border-color: var(--wechat-green); color: #0c6b48; background: #f0fdf4; }
.scroll-bottom-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.card { border-bottom: 1px solid #ededed; padding: 14px 0; }
.card:first-child { padding-top: 0; }
.card-title { color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.profile-row { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
.profile-main { min-width: 0; }
.profile-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-source { color: var(--muted); font-size: 12px; margin-top: 3px; }
.profile-text {
  max-height: 160px;
  overflow: auto;
  white-space: pre-wrap;
  line-height: 1.62;
  color: #4c4c4c;
  font-size: 13px;
  background: #f3f3f3;
  padding: 10px;
  border-radius: var(--r-xs);
}
#roleInfoModal { z-index: 80; display: block !important; opacity: 0; visibility: hidden; background: rgba(0,0,0,0); transition: opacity .22s ease, visibility .22s ease, background .22s ease; }
#roleInfoModal.show { opacity: 1; visibility: visible; pointer-events: auto; background: rgba(0,0,0,.42); }
/* 角色介绍：铺满屏幕的大窗。用 #id 提升优先级，盖掉 .modal 的 720px 宽度上限 */
#roleInfoModal .role-info-modal {
  position: fixed;
  inset: 14px;
  width: auto;
  max-width: none;
  max-height: none;
  margin: 0;
  overflow: hidden;
  pointer-events: auto;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  transform: scale(.97) translateY(10px);
  opacity: 0;
  transition: transform .28s cubic-bezier(.22, 1, .36, 1), opacity .22s ease;
}
#roleInfoModal.show .role-info-modal {
  transform: none;
  opacity: 1;
}
.role-info-modal .modal-body { overflow: hidden; padding: 14px 16px; }
.role-info-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  min-height: 0;
}
.role-info-left {
  min-width: 0;
  display: grid;
  gap: 12px;
}
.role-info-shell .profile-row { margin-bottom: 0; align-items: center; }
.ri-top { flex: 0 0 auto; }
/* 三栏分工：① 简介/正文 ② 资源映射 ③ 注入配置(预设/大库/小库)。整列等高，卡片内部各自滚动 */
.role-info-grid {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1.08fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}
/* 每一列：纵向堆叠卡片，列高填满，卡片间留固定间距 */
.ri-col {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
}
/* 紧凑卡片(预设/大库)：只占内容高度，不再被拉伸成半屏空白 */
.ri-card-compact { flex: 0 0 auto; }
/* 撑高卡片(简介正文/资源/小库列表)：吃掉本列剩余高度，内部滚动 */
.ri-card-grow { flex: 1 1 auto; min-height: 0; }
.role-info-card > .ctx-hint { flex: 0 0 auto; }
.ri-col .res-edit-list,
.ri-col .small-kb-list { flex: 1 1 auto; min-height: 0; overflow: auto; padding-right: 4px; }

/* 第3列「注入配置」卡片偏多（预设 / 大库 / 小库 / 记忆库）：改为整列自然高度 + 列内滚动，
   卡片不再互相抢高度；两个选择器弹层在列内 inline 展开（随列滚动、永不被裁剪），杜绝溢出重叠。 */
.ri-col-config { overflow-y: auto; overflow-x: hidden; gap: 12px; padding-right: 4px; }
.ri-col-config .role-info-card { flex: 0 0 auto; }
.ri-col-config .ri-kb-picker-panel {
  position: static; width: 100%; max-width: none; max-height: 46vh;
  margin-top: 8px; box-shadow: none; bottom: auto; right: auto;
}

/* 简介列：简介可读在上，角色卡正文（可能是提示词/源码）折叠在下，互不混淆。间距交给子元素自身 margin，避免与卡片 flex 叠加 */
/* 简介限定高度、超出自身滚动，给「角色卡正文」留出固定区域，避免简介把正文挤没 */
.role-description-card .profile-text { flex: 0 1 auto; min-height: 56px; max-height: 34vh; }
/* 开场白：与角色描述分开的独立框 */
.ri-firstmes-block { flex: 0 0 auto; border-top: 1px solid #e9e9e9; padding-top: 12px; margin-top: 4px; }
.ri-firstmes-block.hidden { display: none; }
.ri-firstmes-label { font-size: 12px; font-weight: 600; color: #0c6b48; margin-bottom: 6px; }
.ri-firstmes-text { margin: 0; min-height: 60px; max-height: 22vh; overflow: auto; white-space: pre-wrap; word-break: break-word; font: inherit; font-size: 13px; line-height: 1.6; color: #2b3a30; background: #f6faf7; border: 1px solid #dbe7df; border-radius: var(--r-sm); padding: 10px 12px; }
.ri-desc-block {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-top: 1px solid #e9e9e9;
  padding-top: 12px;
}
.ri-desc-block.open { flex: 1 1 auto; }
.ri-desc-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--text);
  font-size: 13.5px;
  cursor: pointer;
  text-align: left;
}
.ri-desc-toggle:hover { border-color: rgba(15,138,95,.5); background: #f7fff9; }
.ri-desc-chevron { width: 17px; height: 17px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; transition: transform .15s; }
.ri-desc-block.open .ri-desc-chevron { transform: rotate(180deg); }
.ri-desc-toggle-label { font-weight: 600; }
.ri-desc-badge { margin-left: auto; font-size: 11px; padding: 2px 10px; border-radius: var(--r-pill); background: #eef1f4; color: #6b7280; white-space: nowrap; }
.ri-desc-badge.is-prompt { background: #fdeede; color: #ad6217; }
.ri-desc-block #roleInfoDescription { display: none; }
.ri-desc-block.open #roleInfoDescription {
  display: block;
  flex: 1 1 auto;
  margin: 10px 0 0;
  min-height: 200px;
  max-height: 48vh;
  overflow: auto;
}
/* 简介列：整列一起往下拉滚动（像「注入配置」列那样），开场白 / 角色描述各自自然高度、不再分别内部裁剪，
   整列滚动就能把两个框都舒服看全。覆盖上面各框的内部 max-height / overflow。 */
.ri-col-read { overflow-y: auto; overflow-x: hidden; gap: 12px; padding-right: 4px; }
.ri-col-read .ri-card-grow { flex: 0 0 auto; }
.ri-col-read .role-description-card .profile-text { max-height: none; overflow: visible; }
.ri-col-read .ri-firstmes-text { max-height: none; overflow: visible; }
.ri-col-read .ri-desc-block.open #roleInfoDescription { flex: 0 0 auto; max-height: none; overflow: visible; }
.ri-edit-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: var(--ctl-h-tool);
  padding: 0 12px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
}
.ri-edit-btn:hover { border-color: rgba(15,138,95,.5); color: #0c6b48; }
.ri-edit-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.ri-stats { display: flex; flex-wrap: wrap; gap: 6px; }
.ri-chip {
  font-size: 12px;
  color: #4b6d5a;
  background: #eaf7ef;
  border-radius: var(--r-pill);
  padding: 3px 10px;
}
.ri-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; padding-bottom: 9px; border-bottom: 1px solid #edf0ee; flex-wrap: wrap; }
.ri-card-head h3 { margin: 0; font-size: 14.5px; font-weight: 600; color: var(--text); display: inline-flex; align-items: center; gap: 7px; }
.ri-card-head h3::before { content: ""; width: 3px; height: 14px; border-radius: 2px; background: var(--wechat-green); }
.ri-mini-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: var(--ctl-h);
  padding: 0 14px;
  border: 1px solid rgba(15,138,95,.5);
  border-radius: var(--r-sm);
  background: #f3fff8;
  color: #0c6b48;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.ri-mini-btn:hover { background: #e6fbf0; }
.ri-mini-btn.ghost { border-color: var(--wechat-line); background: #fff; color: var(--muted); }
.ri-mini-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.ri-res-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ri-res-actions .ri-mini-btn { height: var(--ctl-h-tool); padding: 0 11px; }
/* 「AI 资源树」按钮：紫蓝强调，区别于普通增删资源（这是交给主控 AI 的智能动作） */
.ri-mini-btn.ri-mini-btn-ai { border-color: rgba(124,92,246,.55); background: #f5f3ff; color: #6d3bd6; }
.ri-mini-btn.ri-mini-btn-ai:hover { background: #ece8ff; }

/* 小知识库工具栏：新建（实心绿）+ 挂载已有（明显下拉），不再被埋在标题角落 */
.ri-kb-toolbar { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.ri-kb-primary {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: var(--ctl-h-lg);
  padding: 0 18px;
  border: none;
  border-radius: var(--r-sm);
  background: var(--wechat-green);
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(15,138,95,.25);
}
.ri-kb-primary:hover { background: var(--wechat-green-dark); }
.ri-kb-primary svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.4; }
.ri-preset-select {
  width: 100%; height: var(--ctl-h-lg); padding: 0 12px;
  border: 1px solid var(--wechat-line); border-radius: var(--r-sm);
  background: #fff; color: var(--text); font-size: 13px;
}
.ri-kb-toolbar select {
  flex: 1 1 180px;
  min-width: 0;
  height: var(--ctl-h-lg);
  padding: 0 14px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
}
.ri-kb-toolbar select:hover:not(:disabled) { border-color: rgba(15,138,95,.5); }
.ri-kb-toolbar select:disabled { color: var(--muted); background: #f5f5f5; cursor: not-allowed; }

/* ===== 人物小知识库：选择器按钮 + 弹出面板 + 生效摘要 ===== */
.ri-kb-picker-wrap { position: relative; }
.ri-kb-picker-btn {
  display: inline-flex; align-items: center; gap: 7px;
  height: var(--ctl-h-lg); padding: 0 16px;
  border: 1px solid rgba(15,138,95,.55); border-radius: var(--r-sm);
  background: #f3fff8; color: #0c6b48;
  font-size: 13.5px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.ri-kb-picker-btn:hover { background: #e6fbf0; box-shadow: 0 1px 6px rgba(15,138,95,.2); }
.ri-kb-picker-btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.ri-kb-btn-count { min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--r-pill); background: var(--wechat-green); color: #fff; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }

.ri-kb-picker-panel {
  position: absolute; right: 0; bottom: calc(100% + 6px); z-index: 90;
  width: 340px; max-width: 86vw; max-height: 60vh; overflow-y: auto;
  background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-md);
  box-shadow: 0 12px 36px rgba(0,0,0,.18); padding: 10px;
  display: flex; flex-direction: column; gap: 6px;
}
.ri-kb-picker-panel.hidden { display: none; }
.ri-kb-pick-head { font-size: 12.5px; font-weight: 700; color: var(--text); padding: 2px 2px 4px; }
.ri-kb-pick-sep { font-size: 11.5px; color: var(--muted); padding: 6px 2px 2px; border-top: 1px solid var(--wechat-line); margin-top: 2px; }
.ri-kb-pick-list { display: flex; flex-direction: column; gap: 4px; }
.ri-kb-pick-item {
  display: flex; align-items: center; gap: 9px; width: 100%;
  padding: 8px 9px; border: 1px solid transparent; border-radius: var(--r-sm);
  background: #fafafb; cursor: pointer;
}
.ri-kb-pick-item:hover { background: #f0fff7; border-color: rgba(15,138,95,.3); }
.ri-kb-pick-item.active { background: #e6fbf0; border-color: rgba(15,138,95,.55); }
.ri-kb-pick-item input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--wechat-green); flex: 0 0 auto; cursor: pointer; }
.ri-kb-pick-res { border-style: dashed; border-color: rgba(15,138,95,.45); background: #f6fffb; }
.ri-kb-pick-res.active { border-style: solid; }
.ri-kb-pick-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ri-kb-pick-name { font-size: 13.5px; color: var(--text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ri-kb-pick-sub { font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ri-kb-pick-del { flex: 0 0 auto; width: 26px; height: 26px; border: none; background: transparent; color: #b9bcc4; border-radius: var(--r-xs); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.ri-kb-pick-del:hover { background: #fdecea; color: #c0392b; }
.ri-kb-pick-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.ri-kb-pick-view { flex: 0 0 auto; width: 26px; height: 26px; border: none; background: transparent; color: #b9bcc4; border-radius: var(--r-xs); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.ri-kb-pick-view:hover { background: rgba(15,138,95,.12); color: var(--wechat-green); }
.ri-kb-pick-view svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
/* 世界书 / 资源清单只读查看器 */
.tv-modal { width: min(680px, 100%); }
.tv-pre { margin: 0; white-space: pre-wrap; word-break: break-word; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.6; color: #333; max-height: 64vh; overflow: auto; background: #fafafb; border: 1px solid #eee; border-radius: var(--r-sm); padding: 12px; }
.ri-kb-pick-foot { display: flex; gap: 8px; padding-top: 6px; border-top: 1px solid var(--wechat-line); margin-top: 2px; }
.ri-kb-pick-new { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; height: var(--ctl-h); padding: 0 12px; border: none; border-radius: var(--r-sm); background: var(--wechat-green); color: #fff; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.ri-kb-pick-new:hover { background: var(--wechat-green-dark); }
.ri-kb-pick-new svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.4; }
.ri-kb-pick-manage { flex: 1 1 auto; height: var(--ctl-h); border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: var(--text); font-size: 12.5px; cursor: pointer; }
.ri-kb-pick-manage:hover { background: #f5f5f7; border-color: rgba(15,138,95,.5); }

.ri-kb-summary { margin-top: 10px; }
.ri-kb-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ri-kb-chip { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: var(--r-pill); background: #f0f1f4; color: var(--text); font-size: 12px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ri-kb-chip-res { background: #e6fbf0; color: #0c6b48; font-weight: 600; }

/* 可编辑资源映射表 */
.res-edit-list { display: grid; gap: 10px; }
.res-row {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid #e6e6e6;
  border-radius: var(--r-sm);
  background: #fff;
}
.res-row-preview { width: 60px; height: 60px; }
.res-row-preview .resource-thumb { width: 60px; height: 60px; }
.res-row-fields { min-width: 0; display: grid; gap: 8px; }
.res-row-line { display: flex; gap: 8px; align-items: center; }
.res-row-line .res-type { width: 112px; flex: 0 0 auto; height: 38px; font-size: 13px; }
.res-row-line .res-name { flex: 1 1 auto; min-width: 0; height: 38px; font-size: 13px; }
.res-row .res-url { width: 100%; height: 38px; font-family: var(--mono); font-size: 12.5px; }
.res-row .res-desc { width: 100%; height: 38px; font-size: 12.5px; color: var(--text); }
.res-row .res-desc::placeholder { color: var(--quiet, #9aa0a7); font-size: 11.5px; }
.res-row-dead { border-color: #e2536b; background: #fff1f3; box-shadow: inset 0 0 0 1px rgba(226,83,107,.30); }
.res-row-dead .res-url { border-color: rgba(226,83,107,.5); color: #b32a44; }
.res-dead-flag { color: #c0334c; font-size: 12px; font-weight: 600; line-height: 1.35; }
.res-del {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fff;
  color: #c0504a;
  cursor: pointer;
}
.res-del:hover { background: rgba(233,79,79,.1); border-color: rgba(233,79,79,.4); }
.res-del svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.role-info-card {
  border: 1px solid #e6eae7;
  border-radius: var(--r-md);
  background: #fafbfa;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.role-info-card h3 { font-size: 14px; margin: 0 0 10px; color: var(--text); }
.role-info-card pre {
  margin: 0;
  min-height: 180px;
  max-height: 34vh;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  background: #fff;
  border: 1px solid #eeeeee;
  border-radius: var(--r-xs);
  padding: 12px;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.6;
}
/* 资源映射列：不再 align-self:start，和其它列一样拉伸到行高，让 .res-edit-list 的 overflow:auto 正常滚动 */
.resource-card-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: calc(100vh - 180px);
  overflow: auto;
}
.resource-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid #e8e8e8;
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--text);
  text-decoration: none;
}
.resource-card:hover { border-color: rgba(15,138,95,.45); background: #f7fff9; }
.resource-thumb {
  width: 54px;
  height: 54px;
  border-radius: var(--r-xs);
  object-fit: cover;
  background: #efefef;
}
.resource-icon {
  display: grid;
  place-items: center;
  color: #4b6d5a;
  font-weight: 800;
  font-family: var(--mono);
}
.resource-card-main { min-width: 0; display: grid; gap: 3px; }
.resource-type {
  justify-self: start;
  padding: 1px 7px;
  border-radius: var(--r-pill);
  background: #e8f6ed;
  color: #0c6b48;
  font-size: 11px;
}
.resource-card strong, .resource-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-card small { color: var(--muted); font-size: 11px; }
.empty.mini { padding: 18px 8px; text-align: left; }
.muted-box:empty::before { content: "暂无规划"; color: var(--quiet); }
.api-line { font-family: var(--mono); font-size: 11px; color: var(--muted); overflow: hidden; white-space: pre-line; text-overflow: ellipsis; margin-bottom: 8px; }
.api-hint {
  min-height: var(--ctl-h);
  padding: 8px 10px;
  border-radius: var(--r-xs);
  background: #f1f1f1;
  color: #777;
  font-size: 12px;
  line-height: 1.45;
}
.field { display: grid; gap: 6px; margin-bottom: 10px; }
.field label { color: var(--muted); font-size: 12px; }
.global-system-text {
  min-height: 240px;
  resize: vertical;
  border: 1px solid var(--wechat-line);
  background: #fff;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-wrap;
}
.global-system-text:focus { border-color: rgba(15,138,95,.5); }
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.model-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.provider-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 12px;
}
.provider-row button {
  min-height: var(--ctl-h-micro);
  padding: 0 12px;
  border-radius: var(--r-pill);
  background: #fff;
  border: 1px solid #e1e1e1;
  color: #555;
  font-size: 12px;
}
.provider-row button:hover { border-color: rgba(15,138,95,.45); background: #f2fff7; color: #0c6b48; }
.check { display: flex; align-items: center; gap: 8px; color: #555; margin: 8px 0; }
.check input { width: auto; height: auto; }
.overlay { position: fixed; inset: 0; display: none; z-index: 40; pointer-events: none; overscroll-behavior: contain; }
.overlay.show { display: block; }
.overlay.shade { background: rgba(0,0,0,.35); }
/* ===== 全局滚动加固：任意浮层打开时锁住背景(body)滚动，浮层内滚动到边界也不外溢到背景，消除滚动穿透 / 背景晃动 ===== */
html:has(.overlay.show), body:has(.overlay.show) { overflow: hidden !important; }
.modal, .float-panel, .modal-body { overscroll-behavior: contain; }
/* 通用覆盖：弹窗 / 浮层里几乎所有可滚动容器（列表 / 树 / 网格 / 弹出 / 卡片 / 代码块）滚到边界都不外溢到背景 */
[class*="-list"], [class*="-tree"], [class*="-grid"], [class*="-cards"], [class*="-pop"], [class*="-bands"], [class*="-groups"], [class*="-beats"], .map-tree, .otl-tree, .furnace-items, .ctx-cards, pre, textarea { overscroll-behavior: contain; }
.modal {
  width: min(720px, 100%);
  max-height: min(820px, 92vh);
  overflow: auto;
  background: #fff;
  border-radius: var(--r-sm);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  pointer-events: auto;
}
.modal.wide { width: min(900px, calc(100vw - 28px)); }
.prompt-modal { width: min(1040px, calc(100vw - 110px)); }
.float-panel {
  position: fixed;
  top: 68px;
  right: 18px;
  max-height: calc(100vh - 86px);
  border: 1px solid rgba(0,0,0,.08);
}
.modal-head { height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid #eee; font-weight: 700; }
.modal-body { padding: 16px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 0 16px 16px; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.preset-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.prompt-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 1fr) 140px auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 10px;
}
.prompt-toolbar .field { margin-bottom: 0; }
.prompt-token-summary {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
  padding: 8px 0 12px;
}
.st-list { display: grid; gap: 8px; max-height: 460px; overflow: auto; padding-right: 2px; }
.regex-entry {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-xs);
  background: #fafafa;
}
/* 预设条目：折叠长条 */
.st-entry {
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-xs);
  background: #fafafa;
  overflow: hidden;
  transition: border-color .14s ease, box-shadow .14s ease;
}
.st-entry.open { border-color: rgba(15,138,95,.4); box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.st-entry-bar {
  display: grid;
  grid-template-columns: 22px auto minmax(0, 1fr) 56px 30px;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  cursor: pointer;
}
.st-entry-bar:hover { background: rgba(0,0,0,.03); }
.st-entry-bar .check { margin: 0; }
.st-entry-name { background: transparent; border: 0; font-weight: 600; height: var(--ctl-h-micro); padding: 0 4px; }
.st-entry-name:focus { background: #fff; border: 1px solid rgba(15,138,95,.45); }
.st-toggle { width: 30px; min-width: 30px; min-height: var(--ctl-h-micro); color: var(--muted); }
.st-toggle svg { transition: transform .18s ease; }
.st-entry.open .st-toggle svg { transform: rotate(180deg); }
.st-entry-body {
  display: grid;
  gap: 8px;
  max-height: 0;
  opacity: 0;
  padding: 0 10px;
  overflow: hidden;
  transition: max-height .2s ease, opacity .18s ease, padding .2s ease;
}
.st-entry.open .st-entry-body { max-height: 600px; opacity: 1; padding: 4px 10px 10px; }
.st-entry-actions { display: flex; justify-content: flex-end; }
.st-remove { color: var(--danger); font-size: 12px; }
.st-remove:hover { background: rgba(233,79,79,.12); }
.regex-entry-head { display: grid; grid-template-columns: auto minmax(0, 1fr) 120px 56px; gap: 8px; align-items: center; }
.st-entry-sub { display: grid; grid-template-columns: minmax(100px, .7fr) minmax(110px, .7fr) 96px 96px 112px; gap: 8px; align-items: center; }
.st-drag { color: var(--muted); text-align: center; font-weight: 700; cursor: grab; user-select: none; }
.st-drag:active { cursor: grabbing; }
.st-entry.dragging { opacity: .5; }
.st-entry.drop-target { box-shadow: 0 -2px 0 0 #0f8a5f inset, 0 0 0 1px rgba(15,138,95,.4); }
.st-token { text-align: right; color: var(--muted); font-family: var(--mono); font-size: 12px; }
.st-flags { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.st-flags .check { margin: 0; font-size: 12px; }
.st-entry textarea, .regex-entry textarea {
  min-height: 96px;
  font-family: var(--mono);
  font-size: 12px;
  resize: vertical;
  width: 100%;
}
.regex-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.settings-section { border: 1px solid #ededed; border-radius: var(--r-sm); padding: 14px; background: #fafafa; }
.settings-section.full { margin-top: 14px; }
.settings-section.full:first-child { margin-top: 0; }
.profile-float { display: grid; gap: 10px; }
.status-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}
.planner-strip { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.settings-section h2 { margin: 0 0 6px; font-size: 15px; }
.settings-section p { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.inline-actions, .switch-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cc-toggle-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0 8px; }
.cc-toggle-btn {
  min-height: 36px;
  padding: 0 14px;
  border-radius: var(--r-pill);
  border: 1px solid var(--wechat-line);
  background: var(--surface);
  color: var(--text);
  font-weight: 650;
  cursor: pointer;
  box-shadow: var(--shadow-soft);
}
.cc-toggle-btn.is-on {
  border-color: var(--jade);
  background: var(--jade-soft);
  color: var(--jade-ink);
}
.cc-toggle-btn.is-off {
  background: var(--surface-3);
  color: var(--muted);
  box-shadow: none;
}
.cc-auto-info { color: var(--muted); font-size: 12px; line-height: 1.4; }
.drop { border: 1px dashed #cfcfcf; border-radius: var(--r-sm); padding: 24px; text-align: center; color: var(--muted); background: #fafafa; cursor: pointer; display: block; }
.drop.drag { border-color: var(--wechat-green); background: #f0fff6; }
.toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%) translateY(12px);
  background: rgba(0,0,0,.78);
  color: #fff;
  padding: 10px 14px;
  border-radius: var(--r-xs);
  max-width: min(720px, calc(100vw - 48px));
  white-space: pre-wrap;
  line-height: 1.45;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 50;
}
.toast.long { text-align: left; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.hidden { display: none !important; }
.empty { color: var(--muted); text-align: center; padding: 60px 20px; }
.mobile-only { display: none; }

/* ========== 上下文看板 ========== */
.ctx-hint { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 0 0 12px; }
.ctx-summary {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}
.ctx-stat {
  flex: 1;
  background: #f5f5f5;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  display: grid;
  gap: 2px;
}
.ctx-stat-num { font-size: 20px; font-weight: 800; color: var(--text); font-family: var(--mono); }
.ctx-stat-label { font-size: 11px; color: var(--muted); }
.sampling-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
@media (max-width: 760px) { .sampling-grid { grid-template-columns: repeat(2, 1fr); } }
.ctx-stat-warn { background: #fff7e6; border-color: #ffe1a8; }
.ctx-stat-warn .ctx-stat-num { color: #b76e00; }
.ctx-stat-over { background: #fff1f0; border-color: #ffccc7; }
.ctx-stat-over .ctx-stat-num { color: #cf1322; }
.ctx-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.ctx-tabs { display: inline-flex; background: #ededed; border-radius: var(--r-sm); padding: 3px; gap: 2px; }
.ctx-tab {
  min-height: var(--ctl-h-sm);
  padding: 0 14px;
  border-radius: var(--r-xs);
  font-size: 13px;
  color: var(--muted);
  background: transparent;
}
.ctx-tab.active { background: #fff; color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.08); font-weight: 600; }
.ctx-cards { display: grid; gap: 8px; max-height: 56vh; overflow: auto; padding-right: 2px; }
.ctx-entry {
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fafafa;
  overflow: hidden;
}
.ctx-entry.open { border-color: rgba(15,138,95,.35); box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.ctx-entry-bar {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto 30px;
  gap: 10px;
  align-items: center;
  padding: 9px 12px;
  cursor: pointer;
}
.ctx-entry-bar:hover { background: rgba(0,0,0,.03); }
.ctx-chip {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  white-space: nowrap;
  color: #fff;
}
.ctx-chip.sys { background: #8a8a8a; }
.ctx-chip.preset { background: #6b7280; }
.ctx-chip.char { background: var(--wechat-green); }
.ctx-chip.persona { background: #d4a017; }
.ctx-chip.world { background: #8b5cf6; }
.ctx-chip.absolute { background: #f97316; }
.ctx-chip.history { background: #3b82f6; }
.ctx-chip.compact { background: #0f766e; }
.ctx-role { font-family: var(--mono); font-size: 11px; color: var(--muted); text-transform: uppercase; }
.ctx-name { font-size: 13px; font-weight: 600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ctx-token { font-family: var(--mono); font-size: 12px; color: var(--muted); }
.ctx-toggle { width: 30px; min-width: 30px; min-height: var(--ctl-h-micro); color: var(--muted); }
.ctx-toggle svg { transition: transform .18s ease; }
.ctx-entry.open .ctx-toggle svg { transform: rotate(180deg); }
.ctx-entry-body {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height .22s ease, opacity .18s ease, padding .2s ease;
  padding: 0 12px;
}
.ctx-entry.open .ctx-entry-body { max-height: 600px; opacity: 1; padding: 0 12px 12px; overflow: auto; }
.ctx-content {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--sans);
  font-size: 12.5px;
  line-height: 1.6;
  color: #333;
  background: #fff;
  border: 1px solid #eee;
  border-radius: var(--r-xs);
  padding: 10px;
}
.ctx-json {
  margin: 0;
  max-height: 56vh;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.55;
  color: #333;
  background: #f7f7f7;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  padding: 12px;
}
.ctx-whole {
  margin: 0;
  max-height: 56vh;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: inherit;
  font-size: 13.5px;
  line-height: 1.7;
  color: #2a2d36;
  background: #fbfbfd;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  padding: 16px 18px;
}
.ctx-autorefresh { font-size: 12px; color: var(--muted); display: inline-flex; align-items: center; gap: 5px; margin-right: 4px; }

/* ========== 角色卡库 / 选角 ========== */
.character-modal {
  width: min(1480px, calc(100vw - 40px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.character-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.material-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -2px 0 12px;
  color: var(--muted);
  font-size: 12px;
}
.material-summary span {
  padding: 4px 9px;
  border: 1px solid #e6e6e6;
  border-radius: var(--r-pill);
  background: #fafafa;
}

/* ========== 标签 / 词条素材库 ========== */
.tag-modal {
  width: min(1680px, calc(100vw - 64px));
}
.tag-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.tag-toolbar button {
  min-height: var(--ctl-h-tool);
  background: #f5f5f5;
  border: 1px solid #e5e5e5;
}
.tag-toolbar button:hover {
  background: #eef8f2;
  border-color: rgba(15,138,95,.3);
}
.tag-layout {
  display: grid;
  grid-template-columns: 210px 340px minmax(0, 1fr);
  gap: 12px;
  min-height: min(760px, calc(100vh - 260px));
}
.tag-column,
.tag-detail {
  min-width: 0;
  border: 1px solid #eeeeee;
  border-radius: var(--r-sm);
  background: #fafafa;
  padding: 10px;
}
.tag-column-title {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.tag-search-wrap {
  margin-bottom: 8px;
}
.tag-search-wrap input {
  min-height: var(--ctl-h);
  padding: 0 10px;
  border-radius: var(--r-sm);
  background: #fff;
}
.tag-column { display: flex; flex-direction: column; }
.tag-group-list,
.tag-list {
  display: grid;
  gap: 7px;
  flex: 1 1 auto;
  min-height: 120px;
  /* 封顶高度：标签多达几百条时不再把整列撑得老长，超出就在列内滚动（之前是 max-height:none → 全铺开） */
  max-height: min(60vh, 640px);
  overflow-y: auto;
  align-content: start;
}
/* 标签库删除按钮：轻量轮廓危险样式，含说明，不再两个吓人的红块 */
.tag-editor-actions { align-items: center; }
.tag-danger-label { margin-right: auto; font-size: 11px; color: var(--muted); }
.tag-del-btn { min-height: var(--ctl-h-sm); padding: 0 12px; border: 1px solid rgba(233,79,79,.45); border-radius: var(--r-sm); background: #fff; color: #c0504a; font-size: 12.5px; cursor: pointer; }
.tag-del-btn:hover { background: rgba(233,79,79,.08); border-color: rgba(233,79,79,.7); }
.tag-modal-actions { justify-content: flex-start; }
.tag-save-hint { color: #0c6b48; font-size: 12.5px; }
.tag-list-hint {
  position: sticky;
  top: 0;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #dcefe4;
  border-radius: var(--r-sm);
  background: #f3fbf6;
  color: #0c6b48;
  font-size: 12px;
}
.tag-list-hint span {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.tag-list-hint button {
  min-height: var(--ctl-h-micro);
  padding: 0 10px;
  border: 1px solid rgba(15,138,95, .25);
  border-radius: var(--r-xs);
  background: #fff;
  color: #0c6b48;
  font-size: 12px;
  font-weight: 700;
}
.tag-list-hint button:hover {
  background: #e9f8ef;
}
.tag-group-pill {
  width: 100%;
  min-height: var(--ctl-h-lg);
  justify-content: space-between;
  background: #fff;
  border: 1px solid #e8e8e8;
  padding: 0 10px;
  text-align: left;
}
.tag-group-pill span {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.tag-group-pill small {
  color: var(--muted);
  font-family: var(--mono);
}
.tag-group-pill.active,
.tag-row.active {
  border-color: rgba(15,138,95,.5);
  background: #f0fff6;
}
.tag-row {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  border: 1px solid #e8e8e8;
  border-radius: var(--r-sm);
  background: #fff;
  padding: 7px;
}
.tag-row .check {
  margin: 0;
  justify-content: center;
}
.tag-row-main {
  min-width: 0;
  min-height: var(--ctl-h-lg);
  padding: 0 4px;
  display: grid;
  justify-content: stretch;
  text-align: left;
  background: transparent;
}
.tag-row-main strong,
.tag-row-main small {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.tag-row-main small {
  color: var(--muted);
  font-family: var(--mono);
  font-size: 11px;
}
.tag-detail-grid {
  display: grid;
  grid-template-columns: minmax(460px, 1.15fr) minmax(360px, .85fr);
  gap: 12px;
  height: 100%;
}
@media (max-width: 1500px) {
  .tag-detail-grid {
    grid-template-columns: 1fr;
  }
}
.tag-editor-card,
.tag-output-card {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid #eeeeee;
  border-radius: var(--r-sm);
  background: #fff;
  padding: 12px;
}
.tag-editor {
  min-height: 0;
  overflow: auto;
}
.tag-editor textarea[data-tag-field="tagNote"] {
  min-height: 70px;
  overflow: hidden;
  resize: none;
}
.tag-entry-list {
  display: grid;
  gap: 8px;
}
.tag-entry-editor {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fafafa;
}
.tag-entry-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 84px 34px;
  gap: 8px;
  align-items: center;
}
.tag-entry-editor textarea {
  min-height: 180px;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.58;
  resize: none;
  overflow: hidden;
}
.tag-editor-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}
.tag-output-card {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}
.tag-gen-row { display: flex; gap: 8px; margin: 6px 0 10px; align-items: stretch; }
.tag-gen-row input { flex: 1 1 auto; min-width: 0; height: 38px; }
.tag-gen-row button { flex: 0 0 auto; min-height: 38px; padding: 0 16px; }
.tag-output-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
  margin-bottom: 8px;
}
.tag-output-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.tag-output-actions button {
  min-height: var(--ctl-h-sm);
  padding: 0 12px;
  background: #f5f5f5;
  border: 1px solid #e4e4e4;
}
.tag-output-actions button:first-child {
  color: #fff;
  background: var(--wechat-green);
  border-color: var(--wechat-green);
}
.tag-output-meta {
  color: var(--muted);
  font-size: 12px;
}
.selected-tag-chips {
  min-height: var(--ctl-h-tool);
  display: flex;
  flex-wrap: wrap;
  align-content: start;
  gap: 6px;
  margin-bottom: 8px;
}
.selected-tag-chips span {
  max-width: 100%;
  padding: 3px 8px;
  border-radius: var(--r-pill);
  background: #eaf8ef;
  color: #0c6b48;
  font-size: 11px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#tagOutput {
  min-height: 240px;
  height: 100%;
  resize: vertical;
  font-family: var(--mono);
  font-size: 12.5px;
  line-height: 1.6;
  background: #fbfbfb;
  white-space: pre-wrap;
  overflow: auto;
}
.character-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 150px auto auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 14px;
}
.character-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  max-height: 66vh;
  overflow: auto;
  padding-right: 2px;
}
/* 头像墙视图：纯头像密排，hover 浮出名字，点头像看介绍 / 开聊 —— 方便快速浏览选择 */
.character-grid.avatar-wall { display: flex; flex-wrap: wrap; gap: 12px; align-content: flex-start; }
.char-av-item { position: relative; width: 72px; flex: 0 0 auto; border: none; background: none; padding: 0; cursor: pointer; }
.char-av-item .avatar { width: 72px; height: 72px; border-radius: 14px; font-size: 26px; transition: outline .12s ease, transform .12s ease; }
.char-av-item:hover .avatar { outline: 2px solid var(--jade-ink, #0c6b48); outline-offset: 1px; transform: translateY(-2px); }
.char-av-name { position: absolute; left: -6px; right: -6px; bottom: -4px; background: rgba(12,107,72,.94); color: #fff; font-size: 11px; line-height: 1.35; padding: 3px 6px; border-radius: 8px; text-align: center; opacity: 0; transform: translateY(4px); transition: opacity .12s ease, transform .12s ease; pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 4px 14px rgba(0,0,0,.28); z-index: 3; }
.char-av-item:hover .char-av-name { opacity: 1; transform: translateY(0); }
@media (max-width: 760px) { .char-av-item { width: 58px; } .char-av-item .avatar { width: 58px; height: 58px; font-size: 22px; } }
.character-card {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: var(--r-sm);
  padding: 12px;
  display: grid;
  gap: 10px;
  min-width: 0;
}
.character-card-head {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
.character-card .avatar { width: 48px; height: 48px; }
.character-card-main { min-width: 0; }
.character-card-name {
  font-weight: 800;
  font-size: 15px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.character-card-meta {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.character-card-summary {
  color: #555;
  font-size: 13px;
  line-height: 1.55;
  min-height: var(--ctl-h-lg);
  max-height: 62px;
  overflow: hidden;
}
.character-card-tags {
  min-height: 22px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
/* 卡片标签：可删胶囊（专属 class，覆盖「黑金标签」主题，统一干净绿色 + ×）*/
.character-card-tags .cc-tag { display: inline-flex !important; align-items: center; gap: 2px; font-size: 11px !important; color: #0c6b48 !important; background: #eaf8ef !important; border: 1px solid #cdeedd !important; border-radius: var(--r-pill) !important; padding: 2px 4px 2px 9px !important; box-shadow: none !important; line-height: 1.6 !important; }
.character-card-tags .cc-tag-x { border: 0; background: none; color: #6fae90; cursor: pointer; font-size: 13px; line-height: 1; padding: 0 3px; border-radius: var(--r-pill); }
.character-card-tags .cc-tag-x:hover { background: #d3efe0; color: #0c6b48; }
.character-card-tags .cc-tag-add, .character-card-tags .cc-tag-ai { font-size: 11px; border: 1px dashed rgba(15,138,95,.45); background: #fff; color: #0f8a5f; border-radius: var(--r-pill); padding: 2px 9px; cursor: pointer; line-height: 1.6; }
.character-card-tags .cc-tag-ai { border-style: solid; }
.character-card-tags .cc-tag-add.active { background: rgba(15,138,95,.1); }
.character-card-tags .cc-tag-add:hover, .character-card-tags .cc-tag-ai:hover { background: rgba(15,138,95,.08); }
.character-card-tags .cc-tag-ai:disabled { opacity: .55; cursor: default; }
.cc-tag-picker { flex: 1 1 100%; margin-top: 6px; border: 1px solid #e6efe9; border-radius: var(--r-sm); background: #fafdfb; padding: 8px; }
.cc-tag-pick-hint { font-size: 10.5px; color: #9aa7a0; margin-bottom: 6px; }
.cc-pool-wrap { display: flex; flex-wrap: wrap; gap: 5px; }
.character-card-tags .cc-pool-tag { display: inline-flex !important; align-items: center; gap: 1px; font-size: 11px !important; color: #5a6b63 !important; background: #eef1ef !important; border: 1px solid transparent !important; border-radius: var(--r-pill) !important; padding: 2px 4px 2px 9px !important; cursor: pointer; box-shadow: none !important; line-height: 1.6 !important; }
.character-card-tags .cc-pool-tag.active { color: #0c6b48 !important; background: #d6efe0 !important; border-color: #9fd8ba !important; }
.cc-pool-edit, .cc-pool-x { border: 0; background: none; cursor: pointer; font-size: 11px; line-height: 1; padding: 0 2px; border-radius: var(--r-pill); color: #aab6af; }
.cc-pool-edit:hover { color: #0f8a5f; }
.cc-pool-x:hover { color: #e94f4f; }
.cc-pool-rename { font-size: 11px; border: 1px solid #9fd8ba; border-radius: var(--r-xs); padding: 1px 5px; width: 76px; }
.cc-tag-newrow { margin-top: 7px; }
.cc-tag-newrow input { width: 100%; border: 1px solid #e3e8e5; border-radius: var(--r-sm); padding: 6px 9px; font-size: 12px; }
.character-card-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.character-card-actions button {
  min-height: var(--ctl-h-sm);
  padding: 0 12px;
  background: #f4f4f4;
  border: 1px solid #e5e5e5;
}
.character-card-actions button:first-child {
  color: #fff;
  background: var(--wechat-green);
  border-color: var(--wechat-green);
}
.character-card-actions button:disabled {
  opacity: .38;
  cursor: not-allowed;
}
.chat-empty {
  margin: 28px auto;
  max-width: 360px;
  text-align: center;
}

/* ========== 群聊 ========== */
.avatar.group-avatar { background: linear-gradient(135deg, #7c5cff, #5b8def); }
.speaker-name { font-size: 11px; color: #8b5cf6; font-weight: 700; margin-bottom: 4px; }
.bubble-content {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-family: var(--serif);
  font-size: 17.5px;
  line-height: 1.8;
  color: #1a1a1a;
  letter-spacing: .2px;
  -webkit-font-smoothing: antialiased;
}
/* 柔和青蓝对话/引号标识（对齐酒馆细腻观感） */
.bubble-content .rp-dia { color: #5b76a8; }
.bubble-content .rp-quote { color: #5b76a8; }
.msg.user .bubble-content { color: #1f1f1f; }

/* 思维链（推理模型 reasoning_content）：只看不发。统一收成深色「黑框」折叠条（仿酒馆「思考了 X 分钟」），
   不管角色绑定哪种预设、思考用什么格式输出，都归一成同一个可折叠的黑框，默认收起、不喧宾夺主。 */
.msg-reasoning {
  margin: 0 0 10px;
  border: 1px solid #34363d;
  background: #2a2c32;
  border-radius: var(--r-sm);
  display: inline-block; /* 折叠态：只占内容宽度的小黑框（像酒馆的「思考了 X 分钟」框） */
  max-width: 100%;
  overflow: hidden;
}
.msg-reasoning[open] { display: block; border-left: 2px solid #5b5e68; }
.msg-reasoning > summary {
  cursor: pointer;
  list-style: none;
  padding: 5px 12px;
  font-size: 12px;
  color: #c6c8d0;
  user-select: none;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.msg-reasoning > summary:hover { color: #e6e7ec; }
.msg-reasoning > summary::-webkit-details-marker { display: none; }
.msg-reasoning > summary::after { content: '▾'; font-size: 10px; opacity: .7; margin-left: 2px; transition: transform .15s ease; }
.msg-reasoning[open] > summary::after { transform: rotate(180deg); }
.msg-reasoning[open] > summary { border-bottom: 1px solid #3a3d45; }
.msg-reasoning.streaming { border-left-color: var(--wechat-green); }
.msg-reasoning.streaming > summary { color: #6ee7a8; }
.msg-reasoning.streaming > summary::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #6ee7a8;
  box-shadow: 0 0 0 0 rgba(110,231,168,.45);
  animation: reasoningPulse 1.2s ease-in-out infinite;
}
@keyframes reasoningPulse {
  0%, 100% { opacity: .55; box-shadow: 0 0 0 0 rgba(110,231,168,.35); }
  50% { opacity: 1; box-shadow: 0 0 0 5px rgba(110,231,168,0); }
}
/* 思维链来源小标：信道（绿=协议级 reasoning 字段，最可靠）/ 剥离（黄=从正文启发式正则识别） */
.msg-reasoning > summary .rs-src { flex: 0 0 auto; font-size: 10px; line-height: 1.4; padding: 1px 7px; border-radius: 999px; font-weight: 600; letter-spacing: .3px; }
.msg-reasoning > summary .rs-src-channel { background: rgba(110,231,168,.16); color: #7fe9b0; }
.msg-reasoning > summary .rs-src-inline { background: rgba(240,190,110,.16); color: #e7be84; }
.msg-reasoning-body {
  padding: 8px 10px;
  max-height: 260px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.55;
  color: #a9acb6;
  font-size: 12.5px;
}
.msg-reasoning-body.is-placeholder { color: #8f949c; font-style: italic; }
.live-stream-text { white-space: pre-wrap; overflow-wrap: anywhere; }

/* Codex-like 上下文压缩状态线：压缩是 prompt 维护，不是角色发言，所以用横线插在聊天流里。 */
.context-compaction-marker {
  width: min(100%, 980px);
  margin: 16px auto 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #73806f;
  font-size: 12px;
  line-height: 1.4;
}
.context-compaction-marker::before,
.context-compaction-marker::after {
  content: '';
  height: 1px;
  flex: 1 1 auto;
  background: linear-gradient(90deg, transparent, rgba(98, 122, 96, .34));
}
.context-compaction-marker::after {
  background: linear-gradient(90deg, rgba(98, 122, 96, .34), transparent);
}
.context-compaction-pill {
  flex: 0 1 auto;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border: 1px solid rgba(114, 139, 111, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .74);
  box-shadow: 0 6px 18px rgba(40, 52, 43, .08);
  backdrop-filter: blur(10px);
}
.context-compaction-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #73a66e;
}
.context-compaction-text {
  flex: 0 0 auto;
  font-weight: 700;
  color: #566b52;
  white-space: nowrap;
}
.context-compaction-meta {
  min-width: 0;
  color: #7f897c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.context-compaction-marker.is-running .context-compaction-dot {
  animation: contextCompactionPulse 1.25s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(115, 166, 110, .38);
}
.context-compaction-marker.is-done .context-compaction-dot { background: #6da65f; }
.context-compaction-marker.is-failed .context-compaction-dot { background: #c45f57; }
.context-compaction-marker.is-failed .context-compaction-text { color: #9d453e; }
@keyframes contextCompactionPulse {
  0%, 100% { opacity: .58; box-shadow: 0 0 0 0 rgba(115, 166, 110, .32); }
  50% { opacity: 1; box-shadow: 0 0 0 6px rgba(115, 166, 110, 0); }
}
@media (max-width: 640px) {
  .context-compaction-marker { gap: 8px; margin: 12px auto 14px; }
  .context-compaction-pill { padding: 6px 9px; max-width: calc(100vw - 78px); }
  .context-compaction-meta { max-width: 42vw; }
}
/* 折叠块（<details>）：预设硬塞的状态面板等收进可点开的折叠条，默认收起、保持气泡干净 */
.msg-foldout {
  margin: 6px 0;
  border: 1px solid var(--wechat-line);
  border-left: 2px solid #cfcfcf;
  background: #f7f7f7;
  border-radius: var(--r-xs);
}
.msg-foldout > summary {
  cursor: pointer;
  list-style: none;
  padding: 6px 10px;
  font-size: 12px;
  color: #8a8a8a;
  user-select: none;
}
.msg-foldout > summary::-webkit-details-marker { display: none; }
.msg-foldout > summary::before { content: "▸ "; color: #b5b5b5; }
.msg-foldout[open] > summary::before { content: "▾ "; }
.msg-foldout[open] > summary { border-bottom: 1px solid var(--wechat-line); }
.msg-foldout-body {
  padding: 8px 10px;
  max-height: 360px;
  overflow: auto;
}
.group-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: #f0f0f0;
  border: 1px solid #e2e2e2;
  border-radius: var(--r-sm);
  margin-bottom: 8px;
}
.group-mode { display: inline-flex; align-items: center; gap: 4px; }
.group-mode-label { font-size: 12px; color: var(--muted); }
.group-mode-btn {
  min-height: var(--ctl-h-micro);
  padding: 0 12px;
  font-size: 12px;
  border-radius: var(--r-xs);
  background: #fff;
  border: 1px solid #ddd;
  color: var(--muted);
}
.group-mode-btn.active { background: var(--wechat-green); color: #fff; border-color: var(--wechat-green); }
.group-speakers { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.group-speaker-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: var(--ctl-h-sm);
  padding: 0 10px 0 4px;
  font-size: 12px;
  border-radius: var(--r-pill);
  background: #fff;
  border: 1px solid #ddd;
  color: var(--text);
}
.group-speaker-chip.active { border-color: var(--wechat-green); background: #f0fff6; }
.group-speaker-av {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #678f7c;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: grid;
  place-items: center;
}
.group-bar-hint { font-size: 12px; color: var(--muted); flex: 1; min-width: 120px; }

/* 群聊编辑：成员选择器 */
.group-count { color: var(--muted); font-weight: 400; font-size: 12px; }
.group-add-search { margin-bottom: 8px; }
.group-add-search input { width: 100%; height: var(--ctl-h); }
.group-add-pool {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
  padding: 2px;
}
.group-add-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: var(--ctl-h);
  padding: 0 12px 0 4px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-pill);
  background: #fff;
  color: var(--text);
  font-size: 12.5px;
  cursor: pointer;
}
.group-add-chip:hover { border-color: rgba(15,138,95,.5); background: #f3fff8; }
.group-add-chip .avatar { width: 26px; height: 26px; font-size: 11px; }
.group-add-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 新建/编辑角色 & 群聊：头像 + 名称头部 */
.role-edit-head { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 4px; }
.role-edit-head .field.grow { flex: 1 1 auto; min-width: 0; }
.role-edit-avatar-wrap { display: grid; gap: 6px; justify-items: center; }
.role-edit-avatar-wrap .avatar { width: 60px; height: 60px; font-size: 20px; cursor: pointer; transition: filter .15s, transform .15s; }
.role-edit-avatar-wrap .avatar:hover { filter: brightness(1.08); transform: scale(1.04); }
.role-edit-avatar-btns { display: flex; gap: 4px; }
.group-go-btn {
  min-height: var(--ctl-h-sm);
  padding: 0 14px;
  font-size: 13px;
  border-radius: var(--r-xs);
  background: var(--wechat-green);
  color: #fff;
}
.group-go-btn:hover { background: var(--wechat-green-dark); }
/* 群聊编辑 modal */
#groupModal .modal { width: min(980px, calc(100vw - 40px)); }   /* 群聊弹窗加宽：选角色池 / 成员列表更宽，一行能放更多角色 */
.group-member-list {
  display: grid;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
  margin-bottom: 8px;
}
.group-member-row {
  display: grid;
  grid-template-columns: 40px 1fr 30px;
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  background: #fafafa;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
}
.group-member-row .avatar { width: 36px; height: 36px; font-size: 12px; margin-top: 2px; }
.group-member-main { min-width: 0; display: grid; gap: 8px; }
.group-member-namebar { display: flex; align-items: center; gap: 8px; }
.group-member-name { font-weight: 600; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 1; min-width: 0; }
.gm-info-btn {
  height: 22px; min-height: 22px; padding: 0 9px; font-size: 11px; white-space: nowrap;
  border: 1px solid var(--wechat-line); border-radius: var(--r-pill); background: #fff; color: var(--muted);
}
.gm-info-btn:hover { border-color: rgba(15,138,95,.5); color: #0c6b48; background: #f3fff8; }
/* 群聊主知识库 / 角色信息面板主库多选盒：与成员小库共用 .gm-kb-wrap 外观 */
.gm-mainkb-box, .ri-mainkb-box { align-items: center; min-height: var(--ctl-h-sm); }
/* 成员字段：左标签 + 右控件 */
.gm-field { display: grid; grid-template-columns: 52px 1fr; gap: 8px; align-items: center; }
.gm-field-kb { align-items: start; }
.gm-field-label {
  font-size: 12px; color: var(--muted); font-weight: 500;
  padding-top: 0; line-height: 30px;
}
.gm-field-kb .gm-field-label { line-height: 26px; }
.gm-preset { width: 100%; height: var(--ctl-h-sm); font-size: 12px; }
.gm-kb-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.gm-kb-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gm-kb-chip {
  display: inline-flex; align-items: center; gap: 2px;
  height: 26px; padding: 0 3px 0 10px;
  border-radius: var(--r-pill);
  background: #eaf7ef; border: 1px solid rgba(15,138,95,.32); color: #0c6b48;
  font-size: 12px; max-width: 220px;
}
.gm-kb-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gm-kb-chip-x {
  width: 18px; height: 18px; min-height: 18px; min-width: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #0c6b48; font-size: 11px; line-height: 1; padding: 0; background: transparent;
}
.gm-kb-chip-x:hover { background: rgba(15,138,95,.2); }
.gm-kb-empty, .gm-kb-alladded { font-size: 12px; color: var(--muted); }
.gm-kb-add { height: var(--ctl-h-micro); font-size: 12px; min-width: 150px; max-width: 100%; }
.group-member-remove {
  width: 30px; min-width: 30px; min-height: var(--ctl-h-sm);
  color: var(--danger); border-radius: var(--r-xs); margin-top: 2px;
}
.group-member-remove:hover { background: rgba(233,79,79,.1); }

/* 通用代码块（非 html/chat 的 ```lang 围栏 → 等宽代码块 + 复制） */
.code-block { margin: 8px 0; border-radius: var(--r-sm); overflow: hidden; background: #1e1e1e; border: 1px solid rgba(0,0,0,.18); }
.code-block-head { display: flex; align-items: center; justify-content: space-between; padding: 5px 10px; background: #2a2a2a; color: #bbb; font-size: 11px; }
.code-block-head .code-lang { text-transform: lowercase; letter-spacing: .5px; }
.code-block-head .code-copy { color: #bbb; background: transparent; border: 1px solid rgba(255,255,255,.18); border-radius: 5px; padding: 1px 8px; font-size: 11px; cursor: pointer; min-height: 0; }
.code-block-head .code-copy:hover { color: #fff; border-color: rgba(255,255,255,.4); }
.code-block pre { margin: 0; padding: 10px 12px; overflow: auto; max-height: 420px; }
.code-block code { font-family: var(--mono, monospace); font-size: 12.5px; line-height: 1.6; color: #e6e6e6; white-space: pre; }

/* 行内 / 块级 Markdown（仅作用于气泡正文，避免影响其它区域） */
.bubble-content strong { font-weight: 700; }
.bubble-content em { font-style: italic; }
.bubble-content del { opacity: .6; }
.bubble-content .md-code { font-family: var(--mono, monospace); font-size: .9em; background: rgba(0,0,0,.06); padding: 1px 5px; border-radius: 4px; }
.bubble-content .md-h { font-weight: 700; line-height: 1.35; margin: .5em 0 .3em; }
.bubble-content .md-h1 { font-size: 1.46em; }
.bubble-content .md-h2 { font-size: 1.32em; }
.bubble-content .md-h3 { font-size: 1.18em; }
.bubble-content .md-h4 { font-size: 1.08em; }
.bubble-content .md-h5, .bubble-content .md-h6 { font-size: 1em; opacity: .85; }
.bubble-content .md-hr { border: 0; border-top: 1px solid rgba(0,0,0,.15); margin: .8em 0; }
.bubble-content .md-quote { margin: .4em 0; padding: 3px 12px; border-left: 3px solid rgba(0,0,0,.22); color: #555; background: rgba(0,0,0,.03); white-space: pre-wrap; }
.bubble-content .md-alert { color: inherit; padding: 6px 12px; border-radius: var(--r-xs); white-space: normal; }
.bubble-content .md-alert .md-alert-title { font-weight: 700; margin-bottom: 2px; }
.bubble-content .md-alert .md-alert-body { white-space: pre-wrap; }
.bubble-content .md-alert-note { border-left-color: #539bf5; background: rgba(83,155,245,.08); }
.bubble-content .md-alert-note .md-alert-title { color: #2f6fc0; }
.bubble-content .md-alert-tip { border-left-color: #57ab5a; background: rgba(87,171,90,.08); }
.bubble-content .md-alert-tip .md-alert-title { color: #3f8544; }
.bubble-content .md-alert-important { border-left-color: #986ee2; background: rgba(152,110,226,.08); }
.bubble-content .md-alert-important .md-alert-title { color: #7048bf; }
.bubble-content .md-alert-warning { border-left-color: #d4a017; background: rgba(212,160,23,.10); }
.bubble-content .md-alert-warning .md-alert-title { color: #9a7400; }
.bubble-content .md-alert-caution { border-left-color: #e5534b; background: rgba(229,83,75,.08); }
.bubble-content .md-alert-caution .md-alert-title { color: #c0382f; }
.bubble-content .md-list { margin: .3em 0; padding-left: 1.6em; }
.bubble-content .md-list li { margin: .15em 0; }
.bubble-content .md-table { border-collapse: collapse; margin: .5em 0; font-size: .94em; max-width: 100%; }
.bubble-content .md-table th, .bubble-content .md-table td { border: 1px solid rgba(0,0,0,.18); padding: 4px 10px; }
.bubble-content .md-table th { background: rgba(0,0,0,.05); font-weight: 700; }
.danger-btn { color: var(--danger); }
.danger-btn:hover { background: rgba(233,79,79,.1); }

* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
*::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* ========== 知识库 ========== */
.kb-summary { color: var(--muted); font-size: 12px; margin-bottom: 10px; }
.kb-bulk-off {
  border-color: rgba(15,138,95,.35);
  background: #f0fff7;
  color: #0c6b48;
  font-weight: 600;
}
.kb-bulk-off:hover {
  background: #e3f8ee;
  border-color: rgba(15,138,95,.55);
}
.kb-bulk-on {
  color: var(--muted);
}
.kb-bulk-on:hover {
  color: var(--text);
  border-color: rgba(15,138,95,.4);
}
.kb-list {
  max-height: min(68vh, calc(100dvh - 220px));
  overflow-y: auto;
  padding-right: 6px;
}
.kb-manager {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  gap: 12px;
  min-height: min(68vh, 680px);
}
.kb-manager-empty {
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  border: 1px dashed var(--wechat-line);
  border-radius: var(--r-md);
  background: #fafafb;
}
.kb-book-pane,
.kb-editor {
  min-width: 0;
  min-height: 0;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-md);
  background: #fff;
}
.kb-book-pane {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.kb-pane-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--wechat-line);
  font-size: 12px;
  font-weight: 700;
  color: #2b3a30;
}
.kb-book-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.kb-book {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  text-align: left;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  background: transparent;
  padding: 9px 10px;
  cursor: pointer;
}
.kb-book:hover { background: #f7faf8; border-color: #dbe7df; }
.kb-book.active { background: #eefbf4; border-color: rgba(15,138,95,.38); }
.kb-book.off { opacity: .56; }
.kb-book-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.kb-book-name { font-size: 13px; font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-book-sub { font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-book-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font: 11px var(--mono); color: var(--muted); white-space: nowrap; }
.kb-editor {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 12px;
  gap: 10px;
}
.kb-editor-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.kb-editor-title { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.kb-title-input {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--wechat-line);
  border-radius: 0;
  padding: 3px 0 7px;
  font-size: 18px;
  font-weight: 800;
  background: transparent;
}
.kb-title-input:focus { border-color: rgba(15,138,95,.55); box-shadow: none; }
.kb-editor-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.kb-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: var(--ctl-h-sm);
  padding: 0 10px;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-pill);
  background: #f8faf9;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
}
.kb-switch input { width: 16px; height: 16px; accent-color: var(--wechat-green); }
.kb-editor-meta {
  display: grid;
  grid-template-columns: 120px minmax(220px, 1fr) 150px;
  gap: 10px;
}
.kb-editor-meta label,
.kb-entry-row-body label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  font-size: 11px;
  color: var(--muted);
}
.kb-editor-meta input,
.kb-editor-meta select,
.kb-entry-row-body input,
.kb-entry-row-body textarea {
  width: 100%;
  font-size: 12.5px;
}
.kb-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}
.kb-editor-actions button {
  height: var(--ctl-h-sm);
  padding: 0 10px;
  font-size: 12px;
}
.kb-entry-table {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 4px;
}
.kb-entry-row {
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-sm);
  background: #fbfbfc;
  padding: 9px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.kb-entry-row.off { opacity: .58; }
.kb-entry-row-head {
  display: grid;
  grid-template-columns: auto auto minmax(140px, 1fr) 74px auto auto;
  gap: 7px;
  align-items: center;
}
.kb-entry-row-head .check { margin: 0; }
.kb-entry-mode {
  height: 27px;
  padding: 0 9px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.kb-entry-mode.is-const { background: #e8f1ff; color: #2563eb; border-color: #cfe0ff; }
.kb-entry-mode.is-key { background: #e8f6ed; color: #14814f; border-color: #cdebd7; }
.kb-entry-title {
  min-width: 0;
  height: 28px;
  padding: 0 8px;
  font-weight: 700;
}
.kb-entry-order {
  height: 28px;
  padding: 0 6px;
  font-family: var(--mono);
  font-size: 12px;
}
.kb-entry-tok {
  color: var(--muted);
  font: 11px var(--mono);
  white-space: nowrap;
}
.kb-entry-del {
  border: none;
  background: transparent;
  color: #b55050;
  cursor: pointer;
  font-size: 12px;
}
.kb-entry-del:hover { background: #fdecea; }
.kb-entry-row-body {
  display: grid;
  grid-template-columns: minmax(160px, .45fr) minmax(0, 1fr);
  gap: 8px;
}
.kb-entry-row-body textarea {
  min-height: 74px;
  resize: vertical;
  line-height: 1.55;
}
.kb-plain-editor {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.kb-plain-head {
  padding: 9px 10px;
  border: 1px solid #dbe7df;
  border-radius: var(--r-sm);
  background: #f6faf7;
  color: #4b6d5a;
  font-size: 12px;
  line-height: 1.5;
}
.kb-plain-editor textarea {
  flex: 1 1 auto;
  min-height: 220px;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.6;
  resize: vertical;
}
@media (max-width: 860px) {
  .kb-manager {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .kb-book-pane {
    max-height: 220px;
  }
  .kb-editor-head,
  .kb-editor-meta,
  .kb-entry-row-head,
  .kb-entry-row-body {
    grid-template-columns: 1fr;
  }
  .kb-switch {
    justify-self: start;
  }
}
.kb-list,
.kb-wi-entries,
.kb-book-list,
.kb-entry-table {
  scrollbar-width: thin;
  scrollbar-color: rgba(15,138,95,.35) transparent;
}
.kb-list::-webkit-scrollbar,
.kb-wi-entries::-webkit-scrollbar,
.kb-book-list::-webkit-scrollbar,
.kb-entry-table::-webkit-scrollbar {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
}
.kb-list::-webkit-scrollbar-thumb,
.kb-wi-entries::-webkit-scrollbar-thumb,
.kb-book-list::-webkit-scrollbar-thumb,
.kb-entry-table::-webkit-scrollbar-thumb {
  border-radius: var(--r-pill);
  background: rgba(15,138,95,.28);
}
#knowledgeModal .kb-entry.open .st-entry-body {
  max-height: none;
  overflow: visible;
}
.kb-group-head {
  font-size: 12px;
  font-weight: 700;
  color: #8b5cf6;
  padding: 8px 4px 4px;
  border-bottom: 1px solid var(--wechat-line);
  margin-top: 4px;
}
.kb-group-head:first-child { margin-top: 0; }
.kb-entry-bar { grid-template-columns: auto minmax(0, 1fr) auto 56px 30px; }
.kb-bound {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: #f97316;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  white-space: nowrap;
}
.kb-entry-sub {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto minmax(140px, 1fr);
  gap: 8px;
  align-items: center;
}
.kb-scope-pill {
  justify-self: start;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  background: #e8f6ed;
  color: #0c6b48;
  font-size: 11px;
  font-weight: 700;
}
.kb-owner {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kb-entry textarea {
  min-height: 90px;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.55;
  resize: vertical;
  width: 100%;
}
.kb-entry-previews {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}
.kb-entry-preview {
  border: 1px solid #ededed;
  border-radius: var(--r-xs);
  background: #fff;
  overflow: hidden;
}
.kb-entry-preview summary {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 10px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.kb-entry-preview summary small {
  color: var(--muted);
  font-family: var(--mono);
  font-weight: 400;
}
.kb-entry-preview pre {
  margin: 0;
  padding: 9px 10px;
  border-top: 1px solid #ededed;
  background: #fafafa;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--sans);
  font-size: 12px;
  line-height: 1.55;
}
/* 世界书「合并全文」只读折叠（有结构化条目时，注入以条目为准，这里只是参考） */
.kb-merged { margin-top: 6px; border: 1px solid #ededed; border-radius: var(--r-xs); background: #fafafa; }
.kb-merged > summary { padding: 6px 10px; cursor: pointer; font-size: 12px; color: var(--muted); }
.kb-merged > textarea { width: 100%; min-height: 120px; border: 0; border-top: 1px solid #ededed; background: #fff; padding: 8px 10px; font-family: var(--sans); font-size: 12px; line-height: 1.55; resize: vertical; }
/* 世界书逐条可控编辑区 */
.kb-wi { margin-top: 10px; border-top: 1px dashed #e2e2e2; padding-top: 8px; }
.kb-wi-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.kb-wi-stat { font-size: 12px; color: var(--muted); }
.kb-wi-stat .c-const { color: #2563eb; }
.kb-wi-stat .c-key { color: #16a34a; }
.kb-wi-bulk { font-size: 12px; padding: 4px 10px; border: 1px solid #d6c2f0; background: #f6f0ff; color: #7c3aed; border-radius: var(--r-xs); cursor: pointer; white-space: nowrap; }
.kb-wi-bulk:hover { background: #efe5ff; }
.kb-wi-entries {
  display: grid;
  gap: 6px;
  max-height: min(52vh, 560px);
  overflow-y: auto;
  padding-right: 4px;
  overscroll-behavior: contain;
}
.kb-wi-entry { border: 1px solid #ededed; border-radius: var(--r-xs); background: #fff; overflow: hidden; }
.kb-wi-entry.off { opacity: 0.5; }
.kb-wi-bar { display: flex; align-items: center; gap: 8px; padding: 6px 8px; cursor: pointer; }
.kb-wi-bar .check { margin: 0; }
.kb-wi-mode { flex: none; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: var(--r-pill); border: 1px solid transparent; cursor: pointer; }
.kb-wi-mode.is-const { background: #e8f1ff; color: #2563eb; border-color: #cfe0ff; }
.kb-wi-mode.is-key { background: #e8f6ed; color: #16a34a; border-color: #cdebd7; }
.kb-wi-title { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-wi-warn { flex: none; font-size: 10px; font-weight: 700; color: #b45309; background: #fff4e0; padding: 1px 6px; border-radius: var(--r-pill); }
.kb-wi-tok { flex: none; font-size: 11px; color: var(--muted); font-family: var(--mono); }
.kb-wi-expand { flex: none; width: 26px; height: 26px; }
.kb-wi-body { display: none; padding: 0 10px 10px; }
.kb-wi-entry.open .kb-wi-body { display: block; }
.kb-wi-entry.open .kb-wi-expand svg { transform: rotate(180deg); }
.kb-wi-klabel { display: block; font-size: 11px; color: var(--muted); margin: 4px 0; }
.kb-wi-keys { width: 100%; font-size: 12px; padding: 5px 8px; border: 1px solid #e0e0e0; border-radius: var(--r-xs); margin-bottom: 6px; }
.kb-wi-keys:disabled { background: #f3f3f3; color: #aaa; }
.kb-wi-content { width: 100%; font-family: var(--sans); font-size: 12px; line-height: 1.55; resize: vertical; padding: 6px 8px; border: 1px solid #e0e0e0; border-radius: var(--r-xs); }
/* 方案A：部署新版提示横幅 */
.app-update-bar { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 9999; display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px); padding: 10px 12px 10px 16px; background: #0f8a5f; color: #fff; border-radius: var(--r-pill); box-shadow: 0 6px 24px rgba(0,0,0,0.22); font-size: 14px; animation: appUpdateIn .25s ease; }
.app-update-text { font-weight: 600; white-space: nowrap; }
.app-update-refresh { background: #fff; color: #07976b; border: 0; border-radius: var(--r-pill); padding: 6px 14px; font-size: 13px; font-weight: 700; cursor: pointer; flex: none; }
.app-update-refresh:hover { background: #f0fff8; }
.app-update-close { background: transparent; border: 0; color: rgba(255,255,255,0.85); font-size: 16px; cursor: pointer; padding: 0 4px; line-height: 1; flex: none; }
@keyframes appUpdateIn { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (max-width: 1180px) {
  .app { grid-template-columns: 280px minmax(0, 1fr); }
}
@media (max-width: 760px) {
  body { overflow: auto; background: var(--chat-canvas); }
  .app { width: 100%; min-height: calc(100dvh * var(--app-unzoom, 1)); grid-template-columns: 1fr; }
  .rail { display: none; }
  .conversations {
    position: fixed;
    left: 0;
    top: 0;
    width: 80vw;
    max-width: 320px;
    height: calc(100dvh * var(--app-unzoom, 1));
    z-index: 30;
    transform: translateX(-100%);
    transition: transform .3s ease;
    box-shadow: 0 0 0 rgba(0,0,0,0);
  }
  .conversations.mobile-open {
    transform: translateX(0);
    box-shadow: 4px 0 24px rgba(0,0,0,.15);
  }
  .conversations::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.4);
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
    z-index: -1;
  }
  .conversations.mobile-open::after {
    opacity: 1;
    pointer-events: auto;
  }
  .mobile-only { display: inline-flex; }
  .chat { min-height: calc(100dvh * var(--app-unzoom, 1)); grid-column: 1; }
  .msg { max-width: 92%; }
  .msg-actions { opacity: 1; }
  .settings-grid { grid-template-columns: 1fr; }
  .preset-grid { grid-template-columns: 1fr; }
  .prompt-toolbar { grid-template-columns: 1fr; }
  .float-panel { top: 10px; right: 10px; left: 10px; width: auto; max-height: calc(100vh - 20px); }
  .status-strip { grid-template-columns: 1fr; }
  #roleInfoModal .role-info-modal { inset: 10px; }
  .role-info-modal .modal-body { overflow: auto; }
  .role-info-shell { height: auto; }
  .role-info-grid { grid-template-columns: 1fr; }
  .ri-col { overflow: visible; }
  .ri-card-grow, .ri-card-compact, .role-description-card, .role-resources-card { flex: 0 0 auto; min-height: 0; }
  .ri-col .res-edit-list, .ri-col .small-kb-list { overflow: visible; max-height: none; flex: 0 0 auto; }
  .role-description-card .profile-text { max-height: 46vh; }
  .role-description-card pre { max-height: 40vh; }
  .role-resources-card { position: static; }
  .tag-modal { width: auto; }
  .tag-layout { grid-template-columns: 1fr; min-height: 0; }
  .tag-detail-grid { grid-template-columns: 1fr; }
  .tag-group-list, .tag-list { max-height: 220px; }
  #tagOutput { min-height: 260px; }
}

/* ===== AI 生成角色 ===== */
.cg-pane { display: flex; flex-direction: column; gap: 10px; }
.cg-pane textarea { min-height: 90px; }
.cg-tag-picked { display: flex; flex-wrap: wrap; gap: 6px; min-height: var(--ctl-h-sm); padding: 6px; border: 1px dashed var(--wechat-line); border-radius: var(--r-sm); background: #fafafa; margin-bottom: 8px; }
.cg-tag-chip { font-size: 12px; color: #0c6b48; background: #eafdf2; border: 1px solid rgba(15,138,95,.35); border-radius: var(--r-pill); padding: 3px 10px; }
.cg-tag-empty { font-size: 12px; color: var(--muted); }
/* 素材熔炉 */
.furnace-bar { display: flex; gap: 8px; align-items: center; }
.furnace-bar select { flex: 1 1 auto; min-width: 0; height: var(--ctl-h); border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 0 10px; background: #fff; }
.furnace-add { display: flex; gap: 6px; flex-wrap: wrap; }
.furnace-text-editor { display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px; background: #fafafa; }
.furnace-text-editor input { height: var(--ctl-h-tool); }
.furnace-text-editor textarea { min-height: 120px; resize: vertical; }
.furnace-text-actions { display: flex; gap: 6px; justify-content: flex-end; }
.furnace-items { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow: auto; }
.furnace-item-text { position: relative; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 30px 8px 10px; background: #fff; }
.furnace-item-text .fi-main { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.furnace-item-text .fi-main small { color: var(--muted); font-family: var(--mono); font-size: 11px; }
.furnace-item-text p { margin: 4px 0 0; font-size: 12px; color: #555; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.fi-del { position: absolute; top: 6px; right: 6px; width: 20px; height: 20px; display: grid; place-items: center; border: none; border-radius: var(--r-xs); background: rgba(0,0,0,.05); color: #c0504a; cursor: pointer; font-size: 12px; line-height: 1; }
.fi-del:hover { background: rgba(233,79,79,.15); }
.furnace-img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 8px; }
.furnace-img { position: relative; aspect-ratio: 1; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--wechat-line); background: #f0f0f0; }
.furnace-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ===== 作者注分类库（铺开卡片网格的大弹窗）===== */
.an-modal { max-width: 1040px; width: 94vw; }
.an-modal-bar { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: 6px 0 14px; }
.an-modal-bar .primary { margin-left: auto; }
.an-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(264px, 1fr)); gap: 14px; align-items: start; max-height: 64vh; overflow-y: auto; padding: 2px; }
/* 作者库：扁平化，去掉层层套盒子（卡片=一张白卡；条目=一行，不再盒中盒） */
.an-card { border: 1px solid var(--wechat-line); border-radius: var(--r-md); background: #fff; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.an-card-head { display: flex; align-items: center; gap: 8px; padding-bottom: 4px; border-bottom: 1px solid #f0f0f3; }
.an-card-name { flex: 1; min-width: 0; border: 0; border-radius: 0; padding: 3px 2px; font-size: 14px; font-weight: 700; background: transparent; }
.an-card-name:focus { box-shadow: inset 0 -2px 0 var(--wechat-green); }
.an-card-count { flex: 0 0 auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-pill); background: #0f8a5f; color: #fff; font-size: 11px; line-height: 20px; text-align: center; }
.an-card-count:empty { display: none; }
.an-card-del { flex: 0 0 auto; width: 28px; height: var(--ctl-h-micro); color: #c0392b; }
.an-card-entries { display: flex; flex-direction: column; }
.an-card-entry { background: transparent; border: 0; border-top: 1px dashed #eee; border-radius: 0; padding: 7px 0; display: flex; flex-direction: column; gap: 3px; }
.an-card-entry:first-child { border-top: 0; }
.an-card-entry-top { display: flex; gap: 6px; align-items: center; }
.an-card-title { flex: 1; min-width: 0; border: 0; border-radius: 0; padding: 2px; font-size: 13px; font-weight: 600; background: transparent; }
.an-card-title:focus { box-shadow: inset 0 -2px 0 #d7d4f5; }
.an-card-title::placeholder { font-weight: 400; color: var(--quiet); }
.an-card-entry-del { flex: 0 0 auto; width: 24px; height: 24px; min-height: 24px; min-width: 24px; color: #c8ccd4; }
.an-card-entry-del:hover { color: var(--danger); }
.an-card-desc { width: 100%; min-height: var(--ctl-h); resize: vertical; border: 0; border-radius: 0; padding: 0 2px 2px 26px; font-size: 12.5px; line-height: 1.5; font-family: inherit; color: #5a5f6a; background: transparent; }
.an-card-desc::placeholder { color: var(--quiet); }
.an-card-add { align-self: flex-start; border: 0; background: transparent; padding: 4px 2px; font-size: 12.5px; color: #6d5efc; cursor: pointer; }
.an-card-add:hover { text-decoration: underline; }

/* ===== 快捷指令条 ===== */
.quick-cmd-bar { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; padding: 0 2px 8px; }
.qc-chip { padding: 5px 12px; border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-pill); font-size: 12.5px; color: #444; cursor: pointer; white-space: nowrap; }
.qc-chip:hover { background: #f0fdf4; border-color: #9ae6b4; color: #0c6b48; }
.qc-manage { display: inline-flex; align-items: center; justify-content: center; padding: 5px; width: 28px; color: #888; }
.qc-manage svg { width: 15px; height: 15px; }
/* 「＋ 添加快捷回复」入口：虚线 + 绿字，明确可点 */
.qc-add { color: #0c6b48; border-color: #b7e6cb; border-style: dashed; font-weight: 600; }
.qc-add:hover { background: #eafaf0; border-color: var(--wechat-green); color: #0c6b48; }
/* 快捷回复 / 指令回复 弹窗 */
.qr-tabs { display: flex; gap: 6px; margin-bottom: 12px; border-bottom: 1px solid var(--wechat-line, #e8e8ed); }
.qr-tab { padding: 8px 16px; border: none; background: none; font-size: 14px; color: var(--muted, #888); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.qr-tab.active { color: #0c6b48; font-weight: 600; border-bottom-color: var(--wechat-green, #0f8a5f); }
.qr-hint { margin: 0 0 10px; }
.qr-list { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow-y: auto; }
.qr-row { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; background: #fafafb; }
.qr-row-top { display: flex; align-items: center; gap: 8px; }
.qr-use { flex: 1 1 auto; min-width: 0; text-align: left; padding: 8px 12px; border: 1px solid #dbe7df; border-radius: var(--r-sm); background: #fff; color: #2b3a30; font-size: 13.5px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-use:hover:not(:disabled) { background: #f0fdf4; border-color: var(--wechat-green, #0f8a5f); color: #0c6b48; }
.qr-use:disabled { color: #b0b3bb; cursor: default; }
.qr-import-base { flex: none; width: 100%; }
.qr-icon { flex: 0 0 auto; width: 32px; height: var(--ctl-h-tool); display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #8a8f98; cursor: pointer; font-size: 14px; }
.qr-icon:hover { background: #f3f7f4; color: #0c6b48; }
.qr-icon.qr-del:hover { color: var(--danger, #e94f4f); border-color: rgba(233,79,79,.4); background: rgba(233,79,79,.08); }
.qr-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.qr-editor { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; padding: 12px; background: #f6faf7; border: 1px solid #e6efe9; border-radius: var(--r-sm); }
.qr-editor.hidden { display: none; }
.qr-field { display: flex; flex-direction: column; gap: 4px; }
.qr-field > span { font-size: 12px; color: var(--muted, #8a8f98); }
.qr-f-label, .qr-f-text { width: 100%; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13.5px; font-family: inherit; background: #fff; box-sizing: border-box; }
.qr-f-text { resize: vertical; line-height: 1.55; }
.qr-check { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--muted, #6b7280); cursor: pointer; }
.qr-check input { width: 15px; height: 15px; accent-color: var(--wechat-green, #0f8a5f); }
.qr-foot { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
/* —— 快捷回复：当前世界状态栏 + 每条「变量联动」（QuickFx）—— */
.qr-world { margin: 0 0 10px; border: 1px solid #e6efe9; border-radius: var(--r-sm); background: #f6faf7; padding: 8px 10px; }
.qr-world-hint { font-size: 12px; color: var(--muted, #8a8f98); line-height: 1.6; }
.qr-world-head { display: flex; align-items: center; gap: 8px; }
.qr-world-now { flex: 1 1 auto; min-width: 0; font-size: 13px; color: #2b3a30; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-world-edit { flex: none; border: 1px solid #dbe7df; background: #fff; color: #0c6b48; border-radius: var(--r-sm); padding: 4px 12px; font-size: 12.5px; cursor: pointer; }
.qr-world-edit:hover { background: #f0fdf4; border-color: var(--wechat-green, #0f8a5f); }
.qr-world-editor { margin-top: 10px; display: flex; flex-direction: column; gap: 10px; }
.qr-world-editor.hidden { display: none; }
.qr-world-placerow { display: flex; flex-direction: column; gap: 8px; }
.qr-world-addplace { display: flex; gap: 8px; }
.qr-world-addplace input { flex: 1 1 auto; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 10px; font-size: 13px; font-family: inherit; background: #fff; box-sizing: border-box; }
.qr-world-addplace button { flex: none; border: 1px solid #dbe7df; background: #fff; color: #0c6b48; border-radius: var(--r-sm); padding: 0 14px; font-size: 12.5px; cursor: pointer; }
.qr-world-reset { align-self: flex-start; border: 1px dashed #cdd7d0; background: transparent; color: #6b7180; border-radius: var(--r-sm); padding: 4px 12px; font-size: 12px; cursor: pointer; }
.qr-world-tie { font-size: 11.5px; line-height: 1.6; color: #0c6b48; background: #eaf7f0; border: 1px solid #cfe9dc; border-radius: var(--r-sm); padding: 6px 9px; }
.qr-fx { margin-top: 4px; border-top: 1px dashed #e0e8e2; padding-top: 8px; }
.qr-fx-sum { cursor: pointer; font-size: 12.5px; color: #0c6b48; list-style: none; user-select: none; }
.qr-fx-sum::-webkit-details-marker { display: none; }
.qr-fx-sum::before { content: '▸ '; color: var(--muted, #8a8f98); }
.qr-fx[open] .qr-fx-sum::before { content: '▾ '; }
.qr-fx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.qr-fx-place { grid-column: 1 / -1; }
.qr-fx-field { display: flex; flex-direction: column; gap: 4px; }
.qr-fx-field > span { font-size: 12px; color: var(--muted, #8a8f98); }
.qr-fx-field select, .qr-fx-field input { width: 100%; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 10px; font-size: 13px; font-family: inherit; background: #fff; box-sizing: border-box; }
.qc-list { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
.qc-row { display: flex; gap: 6px; align-items: center; }
.qc-row .qc-label { flex: 0 0 84px; }
.qc-row .qc-text { flex: 1; }
.qc-row input, .qc-row select { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 9px; font-size: 13px; }
.qc-row .qc-del { flex: 0 0 auto; width: 28px; height: var(--ctl-h-micro); color: #c0392b; }

/* ===== 发送框旁的小数据库（变量 / 作者注）===== */
.composer-quick { display: flex; gap: 8px; margin-left: auto; }
.quick-wrap { position: relative; }
.quick-btn { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-pill); font-size: 12.5px; color: #555; cursor: pointer; }
.quick-btn:hover { background: #f5f5f7; border-color: #d7d7dc; }
.quick-btn svg { width: 15px; height: 15px; }
.quick-count { min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-pill); background: #6d5efc; color: #fff; font-size: 11px; line-height: 16px; text-align: center; }
.quick-count:empty { display: none; }
.quick-panel { position: absolute; right: 0; bottom: calc(100% + 10px); width: 360px; max-width: 78vw; background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-md); box-shadow: 0 12px 36px rgba(0,0,0,.16); padding: 14px; z-index: 70; display: flex; flex-direction: column; gap: 10px; }
.quick-panel.hidden { display: none; }
.quick-head { display: flex; flex-direction: column; gap: 2px; }
.quick-title { font-weight: 700; font-size: 14px; }
.quick-hint { font-size: 11.5px; color: var(--muted); }
.quick-explain { font-size: 11.5px; color: #6b7180; line-height: 1.7; background: #f6f7fb; border: 1px solid #ececf3; border-radius: var(--r-sm); padding: 8px 10px; }
.quick-explain code { background: #eceaff; color: #5a3fd0; padding: 1px 5px; border-radius: 5px; font-size: 11px; }
#anQuickPanel { width: 440px; }
.var-row2 { display: flex; flex-direction: column; gap: 5px; background: #fafafb; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; }
.var-line { display: flex; gap: 8px; align-items: center; }
.var-line .var-name { flex: 0 0 36%; }
.var-line .var-value { flex: 1; }
.var-row2 input { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 9px; font-size: 13px; }
.var-note { width: 100%; }
.an-group-list { display: flex; flex-direction: column; gap: 10px; max-height: 360px; overflow-y: auto; }
.an-group { border: 1px solid var(--wechat-line); border-radius: var(--r-md); padding: 10px; background: #fafafb; }
.an-group-head { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
.an-group-name { flex: 1; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 9px; font-size: 13.5px; font-weight: 600; }
.an-group-del { flex: 0 0 auto; width: 28px; height: var(--ctl-h-micro); color: #c0392b; }
.an-entries { display: flex; flex-direction: column; gap: 8px; }
.an-entry { background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 8px; display: flex; flex-direction: column; gap: 5px; }
.an-entry-top { display: flex; gap: 6px; align-items: center; }
.an-entry-title { flex: 1; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 8px; font-size: 13px; }
.an-entry-del { flex: 0 0 auto; width: 26px; height: 26px; color: #c0392b; }
.an-entry-desc { width: 100%; min-height: 48px; resize: vertical; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 8px; font-size: 12.5px; line-height: 1.5; font-family: inherit; }
.an-add-entry { margin-top: 8px; border: 1px dashed var(--wechat-line); background: #fff; border-radius: var(--r-sm); padding: 6px; font-size: 12.5px; color: #555; cursor: pointer; width: 100%; }
.empty.small { font-size: 12px; padding: 6px; }
.quick-opts { display: flex; gap: 16px; align-items: center; }
.quick-panel .var-list, .quick-panel .an-list { max-height: 320px; overflow-y: auto; }

/* 叙事模式快捷面板：单选模式列表（图标 + 名称 + 一句说明） */
.nm-list { display: flex; flex-direction: column; gap: 4px; max-height: 340px; overflow-y: auto; }
.nm-row { display: flex; align-items: flex-start; gap: 9px; width: 100%; text-align: left; padding: 8px 10px; border-radius: 10px; border: 1px solid transparent; background: transparent; cursor: pointer; transition: background .12s ease, border-color .12s ease; }
.nm-row:hover { background: var(--surface-2); }
.nm-row.active { background: var(--jade-soft); border-color: var(--jade-line); }
.nm-ico { font-size: 16px; line-height: 1.5; flex: 0 0 auto; }
.nm-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nm-name { font-size: 13px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 6px; }
.nm-check { color: var(--jade-ink); font-weight: 700; }
.nm-desc { font-size: 11.5px; color: var(--muted); line-height: 1.45; }
.nm-foot { margin-top: 2px; padding-top: 9px; border-top: 1px dashed var(--wechat-line); font-size: 11px; color: var(--quiet); line-height: 1.5; }
.quick-foot { display: flex; gap: 8px; }
@media (max-width: 760px) { .quick-panel { width: 300px; } }

/* ===== 主角扮演：发送区控件 + 选择器 + 右侧名牌 ===== */
.protagonist-control { display: inline-flex; align-items: center; gap: 6px; }
.protagonist-pick-btn { border-style: dashed; border-color: rgba(15,138,95,.55); color: #0c6b48; }
.protagonist-pick-btn:hover { background: #f0fff7; }
.protagonist-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 3px 10px 3px 4px; border: 1px solid rgba(15,138,95,.5);
  background: #f3fff8; border-radius: var(--r-pill); cursor: pointer;
  color: #0c6b48; font-size: 12.5px; font-weight: 600; white-space: nowrap;
}
.protagonist-chip:hover { background: #e6fbf0; box-shadow: 0 1px 6px rgba(15,138,95,.2); }
.protagonist-av { width: 26px; height: 26px; border-radius: 50%; font-size: 11px; }
.protagonist-chip-name { max-width: 96px; overflow: hidden; text-overflow: ellipsis; }
.protagonist-chip-tip { font-size: 11px; font-weight: 700; color: #fff; background: var(--wechat-green); border-radius: var(--r-pill); padding: 1px 7px; }
.protagonist-mini-btn { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--wechat-line); background: #fff; color: #888; font-size: 12px; cursor: pointer; line-height: 1; padding: 0; }
.protagonist-mini-btn:hover { background: #f5f5f7; color: #333; border-color: #d0d0d6; }
/* 发送区「我」按钮（未指定主角扮演时）：点开「我的人设」档案 */
.protagonist-me-btn { display: inline-flex; align-items: center; gap: 7px; padding: 3px 12px 3px 4px; border: 1px solid var(--wechat-line); background: #fff; border-radius: var(--r-pill); cursor: pointer; color: #555; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.protagonist-me-btn:hover { background: #f5f5f7; border-color: #d0d0d6; }
/* 「我的人设」弹窗 */
.overlay.up-overlay { display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 90; pointer-events: auto; }
.up-modal { width: min(560px, 100%); max-height: 92vh; display: flex; flex-direction: column; }
.up-body { display: flex; flex-direction: column; gap: 14px; overflow: auto; }
.up-avatar-row { display: flex; gap: 12px; align-items: flex-start; }
.up-avatar-prev { width: 56px; height: 56px; border-radius: var(--r-md); font-size: 20px; flex: 0 0 auto; cursor: pointer; transition: filter .15s, transform .15s; }
.up-avatar-prev:hover { filter: brightness(1.08); transform: scale(1.04); }
.up-avatar-fields { flex: 1 1 auto; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.up-field { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; color: #555; }
.up-field input, .up-field textarea { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13.5px; font-family: inherit; line-height: 1.5; }
.up-field textarea { resize: vertical; min-height: 120px; }
.up-hint { font-size: 12px; color: #999; line-height: 1.55; margin: 0; }
.protagonist-picker-panel { left: 0; right: auto; width: 340px; }
.protagonist-pick-head { font-weight: 700; font-size: 13.5px; color: var(--text); }
.protagonist-pick-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow-y: auto; }
.protagonist-pick-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 7px 9px; border: 1px solid transparent; border-radius: var(--r-sm); background: #fafafb; cursor: pointer; font-size: 13.5px; color: var(--text); }
.protagonist-pick-item:hover { background: #f0fff7; border-color: rgba(15,138,95,.35); }
.protagonist-pick-item.active { background: #e6fbf0; border-color: rgba(15,138,95,.6); font-weight: 600; }
.protagonist-pick-item .avatar { width: 30px; height: var(--ctl-h-sm); border-radius: 50%; font-size: 12px; }
.protagonist-pick-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.protagonist-pick-none { width: 100%; text-align: center; padding: 8px; border: 1px dashed var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #888; cursor: pointer; font-size: 12.5px; }
.protagonist-pick-none:hover { background: #f7f7f9; color: #c0392b; border-color: #e0b4b0; }
/* 右侧用户消息的主角名牌（右对齐、绿色系，区别于群聊紫色名签） */
.msg.user .speaker-name.protagonist-name { text-align: right; color: #0c6b48; }
/* 角色介绍里「设为主角」激活态 */
#setProtagonistBtn.is-active { background: var(--wechat-green); color: #fff; border-color: var(--wechat-green); }

/* ===== 顶栏「更多」溢出菜单 ===== */
.more-wrap { position: relative; display: inline-block; }
.more-menu { position: absolute; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-md); box-shadow: 0 8px 28px rgba(0,0,0,.12); padding: 6px; display: flex; flex-direction: column; gap: 2px; min-width: 168px; z-index: 60; }
.more-menu.hidden { display: none; }
.more-menu button { display: flex; align-items: center; gap: 10px; width: 100%; justify-content: flex-start; padding: 9px 12px; border: none; background: transparent; border-radius: var(--r-sm); font-size: 13.5px; color: var(--text); cursor: pointer; }
.more-menu button:hover { background: #f4f4f7; }
.more-menu button svg { width: 16px; height: 16px; flex: 0 0 auto; }
/* 「更多」菜单移到输入框上方后，需向上弹出（否则会被裁在屏幕外） */
.more-menu-up { top: auto; bottom: calc(100% + 6px); }
/* 续写/撤回/更多挪到输入框上方这行后，按钮多了允许换行，别撑破布局 */
.composer-quick { flex-wrap: wrap; align-items: center; }

/* ===== 分段切换 ===== */
.seg-toggle { display: inline-flex; background: #f0f0f3; border-radius: var(--r-sm); padding: 3px; gap: 2px; margin-bottom: 12px; }
.seg { border: none; background: transparent; padding: 7px 16px; border-radius: var(--r-sm); font-size: 13.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.seg.active { background: #fff; color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.1); }

/* ===== 创作库（记忆 / 剧情图 / 变量 / 作者注）===== */
.accent-btn { background: linear-gradient(135deg, #6d5efc, #8b6df0) !important; color: #fff !important; border: none !important; }
.accent-btn svg { stroke: #fff; }
.studio-tabs { display: flex; gap: 6px; padding: 10px 18px 0; border-bottom: 1px solid var(--wechat-line); flex-wrap: wrap; }
.studio-tab { border: none; background: transparent; padding: 9px 14px; border-radius: var(--r-sm) var(--r-sm) 0 0; font-size: 13.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.studio-tab:hover { background: #f4f4f7; color: var(--text); }
.studio-tab.active { color: var(--text); background: #efeefe; box-shadow: inset 0 -2px 0 #6d5efc; }
.studio-pane { display: flex; flex-direction: column; gap: 12px; }
/* 创作库弹窗：内容在 modal-body 内部滚动，overscroll-behavior:contain 阻止滚动穿透到聊天背景 */
#studioModal .float-panel { display: flex; flex-direction: column; overflow: hidden; }
#studioModal .modal-head, #studioModal .studio-tabs { flex: 0 0 auto; }
#studioModal .modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.studio-row-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.studio-meta { font-size: 12px; color: var(--muted); margin-left: auto; }
.studio-inline { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.tiny-num { width: 64px; }
.studio-textarea { width: 100%; min-height: 260px; resize: vertical; border: 1px solid var(--wechat-line); border-radius: var(--r-md); padding: 14px; font-size: 14px; line-height: 1.6; font-family: inherit; }
.var-list, .an-list { display: flex; flex-direction: column; gap: 8px; }
.var-row, .an-row { display: flex; gap: 8px; align-items: center; background: #fafafb; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; }
.var-row .var-name { flex: 0 0 38%; }
.var-row .var-value, .an-row .an-text { flex: 1; }
.var-row input, .an-row input { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13.5px; }
.var-del, .an-del { flex: 0 0 auto; width: 30px; height: var(--ctl-h-sm); color: #c0392b; }
.mem-section { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; border-top: 1px solid #eee; }
.mem-section:first-of-type { border-top: none; }
.mem-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.mem-head h3 { margin: 0; font-size: 14.5px; }
.mem-sub { font-size: 12px; color: var(--muted); }
.char-mem-list { display: flex; flex-direction: column; gap: 12px; }
.char-mem-card { border: 1px solid var(--wechat-line); border-radius: var(--r-md); padding: 12px 14px; background: #fafafb; display: flex; flex-direction: column; gap: 6px; }
.char-mem-name { font-weight: 700; font-size: 14px; }
.char-mem-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.char-mem-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.char-mem-acts .ri-mini-btn { font-size: 11.5px; padding: 4px 8px; }
.char-mem-label { font-size: 12px; color: var(--muted); margin-top: 4px; }
.char-mem-card textarea { width: 100%; min-height: 70px; resize: vertical; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 10px; font-size: 13.5px; line-height: 1.55; font-family: inherit; }
/* 记忆库管理区：库名输入框 + 启用开关，沿用角色记忆卡的外观 */
.mem-bank-name { flex: 1; min-width: 120px; font-weight: 700; font-size: 14px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 9px; font-family: inherit; background: #fff; }
.mem-bank-name:focus { outline: none; border-color: #0f8a5f; }
.char-mem-acts .mem-bank-enable { font-size: 11.5px; color: var(--muted); display: inline-flex; align-items: center; gap: 3px; }
.mem-bank-hint { margin: 2px 0 8px; }
/* 大纲文本框 */
.outline-textarea { min-height: 300px; font-size: 14px; line-height: 1.7; }
/* 记忆条目编辑器（世界记忆 / 角色小记忆库 / 头像弹窗 共用） */
.mem-entry-box { display: flex; flex-direction: column; gap: 6px; }
.mem-entry-list { display: flex; flex-direction: column; gap: 6px; }
.mem-empty { font-size: 12.5px; color: var(--muted); padding: 4px 2px; }
.mem-entry { display: flex; gap: 6px; align-items: flex-start; }
.mem-entry-text { flex: 1 1 auto; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13.5px; line-height: 1.55; font-family: inherit; resize: none; overflow: hidden; background: #fff; }
.mem-entry-del { flex: 0 0 auto; width: 30px; height: var(--ctl-h-sm); min-height: var(--ctl-h-sm); min-width: 30px; padding: 0; color: #b0b3bb; border-radius: var(--r-sm); }
.mem-entry-del:hover { color: var(--danger); background: rgba(233,79,79,.1); }
.mem-entry-del svg { width: 15px; height: 15px; }
/* 条目开关：启用=注入（绿），关闭=不注入但保留（灰）。主控 AI 维护时也会自动关掉没用的记忆。 */
.mem-entry-toggle { flex: 0 0 auto; width: 30px; height: var(--ctl-h-sm); min-height: var(--ctl-h-sm); min-width: 30px; padding: 0; color: #8a8f98; border-radius: var(--r-sm); }
.mem-entry-toggle:hover { color: var(--wechat-green); background: rgba(15,138,95,.1); }
.mem-entry-toggle.is-off { color: #c7cad1; }
.mem-entry-toggle.is-off:hover { color: var(--wechat-green); }
.mem-entry-toggle svg { width: 15px; height: 15px; }
.mem-entry.is-off .mem-entry-text { opacity: .55; text-decoration: line-through; text-decoration-color: rgba(0,0,0,.22); background: #fafafb; }
/* 「↑长期」：把本会话这一条记忆收录进角色长期记忆库 */
.mem-entry-promote { flex: 0 0 auto; height: var(--ctl-h-sm); min-height: var(--ctl-h-sm); padding: 0 8px; border-radius: var(--r-sm); border: 1px solid #dbe7df; background: #f3f7f4; color: #0c6b48; font-size: 11.5px; white-space: nowrap; cursor: pointer; }
.mem-entry-promote:hover { background: #e6fbf0; border-color: var(--wechat-green); }
.mem-add-entry { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; border: 1px dashed var(--wechat-line); background: #fff; border-radius: var(--r-sm); padding: 6px 12px; font-size: 12.5px; color: #555; cursor: pointer; }
.mem-add-entry:hover { border-color: var(--wechat-green); color: #0c6b48; background: #f5fff9; }
.mem-add-entry svg { width: 15px; height: 15px; }
/* 角色「长期记忆库」选择器：默认收起，点「📚 长期库(N)」展开。逐条勾选载入本会话 + 直接改写长期库。 */
.lt-picker { display: none; flex-direction: column; gap: 8px; margin: 2px 0 4px; padding: 10px; border: 1px solid #dbe7df; border-radius: var(--r-sm); background: #f6faf7; }
.lt-picker.show { display: flex; }
.lt-hint { font-size: 11.5px; line-height: 1.5; color: var(--muted); }
.lt-list { display: flex; flex-direction: column; gap: 6px; }
.lt-row { display: flex; gap: 6px; align-items: flex-start; }
.lt-chk { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 8px; cursor: pointer; accent-color: var(--wechat-green); }
.lt-text { flex: 1 1 auto; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13px; line-height: 1.55; font-family: inherit; resize: none; overflow: hidden; background: #fff; }
.lt-rowbtn { flex: 0 0 auto; width: 30px; height: var(--ctl-h-sm); min-height: var(--ctl-h-sm); padding: 0; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #5a6;  font-size: 15px; line-height: 1; cursor: pointer; }
.lt-rowbtn:hover { border-color: var(--wechat-green); color: #0c6b48; background: #f5fff9; }
.lt-rowbtn.lt-del { color: #b0b3bb; font-size: 13px; }
.lt-rowbtn.lt-del:hover { color: var(--danger); border-color: rgba(233,79,79,.5); background: rgba(233,79,79,.08); }
.lt-rowbtn.lt-del svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.lt-foot { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 2px; border-top: 1px dashed #dbe7df; }
.lt-foot .ri-mini-btn { font-size: 11.5px; padding: 4px 10px; }
/* 数据备份与恢复：自动备份说明 + 恢复弹窗列表 */
.ab-note { font-size: 12.5px; line-height: 1.6; color: var(--muted); background: #f6faf7; border: 1px solid #dbe7df; border-radius: var(--r-sm); padding: 8px 11px; margin: 6px 0 2px; }
/* 立即同步卡片（多设备主动同步入口） */
.ab-sync-card { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 11px 13px; margin: 10px 0 12px; border: 1px solid var(--jade-line); border-radius: var(--r-md); background: var(--jade-softer); }
.ab-sync-card #syncNowBtn { flex: 0 0 auto; }
.ab-sync-status { flex: 1 1 220px; min-width: 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.ab-sync-status.ok { color: var(--jade-ink); }
.ab-sync-status.warn { color: var(--warn); }
.ab-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ab-status { font-size: 11.5px; color: var(--muted); }
.ab-list { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow-y: auto; }
.ab-empty { font-size: 12.5px; color: var(--muted); padding: 10px 2px; text-align: center; }
.ab-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 9px 12px; background: #fafafb; }
.ab-item-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ab-item-time { font-size: 13px; font-weight: 600; color: #2b3a30; }
.ab-where { font-size: 10.5px; font-weight: 500; color: #0c6b48; background: #e6fbf0; border-radius: var(--r-xs); padding: 1px 6px; margin-left: 4px; }
.ab-item-meta { font-size: 11.5px; color: var(--muted); }
.ab-item .ri-mini-btn { flex: 0 0 auto; }
/* 群聊头像悬停 → 角色小记忆库弹窗 */
.avatar.has-mem-pop { cursor: help; }
/* 可点击头像：点开该角色完整设定面板（资源 / 知识库 / 记忆库 / 修改）。放在 has-mem-pop 之后以覆盖 cursor。 */
.avatar.avatar-clickable { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; }
.avatar.avatar-clickable:hover { transform: scale(1.06); box-shadow: 0 0 0 2px rgba(15,138,95,.5); }
.mem-popover { position: fixed; z-index: 75; background: var(--surface, #fff); border: 1px solid var(--wechat-line, #e6e6ea); border-radius: var(--r-lg); box-shadow: var(--shadow-lg, 0 18px 50px rgba(20,40,30,.18)); padding: 14px; display: flex; flex-direction: column; gap: 10px; max-height: 70vh; overflow: auto; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.mem-pop-head { display: flex; flex-direction: column; gap: 3px; padding: 2px 2px 9px; border-bottom: 1px solid var(--wechat-line, #eee); margin-bottom: 2px; }
.mem-pop-title { font-weight: 700; font-size: 14px; color: var(--jade-ink, #0c6b48); letter-spacing: .2px; }
.mem-pop-title::before { content: "🧠 "; }
.mem-pop-sub { font-size: 11px; color: var(--muted); line-height: 1.5; }
/* 大纲节点卡片 */
.beat-list { display: flex; flex-direction: column; gap: 10px; }
.beat-card { border: 1px solid var(--wechat-line); border-radius: var(--r-md); padding: 10px 12px; background: #fafafb; display: flex; flex-direction: column; gap: 7px; }
.beat-card.is-current { border-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.25); }
.beat-head { display: flex; align-items: center; gap: 6px; }
.beat-cur { display: inline-flex; align-items: center; gap: 4px; height: 26px; min-height: 26px; padding: 0 9px; border: 1px solid #d7d4f5; border-radius: var(--r-pill); background: #fff; color: #6d5efc; font-size: 12px; cursor: pointer; }
.beat-cur svg { width: 13px; height: 13px; fill: currentColor; stroke: none; }
.beat-cur.on { background: #6d5efc; color: #fff; border-color: #6d5efc; }
.beat-idx { font-size: 11.5px; color: var(--muted); font-family: var(--mono); }
.beat-spacer { flex: 1 1 auto; }
.beat-mini { width: 28px; height: 26px; min-height: 26px; min-width: 28px; padding: 0; border-radius: var(--r-xs); color: #8b8f98; }
.beat-mini:hover:not(:disabled) { background: rgba(0,0,0,.06); color: #333; }
.beat-mini:disabled { opacity: .3; cursor: not-allowed; }
.beat-mini svg { width: 15px; height: 15px; }
.beat-del:hover { color: var(--danger); background: rgba(233,79,79,.1); }
.beat-title { width: 100%; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 10px; font-size: 13.5px; font-weight: 600; background: #fff; }
.beat-body { width: 100%; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13px; line-height: 1.55; font-family: inherit; resize: none; overflow: hidden; background: #fff; }
/* 大纲树状骨架（大事件 act → 子节点 beat） */
.outline-actions .outline-struct { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.outline-actions .outline-struct select { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 8px; font-size: 12.5px; background: #fff; }
.outline-prompt-box { border: 1px solid #dbe7df; border-radius: var(--r-md); background: linear-gradient(180deg, #f7fff9, #fff); padding: 10px 12px; box-shadow: 0 1px 0 rgba(15,138,95,.04); }
.outline-prompt-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.outline-prompt-head b { font-size: 13px; color: #0c6b48; }
.outline-prompt-head span { font-size: 11.5px; color: var(--muted); }
.outline-prompt-input { width: 100%; min-height: 54px; max-height: 180px; resize: vertical; overflow: hidden; border: 1px solid #cfe0d5; border-radius: var(--r-sm); padding: 8px 10px; background: rgba(255,255,255,.9); color: var(--text); font-family: inherit; font-size: 13px; line-height: 1.55; }
.outline-prompt-input:focus { outline: none; border-color: var(--wechat-green, #0f8a5f); box-shadow: 0 0 0 2px rgba(15,138,95,.12); }
.outline-tree { display: flex; flex-direction: column; gap: 12px; }
.act-card { position: relative; border: 1px solid var(--wechat-line); border-left: 3px solid #cfcbf7; border-radius: var(--r-md); padding: 10px 12px; background: #fafafb; display: flex; flex-direction: column; gap: 8px; }
.act-card.is-current { border-color: #6d5efc; border-left-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.22); }
.act-head { display: flex; align-items: center; gap: 6px; }
.act-toggle { width: 24px; height: 24px; min-width: 24px; min-height: 24px; padding: 0; border-radius: var(--r-xs); color: #8b8f98; display: inline-flex; align-items: center; justify-content: center; }
.act-toggle svg { width: 16px; height: 16px; transition: transform .15s ease; transform: rotate(90deg); }
.act-toggle.collapsed svg { transform: rotate(0deg); }
.act-toggle:hover { background: rgba(0,0,0,.06); color: #333; }
.act-title { flex: 1 1 auto; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 10px; font-size: 13.5px; font-weight: 700; background: #fff; }
.act-date { flex: 0 0 auto; width: 138px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 6px 8px; font-size: 12px; color: #b08d57; background: #fffdf8; }
.act-date:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
@media (max-width: 560px) { .act-date { width: 124px; } }
/* 三层大纲：小事件层 */
.scene-list { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; padding-left: 14px; border-left: 2px solid #ececf0; }
.scene-card { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fcfcfd; padding: 6px 8px; }
.scene-card.is-current { border-color: #b08d57; background: rgba(176,141,87,.05); }
.scene-head { display: flex; align-items: center; gap: 5px; }
.scene-title { flex: 1 1 auto; min-width: 0; border: 1px solid var(--wechat-line); border-radius: var(--r-xs); padding: 5px 8px; font-size: 12.5px; font-weight: 600; background: #fff; }
.scene-title:focus { border-color: var(--wechat-green, #0f8a5f); outline: none; }
.scene-add { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; border: 1px dashed var(--wechat-line); background: none; color: var(--muted); border-radius: var(--r-xs); padding: 4px 10px; font-size: 12px; cursor: pointer; }
.scene-add svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; }
.scene-add:hover { color: var(--wechat-green, #0f8a5f); border-color: var(--wechat-green, #0f8a5f); }
/* 时间树状图（只读概览） */
.otl-tree { display: flex; flex-direction: column; gap: 10px; padding: 4px 2px; }
.otl-act { border-left: 3px solid #b08d57; padding-left: 10px; }
.otl-act-head { display: flex; align-items: center; gap: 7px; font-size: 14px; }
.otl-act-head .otl-tt { color: #333; }
.otl-bullet { width: 9px; height: 9px; border-radius: 50%; background: #b08d57; flex: 0 0 auto; }
.otl-bullet.sm { width: 6px; height: 6px; background: #c4a86a; }
.otl-date { font-size: 11px; color: #fff; background: #b08d57; border-radius: 5px; padding: 1px 7px; flex: 0 0 auto; }
.otl-cur { font-size: 10px; color: #fff; background: var(--wechat-green, #0f8a5f); border-radius: 5px; padding: 1px 7px; }
.otl-sum { font-size: 12px; color: #888; margin: 2px 0 4px 16px; }
.otl-scene { margin: 6px 0 6px 16px; border-left: 2px solid #e6e0d4; padding-left: 10px; }
.otl-scene-head { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #6a5a3a; font-weight: 600; }
.otl-scene.on > .otl-scene-head { color: #b08d57; }
.otl-beat { display: flex; align-items: baseline; gap: 6px; width: 100%; text-align: left; border: 0; background: none; cursor: pointer; padding: 3px 6px; margin: 2px 0 2px 14px; border-radius: 6px; font-size: 12.5px; color: #555; }
.otl-beat:hover { background: #f5f5f7; }
.otl-beat.on { background: rgba(15,138,95,.1); color: var(--wechat-green, #0f8a5f); font-weight: 600; }
.otl-k { font-size: 10px; color: #9a8050; background: #f3eede; border-radius: 4px; padding: 1px 6px; flex: 0 0 auto; }
.otl-bt { flex: 1 1 auto; }
.act-summary { width: 100%; border: 1px dashed var(--wechat-line); border-radius: var(--r-sm); padding: 6px 10px; font-size: 12.5px; color: #555; background: #fff; }
.act-beats { display: flex; flex-direction: column; gap: 7px; margin-left: 11px; padding-left: 14px; border-left: 2px dashed #dddaf3; }
.beat-node { position: relative; display: flex; gap: 7px; align-items: flex-start; }
.beat-node::before { content: ''; position: absolute; left: -15px; top: 15px; width: 11px; border-top: 2px dashed #dddaf3; }
.beat-kind { flex: 0 0 76px; width: 76px; align-self: flex-start; height: var(--ctl-h); padding: 0 6px; border: 1px solid var(--wechat-line); border-radius: var(--r-xs); font-size: 12px; background: #fff; color: #6d5efc; }
.beat-node-text { flex: 1 1 auto; width: auto; min-width: 0; min-height: 36px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 10px; font-size: 13px; line-height: 1.55; font-family: inherit; resize: none; overflow: hidden; background: #fff; }
.beat-add-child { align-self: flex-start; display: inline-flex; align-items: center; gap: 5px; border: 1px dashed var(--wechat-line); background: #fff; border-radius: var(--r-sm); padding: 5px 10px; font-size: 12px; color: #666; cursor: pointer; }
.beat-add-child:hover { border-color: #6d5efc; color: #4a3fd0; background: #f6f5ff; }
.beat-add-child svg { width: 14px; height: 14px; }
/* 发送框旁「剧情推进」面板 */
.story-row { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: #555; margin-bottom: 8px; }
.story-row select { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 9px; font-size: 13px; }
.story-modes { display: flex; gap: 8px; margin-bottom: 8px; }
.story-mode { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: var(--ctl-h); border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #555; font-size: 12.5px; cursor: pointer; }
.story-mode svg { width: 15px; height: 15px; }
.story-mode.on { border-color: #6d5efc; background: #f0eefe; color: #4a3fd0; font-weight: 600; }
.story-dir { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: #555; margin-bottom: 8px; }
.story-dir textarea { width: 100%; min-height: 54px; resize: vertical; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 7px 9px; font-size: 12.5px; line-height: 1.5; font-family: inherit; }
/* 小节步进 + 自动推进开关 */
.story-steps { display: flex; gap: 8px; margin-bottom: 8px; }
.story-step { flex: 1 1 0; height: var(--ctl-h-sm); border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #555; font-size: 12.5px; cursor: pointer; }
.story-step:hover { border-color: #6d5efc; color: #4a3fd0; background: #f6f5ff; }
.story-check { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #555; margin-bottom: 8px; cursor: pointer; }
.story-check input { margin: 0; }
/* 大纲树：当前小节（推进锚点）标记与高亮 */
.beat-cur-mini svg { fill: currentColor; stroke: none; }
.beat-cur-mini.on { color: #6d5efc; }
.beat-node.is-current-beat .beat-node-text { border-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.18); }

/* 超级对话框 · 剧情推进里的「大纲树状小展示」：与「文本大纲」同结构（大事件→小节/小矛盾），只读 + 点选定位当前进度 */
.sc-otree { display: flex; flex-direction: column; gap: 7px; margin: 2px 0 6px; max-height: 300px; overflow-y: auto; padding-right: 2px; }
.sc-oact { border: 1px solid var(--wechat-line, #e2e2e2); border-left: 3px solid #cfcbf7; border-radius: 10px; background: #fafafb; padding: 5px 8px 7px; }
.sc-oact.on { border-color: #6d5efc; border-left-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.16); }
.sc-oact-head { display: flex; align-items: center; gap: 6px; width: 100%; text-align: left; background: none; border: 0; padding: 3px 2px; cursor: pointer; font: inherit; }
.sc-oact-idx { flex: 0 0 auto; font-size: 11px; color: #9a9aa6; font-family: var(--mono, monospace); }
.sc-oact-tt { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 700; color: #2b2b2b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-oact-cur { flex: 0 0 auto; font-size: 10px; font-weight: 600; color: #6d5efc; background: rgba(109,94,252,.12); border-radius: 999px; padding: 1px 7px; }
.sc-oact-sum { font-size: 11.5px; color: #8b8f98; line-height: 1.5; padding: 0 2px 3px; }
.sc-obeats { display: flex; flex-direction: column; gap: 4px; margin: 3px 0 1px 6px; padding-left: 12px; border-left: 2px dashed #dddaf3; }
.sc-obeat { position: relative; display: flex; align-items: flex-start; gap: 6px; width: 100%; text-align: left; background: #fff; border: 1px solid var(--wechat-line, #e6e6e6); border-radius: 8px; padding: 5px 8px; cursor: pointer; font: inherit; }
.sc-obeat::before { content: ''; position: absolute; left: -13px; top: 14px; width: 9px; border-top: 2px dashed #dddaf3; }
.sc-obeat:hover { border-color: #b9b2f5; }
.sc-obeat.on { border-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.16); }
.sc-obeat-k { flex: 0 0 auto; font-size: 10.5px; font-weight: 600; color: #6d5efc; background: rgba(109,94,252,.1); border-radius: 6px; padding: 1px 6px; margin-top: 1px; }
.sc-obeat-t { flex: 1 1 auto; min-width: 0; font-size: 12.5px; line-height: 1.5; color: #3a3a3a; word-break: break-word; }
.sc-obeat.on .sc-obeat-t { color: #2b2b2b; font-weight: 600; }

/* 全局变量 · 世界状态：时间步进器 / 天气直选 / 地点树状（点选即改、当前高亮） */
.sc-wsbox { display: flex; flex-direction: column; gap: 5px; margin: 2px 0 8px; padding: 8px 10px; border: 1px solid var(--wechat-line, #e6e6e6); border-radius: 10px; background: #fafafb; }
.sc-wsnow { font-size: 13px; font-weight: 700; color: #2b2b2b; margin-bottom: 2px; }
.sc-wsrow { display: flex; align-items: center; gap: 6px; }
.sc-wslab { flex: 0 0 34px; font-size: 11.5px; color: #8b8f98; }
.sc-wsstep { width: 36px; height: 26px; border: 1px solid var(--wechat-line, #e2e2e2); border-radius: 7px; background: #fff; color: #4a4f5a; cursor: pointer; font-size: 13px; line-height: 1; }
.sc-wsstep:hover { border-color: #6d5efc; color: #6d5efc; }
.sc-wschips { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: 0 0 8px; }
.sc-wschip { font-size: 12px; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--wechat-line, #e2e2e2); background: #fff; color: #4a4f5a; cursor: pointer; }
.sc-wschip:hover { border-color: #b9b2f5; }
.sc-wschip.on { border-color: #6d5efc; background: #f6f5ff; color: #6d5efc; font-weight: 600; box-shadow: 0 0 0 1px rgba(109,94,252,.16); }
.sc-wslab2 { font-size: 11.5px; color: #8b8f98; margin: 2px 0 4px; }
.sc-ptree { gap: 4px; }
.sc-pnode { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; width: 100%; text-align: left; background: #fff; border: 1px solid var(--wechat-line, #e6e6e6); border-radius: 8px; padding: 5px 9px; cursor: pointer; font: inherit; }
.sc-pnode:hover { border-color: #b9b2f5; }
.sc-pnode.on { border-color: #6d5efc; background: #f6f5ff; box-shadow: 0 0 0 1px rgba(109,94,252,.16); }
.sc-pn-tx { font-size: 12.5px; font-weight: 600; color: #3a3a3a; }
.sc-pnode.on .sc-pn-tx { color: #6d5efc; }
.sc-pn-d { font-size: 11px; color: #9a9aa6; line-height: 1.4; }
.quick-count.hold { background: #e0844a; }
/* 群聊：发言选人面板贴着输入框，但保持独立卡片的精致感 */
.composer-body { display: flex; gap: 12px; align-items: flex-end; justify-content: center; width: 100%; max-width: 820px; margin: 0 auto; }
.composer-left { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.composer-main { width: 100%; }
.composer-main .composer-row { width: 100%; max-width: 560px; margin: 0 auto; }
/* （旧版 #groupBar 右下角 fixed 浮窗样式已移除——群聊发言条现已并入 .composer-body 网格右列，见下方新布局） */
#groupBar.group-bar { overflow: hidden; }
#groupBar.group-bar.hidden { display: none; }
#groupBar .group-mode {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  padding: 2px;
  background: #eef2ef;
  border: 1px solid rgba(0,0,0,.04);
  border-radius: var(--r-md);
}
#groupBar .group-mode-label { display: none; }
#groupBar .group-mode-btn {
  flex: initial;
  min-width: 0;
  min-height: 23px;
  padding: 0 3px;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: #6d756f;
  font-size: 11px;
  font-weight: 650;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
#groupBar .group-mode-btn:hover { background: rgba(255,255,255,.68); color: #2f4538; }
#groupBar .group-mode-btn.active {
  background: var(--wechat-green);
  color: #fff;
  box-shadow: 0 3px 8px rgba(15,138,95,.24);
}
#groupBar .group-speakers {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  overflow-y: auto;
  min-height: 0;
  flex: 1 1 auto;
  align-content: start;
  padding-right: 1px;
  scrollbar-width: thin;
}
#groupBar .group-speaker-chip {
  width: 100%;
  min-width: 0;
  justify-content: flex-start;
  min-height: 25px;
  padding: 0 8px 0 3px;
  border: 1px solid #e4e9e5;
  border-radius: var(--r-pill);
  background: rgba(255,255,255,.86);
  color: #344138;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 1px 1px rgba(0,0,0,.02);
}
#groupBar .group-speaker-chip:hover { border-color: rgba(15,138,95,.38); background: #f5fff9; }
#groupBar .group-speaker-chip.active {
  border-color: rgba(15,138,95,.55);
  background: #eafff2;
  color: #0c6b48;
  font-weight: 650;
}
#groupBar .group-speaker-av {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  font-size: 10px;
  background: linear-gradient(135deg, #4fac78, #2d6f52);
}
#groupBar .group-bar-hint {
  display: none;
}
#groupBar .group-go-btn {
  width: 100%;
  min-height: 31px;
  border-radius: var(--r-sm);
  background: linear-gradient(135deg, var(--wechat-green), #23c96f);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 7px 16px rgba(15,138,95,.24);
}
#groupBar .group-go-btn:hover { background: linear-gradient(135deg, var(--wechat-green-dark), #17ba62); }
@media (max-width: 760px) {
  .composer-body { flex-wrap: wrap; }
  #groupBar.group-bar { position: static; flex: 1 1 100%; width: auto; height: auto; max-height: 164px; margin-left: 0; }
  #groupBar .group-speakers { grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); }
}
.graph-pane { gap: 10px; }
/* 工具栏 */
.graph-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.graph-tools-left, .graph-tools-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.graph-zoom { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; }
.graph-icon-btn {
  width: 30px; height: var(--ctl-h-micro); display: grid; place-items: center;
  border: none; background: transparent; color: #4a4f5c; cursor: pointer; border-radius: var(--r-xs);
}
.graph-icon-btn:hover { background: #eef0f5; color: #2a2f3a; }
.graph-icon-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.graph-clear-btn { color: #c0504a; }
.graph-clear-btn:hover { background: rgba(233,79,79,.08); border-color: rgba(233,79,79,.4); }
/* 画布 */
.graph-canvas-wrap {
  position: relative;
  border: 1px solid var(--wechat-line); border-radius: var(--r-md);
  background: radial-gradient(circle at 1px 1px, #e6e7f0 1px, transparent 0) 0 0 / 24px 24px, linear-gradient(180deg, #fcfcff, #f6f7fb);
  overflow: hidden;
}
.graph-svg { width: 100%; height: clamp(340px, 54vh, 600px); display: block; touch-action: none; cursor: grab; }
.graph-svg:active { cursor: grabbing; }
.graph-hint-badge {
  position: absolute; left: 12px; bottom: 10px;
  background: rgba(255,255,255,.82); backdrop-filter: blur(4px);
  border: 1px solid #e7e7ee; border-radius: var(--r-pill);
  padding: 4px 11px; font-size: 11.5px; color: #8990a0; pointer-events: none;
}
.graph-empty-overlay { position: absolute; inset: 0; display: grid; place-items: center; padding: 20px; pointer-events: none; }
.graph-empty-overlay.hidden { display: none; }
.graph-empty-card {
  pointer-events: auto;
  max-width: 360px; text-align: center;
  background: rgba(255,255,255,.92); border: 1px solid #ececf3; border-radius: var(--r-lg);
  padding: 24px 22px; box-shadow: 0 12px 36px rgba(20,24,40,.1);
}
.graph-empty-emoji { font-size: 34px; margin-bottom: 6px; }
.graph-empty-card p { margin: 0 0 14px; color: #6a7080; font-size: 13px; line-height: 1.6; }
/* 连线 */
.graph-edge { fill: none; stroke: #b3bdcc; stroke-width: 1.8; stroke-linecap: round; }
.graph-edge.selected { stroke: #6d5efc; stroke-width: 2.6; }
.graph-edge-hit { fill: none; stroke: transparent; stroke-width: 18px; cursor: pointer; }
.graph-edge-pill { fill: #fff; stroke: #e2e4ea; stroke-width: 1; cursor: pointer; filter: drop-shadow(0 1px 2px rgba(20,24,40,.06)); }
.graph-edge-pill.selected { stroke: #6d5efc; fill: #f4f2ff; }
.graph-edge-label { fill: #5a6273; font-size: 12px; font-weight: 600; cursor: pointer; pointer-events: none; }
/* 节点 */
.graph-node { cursor: grab; }
.graph-node:active { cursor: grabbing; }
.graph-node rect { fill: #fff; stroke: #d2d6e0; stroke-width: 1.5; filter: drop-shadow(0 2px 5px rgba(20,24,40,.08)); transition: stroke .12s, filter .12s; }
.graph-node:hover rect { filter: drop-shadow(0 4px 10px rgba(20,24,40,.14)); }
.graph-svg text { text-rendering: geometricPrecision; font-family: -apple-system, "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif; }
.graph-node-title { fill: #1c2030; font-size: 14px; font-weight: 600; pointer-events: none; }
.graph-node-sub { fill: #97a0b2; font-size: 11px; font-weight: 500; pointer-events: none; }
.graph-edge-label { font-family: -apple-system, "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif; }
/* 按类型着色：人物=紫，事件=蓝，地点=琥珀，物品=青，其他=灰 */
.graph-node.type-character rect { fill: #f4f2ff; stroke: #b9aef9; }
.graph-node.type-character .graph-node-title { fill: #4a3fc4; }
.graph-node.type-event rect { fill: #eaf3fd; stroke: #a8cdf3; }
.graph-node.type-event .graph-node-title { fill: #1f5fa8; }
.graph-node.type-location rect { fill: #fdf4e3; stroke: #f0cf93; }
.graph-node.type-location .graph-node-title { fill: #9a6a12; }
.graph-node.type-item rect { fill: #e9f8f1; stroke: #a6dcc6; }
.graph-node.type-item .graph-node-title { fill: #1c7a55; }
.graph-node.type-other rect { fill: #f3f4f7; stroke: #d2d6e0; }
.graph-seq-badge { fill: #1f5fa8; }
.graph-seq-text { fill: #fff; font-size: 10px; font-weight: 700; pointer-events: none; }
.graph-node.selected rect { stroke: #6d5efc; stroke-width: 2.6; filter: drop-shadow(0 4px 12px rgba(109,94,252,.3)); }
.graph-svg.connect-mode { cursor: crosshair; }
.graph-svg.connect-mode .graph-node { cursor: crosshair; }
.graph-node.connect-from rect { stroke: #f59e0b; stroke-width: 2.8; filter: drop-shadow(0 4px 12px rgba(245,158,11,.35)); }
#graphConnectBtn.active { background: var(--wechat-green); color: #fff; border-color: var(--wechat-green); }
/* 图例 */
.graph-legend { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 2px 0; }
.graph-legend-item { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--muted); }
.graph-legend-dot { width: 11px; height: 11px; border-radius: 3px; border: 1px solid; }
.lg-character { background: #f4f2ff; border-color: #b9aef9; }
.lg-event { background: #eaf3fd; border-color: #a8cdf3; }
.lg-location { background: #fdf4e3; border-color: #f0cf93; }
.lg-item { background: #e9f8f1; border-color: #a6dcc6; }
.graph-editor { border: 1px solid var(--wechat-line); border-radius: var(--r-md); padding: 12px 14px; background: #fafafb; min-height: 70px; }
.graph-editor-hint { color: var(--muted); font-size: 13px; }
.graph-editor-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.graph-pill { font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: var(--r-pill); }
.graph-pill.node { background: #eef2ff; color: #4453c6; }
.graph-pill.edge { background: #fff1f0; color: #c0392b; }
.graph-foot-hint { margin: 2px 0; }

/* ===== 文风 / 词语库 ===== */
.style-pane { display: flex; flex-direction: column; min-height: 0; }
.style-active-bar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; min-height: 26px; }
.style-active-label { font-size: 12px; color: var(--muted); }
.style-active-label.muted { color: var(--quiet); }
.style-active-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px 3px 10px; border-radius: var(--r-pill); background: #efecff; color: #4a3fc4; font-size: 12px; }
.style-active-x { border: none; background: transparent; color: #6d5efc; cursor: pointer; font-size: 12px; line-height: 1; }
.style-list { display: grid; gap: 4px; max-height: 48vh; overflow: auto; }
.style-group-head { font-size: 12px; color: var(--muted); margin: 10px 2px 2px; font-weight: 600; }
.style-row { display: flex; align-items: center; gap: 4px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; padding: 2px 6px 2px 2px; }
.style-row.active { border-color: #c0b6fb; background: #faf9ff; }
.style-pick { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; border: none; background: transparent; cursor: pointer; padding: 8px; text-align: left; }
.style-check { width: 18px; height: 18px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #cfd3dd; border-radius: 5px; color: #6d5efc; font-size: 12px; font-weight: 700; }
.style-row.active .style-check { border-color: #6d5efc; background: #6d5efc; color: #fff; }
.style-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.style-view, .style-edit, .style-del { flex: 0 0 auto; width: 28px; height: var(--ctl-h-micro); border: none; background: transparent; cursor: pointer; border-radius: var(--r-xs); color: var(--muted); }
.style-view:hover, .style-edit:hover { background: #f0f0f5; }
.style-del:hover { background: rgba(233,79,79,.1); color: #c0504a; }
.style-editor-panel { display: none; margin-top: 10px; border: 1px solid #d7d2f5; border-radius: var(--r-sm); background: #fbfaff; padding: 10px; }
.style-editor-panel.show { display: block; }
.style-editor-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 13px; }
.style-editor-head .icon { width: 24px; height: 24px; }
.style-ed-name { width: 100%; box-sizing: border-box; height: var(--ctl-h-tool); margin-bottom: 8px; font-weight: 600; }
.style-ed-content { width: 100%; box-sizing: border-box; min-height: 200px; max-height: 40vh; resize: vertical; font-family: var(--mono); font-size: 12px; line-height: 1.55; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 10px; }
.style-editor-foot { display: flex; justify-content: flex-end; margin-top: 8px; }
.word-list { display: grid; gap: 10px; }
.word-card { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; padding: 10px; display: grid; gap: 8px; }
.word-card-head { display: flex; align-items: center; gap: 8px; }
.word-name { flex: 1 1 auto; min-width: 0; height: var(--ctl-h-tool); font-weight: 600; }
.word-tk { flex: 0 0 auto; font-size: 11px; color: var(--muted); font-family: var(--mono); }
.word-words { width: 100%; box-sizing: border-box; min-height: 80px; max-height: 240px; resize: vertical; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 8px 10px; font-size: 13px; line-height: 1.6; }

/* ===== 小剧场 ===== */
.mt-types { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 12px; }
.mt-type-chip {
  flex: 0 0 auto; height: var(--ctl-h-tool); padding: 0 14px;
  border: 1px solid var(--wechat-line); border-radius: var(--r-pill); background: #fff;
  color: #444; font-size: 13px; cursor: pointer;
}
.mt-type-chip:hover { border-color: rgba(124,92,255,.5); color: #6d5efc; background: #f7f5ff; }
.mt-type-chip.active { border-color: #6d5efc; background: #efecff; color: #4a3fc4; font-weight: 600; }
.mt-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.mt-bar .mt-spacer { flex: 1 1 auto; }
.mt-current { color: var(--muted); font-size: 12px; }
.mt-output { border: 1px solid var(--wechat-line); border-radius: var(--r-md); background: #fafafb; padding: 14px; min-height: 120px; }
.mt-loading, .mt-streaming { color: var(--muted); font-size: 13px; white-space: pre-wrap; line-height: 1.7; }
.mt-result { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; }
.mt-modal .modal-body { display: flex; flex-direction: column; }
.danger-btn { background: #fff1f0; color: #cf1322; border: 1px solid #ffccc7; border-radius: var(--r-sm); padding: 5px 10px; font-size: 12.5px; cursor: pointer; }
@media (max-width: 760px) { .graph-svg { height: 44vh; } .var-row .var-name { flex-basis: 32%; } }

/* ===== 群聊视图渲染 ===== */
.render-modal { max-width: 520px; }
.render-output { min-height: 200px; }
.wxr-raw { white-space: pre-wrap; font-size: 12px; color: var(--muted); background: #f6f6f8; padding: 10px; border-radius: var(--r-sm); margin-top: 10px; }
.wxr-phone { background: #ededed; border-radius: var(--r-lg); overflow: hidden; border: 1px solid #e0e0e3; }
.wxr-bar { text-align: center; font-size: 14px; font-weight: 600; color: #333; padding: 12px; background: #f7f7f7; border-bottom: 1px solid #e6e6e6; }
.wxr-feed { padding: 14px 12px; display: flex; flex-direction: column; gap: 14px; max-height: 60vh; overflow-y: auto; }
.wxr-narr { text-align: center; font-size: 12px; color: #9a9a9a; background: rgba(0,0,0,.04); align-self: center; padding: 3px 10px; border-radius: var(--r-xs); }
.wxr-row { display: flex; gap: 8px; align-items: flex-start; }
.wxr-row.me { flex-direction: row-reverse; }
.wxr-av-wrap { flex: 0 0 auto; }
.wxr-av { display: block; width: 38px; height: 38px; border-radius: var(--r-xs); background-size: cover; background-position: center; background-color: #c9c9cf; }
.wxr-av-txt { display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 16px; }
.wxr-col { display: flex; flex-direction: column; gap: 4px; max-width: 74%; }
.wxr-name { font-size: 12px; color: #9a9a9a; margin-left: 2px; }
.wxr-bubble { background: #fff; padding: 9px 12px; border-radius: var(--r-sm); font-size: 14px; line-height: 1.5; color: #1c1c1e; max-width: 74%; word-break: break-word; box-shadow: 0 1px 1px rgba(0,0,0,.04); position: relative; }
.wxr-bubble.me { background: #c8ecd6; color: #0b1f12; }
.wxr-img { max-width: 180px; border-radius: var(--r-xs); display: block; }

/* ===================== 界面精简：抽屉侧栏 / 顶栏悬浮 / 居中输入 ===================== */
/* 1) 左侧会话栏 = 抽屉：点按钮收起，聊天区铺满（仅桌面，移动端沿用 mobile-open 逻辑）*/
@media (min-width: 761px) {
  .app { transition: grid-template-columns .32s cubic-bezier(.4,0,.2,1); }
  .app.sidebar-collapsed { grid-template-columns: 0 minmax(0, 1fr); }
  .conversations { transition: transform .32s cubic-bezier(.4,0,.2,1); will-change: transform; }
  .app.sidebar-collapsed .conversations { transform: translateX(-100%); }
}

/* 抽屉开关：常驻悬浮按钮，跟随侧栏边缝移动 */
.drawer-toggle {
  position: fixed; top: 12px; left: 318px;
  width: 34px; height: var(--ctl-h); min-width: 34px; min-height: var(--ctl-h);
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; border-radius: var(--r-sm);
  border: 1px solid var(--wechat-line);
  background: rgba(255,255,255,.86); color: #5a5f6a;
  box-shadow: 0 2px 10px rgba(0,0,0,.10);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  cursor: pointer; z-index: 38;
  transition: left .32s cubic-bezier(.4,0,.2,1), background .15s ease, color .15s ease;
}
.drawer-toggle:hover { background: #fff; color: #111; }
.drawer-toggle svg { width: 18px; height: 18px; }
.app.sidebar-collapsed .drawer-toggle { left: 10px; }

/* 2) 顶部标题栏 + 工具栏：默认隐藏，鼠标移到最顶部才滑出 */
.chat { position: relative; grid-template-rows: minmax(0, 1fr) auto; }
.chat-topbar {
  position: fixed; top: 0; left: 310px; right: 0; z-index: 30;
  display: flex; flex-direction: column;
  transform: translateY(-100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1), left .32s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 8px 22px rgba(0,0,0,.07);
}
.chat-topbar:hover, .chat-topbar.peek { transform: translateY(0); }
/* 隐藏态下在顶部留一条不可见的“感应带”，鼠标移上去即滑出 */
.chat-topbar::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 18px; }
.chat-topbar .chat-titlebar,
.chat-topbar .chat-toolbar { position: static; top: auto; z-index: auto; }
/* 给标题留出左侧抽屉按钮的位置 */
.chat-topbar .chat-titlebar { padding-left: 54px; }
.app.sidebar-collapsed .chat-topbar { left: 0; }

/* 3) 聊天正文居中、留白干净 */
.messages {
  max-width: 980px; width: 100%; margin: 0 auto;
  padding: 22px 24px 150px;
  min-height: calc(100dvh * var(--app-unzoom, 1) - 80px);
  position: relative; z-index: 2; /* 浮在立绘背景层（z-index:1）之上：立绘不再遮挡 / 挤压正文 */
}

/* 4) 底部输入框居中、悬浮卡片感 */
.composer {
  border-top: 0;
  background: linear-gradient(to top, var(--wechat-panel) 72%, rgba(247,247,247,0));
  padding: 4px 16px 14px;
}
.composer > * { width: 100%; max-width: 820px; margin-left: auto; margin-right: auto; }
.composer-row {
  background: #fff;
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-lg);
  padding: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.composer textarea { border: 0; background: transparent; }
.composer textarea:focus { border: 0; }

/* 响应式：边缝随侧栏宽度变化；窄屏回退到移动抽屉逻辑 */
@media (max-width: 1180px) {
  .chat-topbar { left: 280px; }
  .drawer-toggle { left: 288px; }
}
@media (max-width: 760px) {
  .chat-topbar { left: 0; }
  .drawer-toggle { left: 10px; }
}

/* 变量 / 作者注 下移，与「推进剧情…」快捷命令并到同一行（命令左、变量/作者注右） */
.composer-tools { justify-content: flex-start; gap: 10px; }
.composer-mid { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%; max-width: 560px; margin: 0 auto 2px; }
.composer-mid .quick-cmd-bar { flex: 1 1 auto; min-width: 0; padding: 0 2px; }
.composer-mid .composer-quick { flex: 0 0 auto; margin-left: auto; }

/* 底部操作台：按右侧标注区重排，做成无硬阴影的果冻悬浮层 */
.composer {
  background: transparent;
}
.composer-tools {
  display: none;
}
.composer > * {
  max-width: none;
}
.composer-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
  gap: 8px 12px;
  align-items: stretch;
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
}
/* 非群聊（发言条隐藏）时输入框独占整行，右侧不预留群聊条的空列；群聊时才出现右列 */
.composer-body:not(.has-groupbar) { grid-template-columns: minmax(0, 1fr); }
.composer-left {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.composer-mid {
  width: 100%;
  max-width: none;
  margin: 0;
  gap: 8px;
  align-items: center;
}
.composer-mid .quick-cmd-bar {
  flex: 1 1 260px;
  min-width: 0;
  padding: 0;
}
.composer-mid .composer-quick {
  flex: 1 1 100%;
  width: 100%;
  margin-left: 0;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
/* ===== 发送区工具按钮统一整理：操作行(墨绿) + 库行(彩色)，统一药丸规格、整齐两层 ===== */
/* 操作行容器：顶对齐、行距收紧 */
.composer-mid { gap: 6px; align-items: flex-start; }

/* 两排药丸统一几何：等高、同内边距与字号、统一胶囊圆角（带头像的「我」/主角 chip 只统一等高，保留自身内边距以免挤到头像） */
.composer-quick > .quick-btn,
.composer-quick .quick-wrap > .quick-btn,
.composer-quick .protagonist-pick-btn,
#superComposerBar .sc-btn {
  min-height: var(--ctl-h-sm);
  padding: 4px 12px;
  font-size: 12.5px;
  border-radius: var(--r-pill);
  box-sizing: border-box;
  white-space: nowrap;
}
.composer-quick .protagonist-me-btn,
.composer-quick .protagonist-chip {
  min-height: var(--ctl-h-sm);
  font-size: 12.5px;
  box-sizing: border-box;
  white-space: nowrap;
}
.composer-quick .protagonist-control { min-height: var(--ctl-h-sm); gap: 6px; box-sizing: border-box; }

/* 操作行（续写 / 叙事 / 角色变量 / 作者注 / 「我」）统一墨绿描边药丸，呼应主题、与彩色库行分层 */
.composer-quick { gap: 6px; align-items: center; flex-wrap: wrap; }
.composer-quick > .quick-btn,
.composer-quick .quick-wrap > .quick-btn,
.composer-quick .protagonist-me-btn {
  border: 1px solid color-mix(in srgb, var(--jade-ink, #0c6b48) 24%, var(--wechat-line, #e3e3e8));
  background: var(--surface, #fff);
  color: var(--jade-ink, #0c6b48);
  font-weight: 500;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.composer-quick > .quick-btn:hover,
.composer-quick .quick-wrap > .quick-btn:hover,
.composer-quick .protagonist-me-btn:hover {
  border-color: var(--jade-ink, #0c6b48);
  background: color-mix(in srgb, var(--jade-ink, #0c6b48) 10%, var(--surface, #fff));
  color: var(--jade-ink, #0c6b48);
}
.composer-quick > .quick-btn.active,
.composer-quick .quick-wrap > .quick-btn.active {
  border-color: var(--jade-ink, #0c6b48);
  background: color-mix(in srgb, var(--jade-ink, #0c6b48) 15%, var(--surface, #fff));
  color: var(--jade-ink, #0c6b48);
  font-weight: 600;
}
.composer-quick .quick-btn svg,
.composer-quick .protagonist-me-btn svg { width: 14px; height: 14px; opacity: .9; }
/* 操作行徽标（角色变量 / 作者注计数）统一成墨绿小圆点，与库行计数一致；保留「持有」橙色态 */
.composer-quick .quick-count:not(.hold) {
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-pill);
  background: var(--jade-ink, #0c6b48); color: #fff; font-size: 11px; line-height: 16px; text-align: center;
}

/* 库行（super-composer）：彩色药丸保留，统一对齐 + 整齐换行（sc-bar 几何在 super-composer 模块内定义） */
#superComposerBar .sc-libs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.composer-main .composer-row {
  width: 100%;
  max-width: none;
  margin: 0;
  border: 1px solid #dddddd;
  background: #fff;
  border-radius: var(--r-lg);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#groupBar.group-bar {
  position: static;
  z-index: auto;
  width: 100%;
  height: auto;
  align-self: end;
  display: flex;
  flex-direction: column;
  flex: none;
  gap: 7px;
  padding: 10px;
  margin: 0;
  border: 1px solid #dddddd;
  border-radius: var(--r-lg);
  background: #fff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#groupBar .group-mode {
  min-height: var(--ctl-h-sm);
  background: #f0f2f1;
  border-color: #e5e5e5;
}
#groupBar .group-mode-btn {
  min-height: 25px;
  font-size: 11.5px;
}
#groupBar .group-mode-btn.active {
  box-shadow: none;
}
#groupBar .group-speakers {
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  overflow-y: auto;
  flex: 0 1 auto;
  max-height: 200px;
}
#groupBar .group-speaker-chip {
  min-height: 26px;
  background: #fff;
  border-color: #e1e6e2;
}
#groupBar .group-speaker-chip.active {
  background: #eafff2;
}
#groupBar .group-bar-hint {
  display: none;
}
#groupBar .group-bar-hint.show {
  display: block;
  margin: 0;
  padding: 5px 8px;
  border-radius: var(--r-sm);
  background: #f4f6f5;
  color: #6a726c;
  font-size: 11.5px;
  line-height: 1.4;
  text-align: center;
}
#groupBar .group-go-btn {
  min-height: var(--ctl-h-tool);
  box-shadow: none;
}
@media (max-width: 900px) {
  .composer-body {
    width: 100%;
    grid-template-columns: 1fr;
    margin-left: auto;
    margin-right: auto;
  }
  #groupBar.group-bar {
    width: 100%;
    max-height: 164px;
  }
  #groupBar .group-speakers {
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  }
}

/* =================================================================== */
/* ===============  雅致翡翠 · 美化增强层（统一视觉语言） ============== */
/* 仅做观感统一：圆角阶 / 柔和阴影 / 翡翠强调 / 描边收敛 / 交互反馈。   */
/* 字体一律沿用上方 --sans/--serif/--mono，不改动。                    */
/* =================================================================== */

/* ---------- 0. 基础 ---------- */
body { background: var(--canvas); }
::selection { background: rgba(15,138,95,.20); }
:focus-visible { outline: 2px solid var(--jade-ring); outline-offset: 1px; }
button:focus-visible, .icon:focus-visible { outline-offset: 2px; }

button.primary {
  background: linear-gradient(135deg, #16976a, var(--jade));
  box-shadow: 0 4px 12px rgba(15,138,95,.24);
  transition: filter .15s ease, box-shadow .15s ease, transform .06s ease;
}
button.primary:hover { background: linear-gradient(135deg, #128560, var(--jade-dark)); box-shadow: 0 6px 16px rgba(15,138,95,.30); }
button.primary:active { transform: translateY(1px); }

input, textarea, select { background: var(--surface); border-color: var(--wechat-line); transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
input:focus, textarea:focus, select:focus { border-color: var(--jade-ring); box-shadow: 0 0 0 3px rgba(15,138,95,.12); }

/* ---------- 1. 应用外壳 / 侧栏 ---------- */
.app { box-shadow: 0 30px 90px rgba(20,34,26,.20); }
.conversations { border-right: 1px solid var(--wechat-line); }
.search-head, .conv-filters, .pm-head, .pm-toolbar, .pm-actions, .pm-hint { border-color: var(--wechat-line); }
.search-wrap input { background: var(--surface-2); border: 1px solid var(--wechat-line); }
.search-wrap input:focus { background: var(--surface); }
.conv-filters select { border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: var(--surface); }

.conv-item { border-bottom: 1px solid #e7ebe6; transition: background .14s ease; }
.conv-item::before {
  content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0; background: transparent; transition: background .14s ease;
}
.conv-item:hover { background: var(--jade-softer); }
.conv-item.active { background: var(--jade-soft); }
.conv-item.active::before { background: var(--jade); }
.conv-name { color: var(--text); }

.avatar { border-radius: var(--r-md); }
.me-avatar { border-radius: var(--r-md); background: linear-gradient(135deg, #1aa873, #0c7350); box-shadow: 0 4px 12px rgba(12,107,72,.28); }
.avatar.imported { background: linear-gradient(135deg, #6f97c8, #4f74ad); }

.drawer-toggle { border-radius: var(--r-sm); border-color: var(--wechat-line); box-shadow: var(--shadow-sm); }

/* ---------- 2. 顶部标题栏 / 工具条 ---------- */
.chat-topbar { box-shadow: var(--shadow-md); }
.chat-titlebar { background: rgba(243,246,242,.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--wechat-line); }
.chat-toolbar { background: rgba(243,246,242,.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--wechat-line); padding: 8px 16px; gap: 7px; }
.chat-title { letter-spacing: .2px; }

.chat-tool-btn {
  border: 1px solid var(--wechat-line); border-radius: var(--r-pill);
  background: var(--surface); color: #4b524c; height: 33px; padding: 0 13px;
  box-shadow: var(--shadow-xs); transition: color .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}
.chat-tool-btn:hover { border-color: var(--jade-ring); color: var(--jade-ink); background: var(--jade-softer); box-shadow: 0 2px 8px rgba(15,138,95,.12); }
.chat-tool-btn.danger { color: #b9554c; }
.chat-tool-btn.danger:hover { border-color: rgba(224,87,76,.5); background: rgba(224,87,76,.08); color: #b9554c; }
.chat-tool-sep { min-width: 1px; flex: 1 1 auto; }

.zoom-ctl { border-radius: var(--r-sm); border-color: var(--wechat-line); background: var(--surface); }

/* ---------- 3. 消息 / 气泡 ---------- */
.messages {
  background: var(--chat-canvas);
}
.dayline { color: var(--muted); font-size: 11.5px; letter-spacing: .3px; }

.bubble {
  border-radius: var(--r-md);
  border: 1px solid rgba(20,40,30,.06);
  box-shadow: 0 2px 10px rgba(20,40,30,.06);
  padding: 11px 14px;
}
.msg.assistant .bubble { border-color: rgba(20,40,30,.07); }
.msg.assistant .bubble::before { top: 15px; }
.msg.user .bubble {
  background: linear-gradient(135deg, #d6f1df, #c2e8d1);
  border-color: rgba(15,138,95,.20);
}
.msg.user .bubble::after { top: 15px; border-left-color: #c2e8d1; }
.msg.plan .bubble { background: #fbf6e3; border-color: #ecdcae; color: #6a5827; border-radius: var(--r-md); }

.msg .avatar { border-radius: var(--r-sm); box-shadow: var(--shadow-xs); }
.msg-foot { border-top-color: rgba(20,40,30,.07); }
.msg-action-btn { border-radius: var(--r-pill); transition: background .14s ease, border-color .14s ease, color .14s ease, transform .08s ease, box-shadow .14s ease; }
.msg-action-btn:hover { background: var(--jade-softer); color: var(--jade-ink); }

.msg-foldout { border-radius: var(--r-sm); border-color: #e3e8e3; border-left-color: #c8d2c8; background: var(--surface-2); }
.msg-reasoning { border-radius: var(--r-sm); border-color: #34363d; border-left-color: #5b5e68; background: #2a2c32; }
.code-block { border-radius: var(--r-md); box-shadow: var(--shadow-sm); }

/* ---------- 4. 底部输入台 ---------- */
.composer-main .composer-row {
  border: 1px solid var(--wechat-line);
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.composer-main .composer-row:focus-within { border-color: var(--jade-ring); box-shadow: 0 0 0 3px rgba(15,138,95,.10), var(--shadow-sm); }
.composer-send-group .primary {
  border-radius: var(--r-md); min-height: 44px; padding: 0 18px; font-weight: 600;
}
.composer-mini { border-radius: var(--r-md); border-color: var(--wechat-line); color: var(--jade-ink); }
.composer-mini:hover:not(:disabled) { background: var(--jade-soft); border-color: var(--jade-ring); }

.quick-btn, .qc-chip, .mt-type-chip, .group-add-chip, .group-mode-btn {
  transition: background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
}
.quick-btn { border-color: var(--wechat-line); background: var(--surface); }
.quick-btn:hover { border-color: var(--jade-ring); background: var(--jade-softer); color: var(--jade-ink); }
.qc-chip { border-color: var(--wechat-line); }
.qc-chip:hover { background: var(--jade-softer); border-color: var(--jade-ring); color: var(--jade-ink); }

#groupBar.group-bar { border: 1px solid var(--wechat-line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }

/* ---------- 5. 弹窗 / 浮层 ---------- */
.modal { border-radius: var(--r-lg); border: 1px solid rgba(20,40,30,.06); box-shadow: var(--shadow-lg); }
.modal-head {
  position: sticky; top: 0; z-index: 3;
  background: var(--surface); border-bottom: 1px solid var(--wechat-line);
  font-size: 15px;
}
.modal-actions {
  position: sticky; bottom: 0; z-index: 3;
  padding-top: 12px;
  background: linear-gradient(to top, var(--surface) 70%, transparent);
  border-top: 1px solid var(--wechat-line);
  margin-top: 4px;
}
.float-panel { border-radius: var(--r-lg); border: 1px solid rgba(20,40,30,.08); box-shadow: var(--shadow-lg); }
.modal-head .icon { border-radius: var(--r-sm); color: var(--muted); }
.modal-head .icon:hover { background: var(--surface-3); color: var(--text); }

/* 各类浮出菜单 / 气泡面板：统一圆角与柔和投影 */
.quick-panel, .more-menu, .mem-popover, .ctx-menu,
.ri-kb-picker-panel, .protagonist-picker-panel, .protagonist-pick-list {
  border-radius: var(--r-md);
  border-color: var(--wechat-line);
  box-shadow: var(--shadow-pop);
}

/* ---------- 6. 表单 / 区块 / 折叠条 ---------- */
.settings-section { background: var(--surface-2); border: 1px solid var(--wechat-line); border-radius: var(--r-md); }
.settings-section h2 { letter-spacing: .2px; }
.api-hint { background: var(--surface-3); border-radius: var(--r-sm); }
.provider-row button { border-color: var(--wechat-line); }
.provider-row button:hover { border-color: var(--jade-ring); background: var(--jade-softer); color: var(--jade-ink); }
.pm-iconbtn, .pm-toolbar select, .pm-toolbar button { border-radius: var(--r-sm); border-color: var(--wechat-line); }
.pm-iconbtn:hover { background: var(--jade-softer); color: var(--jade-ink); }
.pm-preset-label, .pm-who { background: var(--jade-softer); border-color: var(--jade-line); color: #2c4338; }

.st-entry, .regex-entry, .ctx-entry, .stpm-row, .kb-wi-entry, .pmi-card,
.tag-entry-editor, .group-member-row, .var-row, .an-row, .var-row2,
.char-mem-card, .beat-card, .act-card, .word-card, .qr-row, .ab-item, .res-row {
  border-radius: var(--r-md);
  border-color: var(--wechat-line);
}
.st-entry.open, .ctx-entry.open { border-color: var(--jade-ring); box-shadow: var(--shadow-sm); }

/* 分段控件 / 标签页：统一翡翠激活 */
.seg-toggle, .ctx-tabs { background: var(--surface-3); border-radius: var(--r-md); }
.seg.active, .ctx-tab.active { box-shadow: var(--shadow-xs); }
.qr-tab.active { color: var(--jade-ink); border-bottom-color: var(--jade); }
.drop { border-radius: var(--r-md); border-color: #cdd4cc; background: var(--surface-2); }
.drop.drag { border-color: var(--jade); background: var(--jade-softer); }

/* ---------- 7. 看板：上下文 / 剧情图 / 状态 / 地图 / 渲染 / 小剧场 ---------- */
.ctx-stat { background: var(--surface-2); border: 1px solid var(--wechat-line); border-radius: var(--r-md); }
.ctx-entry, .ctx-card { background: var(--surface-2); }
.ctx-whole, .ctx-json { border-radius: var(--r-md); }
.ctx-chip.char { background: var(--jade); }

.graph-canvas-wrap { border-radius: var(--r-md); border-color: var(--wechat-line); box-shadow: var(--shadow-sm); }
.graph-editor, .mt-output { background: var(--surface-2); border-radius: var(--r-md); border-color: var(--wechat-line); }
.graph-zoom { border-radius: var(--r-sm); border-color: var(--wechat-line); }

.status-panel { background: var(--surface-2); border: 1px solid var(--wechat-line); border-radius: var(--r-md); box-shadow: var(--shadow-xs); }
.status-panel-head { color: var(--jade-ink); }
.status-group-name { color: #9a7b3f; }

.map-tree { border-radius: var(--r-md); border-color: var(--wechat-line); background: var(--surface-2); }
.map-op { border-radius: var(--r-pill); border-color: var(--wechat-line); }

.wxr-phone { border-radius: var(--r-lg); border-color: var(--wechat-line); box-shadow: var(--shadow-md); }

/* ---------- 8. 角色介绍 / 素材卡片 ---------- */
.role-info-card { background: var(--surface-2); border: 1px solid var(--wechat-line); border-radius: var(--r-md); }
.role-info-card pre, .profile-text, .ri-firstmes-text { border-radius: var(--r-sm); }
.character-card {
  border: 1px solid var(--wechat-line); border-radius: var(--r-md);
  box-shadow: var(--shadow-xs); transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.character-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--jade-ring); }
.resource-card, .resource-card-list .resource-card { border-radius: var(--r-sm); border-color: var(--wechat-line); }

/* 大素材库 / 头像墙：用弹窗主体滚动，不让网格自己 66vh 截断，避免中间滚不到 */
#characterModal .character-modal {
  top: 18px;
  right: 12px;
  width: min(1720px, calc(100vw - 24px));
  height: calc(100vh - 36px);
  max-height: calc(100vh - 36px);
}
#characterModal .character-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
#characterModal .character-grid {
  max-height: none;
  overflow: visible;
  padding-right: 0;
  padding-bottom: 24px;
}

/* 角色介绍：整页滚动兜底，三栏内容不再被各自 overflow:hidden 裁掉 */
#roleInfoModal .role-info-modal {
  inset: 10px;
}
#roleInfoModal .role-info-modal .modal-body {
  overflow-y: auto;
  min-height: 0;
}
#roleInfoModal .role-info-shell {
  height: auto;
  min-height: 100%;
}
#roleInfoModal .role-info-grid {
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 1.06fr) minmax(0, 1.16fr);
  grid-template-rows: auto;
  align-items: start;
}
#roleInfoModal .ri-col,
#roleInfoModal .ri-col-read,
#roleInfoModal .ri-col-config {
  overflow: visible;
}
#roleInfoModal .ri-card-grow,
#roleInfoModal .role-description-card,
#roleInfoModal .role-resources-card {
  flex: 0 0 auto;
}
#roleInfoModal .ri-col .res-edit-list,
#roleInfoModal .ri-col .small-kb-list {
  flex: 0 0 auto;
  max-height: none;
  overflow: visible;
}
.resource-card:hover { border-color: var(--jade-ring); background: var(--jade-softer); }

/* ---------- 9. 杂项收尾 ---------- */
.toast { border-radius: var(--r-md); background: rgba(26,38,30,.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: var(--shadow-lg); }
.empty { color: var(--muted); }
.app-update-bar { background: linear-gradient(135deg, #16976a, var(--jade)); border-radius: var(--r-pill); box-shadow: var(--shadow-lg); }
.app-update-refresh { color: var(--jade-dark); }
.material-summary span, .ri-chip, .gm-kb-chip, .selected-tag-chips span, .character-card-tags span { border-radius: var(--r-pill); }

/* 移动端：弹窗与输入台贴边更圆润 */
@media (max-width: 760px) {
  .float-panel { border-radius: var(--r-md); }
  .modal { border-radius: var(--r-md); }
  .composer-main .composer-row { border-radius: var(--r-lg); }
}
/* ===================  美化增强层 · 结束  =================== */


/* =================================================================== */
/* ===============  统一制式层（同类组件收敛成一套样板） ============== */
/* 目标：把"同一种东西却各做各的"小组件统一成一致样板，降低视觉与认知   */
/* 复杂度。仅统一形状 / 尺寸 / 间距 / 交互态；不改颜色、不改 DOM、不动   */
/* JS，可随时整段删除回滚。                                            */
/* =================================================================== */

/* ---- 1. 信息胶囊：统一形状与尺寸（各自颜色保留） ---- */
.ri-chip, .kb-scope-pill, .resource-type, .material-summary span,
.character-card-tags span, .cg-tag-chip, .selected-tag-chips span,
.conv-group-tag {
  border-radius: var(--r-pill);
  padding: 3px 10px;
  font-size: 11.5px;
  line-height: 1.55;
  vertical-align: middle;
}

/* ---- 2. 计数徽标：统一成一致小圆标（各自颜色保留） ---- */
.quick-count, .an-card-count, .ri-kb-btn-count {
  min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: var(--r-pill);
  font-size: 11px; line-height: 18px; font-weight: 700;
  text-align: center;
}

/* ---- 3. 可勾选选择行：统一圆角与交互过渡（各自颜色保留） ---- */
.ri-kb-pick-item, .protagonist-pick-item, .style-row, .tag-row {
  border-radius: var(--r-sm);
  transition: background .14s ease, border-color .14s ease;
}

/* ---- 4. 选择行内小动作按钮：统一成一致无框图标按钮（各自颜色保留） ---- */
.ri-kb-pick-view, .ri-kb-pick-del, .style-view, .style-edit, .style-del {
  border-radius: var(--r-xs);
  transition: background .14s ease, color .14s ease;
}

/* ---- 5. 虚线「＋ 新增」按钮：统一几何与虚线（各自强调色保留） ---- */
.mem-add-entry, .beat-add-child, .an-add-entry, .qc-add, .var-bank-add {
  border-radius: var(--r-sm);
  border-style: dashed;
  font-size: 12.5px;
}

/* ---- 6. 空态：统一"虚线盒"样板 ---- */
.empty { color: var(--muted); }
.kb-bound-empty, .cg-empty, .ab-empty {
  border: 1px dashed var(--wechat-line);
  border-radius: var(--r-md);
  background: var(--surface-2);
  color: var(--muted);
  padding: 16px;
  text-align: center;
  font-size: 12.5px;
  line-height: 1.6;
}

/* ---- 7. 分段 / 标签页：统一激活态（胶囊白底浮起 · 下划线翡翠） ---- */
.seg.active, .ctx-tab.active { background: var(--surface); box-shadow: var(--shadow-xs); }
.qr-tab.active { border-bottom-color: var(--jade); color: var(--jade-ink); }
/* ===================  统一制式层 · 结束  =================== */


/* =================================================================== */
/* ===============  防刷新闪烁层（配合 index.html 头部脚本） ========== */
/* 加载期禁用一切过渡/动画 + 首帧前镜像"侧栏收起态"，刷新不再闪。       */
/* =================================================================== */
html.preload *,
html.preload *::before,
html.preload *::after {
  transition: none !important;
  animation: none !important;
  scroll-behavior: auto !important;
}
/* 首帧前（JS 还来不及给 .app 加 sidebar-collapsed）就由 <html class="rp-collapsed"> 镜像收起布局，
   与 .app.sidebar-collapsed 完全一致，JS 随后加同名类时状态不变、不触发过渡 */
@media (min-width: 761px) {
  html.rp-collapsed .app { grid-template-columns: 0 minmax(0, 1fr); }
  html.rp-collapsed .conversations { transform: translateX(-100%); }
  html.rp-collapsed .drawer-toggle { left: 10px; }
  html.rp-collapsed .chat-topbar { left: 0; }
}
/* ===================  防刷新闪烁层 · 结束  =================== */


/* =================================================================== */
/* ===============  黑金虚影标签层（库标签 / 胶囊 / 计数徽标统一） ===== */
/* 把各类信息胶囊 / 标签 / 计数徽标统一成"黑金 + 虚影"质感。            */
/* 形状沿用「统一制式层」，此处只换配色与光影。                         */
/* =================================================================== */
.ri-chip, .kb-scope-pill, .resource-type, .material-summary span,
.character-card-tags span, .cg-tag-chip, .selected-tag-chips span,
.conv-group-tag, .gm-kb-chip, .style-active-chip, .ri-kb-chip {
  background: linear-gradient(145deg, rgba(40,35,27,.97), rgba(20,17,13,.97)) !important;
  color: #e8cd86 !important;
  border: 1px solid rgba(214,178,96,.42) !important;
  box-shadow:
    0 2px 9px rgba(0,0,0,.24),
    0 0 0 3px rgba(214,178,96,.05),
    inset 0 1px 0 rgba(255,238,190,.12) !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.4);
}
/* 浅底特例（资源映射库等用浅绿底的 chip）也并入黑金，保持一致 */
.ri-kb-chip-res { color: #f0d490 !important; }

/* 计数徽标：同款黑金小圆标 */
.quick-count, .an-card-count, .ri-kb-btn-count, .kb-bound {
  background: linear-gradient(145deg, #2b2519, #16120c) !important;
  color: #f0d490 !important;
  border: 1px solid rgba(214,178,96,.48) !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,238,190,.12) !important;
}

/* 标签内的「×」/删除：金色，hover 微亮 */
.gm-kb-chip-x, .style-active-x {
  color: #d6b260 !important;
  background: transparent !important;
}
.gm-kb-chip-x:hover, .style-active-x:hover {
  color: #f7e3a6 !important;
  background: rgba(214,178,96,.18) !important;
}
/* ===================  黑金虚影标签层 · 结束  =================== */

/* ===================== 立绘舞台（角色大立绘展示） ===================== */
/* 顶栏「立绘」开关（与缩放控件同排） */
.top-action-btn {
  display: inline-flex; align-items: center; gap: 5px; height: var(--ctl-h-tool); padding: 0 11px;
  border: 1px solid var(--wechat-line); border-radius: var(--r-sm); background: #fff; color: #444;
  font-size: 12.5px; cursor: pointer; flex: 0 0 auto;
}
.top-action-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.top-action-btn:hover { border-color: rgba(15,138,95,.5); color: #0c6b48; background: #f5fff9; }
.top-action-btn.active { border-color: var(--wechat-green); color: #0c6b48; background: #eafef3; box-shadow: inset 0 0 0 1px rgba(15,138,95,.35); }

/* 舞台容器：固定在聊天列左下角（跟随侧栏收放）。整体不接收鼠标，只有名牌/缩略/关闭按钮可点，空白处穿透到背后消息。 */
.sprite-stage {
  position: fixed; left: 310px; bottom: 8px;
  width: clamp(196px, 22vw, 300px); height: min(80vh, 760px);
  pointer-events: none;
  transition: left .32s cubic-bezier(.4,0,.2,1);
}
/* 注意：.sprite-stage 是 position:fixed，本身就会建立层叠上下文——所以可点的缩略条 / 关闭键不能留在它内部（会被输入框盖住点不到），已拆到独立的 .sprite-dock 前景层；这里只承载纯展示的大立绘背景层 */
.sprite-stage.hidden { display: none; }
.app.sidebar-collapsed .sprite-stage { left: 16px; } /* 侧栏收起后左侧整片空出（竖导航 rail 实际未渲染），立绘贴近左缘、仅留少量边距，不再有大片废留白 */
/* 立绘前景交互层：与立绘舞台同位置同尺寸，但独立到前景层（z-index 高于输入框、低于弹窗）。
   原因：.sprite-stage 是 position:fixed → 自成层叠上下文，内部缩略条的 z-index 再高也被困住，
   整个舞台以 z-index:auto 沉在输入框(composer z-index:3)之下，缩略条 / 关闭键被输入框盖住点不到。
   这里只承载可点元素（缩略条、关闭键），立绘大图仍留在舞台背景层、不挡正文。 */
.sprite-dock {
  position: fixed; left: 310px; bottom: 8px;
  width: clamp(196px, 22vw, 300px); height: min(80vh, 760px);
  z-index: 6; pointer-events: none;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 8px 10px;
  transition: left .32s cubic-bezier(.4,0,.2,1);
}
.sprite-dock.hidden { display: none; }
.app.sidebar-collapsed .sprite-dock { left: 16px; }
.sprite-stage-inner {
  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 8px 60px; pointer-events: none; /* 底部多留出底座(缩略条)高度：让立绘上移、与底座分开，不再被压住遮挡 */
}
/* 大立绘本体：填满舞台高度（竖图立绘更大更醒目），横向多余/透明边裁掉；底部对齐、底部柔化淡出；纯视觉不挡点击 */
.sprite-figure {
  flex: 1 1 auto; min-height: 0; width: 100%;
  position: relative; z-index: 1; /* 沉到背景层：低于正文(z2)/输入框(z3)，不挡聊天框 */
  background-repeat: no-repeat; background-position: bottom left; background-size: auto 100%;
  pointer-events: none;
  filter: drop-shadow(0 14px 26px rgba(0,0,0,.30));
  -webkit-mask-image: linear-gradient(to bottom, #000 92%, transparent);
  mask-image: linear-gradient(to bottom, #000 92%, transparent);
  animation: spriteIn .42s cubic-bezier(.2,.7,.3,1);
}
@keyframes spriteIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
/* 没立绘时的兜底：放大头像 / 文字方块 */
.sprite-figure.no-img {
  flex: 0 0 auto; height: 240px; max-height: 46vh; width: min(100%, 210px); margin: 0 auto;
  background-size: cover; background-position: center; border-radius: var(--r-lg);
  display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 46px;
  background-color: #678f7c; box-shadow: 0 12px 28px rgba(0,0,0,.24);
  -webkit-mask-image: none; mask-image: none; filter: none;
}
/* 名牌：可点击打开角色设定 */
.sprite-name {
  pointer-events: auto; align-self: center; margin-top: 8px; max-width: 100%;
  display: inline-flex; flex-direction: column; align-items: center; gap: 1px;
  border: 0; cursor: pointer; background: rgba(20,22,28,.66); color: #fff;
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
  padding: 5px 15px; border-radius: var(--r-pill); font-size: 13.5px; line-height: 1.25;
  box-shadow: 0 5px 16px rgba(0,0,0,.2);
}
.sprite-name:hover { background: rgba(20,22,28,.82); }
.sprite-name-text { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 210px; }
.sprite-name-hint { font-size: 10.5px; font-weight: 600; color: #ffd9a8; }
/* 关闭按钮：常显半透明（移动端 / 触屏无 hover 也能看见、点得到），悬停立绘前景层 .sprite-dock 时高亮。
   注意：关闭键 DOM 在 .sprite-dock（见 03-roles-render），并不在 .sprite-stage 内，故 hover 选择器必须用 .sprite-dock，
   旧的 .sprite-stage:hover 永远命不中（且 .sprite-stage 还是 pointer-events:none），导致关闭键一直不可见。 */
.sprite-close {
  pointer-events: auto; position: absolute; top: 6px; right: 8px; bottom: auto; z-index: 40; width: 24px; height: 24px;
  display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.16);
  background: rgba(20,22,28,.5); color: #fff; cursor: pointer;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: .55; transition: opacity .15s ease; box-shadow: 0 2px 8px rgba(0,0,0,.22);
}
.sprite-dock:hover .sprite-close { opacity: 1; }
.sprite-close svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; }
/* 群聊成员缩略条：点选切换大图 */
.sprite-thumbs {
  pointer-events: auto; position: relative; z-index: 40; align-self: center; display: flex; gap: 6px; margin-top: 9px;
  max-width: 100%; flex-wrap: wrap; justify-content: center;
  background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
  padding: 6px; border-radius: var(--r-md); box-shadow: 0 5px 16px rgba(0,0,0,.13);
}
.sprite-thumb {
  width: 34px; height: var(--ctl-h); border-radius: var(--r-sm); cursor: pointer; padding: 0; overflow: hidden;
  border: 2px solid transparent; background-size: cover; background-position: center; background-color: #678f7c;
  color: #fff; font-weight: 700; font-size: 12px; display: grid; place-items: center;
  opacity: .82; transition: transform .12s ease, opacity .12s ease, border-color .12s ease;
}
.sprite-thumb.image-avatar { color: transparent; }
.sprite-thumb:hover { transform: translateY(-2px); opacity: 1; }
.sprite-thumb.active { border-color: var(--wechat-green); opacity: 1; box-shadow: 0 0 0 2px rgba(15,138,95,.25); }
.sprite-thumb:not(.has-sprite) { filter: grayscale(.45); }

/* 角色编辑器：立绘上传预览 */
.role-edit-sprite-wrap { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 12px; align-items: stretch; }
.sprite-prev {
  width: 96px; height: 132px; border-radius: var(--r-sm); border: 1px dashed #c9c9d2; background: #f3f3f6;
  background-size: cover; background-position: center; display: grid; place-items: center;
  color: #9a9aa5; font-size: 12px; cursor: pointer; overflow: hidden;
}
.sprite-prev.has-img { border-style: solid; border-color: #d8d8e0; color: transparent; }
.role-edit-sprite-side { min-width: 0; display: flex; flex-direction: column; gap: 8px; justify-content: center; }
.role-edit-voice-wrap { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.role-edit-voice-name { font-size: 12px; color: var(--muted); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.role-edit-voice-name.has-voice { color: var(--jade-ink); }

/* 角色介绍面板里的立绘控件（任意角色都能加，入口显眼） */
.ri-sprite-bar { display: flex; gap: 12px; align-items: center; margin-top: 10px; padding: 10px; border: 1px solid #ececf0; border-radius: var(--r-md); background: #fafafb; }
.ri-sprite-prev {
  width: 70px; height: 96px; flex: 0 0 auto; border-radius: var(--r-sm); border: 1px dashed #c9c9d2; background: #f0f0f3;
  background-size: cover; background-position: center; display: grid; place-items: center;
  color: #9a9aa5; font-size: 12px; cursor: pointer; overflow: hidden;
}
.ri-sprite-prev.has-img { border-style: solid; border-color: var(--wechat-green); color: transparent; }
.ri-sprite-side { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.ri-sprite-label { font-weight: 700; font-size: 13.5px; color: var(--text); }
.ri-sprite-hint { font-size: 11.5px; color: var(--muted); line-height: 1.55; }
.ri-sprite-btns { display: flex; gap: 8px; margin-top: 2px; }

/* 标签选择器：按分类分组 */
.cc-pool-group { margin-top: 6px; }
.cc-pool-cat { font-size: 10.5px; color: #8a9790; font-weight: 700; margin: 2px 0 3px; }

/* 素材库：按标签筛选条 */
.character-tag-filter { display: flex; flex-direction: column; gap: 5px; margin: 4px 0 10px; }
.character-tag-filter.hidden { display: none; }
.ctf-active-bar { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #0c6b48; }
.ctf-clear { border: 1px solid #cfe9db; background: #eafef3; color: #0c6b48; border-radius: var(--r-pill); padding: 2px 10px; font-size: 12px; cursor: pointer; }
.ctf-clear:hover { background: #d6efe0; }
.ctf-row { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.ctf-cat { font-size: 11px; color: #9aa7a0; font-weight: 700; min-width: 56px; flex: 0 0 auto; }
.ctf-chip { border: 1px solid #e2e7e4; background: #fff; color: #5a6b63; border-radius: var(--r-pill); padding: 3px 11px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.ctf-chip:hover { border-color: #9fd8ba; background: #f5fff9; }
.ctf-chip.active { color: #0c6b48; background: #d6efe0; border-color: #6fc69e; font-weight: 600; }

/* ===== 模型选择：自定义可搜索下拉 ===== */
.model-combo { position: relative; min-width: 0; }
.model-combo > input { width: 100%; padding-right: 36px; }
.model-caret {
  position: absolute; right: 5px; top: 50%; transform: translateY(-50%);
  width: 28px; height: var(--ctl-h-micro); display: grid; place-items: center;
  border: 0; background: transparent; color: #8a8a8a; cursor: pointer; border-radius: var(--r-xs);
}
.model-caret:hover { background: rgba(0,0,0,.06); color: #333; }
.model-caret svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; }
/* 下拉比输入框宽：左对齐展开，按内容自适应宽度（长模型名能放下），上限再换行兜底 */
.model-dropdown {
  position: absolute; left: 0; right: auto; top: calc(100% + 6px); z-index: 80;
  min-width: 100%; width: max-content; max-width: min(560px, 82vw);
  background: #fff; border: 1px solid var(--wechat-line); border-radius: var(--r-md);
  box-shadow: 0 14px 40px rgba(0,0,0,.18); padding: 8px; display: flex; flex-direction: column; gap: 6px;
  max-height: 380px;
}
.model-dropdown.hidden { display: none; }
.model-dd-search input {
  width: 100%; height: var(--ctl-h); border: 1px solid var(--wechat-line); border-radius: var(--r-sm);
  padding: 0 11px; font-size: 13px; background: #fafafa; box-sizing: border-box;
}
.model-dd-search input:focus { border-color: var(--wechat-green); background: #fff; outline: none; }
.model-dd-head { font-size: 11.5px; color: var(--muted); padding: 0 2px; }
.model-dd-list { overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; gap: 2px; min-height: 0; }
.model-dropdown .model-dd-item {
  display: block; width: 100%; min-width: 0; text-align: left; border: 0; background: transparent; padding: 8px 10px; border-radius: var(--r-sm);
  font-size: 13px; color: #333; cursor: pointer; min-height: 0;
  white-space: normal; overflow-wrap: anywhere; word-break: break-all; line-height: 1.45;
  font-family: var(--mono);
}
.model-dropdown .model-dd-item:hover { background: var(--jade-softer, #f1f8f3); background: color-mix(in srgb, var(--wechat-green) 10%, transparent); color: var(--wechat-green-dark, #0b6e4a); }
/* 选中态：半透明淡底 + 左侧实心色条 + 右侧 ✓，文字深主题色加粗——清晰标识"选中哪个"，绝不实心遮挡文字（半透明随主题自适应：樱粉=淡粉、翡翠=淡绿）。 */
.model-dropdown .model-dd-item.active { background: var(--jade-soft, #e7f4ec); background: color-mix(in srgb, var(--wechat-green) 16%, transparent); color: var(--wechat-green-dark, #0b6e4a); font-weight: 700; box-shadow: inset 3px 0 0 var(--wechat-green); }
.model-dropdown .model-dd-item.active::after { content: '✓'; float: right; margin-left: 8px; color: var(--wechat-green); font-weight: 700; }
.model-dropdown .model-dd-custom { color: #0a7c43; font-family: var(--sans); font-style: italic; }
.model-dd-empty { font-size: 12.5px; color: var(--muted); padding: 10px; text-align: center; }

/* 立绘改为「左侧背景浮层」：出现 / 消失都不再推动正文或输入框（不让位、不挤压、不变窄），
   聊天框位置与宽度始终稳定；立绘置于内容下层当装饰，正文 / 气泡 / 输入框正常浮在其上。 */
@media (max-width: 1180px) { .sprite-stage { left: 280px; } .sprite-dock { left: 280px; } }
/* 中小屏（<=900px）：浮动布局空间不足，立绘舞台自动隐藏，避免挤占 / 遮挡正文；顶栏开关也一并隐藏（按不出来等于没用） */
@media (max-width: 900px) { .sprite-stage { display: none; } .sprite-dock { display: none; } #spriteStageToggle { display: none; } }

/* ============ BGM · AI 配乐 迷你播放器 ============ */
.bgm-player {
  position: fixed;
  right: 18px;
  top: 64px;
  z-index: 33;
  width: 300px;
  max-width: calc(100vw - 36px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "disc main" "status status";
  gap: 6px 12px;
  align-items: center;
  padding: 14px;
  color: #fff;
  font-family: var(--sans);
  background: linear-gradient(160deg, rgba(30,34,40,.93), rgba(17,19,23,.95));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--r-lg);
  box-shadow: 0 18px 52px rgba(0,0,0,.42);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transition: width .2s ease, padding .2s ease, background .2s ease, bottom .2s ease;
}
/* 发言条已移到右下角 dock，播放器放到右上角，不再随群聊上移 */
.bgm-player.bgm-with-groupbar { top: 64px; bottom: auto; }
.bgm-disc {
  grid-area: disc;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  flex: none;
  position: relative;
  cursor: pointer;
  background:
    repeating-radial-gradient(circle at 50% 50%, #242424 0 2px, #151515 2px 4px),
    radial-gradient(circle at 50% 50%, #2b2b2b, #0b0b0b);
  box-shadow: 0 6px 20px rgba(0,0,0,.45), inset 0 0 1px 1px rgba(255,255,255,.06);
  animation: bgm-spin 9s linear infinite;
  animation-play-state: paused;
}
.bgm-player.bgm-playing .bgm-disc { animation-play-state: running; }
.bgm-cover {
  position: absolute;
  inset: 16px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 38%, #2bd07e, #0a8f53) center/cover no-repeat;
  box-shadow: 0 0 0 2px rgba(0,0,0,.5), inset 0 0 8px rgba(0,0,0,.35);
}
.bgm-disc-hole {
  position: absolute;
  left: 50%; top: 50%;
  width: 8px; height: 8px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: #ededed;
  box-shadow: 0 0 0 2px rgba(0,0,0,.45);
}
.bgm-player.bgm-need-tap .bgm-disc { box-shadow: 0 0 0 3px rgba(43,208,126,.55), 0 6px 20px rgba(0,0,0,.45); }
.bgm-player.bgm-picking .bgm-disc::after {
  content: "";
  position: absolute; inset: -4px;
  border-radius: 50%;
  border: 2px solid rgba(43,208,126,.6);
  animation: bgm-pulse 1.3s ease-out infinite;
}
@keyframes bgm-spin { to { transform: rotate(360deg); } }
@keyframes bgm-pulse { 0% { transform: scale(.92); opacity: .85; } 100% { transform: scale(1.28); opacity: 0; } }

.bgm-main { grid-area: main; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.bgm-title { color: #fff; font-weight: 600; font-size: 13px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bgm-sub { color: rgba(255,255,255,.6); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bgm-lyric { color: #7fe7b6; font-size: 12px; min-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bgm-progress { display: flex; flex-direction: column; gap: 4px; }
.bgm-bar { height: 5px; border-radius: 3px; background: rgba(255,255,255,.16); cursor: pointer; position: relative; overflow: hidden; }
.bgm-bar-fill { height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, #2bd07e, #13b9c9); transition: width .15s linear; }
.bgm-time { font-size: 11px; color: rgba(255,255,255,.5); }
.bgm-controls { display: flex; align-items: center; gap: 6px; }
.bgm-btn {
  width: 32px; height: var(--ctl-h-tool); min-width: 32px; min-height: var(--ctl-h-tool);
  padding: 0; border-radius: 50%;
  color: #eee; background: rgba(255,255,255,.08);
  flex: none;
}
.bgm-btn:hover { background: rgba(255,255,255,.2); }
.bgm-btn svg { width: 16px; height: 16px; }
.bgm-play { width: 38px; height: 38px; min-width: 38px; color: #043a23; background: linear-gradient(135deg, #2bd07e, #06ad56); }
.bgm-play:hover { background: linear-gradient(135deg, #36da89, #07c160); }
.bgm-ic-fill svg, .bgm-play svg { fill: currentColor; stroke: none; }
.bgm-vol { flex: 1; min-width: 38px; height: 4px; -webkit-appearance: none; appearance: none; background: rgba(255,255,255,.18); border-radius: 3px; padding: 0; }
.bgm-vol::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #2bd07e; cursor: pointer; }
.bgm-vol::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: #2bd07e; cursor: pointer; }
.bgm-status { grid-area: status; font-size: 11px; color: rgba(255,255,255,.5); min-height: 14px; line-height: 1.3; word-break: break-all; }

.bgm-search { display: none; }
.bgm-search.show { display: block; }
.bgm-search-row { display: flex; gap: 6px; }
.bgm-search-input { height: var(--ctl-h-sm); background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.14); }
.bgm-search-input::placeholder { color: rgba(255,255,255,.4); }
.bgm-results { max-height: 168px; overflow-y: auto; margin-top: 6px; display: flex; flex-direction: column; gap: 2px; }
.bgm-result { width: 100%; height: auto; min-height: 0; justify-content: space-between; gap: 8px; padding: 6px 8px; border-radius: var(--r-sm); color: #eee; background: transparent; }
.bgm-result:hover { background: rgba(255,255,255,.1); }
.bgm-result-name { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bgm-result-artist { font-size: 11px; color: rgba(255,255,255,.5); flex: none; max-width: 42%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.bgm-player.bgm-collapsed {
  grid-template-columns: auto;
  grid-template-areas: "disc";
  width: auto;
  padding: 0;
  gap: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.bgm-player.bgm-collapsed .bgm-main,
.bgm-player.bgm-collapsed .bgm-status { display: none; }
.bgm-player.bgm-collapsed .bgm-disc { width: 58px; height: 58px; box-shadow: 0 8px 24px rgba(0,0,0,.5); }

@media (max-width: 640px) {
  .bgm-player { right: 10px; bottom: 150px; width: 264px; padding: 12px; }
  .bgm-player.bgm-with-groupbar { bottom: 214px; }
  .bgm-player.bgm-collapsed .bgm-disc { width: 50px; height: 50px; }
}
/* 设置弹窗：滑块 + 数字 组合控件（像酒馆，能拖能填） */
.slider-field .slider-row { display: flex; align-items: center; gap: 10px; }
.slider-field input[type="range"] {
  flex: 1 1 auto; min-width: 0; height: var(--ctl-h-micro); padding: 0; margin: 0;
  accent-color: var(--wechat-green); background: transparent; cursor: pointer;
}
.slider-field .slider-num {
  flex: 0 0 96px; width: 96px; text-align: center;
  font-variant-numeric: tabular-nums;
}
.settings-section .field.slider-field { margin-bottom: 10px; }

/* 工具栏「配乐」按钮点开播放器时的高亮提示 */
@keyframes bgmAttn { 0%, 100% { box-shadow: 0 18px 52px rgba(0,0,0,.42); } 50% { box-shadow: 0 0 0 4px var(--jade-ring), 0 18px 52px rgba(0,0,0,.42); } }
.bgm-player.bgm-attn { animation: bgmAttn .5s ease-in-out 3; }

/* ============ 自定义聊天背景（图床 / 视频床直链）============ */
/* 全屏背景层置于聊天画布之下（z-index:-1，在 body 画布之上、.app 之下）。侧栏不透明，所以背景只在聊天区显示——和微信一致。 */
#chatBgLayer { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; display: none; }
body.has-chat-bg #chatBgLayer { display: block; }
#chatBgLayer #chatBgImg,
#chatBgLayer #chatBgVideo {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: none; will-change: transform;
}
#chatBgLayer #chatBgScrim { position: absolute; inset: 0; background: #000; opacity: 0; transition: opacity .2s ease; }

/* 开了自定义背景时，让聊天画布透出底层背景（侧栏 / 顶栏 / 输入框卡片仍保持自己的底色） */
body.has-chat-bg .app { background: transparent; }
body.has-chat-bg .chat { background: transparent; }
body.has-chat-bg .messages { background: transparent; }

/* —— 背景图模式：气泡/iframe 保持原白底（不动），仅确保正文为锐利黑（不再发灰） —— */
body.has-chat-bg .bubble-content { color: #141414; }
body.has-chat-bg .bubble-content .rp-dia,
body.has-chat-bg .bubble-content .rp-quote { color: #243a63; }

/* 背景设置弹窗 */
.chatbg-modal { width: min(560px, calc(100vw - 28px)); }
.chatbg-modal .seg:disabled { opacity: .45; cursor: not-allowed; }
.chatbg-examples { display: flex; gap: 8px; flex-wrap: wrap; }
.chatbg-ex {
  flex: 0 0 auto; height: var(--ctl-h-sm); padding: 0 12px; border-radius: var(--r-pill);
  border: 1px solid var(--wechat-line); background: #fff; color: #3a463e;
  font-size: 12.5px; cursor: pointer; white-space: nowrap;
}
.chatbg-ex:hover { border-color: rgba(15,138,95,.5); color: #0c6b48; background: #f1fbf5; }
.chatbg-types { display: flex; gap: 16px; flex-wrap: wrap; }
.chatbg-types label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #444; cursor: pointer; }
.chatbg-types input { width: auto; height: auto; accent-color: var(--wechat-green); }
.chatbg-preview {
  position: relative; width: 100%; height: 168px; border-radius: var(--r-md); overflow: hidden;
  border: 1px solid var(--wechat-line); display: grid; place-items: center;
  background: repeating-conic-gradient(#eceff0 0% 25%, #f7f9f8 0% 50%) 50% / 22px 22px;
}
.chatbg-preview img,
.chatbg-preview video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: none; }
.chatbg-preview #chatBgPreviewScrim { position: absolute; inset: 0; background: #000; opacity: 0; }
.chatbg-preview-hint {
  position: relative; z-index: 2; font-size: 12.5px; color: #5b625c;
  background: rgba(255,255,255,.82); padding: 5px 12px; border-radius: var(--r-pill); text-align: center; max-width: 90%;
}
.chatbg-preview-hint:empty { display: none; }
.chatbg-slider { display: grid; grid-template-columns: 64px 1fr 48px; align-items: center; gap: 10px; margin-bottom: 8px; }
.chatbg-slider label { color: var(--muted); font-size: 12px; }
.chatbg-slider input[type="range"] { width: 100%; height: 24px; accent-color: var(--wechat-green); padding: 0; }
.chatbg-slider .chatbg-val { font-variant-numeric: tabular-nums; font-size: 12px; color: #2b3a30; text-align: right; }

/* ============ 整站换肤 · 主题配色（覆盖 :root 变量，全站 var() 自动跟随） ============ */
/* 默认 jade 见 :root；以下为其它配色，仅改主色 / 强调 / 气泡，保持浅色底，安全不破版 */
:root[data-theme="rose"] {
  --wechat-green: #d6568f; --wechat-green-dark: #b83f76;
  --jade: #d6568f; --jade-dark: #b83f76; --jade-ink: #b23a70;
  --jade-soft: #fdeaf2; --jade-softer: #fef4f8;
  --jade-line: rgba(214,86,143,.30); --jade-ring: rgba(214,86,143,.45);
  --bubble-me: #f6d6e6;
}
:root[data-theme="ocean"] {
  --wechat-green: #1f86c9; --wechat-green-dark: #1668a3;
  --jade: #1f86c9; --jade-dark: #1668a3; --jade-ink: #176191;
  --jade-soft: #e6f3fb; --jade-softer: #f1f8fd;
  --jade-line: rgba(31,134,201,.30); --jade-ring: rgba(31,134,201,.45);
  --bubble-me: #cfe8f7;
}
:root[data-theme="amber"] {
  --wechat-green: #d98324; --wechat-green-dark: #b86a14;
  --jade: #d98324; --jade-dark: #b86a14; --jade-ink: #9a5b12;
  --jade-soft: #fbefe0; --jade-softer: #fdf7ee;
  --jade-line: rgba(217,131,36,.30); --jade-ring: rgba(217,131,36,.45);
  --bubble-me: #f6e2c4;
}
:root[data-theme="violet"] {
  --wechat-green: #7a5cf0; --wechat-green-dark: #6446d6;
  --jade: #7a5cf0; --jade-dark: #6446d6; --jade-ink: #5b40c4;
  --jade-soft: #efebfe; --jade-softer: #f6f4fe;
  --jade-line: rgba(122,92,240,.30); --jade-ring: rgba(122,92,240,.45);
  --bubble-me: #e3dafb;
}
:root[data-theme="ink"] {
  --wechat-green: #2f7d72; --wechat-green-dark: #225f57;
  --jade: #2f7d72; --jade-dark: #225f57; --jade-ink: #245f56;
  --jade-soft: #e6f1ef; --jade-softer: #f1f7f5;
  --jade-line: rgba(47,125,114,.30); --jade-ring: rgba(47,125,114,.45);
  --bubble-me: #c9e6df;
}

/* 主题选择器（聊天背景 / 外观弹窗内） */
.theme-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.theme-swatch {
  display: inline-flex; align-items: center; gap: 7px;
  height: var(--ctl-h); min-height: var(--ctl-h); padding: 0 12px 0 9px;
  border: 1.5px solid var(--wechat-line); border-radius: var(--r-pill);
  background: var(--surface); color: var(--text); cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.theme-swatch:hover { transform: translateY(-1px); }
.theme-swatch-dot { width: 16px; height: 16px; border-radius: 50%; background: var(--sw, #0f8a5f); box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); flex: none; }
.theme-swatch-name { font-size: 13px; }
.theme-swatch.active { border-color: var(--sw, var(--wechat-green)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sw, #0f8a5f) 22%, transparent); }

/* ============ 消息气泡出现动效（仅新消息，避开全量重渲重播） ============ */
@keyframes msgIn { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
.msg.msg-enter .bubble { animation: msgIn .34s cubic-bezier(.22,.7,.3,1) both; }
@media (prefers-reduced-motion: reduce) { .msg.msg-enter .bubble { animation: none; } }

/* ============ 立绘动效：入场带翻转浮现，之后持续轻微上下浮动（呼吸感，幅度很小不晃眼）。 ============ */
@keyframes spriteFloatIn {
  0%   { opacity: 0; transform: translateY(26px) scale(.955) rotateY(-18deg); }
  55%  { opacity: 1; transform: translateY(-9px) scale(1.022) rotateY(5deg); }
  78%  { transform: translateY(2px) scale(.997) rotateY(-1.5deg); }
  100% { opacity: 1; transform: translateY(0) scale(1) rotateY(0); }
}
/* 呼吸感升级：上下浮动 + 极轻微缩放 + 极轻微摇摆，多层次叠加，幅度都很小不晃眼，让立绘像活着在呼吸 */
@keyframes spriteIdleFloat {
  0%, 100% { transform: translateY(0) scale(1) rotate(0deg); }
  25%      { transform: translateY(-5px) scale(1.008) rotate(.5deg); }
  50%      { transform: translateY(-9px) scale(1.015) rotate(0deg); }
  75%      { transform: translateY(-5px) scale(1.008) rotate(-.5deg); }
}
.sprite-figure.has-img {
  transform-origin: bottom center;
  animation: spriteFloatIn .6s cubic-bezier(.2,.8,.3,1.05) both, spriteIdleFloat 5.4s ease-in-out .8s infinite;
}
/* 立绘切换缩略条（单角色多张）：横排小图，当前张高亮 */
.sprite-variant-thumbs .sprite-thumb { background-size: cover; background-position: top center; }
@media (prefers-reduced-motion: reduce) { .sprite-figure.has-img { animation: none; } }

/* ============ 隐藏使用说明 / 提示语（保留功能性动态读数：API 状态、资源统计、预览报错） ============ */
.settings-section p,
.pm-hint, .ctx-hint, .pm-blank-note, .ab-note, .up-hint, .qr-hint, .quick-hint,
.lt-hint, .mem-bank-hint, .graph-foot-hint, .quick-foot-hint, .sprite-name-hint,
.pme-id-hint, .tag-save-hint { display: none !important; }
#globalResStat { display: block !important; }

/* ===================================================================== */
/* ===== 群聊发言条：横排在「输入框下方」，让文本框占满整行 ===== */
/* 之前发言条占据 composer 右侧一整列，把文本框挤得很窄。改为：文本框独占整行、
   发言条以一条横排（手动/轮流/AI · 成员 · 让TA说）落在文本框下方。这里统一覆盖前面分散的多套 #groupBar 规则。 */
.composer-body { grid-template-columns: 1fr !important; gap: 8px !important; }
#groupBar.group-bar {
  position: static;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center;
  align-self: auto;
  width: 100%;
  height: auto;
  min-height: 0;
  gap: 6px 8px;
  padding: 7px 10px;
  margin: 0;
  border: 1px solid #e6e6e6;
  border-radius: var(--r-md);
  background: #fafafa;
  box-shadow: none;
  overflow: visible;
}
#groupBar .group-mode { flex: 0 0 auto; }
#groupBar .group-speakers {
  display: flex !important;
  grid-template-columns: none !important;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  max-height: none;
  overflow: visible;
}
#groupBar .group-speaker-chip { width: auto !important; max-width: 170px; }
#groupBar .group-go-btn { width: auto !important; flex: 0 0 auto; padding: 0 18px; }
#groupBar .group-bar-hint.show { flex-basis: 100%; order: 9; text-align: left; }

/* ===== 人物介绍：多立绘缩略列表 + 多段语音列表 ===== */
.ri-sprite-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ri-sprite-thumb {
  position: relative; width: 44px; height: 58px; border-radius: var(--r-sm);
  background-size: cover; background-position: top center; border: 1px solid var(--wechat-line, #e2e2e6);
}
.ri-sprite-thumb.is-cover { border-color: var(--wechat-green, #0f8a5f); box-shadow: 0 0 0 1px rgba(15,138,95,.25); }
.ri-thumb-del {
  position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%;
  border: none; background: rgba(20,22,28,.78); color: #fff; font-size: 11px; line-height: 1; cursor: pointer;
  display: grid; place-items: center;
}
/* 立绘语音·多段 MP3 列表：.ri-voice-list=角色介绍面板，.rev-list=角色编辑器，统一制式 */
.ri-voice-list, .rev-list { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }
.ri-voice-list .rev-row, .rev-list .rev-row { display: flex; align-items: center; gap: 6px; font-size: 12px; padding: 3px 6px; border: 1px solid var(--wechat-line, #eee); border-radius: var(--r-sm); background: var(--surface, #fff); }
.ri-voice-list .rev-name, .rev-list .rev-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted, #555); }
.ri-voice-list .rev-icon, .rev-list .rev-icon { flex: 0 0 auto; width: 28px; min-width: 28px; height: 26px; padding: 0; text-align: center; }
.ri-voice-list .rev-empty, .rev-list .rev-empty { font-size: 12px; color: var(--muted, #999); padding: 6px 2px; }
.ri-voice-mode, .rev-mode { margin-top: 8px; font-size: 12px; color: var(--muted, #666); display: flex; align-items: center; gap: 6px; }
.ri-voice-mode select, .rev-mode select { font-size: 12px; padding: 2px 6px; border-radius: var(--r-xs); border: 1px solid var(--wechat-line, #ddd); }

/* ===== 右下角 dock：全局状态 + 选人控制板（集中放右下角，不再占输入区） ===== */
.right-dock {
  position: fixed; right: 16px; bottom: 92px; z-index: 8;
  width: clamp(220px, 22vw, 290px);
  display: flex; flex-direction: column; gap: 8px;
  max-height: 56vh; overflow-y: auto; overflow-x: hidden;
  /* 容器自身穿透点击：群聊时右下 dock 与底部发送区 / 超级框右侧重叠，卡片之间的空隙不再挡住输入与按钮 */
  pointer-events: none;
}
.right-dock.speaker-menu-open { overflow: visible; }
/* 仅卡片 / 控件本体接收点击；容器留白与卡片间隙让点击穿透到背后的 composer */
.right-dock > * { pointer-events: auto; }
.right-dock.hidden { display: none; }
.status-dock:empty { display: none; }
.right-dock .world-state-bar { order: 1; }
.right-dock #groupBar.group-bar { order: 2; }
.right-dock .status-dock { order: 3; }
.right-dock .status-panel { margin: 0; font-size: 12.5px; box-shadow: 0 8px 24px rgba(35,55,45,.12); }
.right-dock .status-panel-body { max-height: min(30vh, 260px); }
.right-dock .status-grid { grid-template-columns: 1fr; }
/* 世界状态条（时间/日期/天气/地点）移到右侧 dock 顶部：做成与「当前状态」一致的卡片，pill 自动换行 */
.right-dock .world-state-bar { margin: 0; padding: 10px 12px; gap: 7px; background: var(--surface-2, #fbfbfa); border: 1px solid var(--wechat-line, rgba(0,0,0,.12)); border-radius: var(--r-md, 12px); box-shadow: 0 8px 24px rgba(35,55,45,.12); }
.right-dock .world-state-bar .wsb-pill { font-size: 12px; }
/* dock 内发言条：竖排紧凑（覆盖输入框底座那套横排规则） */
.right-dock #groupBar.group-bar { width: 100% !important; flex-direction: column !important; align-items: stretch; gap: 6px; padding: 8px; box-shadow: 0 8px 24px rgba(35,55,45,.12); }
.right-dock #groupBar .group-speakers { flex-direction: column !important; }
.right-dock #groupBar .group-speaker-chip { width: 100% !important; max-width: none; }
.right-dock #groupBar .group-go-btn { width: 100% !important; }
.group-speaker-picker { position: relative; width: 100%; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.group-speaker-current { width: 100%; min-height: 36px; display: flex; align-items: center; gap: 8px; padding: 5px 8px 5px 5px; border: 1px solid #d9e7de; border-radius: var(--r-md); background: linear-gradient(180deg, #fbfffc, #f4fbf7); color: #1f3d2d; cursor: pointer; text-align: left; }
.group-speaker-current:hover { border-color: rgba(15,138,95,.46); background: #f5fff9; }
.group-speaker-current-main { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 1px; }
.group-speaker-current-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; line-height: 1.2; }
.group-speaker-current-main small { font-size: 10.5px; color: var(--muted); line-height: 1.2; }
.group-speaker-caret { flex: 0 0 auto; color: #6d8a79; font-size: 14px; transition: transform .18s ease; }
.group-speaker-picker.open .group-speaker-caret { transform: rotate(180deg); }
.group-speaker-menu { position: absolute; left: 0; right: 0; bottom: calc(100% + 6px); z-index: 28; width: 100%; display: flex; flex-direction: column; gap: 6px; padding: 7px; border: 1px solid #dfe8e2; border-radius: var(--r-md); background: #fff; box-shadow: 0 14px 34px rgba(35,55,45,.18), inset 0 1px 0 rgba(255,255,255,.8); }
.group-speaker-search { width: 100%; min-height: 30px; border: 1px solid var(--wechat-line); border-radius: var(--r-sm); padding: 5px 9px; font-size: 12px; background: #fafafa; }
.group-speaker-search:focus { outline: none; border-color: var(--wechat-green, #0f8a5f); box-shadow: 0 0 0 2px rgba(15,138,95,.1); background: #fff; }
.group-speaker-options { display: flex; flex-direction: column; gap: 5px; max-height: 220px; overflow-y: auto; overscroll-behavior: contain; }
.group-speaker-option { width: 100%; min-height: 30px; display: flex; align-items: center; gap: 7px; padding: 4px 8px 4px 4px; border: 1px solid #edf0ee; border-radius: var(--r-sm); background: #fff; color: #344138; text-align: left; cursor: pointer; }
.group-speaker-option:hover { border-color: rgba(15,138,95,.38); background: #f5fff9; }
.group-speaker-option.active { border-color: rgba(15,138,95,.6); background: #eafff2; color: #0c6b48; font-weight: 650; }
.group-speaker-option-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.group-speaker-empty { padding: 10px 6px; color: var(--muted); font-size: 12px; text-align: center; }
.composer-mid { align-items: stretch; gap: 7px; }
.composer-mid .composer-quick,
.composer #superComposerBar.sc-bar {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 8px;
  border: 1px solid rgba(15,138,95,.12);
  border-radius: var(--r-md);
  background: rgba(255,255,255,.68);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.composer-mid .composer-quick::before,
.composer #superComposerBar.sc-bar::before {
  flex: 0 0 auto;
  min-width: 34px;
  padding: 2px 7px;
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--jade-ink, #0c6b48) 10%, #fff);
  color: var(--jade-ink, #0c6b48);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}
.composer-mid .composer-quick::before { content: "发言"; }
.composer #superComposerBar.sc-bar::before { content: "创作"; }
.composer-mid .composer-quick { flex-wrap: wrap; }
.composer #superComposerBar.sc-bar { flex-wrap: nowrap; }
.composer #superComposerBar .sc-libs { flex: 1 1 auto; min-width: 0; }
.composer-mid .composer-quick > .quick-btn,
.composer-mid .composer-quick .quick-wrap > .quick-btn,
.composer #superComposerBar .sc-btn {
  min-height: 30px;
}
@media (max-width: 900px) {
  .right-dock { position: static; right: auto; bottom: auto; width: 100%; max-height: none; margin: 8px 0; }
}
/* 去掉左下角的「界面版本 / 部署新版自动提示刷新」小标记（用户要求；它 z-index 极高还会挡住立绘缩略条点击） */
#buildStamp { display: none !important; }
/* 右下角 dock 下拉贴底（音乐已移到右上角，不再冲突），避免右下角留大片空白 */
.right-dock { bottom: 16px; }

/* ===== 第1批·产品体验审计 P0-1/P0-2：移动端 safe-area 安全区 + 顶栏触屏可达 ===== */
/* safe-area：刘海屏 / 底部手势条不遮挡（桌面端 env() 为 0，无副作用） */
.composer { padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
.chat-topbar { padding-top: env(safe-area-inset-top, 0px); }
/* 顶栏触屏把手：桌面隐藏（继续靠 hover 露顶栏）；触屏设备常显入口，点击滑出 / 收起顶栏工具条 */
#topbarPeekFab, #mobileSettingsFab { display: none; }
@media (max-width: 1024px), (hover: none) and (pointer: coarse) {
  #topbarPeekFab, #mobileSettingsFab {
    display: inline-flex; align-items: center; justify-content: center;
    position: fixed; top: calc(8px + env(safe-area-inset-top, 0px)); z-index: 40;
    width: 44px; height: 44px; padding: 0; border-radius: var(--r-md);
    border: 1px solid var(--wechat-line, #e2e2e2);
    background: rgba(255,255,255,.92); color: var(--jade-ink, #0c6b48);
    box-shadow: 0 2px 10px rgba(0,0,0,.12); cursor: pointer;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  }
  #topbarPeekFab { right: 10px; }
  #mobileSettingsFab {
    right: 62px;
    width: auto;
    min-width: 68px;
    gap: 5px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 650;
  }
  #topbarPeekFab:active, #mobileSettingsFab:active { transform: scale(.94); }
  .chat-topbar.peek { box-shadow: 0 10px 28px rgba(0,0,0,.16); }
  /* P0-3 软键盘：输入区随键盘抬起，避免被遮挡（--kb-inset 由 src/14 visualViewport 写入） */
  .composer { transform: translateY(calc(-1 * var(--kb-inset, 0px))); transition: transform .18s ease; }
}

/* ============================================================
   微信（日间） · data-theme="wechat"
   严格还原 SillyTavern「WeChat_White」主题：微信聊天灰底 #ededed、
   对方纯白气泡、我方微信绿气泡 #9EEA6A、5px 圆角、去阴影、黑色正文、
   #7397F2 对话/引用蓝、灰色昵称。映射到本前端 .msg/.bubble 结构，并在
   还原基础上保留头像 / Markdown / 出现动画等本前端增强（做得更精致）。
   ============================================================ */
:root[data-theme="wechat"] {
  /* 强调色：微信官方绿（按钮 / 链接 / 进度 / 选中态） */
  --wechat-green: #07c160; --wechat-green-dark: #06ad56;
  --jade: #07c160; --jade-dark: #06ad56; --jade-ink: #07a352;
  --jade-soft: #e7f8ef; --jade-softer: #f2fbf6;
  --jade-line: rgba(7,193,96,.30); --jade-ring: rgba(7,193,96,.42);
  /* 气泡：原版微信绿 + 纯白 */
  --bubble-me: #9eea6a; --bubble-ai: #ffffff;
  /* 背景：微信聊天灰（chat_tint #ededed）、顶/底栏同灰、会话栏纯白 */
  --wechat-bg: #ededed; --wechat-panel: #ededed; --wechat-line: #dadada;
  --sidebar: #ffffff; --canvas: #ededed;
  --surface: #ffffff; --surface-2: #f5f5f5; --surface-3: #ededed;
  /* 文本：原版纯黑正文（main_text_color）+ 微信灰次级 */
  --text: #131313; --muted: #8a8a8a; --quiet: #b2b2b2;
}

/* —— 聊天画布：跟随 --chat-canvas（纯白），去掉微信灰 —— */
:root[data-theme="wechat"] .messages { background: var(--chat-canvas); }

/* —— 气泡：5px 圆角、无边框、无阴影（还原原版 noShadows）—— */
:root[data-theme="wechat"] .bubble {
  border: none;
  border-radius: 5px;
  box-shadow: none;
  padding: 9px 13px;
}
/* 对方（AI）纯白气泡 + 白色尖角 */
:root[data-theme="wechat"] .msg.assistant .bubble { background: #ffffff; border: none; }
:root[data-theme="wechat"] .msg.assistant .bubble::before { border-right-color: #ffffff; }
/* 我方（用户）微信绿气泡 + 绿色尖角（覆盖默认浅绿渐变）*/
:root[data-theme="wechat"] .msg.user .bubble { background: #9eea6a; border: none; }
:root[data-theme="wechat"] .msg.user .bubble::after { border-left-color: #9eea6a; }
/* 规划 / 作者卡气泡：维持功能样式，仅去阴影统一观感 */
:root[data-theme="wechat"] .msg.plan .bubble { box-shadow: none; }

/* —— 正文：微信锐利纯黑、系统无衬线、贴近微信字号（统一压黑，杜绝对话/斜体发浅发蓝）—— */
:root[data-theme="wechat"] .bubble-content {
  color: #0a0a0a;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.62;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
:root[data-theme="wechat"] .msg.user .bubble-content { color: #0a0a0a; }
/* 斜体 / 对话 / 引用 / 强调：统一锐利黑，仅靠字形与字重区分，不再用浅蓝灰染浅 */
:root[data-theme="wechat"] .bubble-content em { color: #1a1a1a; font-style: italic; }
:root[data-theme="wechat"] .bubble-content strong { color: #000000; font-weight: 700; }
:root[data-theme="wechat"] .bubble-content .rp-dia,
:root[data-theme="wechat"] .bubble-content .rp-quote { color: #0a0a0a; font-weight: 500; }

/* —— 群聊 / 我方昵称：微信灰色小字 —— */
:root[data-theme="wechat"] .speaker-name { color: #9a9a9a; font-weight: 600; }
:root[data-theme="wechat"] .msg.user .speaker-name.protagonist-name { color: #9a9a9a; }

/* —— 头像：微信圆角方块、无阴影 —— */
:root[data-theme="wechat"] .msg .avatar { border-radius: 5px; box-shadow: none; }

/* —— 日期分割：微信居中灰字 —— */
:root[data-theme="wechat"] .dayline { color: #aaaaaa; }

/* —— 微信群聊渲染小组件（.wxr-*）：我方气泡同步微信绿，保持一致 —— */
:root[data-theme="wechat"] .wxr-bubble.me { background: #9eea6a; color: #11210a; }

/* —— 功能按钮微信美术适配：扁平、方正小圆角、纯微信绿、锐利黑字 —— */
/*    覆盖发送区工具键 .quick-btn（续写/快捷/剧情/角色变量/作者注）、.composer-mini（调控/提取）、超级整理面板 .sc-btn */
:root[data-theme="wechat"] #superComposerBar .sc-badge { background: #07c160; }
:root[data-theme="wechat"] #superComposerBar .sc-btn,
:root[data-theme="wechat"] .composer .quick-btn,
:root[data-theme="wechat"] .composer .composer-mini,
:root[data-theme="wechat"] .composer .scroll-bottom-btn,
:root[data-theme="wechat"] .composer .protagonist-control > button {
  border-radius: 5px;
  border: 1px solid #d6d8d6;
  background: #ffffff;
  color: #1a1a1a;
  font-weight: 500;
  box-shadow: none;
}
:root[data-theme="wechat"] #superComposerBar .sc-btn:hover,
:root[data-theme="wechat"] .composer .quick-btn:hover,
:root[data-theme="wechat"] .composer .composer-mini:hover,
:root[data-theme="wechat"] .composer .scroll-bottom-btn:hover,
:root[data-theme="wechat"] .composer .protagonist-control > button:hover {
  border-color: #07c160; background: #f2fbf6; color: #06ad56;
}
:root[data-theme="wechat"] #superComposerBar .sc-btn.sc-on,
:root[data-theme="wechat"] .composer .quick-btn.active {
  border-color: #07c160; background: #e7f8ef; color: #06ad56; font-weight: 600;
}
:root[data-theme="wechat"] .sc-panel { border-radius: var(--r-sm); }
:root[data-theme="wechat"] .sc-row { border-radius: 5px; }
:root[data-theme="wechat"] .sc-group-title { color: #06ad56; }
/* 主发送按钮：微信纯绿、方正小圆角 */
:root[data-theme="wechat"] .composer button.primary {
  background: #07c160; border-radius: var(--r-xs); box-shadow: none;
}
:root[data-theme="wechat"] .composer button.primary:hover { background: #06ad56; }

/* ============ 空会话上手引导（首次 / 无会话时的可点击三步引导，跟随主题变量自动换色） ============ */
.onboard { max-width: 520px; margin: 7vh auto 0; padding: 4px 8px 40px; }
.onboard-head { text-align: center; margin-bottom: 22px; }
.onboard-title { font-size: 22px; font-weight: 800; color: var(--text); letter-spacing: .3px; }
.onboard-sub { margin-top: 8px; font-size: 13.5px; color: var(--muted); line-height: 1.6; }
.onboard-steps { display: flex; flex-direction: column; gap: 12px; }
.onboard-step {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px;
  background: var(--surface); border: 1px solid var(--wechat-line);
  border-radius: var(--r-md, 14px); box-shadow: var(--shadow-sm, 0 2px 8px rgba(0,0,0,.06));
  transition: border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.onboard-step:hover { border-color: var(--jade-ring); box-shadow: var(--shadow-md, 0 8px 24px rgba(0,0,0,.1)); transform: translateY(-1px); }
.onboard-step.is-done { background: var(--jade-softer, #f1f8f3); }
.onboard-badge {
  flex: 0 0 auto; width: 30px; height: var(--ctl-h-sm); border-radius: 50%;
  display: grid; place-items: center; font-weight: 800; font-size: 14px;
  background: var(--wechat-green); color: #fff;
}
.onboard-step.is-done .onboard-badge { background: var(--jade-ink, #0c6b48); }
.onboard-step-main { flex: 1 1 auto; min-width: 0; }
.onboard-step-title { font-weight: 700; font-size: 14.5px; color: var(--text); }
.onboard-step-desc { margin-top: 3px; font-size: 12.5px; color: var(--muted); line-height: 1.55; }
.onboard-btn {
  flex: 0 0 auto; min-height: 38px; padding: 0 16px; border-radius: var(--r-pill, 999px);
  font-size: 13.5px; font-weight: 600; background: var(--wechat-green); color: #fff;
  border: 0; cursor: pointer; white-space: nowrap; transition: filter .15s ease, background .15s ease;
}
.onboard-btn:hover { filter: brightness(1.05); }
.onboard-btn.ghost { background: transparent; color: var(--jade-ink, #0c6b48); border: 1px solid var(--wechat-line); }
.onboard-btn.ghost:hover { background: var(--jade-softer, #f1f8f3); border-color: var(--jade-ring); }

/* 侧栏会话列表空态：可点击「从素材库添加」 */
.side-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 30px 16px; color: var(--muted); font-size: 13px; text-align: center; }
.side-empty-btn { min-height: var(--ctl-h); padding: 0 14px; border-radius: var(--r-pill, 999px); font-size: 13px; font-weight: 600; background: var(--wechat-green); color: #fff; border: 0; cursor: pointer; }
.side-empty-btn:hover { filter: brightness(1.05); }

@media (max-width: 760px) {
  .onboard { margin-top: 4vh; padding-bottom: 24px; }
  .onboard-step { gap: 10px; padding: 12px; }
  .onboard-btn { padding: 0 12px; font-size: 13px; }
}

/* ============ 移动端触控目标放大（≥40px 更易点） ============ */
@media (max-width: 760px) {
  .drawer-toggle { width: 40px; height: var(--ctl-h-lg); min-width: 40px; min-height: var(--ctl-h-lg); }
}

/* ============================================================
   移动端体验增强（手机专属，桌面端在媒体查询/无触摸下无副作用）
   覆盖：去点击灰块高亮 · iOS 聚焦防缩放 · 触控目标放大 · 滚动隔离
   ============================================================ */
/* 去掉移动端点击时出现的灰色高亮方块（桌面无触摸，无影响） */
* { -webkit-tap-highlight-color: transparent; }

@media (max-width: 760px) {
  /* iOS Safari：输入框字号 < 16px 时，聚焦会自动放大整页 —— 统一抬到 16px 杜绝缩放跳动 */
  #userInput,
  .composer textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select, textarea {
    font-size: 16px;
  }

  /* 聊天滚动区：iOS 惯性滚动 + 滚到顶/底不连带整页（避免误触浏览器下拉刷新/回弹） */
  .messages {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  /* 输入区快捷按钮（续写 / 快捷 / 剧情 / 角色变量 / 作者注…）放大，手指更好按 */
  .composer .quick-btn { min-height: 36px; padding: 7px 13px; font-size: 13px; }
  .composer-mini { min-height: 44px; }
  .composer button.primary { min-height: 44px; }
  .scroll-bottom-btn { min-height: 32px; padding: 5px 12px; }
}

/* ============================================================
   移动端·字号放大（正文 / 控件大一档，看着更舒适）
   ============================================================ */
@media (max-width: 760px) {
  :root { --ctl-fz: 14px; --ctl-fz-sm: 13px; }
  .bubble-content { font-size: 16px; line-height: 1.7; }
  .speaker-name { font-size: 13px; }
  .dayline { font-size: 12.5px; }
}

/* ============================================================
   移动端·立绘展示（窄屏不再隐藏）
   桌面是左侧大竖条；手机改为「右下角氛围立绘」：沉在正文下层、
   pointer-events 穿透，不挡阅读与输入；关闭键/缩略条仍可点。
   JS(renderSpriteStage) 本就会在窄屏注入内容，这里只恢复显示并重新定位。
   ============================================================ */
@media (max-width: 760px) {
  /* 恢复顶栏「立绘」开关（≤900px 曾被隐藏） */
  #spriteStageToggle { display: inline-flex; }
  /* 舞台(背景大图) + dock(前景可点层) 一起从左侧竖条改为右下角中小立绘
     注：.hidden 特异性更高，关闭后仍能正常隐藏，不受这里影响 */
  .sprite-stage, .sprite-dock {
    display: flex;
    left: auto; right: 0; top: auto;
    width: min(46vw, 178px);
    height: min(48vh, 330px);
    bottom: calc(150px + env(safe-area-inset-bottom, 0px));
  }
  .sprite-figure { background-position: bottom right; }
  .sprite-stage-inner { padding: 0 2px 6px; }
  .sprite-thumbs { max-width: 100%; padding: 4px; gap: 4px; }
  .sprite-thumb { width: 30px; height: 30px; }
  .sprite-close { width: 28px; height: 28px; opacity: .72; }
}

/* ============================================================
   第九十五批 · 手机端体验层优化（≤760px，纯 CSS 叠加层，可整段回退）
   针对截图：底部控件直接漂浮在背景图上显零碎、控件偏小、立绘缩略条压住输入区。
   仅作用窄屏；桌面与既有交互、JS 不受影响。
   ============================================================ */
@media (max-width: 760px) {

  /* —— 1) 底部输入区聚拢：给 composer 一层毛玻璃底板，把零散按钮收进一个面板里，
        不再直接漂浮在聊天背景图上（截图"杂乱漂浮"的主因）。桌面果冻态(>760px transparent)不受影响。 —— */
  .composer {
    background: color-mix(in srgb, var(--wechat-panel) 88%, transparent);
    -webkit-backdrop-filter: blur(12px) saturate(1.1);
    backdrop-filter: blur(12px) saturate(1.1);
    border-top: 1px solid var(--wechat-line);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -4px 18px rgba(20, 30, 25, .10);
    gap: 10px;
  }
  .composer-row { gap: 8px; }

  /* —— 2) 触控目标补到 ≥34–40px、相邻间距 ≥8px（向 Material 48dp / WCAG 44px 靠拢）—— */
  .msg-action-btn { min-height: 34px; min-width: 34px; padding: 0 11px; }
  .msg-action-btn svg { width: 16px; height: 16px; }
  .msg-action-btn span { font-size: 12px; }
  .msg-foot { gap: 10px; }
  .msg-actions { gap: 8px; }
  .scroll-bottom-btn { min-height: 36px; padding: 7px 14px; }
  .protagonist-mini-btn { width: 30px; height: 30px; }
  .composer-quick { gap: 8px; }
  /* 超级框 8 库按钮：用 #superComposerBar 前缀提高特异性，稳覆盖 JS 注入的 .sc-btn */
  #superComposerBar .sc-btn { min-height: 38px; padding: 7px 12px; }

  /* —— 3) 立绘缩略条 / 关闭键放大（关闭键误触代价高，优先放大）；缩略条上移，避免压在输入区 / 群聊条上 —— */
  .sprite-thumb { width: 40px; height: 40px; }
  .sprite-close { width: 36px; height: 36px; opacity: .82; }
  .sprite-dock { bottom: calc(178px + env(safe-area-inset-bottom, 0px)); }
  .sprite-figure { opacity: .92; }
}

/* ============ 消息长按操作面板（手机端 ActionSheet · 第九十九批）============ */
/* 长按聊天气泡 → 底部弹出「重新生成 / 编辑 / 复制 / 分支 / 删除」，替代手机上密集的小按钮。
   仅触摸设备触发（见 src/03 末尾），桌面保留常驻 .msg-action-btn 不受影响。 */
.msg-sheet-overlay {
  position: fixed;
  inset: 0;
  z-index: 9990;
  background: rgba(0, 0, 0, .42);
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
}
.msg-sheet-overlay.show { opacity: 1; visibility: visible; }
.msg-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9991;
  max-width: 680px;
  margin: 0 auto;
  background: color-mix(in srgb, var(--surface, #ffffff) 90%, transparent);
  -webkit-backdrop-filter: blur(20px) saturate(1.3);
  backdrop-filter: blur(20px) saturate(1.3);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -10px 34px rgba(0, 0, 0, .22);
  padding: 6px 10px calc(10px + env(safe-area-inset-bottom, 0px));
  transform: translateY(101%);
  transition: transform .28s cubic-bezier(.22, 1, .36, 1);
}
.msg-sheet-overlay.show .msg-sheet { transform: translateY(0); }
.msg-sheet-grip {
  width: 38px;
  height: 4px;
  border-radius: 3px;
  background: rgba(140, 140, 140, .45);
  margin: 8px auto 6px;
}
.msg-sheet-preview {
  font-size: 12.5px;
  color: var(--text-dim, #8a8a8a);
  line-height: 1.5;
  margin: 2px 8px 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.msg-sheet-list { display: flex; flex-direction: column; gap: 2px; }
.msg-sheet-btn {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 15.5px;
  color: var(--text, #1c1c1c);
  border-radius: 12px;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  transition: background .14s ease;
}
.msg-sheet-btn:active { background: rgba(0, 0, 0, .08); }
.msg-sheet-btn svg {
  width: 21px;
  height: 21px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.msg-sheet-btn.danger { color: var(--danger, #e94f4f); }

.msg-sheet-sep { height: 1px; background: rgba(128, 128, 128, .16); margin: 5px 12px; }
.msg-sheet-cancel {
  justify-content: center;
  font-weight: 600;
  margin-top: 4px;
  background: rgba(128, 128, 128, .12);
}

/* ============ 手机端输入区折叠（第一百批）：两排工具默认收起，⊕ 展开 ============ */
/* 痛点：底部「主角条 + 5 个快捷键（续写/叙事/角色变量/作者注…）+ 8 个超级库键（剧情推进/全局变量/
   小知识库/快捷指令/文本大纲/编剧主角…）+ 输入行」全部常驻堆在一起，把聊天内容遮掉大半，手机上没法用。
   方案：手机端默认只留「⊕ + 输入框 + 发送」，点 ⊕ 才从底部展开工具网格；桌面端横向空间足够，⊕ 隐藏、工具照常平铺。
   注：#superComposerBar 的 display 被 src/15 注入的 CSS（#superComposerBar.sc-bar，特异性 1,1,0）控制，
   故收起/展开都带 .sc-bar 把特异性提到 1,2,0 / 1,3,0 稳稳压过。纯 CSS + 一个开关，不动任何按钮的现有 DOM 与事件。 */
.composer-tools-toggle { display: none; }

@media (max-width: 760px) {
  /* —— 默认收起两排工具 —— */
  .composer .composer-quick { display: none; }
  .composer #superComposerBar.sc-bar { display: none; }

  /* ⊕ 进了 composer-row（基础是 grid 两列 1fr auto），手机端补成三列容纳「⊕ + 输入框 + 发送组」，
     否则三个 grid item 挤两列会把发送组挤到第二行、输入行错乱（桌面端 ⊕ display:none 不占单元，不受影响）。 */
  .composer .composer-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; }

  /* —— ⊕ 切换按钮（输入行左侧）—— */
  .composer-tools-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    align-self: flex-end;
    width: 42px;
    height: 42px;
    margin-bottom: 1px;
    padding: 0;
    border: none;
    border-radius: 13px;
    background: var(--jade-soft, #e7f8ef);
    color: var(--jade-ink, #07a352);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .24s cubic-bezier(.22, 1, .36, 1), background .15s ease;
  }
  .composer-tools-toggle svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .composer-tools-toggle:active { background: var(--jade-line, rgba(7, 193, 96, .3)); }

  /* —— 展开态：⊕ 转成 ×，两排工具显示为可滚动网格面板 —— */
  .composer.tools-open .composer-tools-toggle {
    transform: rotate(135deg);
    background: var(--jade-line, rgba(7, 193, 96, .32));
  }
  .composer.tools-open .composer-quick,
  .composer.tools-open #superComposerBar.sc-bar {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 8px;
    width: 100%;
    padding: 6px 2px;
  }
  /* 注意：这里绝不能加 overflow / max-height —— 超级库点击弹出的 .sc-panel 是 absolute + bottom:100%
     向上溢出（src/15），祖先一旦有 overflow 就会把它裁掉、面板看不全。工具就十来个，自然高度 flex-wrap 即可。 */
  .composer.tools-open #superComposerBar.sc-bar {
    border-top: 1px solid rgba(128, 128, 128, .14);
    margin-top: 2px;
    padding-top: 8px;
  }
  /* 展开后每个工具键够大好点（≥40px），整齐成网格 */
  .composer.tools-open .composer-quick .quick-btn,
  .composer.tools-open #superComposerBar .sc-btn {
    min-height: 40px;
  }
}