/* 聊天框页：顶栏 / 消息气泡 / 底栏 / 通话页 / 消息菜单 / 弹层（原 index.html 第 1912-2814 行） */

/* ============================================================
   聊天框页：顶栏 / 消息区 / 底栏（输入行 + 功能行）
   ============================================================ */
.talk-view{
  background:var(--bg);
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
/* 顶栏透明：能透出下面的壁纸 */
.talk-head{
  flex:0 0 auto;
  position:relative;
  display:flex; align-items:center; gap:2px;
  padding:var(--head-top) 10px 5px;
  border-bottom:none;
  background:transparent;
}
.talk-head .back-btn,
.talk-head .icon-btn{
  width:36px; height:36px;
  min-width:36px; min-height:36px;
  flex:0 0 auto;
}
.talk-head .back-btn svg{ width:20px; height:20px; }
/* 报错记录挪到返回键右边；右侧那组图标靠 margin-left:auto 顶到最右 */
.talk-head .talk-err-btn{ margin-right:2px; }
.talk-err-btn svg{ width:19px; height:19px; }
.talk-head .talk-calllog-btn{ margin-left:auto; }
.talk-title{
  /* 顶栏上内边距含了状态栏安全区，标题要在「安全区以下」的那段里居中，所以往下补一半安全区 */
  position:absolute; left:50%; top:calc(50% + var(--sat) / 2);
  transform:translate(-50%,-50%);
  /* 左边返回 + 报错、右边三个图标，留出两侧各 120px 才不会压到图标上 */
  max-width:calc(100% - 240px);
  text-align:center;
  font-size:15.5px; font-weight:600;
  margin:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  pointer-events:none;
}
/* 顶栏右侧图标：离线长文本 / 更多 */
.talk-more svg{ width:20px; height:20px; }
.talk-offline-btn svg{ width:19px; height:19px; }
.talk-offline-btn.on{ color:var(--accent); }
.talk-calllog-btn svg{ width:19px; height:19px; }

/* ============ 通话页（语音 / 视频，全屏覆盖层） ============ */
.call-screen{
  position:absolute; inset:0;
  z-index:96;
  display:none;
  flex-direction:column;
  background:#141418;
  color:#fff;
  padding-top:env(safe-area-inset-top);
  overflow:hidden;
}
.call-screen.show{ display:flex; animation:viewIn .3s var(--ease-out) both; }
.call-screen.video::before{
  content:'';
  position:absolute; inset:0;
  background:var(--call-bg) center/cover no-repeat;
  filter:blur(28px) brightness(.45);
  transform:scale(1.15);
  z-index:0;
}
.call-screen > *{ position:relative; z-index:1; }
.call-head{
  flex:0 0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px 0;
}
.call-mode-tag{
  font-size:12px; color:rgba(255,255,255,.7);
  background:rgba(255,255,255,.12);
  padding:5px 12px; border-radius:999px;
}
.call-mini-btn{
  width:38px; height:38px;
  border:none; border-radius:50%;
  background:rgba(255,255,255,.12); color:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.call-mini-btn svg{ width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.call-hero{
  flex:0 0 auto;
  display:flex; flex-direction:column; align-items:center;
  padding:22px 20px 10px;
}
.call-avatar, .call-avatar-initial{
  width:96px; height:96px; border-radius:32px;
  object-fit:cover;
  box-shadow:0 14px 34px rgba(0,0,0,.4);
}
.call-avatar-initial{
  display:flex; align-items:center; justify-content:center;
  background:#2A2A32; color:#fff;
  font-size:38px; font-weight:600;
}
.call-screen.ringing .call-avatar,
.call-screen.ringing .call-avatar-initial{ animation:callPulse 1.6s ease-in-out infinite; }
@keyframes callPulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.05); }
}
.call-name{ margin-top:14px; font-size:19px; font-weight:600; }
.call-status{
  margin-top:5px;
  font-size:13px; color:rgba(255,255,255,.62);
  font-variant-numeric:tabular-nums;
}
.call-body{
  flex:1; min-height:0;
  overflow-y:auto;
  padding:8px 20px 12px;
  display:flex; flex-direction:column; gap:10px;
}
.call-body::-webkit-scrollbar{ width:0; }
.call-line{
  font-size:14.5px; line-height:1.65;
  color:rgba(255,255,255,.92);
  word-break:break-word; white-space:pre-wrap;
  animation:msgIn .3s var(--ease-out) both;
  cursor:pointer;
  border-radius:10px;
  padding:2px 4px;
  margin:0 -4px;
}
.call-line.me{ color:rgba(255,255,255,.62); text-align:right; }
.call-line b{ font-weight:600; opacity:.7; margin-right:6px; font-size:12.5px; }
.call-line.ta b{ margin-right:6px; }
.call-line.editable:active{ background:rgba(255,255,255,.08); }
.call-line .call-voice-mark{
  display:inline-block; margin-left:6px; font-size:11px; opacity:.55; vertical-align:middle;
}
.call-line .call-tr-btn{
  margin-left:8px; font-size:11px; line-height:1; padding:3px 8px; border-radius:20px;
  border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.1); color:inherit;
  opacity:.8; cursor:pointer; vertical-align:middle;
}
.call-line .call-trans{
  margin-top:4px; font-size:12.5px; opacity:.75; border-top:1px dashed rgba(255,255,255,.25); padding-top:4px;
}
.call-line .call-trans.doing{ opacity:.5; }
.call-line.aside{
  align-self:center;
  text-align:center;
  font-size:12.5px; font-style:italic;
  color:rgba(255,255,255,.55);
  background:rgba(255,255,255,.08);
  padding:6px 14px; border-radius:12px;
}
.call-line.sys{ align-self:center; font-size:12px; color:rgba(255,255,255,.45); }
.call-empty{
  margin:auto; text-align:center;
  font-size:13px; color:rgba(255,255,255,.4);
  line-height:1.8;
}
.call-typing{ display:flex; gap:4px; padding:4px 0; }
.call-typing span{
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,.6);
  animation:typingDot 1.1s ease-in-out infinite;
}
.call-typing span:nth-child(2){ animation-delay:.16s; }
.call-typing span:nth-child(3){ animation-delay:.32s; }
@keyframes typingDot{ 0%,80%,100%{ opacity:.3; transform:translateY(0); } 40%{ opacity:1; transform:translateY(-3px); } }
.call-foot{
  flex:0 0 auto;
  padding:10px 16px calc(16px + env(safe-area-inset-bottom));
  display:flex; flex-direction:column; gap:12px;
}
.call-input-row{ display:flex; align-items:flex-end; gap:8px; }
.call-input{
  flex:1; min-width:0;
  border:none; outline:none; resize:none;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-family:inherit; font-size:14.5px; line-height:1.5;
  padding:11px 14px;
  border-radius:18px;
  max-height:96px;
}
.call-input::placeholder{ color:rgba(255,255,255,.4); }
.call-act-btn{
  flex:0 0 auto;
  height:42px; padding:0 15px;
  border:none; border-radius:999px;
  background:rgba(255,255,255,.14); color:#fff;
  font-family:inherit; font-size:13.5px; font-weight:500;
  cursor:pointer;
  transition:transform .18s var(--spring), background .18s;
}
.call-act-btn:active{ transform:scale(.94); }
.call-act-btn.primary{ background:#fff; color:#0B0B0F; }
.call-edit-input{
  display:block; width:calc(100% - 32px); margin:4px 16px 0;
  box-sizing:border-box; min-height:96px; resize:vertical;
  border:none; border-radius:14px; padding:12px 14px;
  background:var(--fill); color:var(--ink);
  font:14.5px/1.6 inherit;
}
.call-btn-row{ display:flex; align-items:center; justify-content:center; gap:46px; }
.call-round{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  border:none; background:transparent; color:rgba(255,255,255,.8);
  font-family:inherit; font-size:12px;
  cursor:pointer;
}
.call-round i{
  width:62px; height:62px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.14);
  transition:transform .18s var(--spring);
}
.call-round:active i{ transform:scale(.92); }
.call-round i svg{ width:28px; height:28px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.call-round.hang i{ background:var(--danger); }
.call-round.answer i{ background:#34C759; }
.call-screen.ringing .call-input-row{ display:none; }
.call-screen.ringing .call-body{ display:none; }
.call-screen.ringing .call-hero{ flex:1; justify-content:center; }
.call-screen:not(.incoming) .call-round.answer{ display:none; }
.call-screen:not(.incoming) .call-round.reject{ display:none; }
.call-screen.incoming .call-round.hang{ display:none; }

/* 群聊通话：多头像 */
.call-avatars{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  max-width:280px;
}
.call-avatars .call-av{
  width:56px; height:56px; border-radius:18px;
  object-fit:cover;
  box-shadow:0 8px 20px rgba(0,0,0,.35);
  background:#2A2A32;
}
.call-avatars .call-av.me{
  box-shadow:0 0 0 2px rgba(52,199,89,.7), 0 8px 20px rgba(0,0,0,.35);
}
.call-screen.ringing .call-avatars .call-av{ animation:callPulse 1.6s ease-in-out infinite; }
.call-screen.group .call-hero .call-avatar,
.call-screen.group .call-hero > .call-avatar-initial{ display:none; }
.call-joined-tip{
  margin-top:8px;
  font-size:11.5px; color:rgba(255,255,255,.5);
  text-align:center; max-width:280px; line-height:1.5;
}

/* 群聊邀请面板 */
.gcall-pick{
  display:flex; flex-direction:column; gap:8px;
  max-height:42vh; overflow-y:auto;
  margin-bottom:4px;
}
.gcall-pick::-webkit-scrollbar{ width:0; }
.gcall-pick-item{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  border:none; border-radius:14px;
  background:var(--bg);
  font-family:inherit; font-size:14px; color:var(--ink);
  text-align:left; cursor:pointer;
}
.gcall-pick-item img{
  width:36px; height:36px; border-radius:50%; object-fit:cover; flex:0 0 auto;
}
.gcall-pick-item span{ flex:1; min-width:0; font-weight:500; }
.gcall-pick-item i{
  width:22px; height:22px; border-radius:50%;
  border:1.5px solid var(--hairline);
  flex:0 0 auto;
  font-style:normal;
}
.gcall-pick-item.on i{
  border-color:var(--tint);
  background:var(--tint);
  box-shadow:inset 0 0 0 4px var(--bg);
}

/* 缩小后的小窗：右上角悬浮 */
.call-mini{
  position:absolute;
  top:calc(58px + env(safe-area-inset-top)); right:12px;
  z-index:95;
  display:none;
  align-items:center; gap:8px;
  padding:6px 12px 6px 6px;
  border:none; border-radius:999px;
  background:#141418; color:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.28);
  cursor:pointer;
  font-family:inherit;
  touch-action:none;user-select:none;-webkit-user-select:none;
}
.call-mini.show{ display:flex; }
.call-mini img, .call-mini .call-mini-ico, .call-mini .call-mini-initial{
  width:34px; height:34px; border-radius:50%;
  object-fit:cover;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.14);
  font-size:14px; font-weight:600;
}
.call-mini .call-mini-ico svg{ width:18px; height:18px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.call-mini.ringing .call-mini-ico,
.call-mini.ringing img, .call-mini.ringing .call-mini-initial{ animation:callPulse 1.4s ease-in-out infinite; }
.call-mini-text{ display:flex; flex-direction:column; line-height:1.25; }
.call-mini-text b{ font-size:12px; font-weight:600; max-width:90px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.call-mini-text span{ font-size:11px; color:rgba(255,255,255,.62); font-variant-numeric:tabular-nums; }

/* 聊天框里的通话卡片 */
.msg-call{ display:flex; align-items:center; gap:10px; min-width:150px; cursor:pointer; }
.msg-call svg{ width:20px; height:20px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.msg-call span{ font-size:13.5px; }
.msg-call small{ display:block; font-size:11px; opacity:.6; margin-top:2px; }

/* 通话记录页 */
.calllog-tabs{ display:flex; gap:3px; margin:14px 0 12px; background:var(--fill); border-radius:14px; padding:3px; }
#callLogList{ overflow-anchor:none; }
.calllog-item{ margin:0 0 10px; background:var(--fill); border-radius:20px; overflow:hidden; }
.calllog-head{
  display:flex; align-items:center; gap:12px;
  width:100%;
  padding:14px 16px;
  border:none; background:transparent;
  font-family:inherit; text-align:left;
  cursor:pointer;
}
.calllog-ico{
  width:36px; height:36px; border-radius:12px; flex:0 0 auto;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
}
.calllog-ico svg{ width:18px; height:18px; fill:none; stroke:var(--ink); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.calllog-item.missed .calllog-ico svg{ stroke:var(--danger); }
.calllog-word{ flex:1; min-width:0; }
.calllog-word b{ display:block; font-size:14px; font-weight:500; }
.calllog-word span{ display:block; font-size:11.5px; color:var(--gray-2); margin-top:3px; }
.calllog-arrow{ width:16px; height:16px; flex:0 0 auto; fill:none; stroke:var(--gray-2); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.calllog-item.open .calllog-arrow{ transform:rotate(90deg); }
.calllog-lines{ display:none; padding:2px 16px 14px; }
.calllog-item.open .calllog-lines{ display:block; }
.calllog-line{ font-size:13px; line-height:1.65; color:var(--ink); padding:4px 0; white-space:pre-wrap; word-break:break-word; }
.calllog-line + .calllog-line{ box-shadow:inset 0 1px 0 rgba(11,11,15,.05); }
.calllog-line b{ font-weight:600; color:var(--gray-1); margin-right:6px; }
.calllog-line.aside{ color:var(--gray-1); font-style:italic; text-align:center; }
.calllog-line.none{ color:var(--gray-2); text-align:center; }
.calllog-empty{ text-align:center; font-size:13px; color:var(--gray-2); line-height:1.8; padding:40px 20px; }

/* 表情包分组多选 */
.stk-pick{ display:flex; flex-wrap:wrap; gap:8px; padding:6px 16px 14px; }
.stk-pick button{
  border:none; border-radius:999px;
  background:var(--bg); color:var(--gray-1);
  font-family:inherit; font-size:12.5px; font-weight:500;
  padding:7px 13px;
  cursor:pointer;
}
.stk-pick button.on{ background:var(--ink); color:var(--on-ink); }
.stk-pick .stk-none{ font-size:12px; color:var(--gray-2); padding:4px 0; }

/* 消息区 */
.talk-body{
  flex:1; min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overflow-anchor:none;
  overscroll-behavior:contain;
  padding:18px 16px 10px;
  display:flex; flex-direction:column; gap:14px;
  background:transparent;
}
.talk-body::-webkit-scrollbar{ width:0; }
/* 时间戳：两条消息相隔 5 分钟以上时出现（.msg-day 为旧别名，兼容自定义 CSS） */
.msg-stamp,
.msg-day{
  align-self:center;
  font-size:11px; color:var(--gray-2);
  background:rgba(var(--tint-rgb),.05);
  padding:4px 12px;
  border-radius:999px;
}
/* 旁白：类似时间戳 / 系统框，居中浅底 */
.msg-aside{
  align-self:center;
  max-width:86%;
  text-align:center;
  font-size:12.5px; color:var(--gray-1);
  line-height:1.65;
  background:rgba(var(--tint-rgb),.06);
  padding:7px 14px;
  border-radius:12px;
  white-space:pre-wrap; word-break:break-word;
  animation:msgIn .3s var(--ease-out) both;
}
.msg-aside.picked{ outline:2px solid var(--ink); }
/* 旁白的译文：紧跟正文，斜体浅色带括号 */
.msg-aside-trans{ display:block; margin-top:3px; font-style:italic; color:var(--gray-2); font-size:12px; }
/* ============ 翻译气泡（聊天设置 → 翻译）：挂在 TA 气泡下方的小气泡 ============ */
.msg-stack{ display:flex; flex-direction:column; align-items:flex-start; gap:5px; max-width:73%; min-width:0; }
.msg.mine .msg-stack{ align-items:flex-end; }
.msg-stack > .msg-who{ margin-bottom:-2px; }   /* 群聊发言人名字紧贴在气泡上方 */
.msg-stack > .msg-quote{ max-width:100%; }
.msg-stack > .msg-bubble{ max-width:100%; }
.msg-stack > .msg-think{ max-width:100%; width:100%; }
.msg-stack > .msg-sticker{ max-width:100%; }
/* 每条气泡下方的发送时间（聊天设置 → 美化 → 显示气泡时间，默认开） */
.msg-time{
  display:block;
  font-size:10.5px; line-height:1.2;
  color:var(--gray-2);
  padding:0 2px;
  user-select:none;
}
.msg.mine .msg-time{ text-align:right; }
.msg-trans{
  position:relative;
  max-width:100%;
  padding:6px 10px 6px 28px;
  border-radius:14px;
  border-top-left-radius:6px;
  font-size:12.5px; line-height:1.55;
  color:var(--sk-trans-ink, var(--gray-1));
  background:var(--sk-trans-bg, rgba(var(--tint-rgb),.045));
  border:1px dashed rgba(var(--tint-rgb),.14);
  white-space:pre-wrap; word-break:break-word;
  animation:msgIn .3s var(--ease-out) both;
  cursor:pointer;
}
.msg-trans.hidden,
.msg-aside-trans.hidden{ display:none; }
.msg-bubble.has-trans{ cursor:pointer; }
.msg-trans svg{
  position:absolute; left:9px; top:7px;
  width:13px; height:13px;
  fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
  opacity:.7;
}
.msg.grp-cont .msg-stack > .msg-bubble{ border-top-left-radius:7px; }
.msg.grp-more .msg-stack > .msg-bubble{ border-bottom-left-radius:7px; }
/* 组内最后一条：底部贴头像侧恢复大圆角（收束），不再沿用中间条的小圆角 */
.msg.grp-cont:not(.grp-more) .msg-stack > .msg-bubble{
  border-bottom-left-radius:var(--sk-talk-radius, 20px);
}
.msg.mine.grp-cont .msg-stack > .msg-bubble{
  border-top-left-radius:var(--sk-talk-radius, 20px);
  border-top-right-radius:7px;
}
.msg.mine.grp-more .msg-stack > .msg-bubble{
  border-bottom-left-radius:var(--sk-talk-radius, 20px);
  border-bottom-right-radius:7px;
}
.msg.mine.grp-cont:not(.grp-more) .msg-stack > .msg-bubble{
  border-bottom-right-radius:var(--sk-talk-radius, 20px);
}
/* 撤回提示：居中一行；点击可展开查看原文 */
.msg-recall{
  align-self:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  max-width:86%;
  font-size:11.5px; color:var(--gray-2);
  padding:3px 12px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  user-select:none;
}
.msg-recall-tip{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.msg-recall-tip i{
  font-style:normal;
  font-size:10.5px;
  opacity:.7;
}
.msg-recall-body{
  margin-top:6px;
  padding:8px 12px;
  max-width:100%;
  border-radius:12px;
  background:rgba(var(--tint-rgb),.07);
  color:var(--gray-1);
  font-size:12.5px;
  line-height:1.55;
  white-space:pre-wrap;
  word-break:break-word;
  text-align:left;
}
.msg-recall-body[hidden]{ display:none; }
.msg-recall-body img{
  display:block;
  max-width:140px;
  max-height:140px;
  border-radius:10px;
  object-fit:contain;
}
.msg-recall-cap{
  display:block;
  margin:0 0 4px;
  font-size:11.5px;
  color:var(--gray-2);
}
/* 线下模式：长篇小说式正文（不走气泡） */
.msg-novel{
  width:100%; max-width:100%;
  padding:16px 18px;
  background:rgba(var(--paper-rgb),.82);
  border-radius:18px;
  font-size:13.5px; line-height:1.9; color:var(--ink);
  white-space:pre-wrap; word-break:break-word;
  text-align:justify;
}
.msg.mine .msg-novel{
  background:rgba(var(--tint-rgb),.05);
  font-style:italic;
}
/* ============ 线下页（独立视图：小说式正文） ============ */
.off-view{
  /* Only .off-body scrolls; native editor focus cannot pan the whole view. */
  overflow:hidden; overflow:clip;
  background-color:var(--sk-off-bg, #F5F1EA);
  background-size:cover; background-position:center;
}
/* 线下壁纸透明度：--sk-off-wp-alpha（0~1，由 js 写入）。
   壁纸本身是 background-image 没法直接调 opacity，改成在壁纸上盖一层「页面底色」，
   底色的不透明度 = 1 - 壁纸透明度；用 ::after 避免与夜间压暗层 ::before 冲突 */
.off-view.has-wallpaper{ position:relative; isolation:isolate; }
.off-view.has-wallpaper::after{
  content:'';
  position:absolute; inset:0;
  background:var(--sk-off-bg, #F5F1EA);
  opacity:calc(1 - var(--sk-off-wp-alpha, 1));
  pointer-events:none;
  z-index:-1;
}
.off-head{
  flex:0 0 auto;
  position:relative;
  display:flex; align-items:center; gap:4px;
  padding:var(--head-top) 10px 8px;          /* --head-top 已含顶部安全区 */
  background:transparent;                    /* 与线上一致：透出壁纸 */
  border-bottom:none;
}
.off-head .back-btn{ flex:0 0 auto; }
/* 标题绝对居中：左边返回键 + 报错记录、右边 3 个功能键，flex:1 会被挤偏，改成和线上聊天页一样绝对定位 */
.off-title{
  position:absolute; left:50%;
  top:var(--head-top); bottom:8px;
  transform:translateX(-50%);
  display:flex; align-items:center; justify-content:center;
  width:calc(100% - 228px);
  max-width:calc(100% - 228px);
  margin:0; text-align:center;
  font-size:15px; font-weight:600; letter-spacing:.02em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  pointer-events:none;
}
/* 报错记录挪到返回键右边；右侧那组图标靠 margin-left:auto 顶到最右 */
.off-head .off-err-btn{ flex:0 0 auto; }
.off-err-btn svg{ width:18px; height:18px; }
.off-head .off-hist-btn{ margin-left:auto; }
.off-head .icon-btn{ width:32px; height:32px; flex:0 0 auto; }
.off-online-btn svg{ width:19px; height:19px; }
.off-set-btn svg{ width:19px; height:19px; }
.off-hist-btn svg{ width:19px; height:19px; }
.off-hist-btn:disabled{ opacity:.4; }
.off-body{
  flex:1; min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:18px 18px 12px;
  display:flex; flex-direction:column; gap:14px;
}
.off-body::-webkit-scrollbar{ width:0; }
.off-empty{
  margin:auto 0;
  padding:26px 22px;
  text-align:center;
  font-size:13px; line-height:1.85; color:var(--gray-1);
  background:rgba(var(--paper-rgb),.7);
  border-radius:20px;
}
.off-empty b{ display:block; margin-bottom:8px; font-size:15px; color:var(--ink); }
/* 正文段：TA 的段落是小说正文，我的段落是斜体动作 */
.off-entry{
  width:100%;
  padding:16px 18px;
  border-radius:var(--sk-off-radius, 18px);
  font-size:var(--sk-off-font, 14px); line-height:1.95; color:var(--sk-off-ink, var(--ink));
  white-space:pre-wrap; word-break:break-word;
  text-align:justify;
  animation:msgIn .3s var(--ease-out) both;
}
.off-entry.off-novel{ background:rgba(var(--paper-rgb),var(--sk-off-alpha, .84)); }
.off-entry.off-me{
  background:rgba(var(--tint-rgb),calc(var(--sk-off-alpha, .84) * .08));
  font-style:italic; color:var(--gray-1);
}
.off-entry.off-writing{ display:flex; align-items:center; min-height:52px; }
.off-entry.off-live{ cursor:pointer; -webkit-tap-highlight-color:transparent; }
/* 段落上方的头像 / 网名：默认隐藏，由美化开关（.off-view 上的 class）控制 */
.off-meta{ display:none; align-items:center; gap:8px; margin-bottom:8px; white-space:normal; font-style:normal; }
.off-view.off-show-avatar .off-meta, .off-view.off-show-name .off-meta{ display:flex; }
.off-meta-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; display:none; background:var(--fill); }
.off-meta-name{ font-size:12px; font-weight:600; color:var(--sk-off-accent, #C0392B); display:none; }
.off-view.off-show-avatar .off-meta-avatar{ display:block; }
.off-view.off-show-name .off-meta-name{ display:inline; }
.off-entry.off-me .off-meta-name{ color:var(--gray-1); }
/* 正文美化：台词 / 心理 / 强调 / 环境 */
.off-say{ font-weight:600; color:var(--sk-off-accent, #C0392B); font-style:normal; }
.off-think{ font-style:italic; color:var(--gray-1); }
.off-em{ font-weight:700; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.off-env{ font-size:12.5px; color:var(--gray-2); }
/* （译：……）→ 台词的译文：括号和内容一起斜体、换色（聊天设置 → 翻译 开启时 TA 会写） */
.off-trans{ font-style:italic; font-weight:400; color:var(--sk-trans-ink, #7A6F9B); }
/* 整段译文：挂在这一段正文下面 */
.off-trans-block{
  margin-top:12px;
  padding:8px 12px;
  border-radius:12px;
  font-size:12.5px; line-height:1.75; font-style:italic; font-weight:400;
  color:var(--sk-trans-ink, var(--gray-1));
  background:var(--sk-trans-bg, rgba(var(--tint-rgb),.045));
  border:1px dashed rgba(var(--tint-rgb),.14);
  white-space:pre-wrap; word-break:break-word;
}
/* 每个楼层：长按 / 右键弹出的操作菜单（复用 .msg-menu 的样式） */
.off-entry.off-picked{ outline:2px solid var(--ink); outline-offset:-2px; }
.off-body.selecting .off-entry{ cursor:pointer; position:relative; padding-left:44px; }
.off-body.selecting .off-entry::before{
  content:'';
  position:absolute; left:14px; top:18px;
  width:19px; height:19px; border-radius:50%;
  border:1.6px solid var(--gray-3);
  background:transparent;
}
.off-body.selecting .off-entry.off-picked::before{
  background:var(--ink); border-color:var(--ink);
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:12px;
}
.off-select-bar{ flex:0 0 auto; }
/* 楼层内联编辑框 */
.off-edit-area{
  width:100%; min-height:120px;
  border:none; outline:none; resize:vertical;
  background:rgba(var(--paper-rgb),.95);
  border-radius:14px;
  padding:12px 14px;
  font-family:inherit; font-size:14px; line-height:1.9; color:var(--ink);
  box-shadow:0 0 0 1.5px var(--ink);
}
.off-edit-acts{ display:flex; gap:8px; justify-content:flex-end; margin-top:8px; }
.off-edit-acts button{
  border:none; border-radius:999px;
  padding:7px 16px;
  font-family:inherit; font-size:12.5px; font-weight:500;
  background:rgba(var(--tint-rgb),.06); color:var(--gray-1);
  cursor:pointer;
}
.off-edit-acts button.primary{ background:var(--ink); color:var(--on-ink); }
/* 回复建议面板：一行一条，完整显示 */
.off-replies{
  display:flex; flex-direction:column; gap:6px;
  animation:msgIn .25s var(--ease-out) both;
}
.off-replies[hidden]{ display:none; }
.off-reply{
  border:none; text-align:left;
  background:rgba(var(--paper-rgb),.9);
  border-radius:14px;
  padding:9px 11px;
  font-family:inherit; font-size:12px; line-height:1.55; color:var(--ink);
  cursor:pointer;
  transition:transform .18s var(--spring);
}
.off-reply:active{ transform:scale(.97); }
.off-reply b{ display:block; font-size:10.5px; color:var(--gray-2); margin-bottom:2px; font-weight:500; }
.off-reply span{
  display:block; white-space:pre-wrap; word-break:break-word;
}
.off-act.on{ background:var(--ink); color:var(--on-ink); }
/* 过往记录卡 */
.off-hist-card{
  background:var(--fill);
  border-radius:18px;
  padding:13px 16px;
  margin-bottom:10px;
}
.off-hist-head{ display:flex; align-items:center; gap:10px; cursor:pointer; }
.off-hist-head b{ flex:1; min-width:0; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.off-hist-head small{ flex:0 0 auto; font-size:11px; color:var(--gray-2); }
.off-hist-body{
  margin-top:10px; padding-top:10px;
  border-top:1px solid var(--hairline);
  font-size:12.5px; line-height:1.85; color:var(--ink);
  white-space:pre-wrap; word-break:break-word;
  max-height:50vh; overflow-y:auto;
}
.off-hist-body[hidden]{ display:none; }
.off-hist-acts{ display:flex; gap:8px; margin-top:10px; }
.off-hist-acts button{
  flex:1; height:34px;
  border:1px solid var(--hairline); border-radius:12px;
  background:var(--bg); color:var(--gray-1);
  font-family:inherit; font-size:12.5px; font-weight:500;
  cursor:pointer;
}
.off-hist-acts button.danger{ color:var(--danger); }
.off-hist-empty{ font-size:12.5px; color:var(--gray-3); text-align:center; padding:40px 0; }
/* 文风预设列表 */
.off-style-row{
  display:flex; align-items:center; gap:8px;
  padding:9px 12px;
  background:var(--bg);
  border-radius:12px;
  margin-bottom:6px;
}
.off-style-row .name{
  flex:1; min-width:0;
  border:none; background:transparent; text-align:left;
  font-family:inherit; font-size:13px; color:var(--ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  cursor:pointer;
}
.off-style-row .sub{ flex:0 0 auto; font-size:11px; color:var(--gray-2); max-width:38%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.off-style-row .del{
  flex:0 0 auto;
  border:none; background:transparent;
  font-family:inherit; font-size:12px; color:var(--danger);
  padding:4px 6px; cursor:pointer;
}
.off-style-row .tag{
  flex:0 0 auto;
  font-size:10px; font-weight:600; color:var(--gray-2);
  padding:2px 7px; border-radius:999px;
  background:rgba(var(--tint-rgb),.06);
}
.off-dots{ display:inline-flex; gap:5px; }
.off-dots span{
  width:6px; height:6px; border-radius:50%;
  background:var(--gray-2);
  animation:offDot 1.1s ease-in-out infinite;
}
.off-dots span:nth-child(2){ animation-delay:.18s; }
.off-dots span:nth-child(3){ animation-delay:.36s; }
@keyframes offDot{ 0%,80%,100%{ opacity:.25; transform:translateY(0); } 40%{ opacity:1; transform:translateY(-3px); } }
/* 底栏：输入行 + 三个动作键（透明，透出壁纸） */
.off-foot{
  flex:0 0 auto;
  padding:8px 12px calc(8px + env(safe-area-inset-bottom));
  display:flex; flex-direction:column; gap:8px;
  background:transparent;
  border-top:none;
}
.off-foot .talk-input{ background:rgba(var(--paper-rgb),.9); max-height:120px; }
/* 线下：发送键常显在输入框右侧（回车只换行） */
.off-foot .talk-send,
.off-foot .talk-input-row .talk-send{
  width:42px;
  opacity:1;
  transform:none;
}
.off-foot .talk-send:disabled{
  opacity:.35;
  cursor:default;
}
.off-actions{ display:flex; gap:8px; }
.off-act{
  flex:1; min-width:0;
  display:flex; align-items:center; justify-content:center; gap:5px;
  height:34px;
  border:none; border-radius:999px;
  background:rgba(var(--tint-rgb),.06);
  color:var(--gray-1);
  font-family:inherit; font-size:12px;
  cursor:pointer;
  transition:transform .18s var(--spring), opacity .18s;
}
.off-act:active{ transform:scale(.96); }
.off-act:disabled{ opacity:.4; cursor:default; }
.off-act.danger{ color:var(--danger); }
.off-act svg{
  width:15px; height:15px; flex:0 0 auto;
  fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.off-act span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* 线下归档卡：结束线下后收纳成一张可展开的卡片 */
.msg-novelpack{
  width:100%;
  padding:13px 16px;
  background:var(--fill);
  border:1px dashed rgba(var(--tint-rgb),.18);
  border-radius:16px;
  cursor:pointer;
}
.msg-novelpack b{ display:block; font-size:13px; }
.msg-novelpack small{ display:block; margin-top:3px; font-size:11px; color:var(--gray-2); }
.msg-novelpack .np-body{
  margin-top:10px; padding-top:10px;
  border-top:1px solid var(--hairline);
  font-size:12.5px; line-height:1.85;
  white-space:pre-wrap; word-break:break-word;
}
.msg-novelpack .np-body[hidden]{ display:none; }
.msg.msg-novelpack{ text-align:left; color:var(--ink); }
.msg.msg-novelpack .np-body{ max-height:46vh; overflow-y:auto; }

/* 思维链：正文气泡上方，点击展开 / 合上 */
.msg-think{
  max-width:73%;
  margin:0 0 6px;
  font-size:11.5px;
  color:var(--gray-2);
  align-self:flex-start;
}
.msg.mine .msg-think{ margin-left:auto; text-align:right; }
.msg-think-tog{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin:0; padding:2px 0;
  border:0; background:transparent;
  color:inherit; font:inherit;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.msg-think-tog svg{
  width:13px; height:13px; flex:0 0 auto;
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
  opacity:.85;
}
.msg-think-tog i{
  font-style:normal;
  font-size:10.5px;
  opacity:.75;
}
.msg-think-body{
  margin-top:5px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(var(--tint-rgb),.07);
  color:var(--gray-1);
  font-size:12px;
  line-height:1.55;
  white-space:pre-wrap;
  word-break:break-word;
  text-align:left;
}
.msg-think-body[hidden]{ display:none; }
.off-cot{
  margin:0 0 8px;
  font-size:12px;
  color:var(--gray-2);
}
.off-cot-tog{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin:0; padding:2px 0;
  border:0; background:transparent;
  color:inherit; font:inherit;
  cursor:pointer;
}
.off-cot-tog i{ font-style:normal; font-size:11px; opacity:.75; }
.off-cot-body{
  margin-top:6px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(var(--tint-rgb),.06);
  color:var(--gray-1);
  font-size:12.5px;
  line-height:1.65;
  white-space:pre-wrap;
  word-break:break-word;
}
.off-cot-body[hidden]{ display:none; }

/* 线下楼层：状态栏（心声 / 生图 / 环境） */
.off-statusbar{
  margin:12px 0 2px;
  border-radius:14px;
  background:rgba(var(--tint-rgb),.05);
  overflow:hidden;
}
.off-sb-label{
  padding:8px 12px 2px;
  font-size:11px; font-weight:600;
  color:var(--gray-2); letter-spacing:.04em;
}
.off-sb-row + .off-sb-row{ box-shadow:inset 0 1px 0 rgba(11,11,15,.06); }
.off-sb-tog{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; margin:0; padding:10px 12px;
  border:0; background:transparent;
  color:var(--ink); font:inherit; font-size:13.5px; font-weight:560;
  cursor:pointer; text-align:left;
}
.off-sb-tog i{ font-style:normal; font-size:11.5px; color:var(--gray-2); font-weight:500; }
.off-sb-body{
  padding:0 12px 12px;
  color:var(--gray-1);
  font-size:13px; line-height:1.65;
}
.off-sb-body[hidden]{ display:none; }
.off-sb-field{ margin:0 0 10px; }
.off-sb-field:last-child{ margin-bottom:0; }
.off-sb-field b{
  display:block; margin-bottom:4px;
  font-size:11px; font-weight:600; color:var(--gray-2);
}
.off-sb-field p{ margin:0; white-space:pre-wrap; word-break:break-word; color:var(--ink); }
.off-sb-trans{ margin-top:4px !important; font-size:12px; color:var(--gray-2); font-style:italic; }
.off-sb-fav{
  display:flex; align-items:center; gap:10px; margin-top:6px;
}
.off-sb-fav-bar{
  flex:1; height:8px; border-radius:999px;
  background:rgba(11,11,15,.1); overflow:hidden;
}
.off-sb-fav-bar i{
  display:block; height:100%; border-radius:inherit;
  background:linear-gradient(90deg, rgba(var(--tint-rgb),.4), rgba(var(--tint-rgb),.9));
}
.off-sb-fav span{
  flex:0 0 auto;
  font-size:12.5px; font-weight:600; color:var(--ink);
  min-width:28px; text-align:right;
}
.off-sb-empty{ margin:0; color:var(--gray-2); font-size:12.5px; }
.off-sb-cap{
  margin:0 0 8px; font-size:12px; color:var(--gray-2);
  white-space:pre-wrap; word-break:break-word;
}
.off-sb-ph, .off-sb-link{
  display:block; width:100%;
  border:none; border-radius:12px;
  background:var(--fill); color:var(--ink);
  font:inherit; font-size:13px;
  padding:12px 14px; cursor:pointer; text-align:center;
}
.off-sb-ph:disabled{ opacity:.65; cursor:default; }
.off-sb-link{
  margin-top:8px; background:transparent;
  color:var(--gray-1); font-size:12.5px; padding:6px;
  box-shadow:inset 0 0 0 1px rgba(11,11,15,.08);
}
.off-sb-img{
  display:block; width:100%; padding:0; border:none;
  background:transparent; border-radius:12px; overflow:hidden; cursor:pointer;
  position:relative;
}
.off-sb-img img{
  display:block; width:100%; max-height:280px; object-fit:cover;
  border-radius:12px;
}
.off-sb-img-idx{
  position:absolute; right:8px; bottom:8px;
  padding:2px 7px; border-radius:999px;
  background:rgba(0,0,0,.55); color:#fff;
  font-size:11px; line-height:1.4; pointer-events:none;
}
.off-sb-env, .off-sb-ifs{ list-style:none; margin:0; padding:0; }
.off-sb-env li, .off-sb-ifs li{
  margin:0 0 8px; padding:8px 10px;
  border-radius:10px; background:var(--bg);
}
.off-sb-env li:last-child, .off-sb-ifs li:last-child{ margin-bottom:0; }
.off-sb-env b, .off-sb-ifs b{
  display:block; margin-bottom:3px;
  font-size:11.5px; color:var(--gray-2);
}
.off-sb-env span, .off-sb-ifs span{ color:var(--ink); white-space:pre-wrap; word-break:break-word; }
.off-sb-ifs b{ color:var(--ink); font-weight:600; }

/* 群聊：发言人名字显示在气泡上方 */
.msg-who{
  display:block;
  font-size:10.5px; color:var(--gray-2);
  margin:0 0 3px 2px;
}
/* 表情包消息：没有任何气泡效果；尺寸强制锁定，避免自定义皮肤把图撑很大 */
.msg-sticker{
  max-width:73%;
  padding:0; background:transparent; box-shadow:none;
}
.msg-sticker .sticker-cap{
  display:block; margin-top:3px;
  font-size:11px; color:var(--gray-2);
  text-align:center;
  max-width:72px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.msg-sticker img{
  display:block !important;
  width:72px !important; height:72px !important;
  max-width:72px !important; max-height:72px !important;
  object-fit:contain !important;
}
.talk-empty{
  margin:auto;
  text-align:center;
  font-size:13px; color:var(--gray-2);
  line-height:1.8;
}
/* 顶部：展开更早 / 已收入记忆的消息 */
.talk-hist-more{
  align-self:center;
  border:none;
  background:var(--fill);
  color:var(--gray-1);
  font:500 12.5px/1 var(--font-body);
  padding:9px 16px;
  border-radius:999px;
  cursor:pointer;
  margin:2px 0 6px;
  transition:transform .18s var(--spring), background .18s;
}
.talk-hist-more:active{ transform:scale(.96); }
@media (hover: hover) and (pointer: fine){
.talk-hist-more:hover{ background:rgba(var(--tint-rgb),.08); }
}

.msg{
  display:flex; align-items:flex-start; gap:9px;
  max-width:100%;
  position:relative;
  animation:msgIn .3s var(--ease-out) both;
}
/* 左滑引用：内容跟着手指走，右侧露出回复标 */
.msg.swiping{ user-select:none; -webkit-user-select:none; }
.msg.swiping > *{ transform:translateX(var(--swipe-x, 0px)); }
.msg.swipe-back > *{ transition:transform .18s ease-out; }
.msg.swiping::before{
  content:'';
  position:absolute;
  right:4px; top:50%;
  width:28px; height:28px;
  margin-top:-14px;
  border-radius:50%;
  background-color:var(--fill);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c6c70' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 14 4 10l5-4'/%3E%3Cpath d='M5 10h8a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:15px;
  opacity:var(--swipe-p, 0);
  transform:scale(calc(.7 + .3 * var(--swipe-p, 0)));
  pointer-events:none;
}
.msg.swipe-ready::before{
  background-color:var(--ink);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 14 4 10l5-4'/%3E%3Cpath d='M5 10h8a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E");
}
@keyframes msgIn{
  from{ opacity:0; transform:translateY(8px); }
  to  { opacity:1; transform:none; }
}
.msg.mine{ flex-direction:row-reverse; }
.msg.msg-aside{ display:block; max-width:86%; align-self:center; }
.msg-avatar{
  flex:0 0 auto;
  width:var(--sk-talk-avatar-size, 38px); height:var(--sk-talk-avatar-size, 38px);
  border-radius:50%;
  object-fit:cover;
  background:var(--fill);
}
.msg-avatar-initial{
  flex:0 0 auto;
  width:var(--sk-talk-avatar-size, 38px); height:var(--sk-talk-avatar-size, 38px);
  border-radius:50%;
  background:var(--fill); color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:600;
}
.msg-bubble{
  max-width:73%;
  padding:var(--sk-talk-pad-y, 8px) var(--sk-talk-pad-x, 11px);
  border-radius:var(--sk-talk-radius, 20px);
  font-size:14.5px;
  line-height:1.62;
  color:var(--ink);
  background:var(--fill);
  white-space:pre-wrap;
  word-break:break-word;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
/* 气泡外引用（长按 / 左滑「引用」后发出的消息，挂在气泡上方） */
.msg-quote{
  display:block;
  font-size:11.5px;
  line-height:1.45;
  color:var(--gray-2);
  border-left:2px solid var(--gray-3);
  padding:1px 0 1px 8px;
  margin:0 2px;
  white-space:pre-wrap;
  word-break:break-word;
}
.msg.mine .msg-quote{
  border-left:none;
  border-right:2px solid var(--gray-3);
  padding-left:0;
  padding-right:8px;
  text-align:right;
}
.msg-quote-who{ font-weight:600; color:var(--gray-1); }
.msg.mine .msg-bubble{
  background:var(--ink); color:var(--on-ink);
  border-radius:var(--sk-talk-radius, 20px);
}
/* ============ 连续气泡分组（美化 → 聊天页 → 气泡分组） ============
   grp-cont：不是这一组的第一条；grp-more：不是这一组的最后一条
   圆角规则（贴头像一侧）：
   · 第一条：顶大、底小（往下连）
   · 中间条：顶小、底小
   · 最后一条：顶小、底大（收束）；单条消息四角均使用默认大圆角 */
.msg.grp-cont{ margin-top:-9px; }                     /* 组内间距收紧（.talk-body gap 是 14px） */
.msg-avatar-ph{ background:transparent !important; visibility:hidden; }   /* 占位：不显示头像但保留对齐 */
/* —— 对方（左侧）—— */
.msg.grp-cont .msg-bubble{ border-top-left-radius:7px; }
.msg.grp-more .msg-bubble{ border-bottom-left-radius:7px; }
.msg.grp-cont:not(.grp-more) .msg-bubble{
  border-bottom-left-radius:var(--sk-talk-radius, 20px);
}
/* —— 我（右侧）—— */
.msg.mine.grp-cont .msg-bubble{
  border-top-left-radius:var(--sk-talk-radius, 20px);
  border-top-right-radius:7px;
}
.msg.mine.grp-more .msg-bubble{
  border-bottom-left-radius:var(--sk-talk-radius, 20px);
  border-bottom-right-radius:7px;
}
.msg.mine.grp-cont.grp-more .msg-bubble{
  border-top-right-radius:7px;
  border-bottom-right-radius:7px;
}
/* 组内最后一条：底部贴头像侧恢复大圆角（覆盖默认 7px 小尾巴） */
.msg.mine.grp-cont:not(.grp-more) .msg-bubble{
  border-top-right-radius:7px;
  border-bottom-right-radius:var(--sk-talk-radius, 20px);
  border-bottom-left-radius:var(--sk-talk-radius, 20px);
  border-top-left-radius:var(--sk-talk-radius, 20px);
}
/* 头像开关关掉：气泡直接贴边 */
.msg.no-avatar{ padding-left:2px; }
.msg.mine.no-avatar{ padding-left:0; padding-right:2px; }
/* 输入中的省略号气泡 */
.msg-typing-row{ cursor:pointer; -webkit-tap-highlight-color:transparent; }
.msg-typing{ display:flex; gap:5px; padding:14px; }
.msg-typing span{
  width:7px; height:7px; border-radius:50%;
  background:var(--gray-3);
  animation:dotJump 1.05s infinite;
}
.msg-typing span:nth-child(2){ animation-delay:.16s; }
.msg-typing span:nth-child(3){ animation-delay:.32s; }
@keyframes dotJump{
  0%,60%,100%{ transform:translateY(0); opacity:.55; }
  30%{ transform:translateY(-5px); opacity:1; }
}

/* ============ 底栏：上行输入 / 下行功能键 ============ */
.talk-foot{
  flex:0 0 auto;
  background:transparent;           /* 底栏透明：透出壁纸 */
  border-top:none;
  padding:12px 12px calc(4px + var(--foot-bottom));   /* 输入栏整体往下：底部安全区只留一点（--foot-bottom） */
  display:flex; flex-direction:column; gap:8px;
}
/* 表情包面板 */
.sticker-panel{
  display:flex; flex-direction:column; gap:8px;
  padding:6px 0 2px;
  animation:msgIn .26s var(--ease-out) both;
  touch-action:pan-y;
}
.sticker-panel[hidden]{ display:none; }
.sticker-groups{
  display:flex; align-items:center; gap:6px;
  overflow-x:auto; padding:0 2px;
  -webkit-overflow-scrolling:touch;
}
.sticker-groups::-webkit-scrollbar{ height:0; }
.sticker-group-btn{
  flex:0 0 auto;
  border:none; background:var(--fill);
  color:var(--gray-1);
  font-family:inherit; font-size:12px;
  padding:6px 12px; border-radius:999px;
  cursor:pointer; white-space:nowrap;
}
.sticker-group-btn.on{ background:var(--ink); color:var(--on-ink); }
.sticker-group-btn.tool{ background:transparent; color:var(--gray-2); padding:6px 8px; }
.sticker-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:6px;
  max-height:min(38vh, 260px);
  overflow-y:auto;
  overflow-x:hidden;
  padding:2px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.sticker-grid::-webkit-scrollbar{ width:0; }
.sticker-cell{
  border:none; background:rgba(var(--tint-rgb),.035);
  border-radius:10px;
  padding:4px 2px 3px;
  cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  gap:2px;
  min-width:0;
  transition:transform .18s var(--spring), background .18s;
  -webkit-user-select:none; user-select:none;
  -webkit-touch-callout:none;
}
.sticker-cell:active{ transform:scale(.92); }
.sticker-cell img{
  width:100% !important;
  height:44px !important;
  max-height:44px !important;
  object-fit:contain !important;
  display:block;
  pointer-events:none;
  flex:0 0 auto;
}
/* 表情包配字：显示在图片下面 */
.sticker-cell-cap{
  flex:0 0 auto; max-width:100%;
  font-size:9px; line-height:1.2; color:var(--gray-2);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  pointer-events:none;
}
.sticker-cell.add{ color:var(--gray-2); font-size:26px; min-height:64px; justify-content:center; }
.sticker-empty{
  grid-column:1 / -1;
  text-align:center; font-size:12px; color:var(--gray-2);
  padding:22px 0;
}
/* 表情包预览 */
.sticker-preview-img{
  display:block; margin:8px auto 4px;
  width:200px; height:200px; object-fit:contain;
}
/* 上行：输入栏 + 发送键 */
.talk-input-row{ display:flex; align-items:flex-end; gap:8px; }
.talk-input{
  flex:1; min-width:0;
  min-height:42px; max-height:104px;
  padding:11px 16px;
  border:none;
  border-radius:21px;
  background:var(--fill);
  color:var(--ink);
  font-family:inherit;
  font-size:14.5px;
  line-height:1.45;
  resize:none;
  overflow-y:auto;
}
.talk-input::placeholder{ color:var(--gray-3); }
.talk-input::-webkit-scrollbar{ width:0; }
/* 发送键：正在输入时从右侧出现 */
.talk-send{
  flex:0 0 auto;
  width:0; height:42px;
  padding:0; border:none;
  border-radius:50%;
  background:var(--ink); color:var(--on-ink);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  opacity:0;
  transform:scale(.4);
  overflow:hidden;
  transition:width .26s var(--spring), opacity .2s, transform .3s var(--spring);
}
.talk-input-row.typing .talk-send{
  width:42px;
  opacity:1;
  transform:none;
}
.talk-send svg{
  width:20px; height:20px;
  fill:none; stroke:currentColor;
  stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.talk-send:active{ transform:scale(.9); }
/* 下行：功能键（纯线条图标、无文字） */
.talk-actions{
  display:flex; align-items:center;
  justify-content:space-between;
  padding:0 4px 2px;
}
.talk-act{
  width:40px; height:40px;
  border:none; background:transparent;
  color:var(--gray-1);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:background .18s, color .18s, transform .18s var(--spring);
}
@media (hover: hover) and (pointer: fine){
.talk-act:hover{ background:rgba(var(--tint-rgb),.05); color:var(--ink); }
}

.talk-act:active{ transform:scale(.86); }
.talk-act.on{ color:var(--ink); background:var(--fill); }
.talk-act svg{
  width:23px; height:23px;
  fill:none; stroke:currentColor;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}
.talk-act.plus svg{ stroke-width:1.9; }

/* 加号展开的功能面板 */
.talk-panel{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:4px 0;
  padding:6px 0 2px;
  animation:msgIn .26s var(--ease-out) both;
}
.talk-panel[hidden]{ display:none; }
.tp-item{
  border:none; background:transparent;
  display:flex; flex-direction:column; align-items:center; gap:7px;
  padding:10px 0;
  cursor:pointer;
  font-family:inherit;
  font-size:11.5px; color:var(--gray-1);
  border-radius:16px;
  transition:background .18s, transform .18s var(--spring);
}
@media (hover: hover) and (pointer: fine){
.tp-item:hover{ background:rgba(var(--tint-rgb),.035); }
}

.tp-item:active{ transform:scale(.94); }
.tp-icon{
  width:48px; height:48px;
  border-radius:17px;
  background:var(--fill);
  color:var(--ink);
  display:flex; align-items:center; justify-content:center;
}
.tp-icon svg{
  width:22px; height:22px;
  fill:none; stroke:currentColor;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

/* ============ 系统提示（居中灰字） ============ */
.msg-system{
  align-self:center;
  max-width:82%;
  text-align:center;
  font-size:11.5px; color:var(--gray-2);
  line-height:1.6;
  background:rgba(var(--tint-rgb),.045);
  padding:5px 12px;
  border-radius:9px;
  animation:msgIn .3s var(--ease-out) both;
}
/* 系统提示也能长按 / 多选：它带 .msg 类，这里把 .msg 的横向布局改回居中块 */
.msg.msg-system{ display:block; max-width:82%; align-self:center; }
.msg-system.picked{ outline:2px solid var(--ink); }

/* ============ 语音气泡 ============ */
.msg-voice{
  display:flex; flex-direction:column;
  min-width:150px;
  cursor:pointer;
}
.voice-main{ display:flex; align-items:center; gap:10px; }
.voice-play{
  flex:0 0 auto;
  width:24px; height:24px;
  border-radius:50%;
  background:rgba(127,127,127,.16);
  display:flex; align-items:center; justify-content:center;
  transition:background .16s, transform .16s;
}
.voice-play:active{ transform:scale(.92); }
.voice-play svg{
  width:13px; height:13px;
  margin-left:1px;
  fill:currentColor; stroke:none;
}
/* 播放中：播放键变成暂停 */
.msg-voice.playing .voice-play svg path{ d:path("M7.5 5.5h3v13h-3zM13.5 5.5h3v13h-3z"); }
.msg-voice.loading .voice-play{ animation:voicePulse 1s infinite; }
@keyframes voicePulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
/* 转文字键 */
.voice-tt{
  flex:0 0 auto;
  width:24px; height:24px;
  margin-left:2px;
  border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  opacity:.62;
  transition:background .16s, opacity .16s;
}
.voice-tt svg{
  width:15px; height:15px;
  fill:none; stroke:currentColor;
  stroke-width:1.9; stroke-linecap:round;
}
@media (hover: hover) and (pointer: fine){
.voice-tt:hover{ opacity:.9; }
}

.voice-tt.on{ opacity:1; background:rgba(127,127,127,.18); }
.voice-wave{
  flex:1;
  display:flex; align-items:center; gap:2.5px;
  height:18px;
}
.voice-wave i{
  display:block;
  width:2.5px; border-radius:2px;
  background:currentColor;
  opacity:.5;
}
.msg-voice.playing .voice-wave i{ animation:waveJump .9s infinite; }
@keyframes waveJump{
  0%,100%{ transform:scaleY(.55); opacity:.4; }
  50%    { transform:scaleY(1.25); opacity:.95; }
}
.voice-dur{
  flex:0 0 auto;
  font-size:12px; opacity:.72;
  font-variant-numeric:tabular-nums;
}
.voice-text{
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid rgba(127,127,127,.28);
  font-size:13.5px; line-height:1.6;
}

/* 真实录音面板 */
.voice-rec-body{
  display:flex; flex-direction:column; align-items:center;
  gap:12px; padding-bottom:6px;
}
.voice-rec-btn{
  width:76px; height:76px; border-radius:50%;
  border:none; cursor:pointer;
  background:rgba(var(--tint-rgb), .14);
  color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  transition:transform .16s, background .16s, box-shadow .16s;
}
.voice-rec-btn svg{
  width:30px; height:30px;
  fill:none; stroke:currentColor;
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.voice-rec-btn:active{ transform:scale(.94); }
.voice-rec-btn.on{
  background:rgba(220, 60, 60, .18);
  color:#d03a3a;
  box-shadow:0 0 0 6px rgba(220, 60, 60, .08);
  animation:voiceRecPulse 1.2s ease-in-out infinite;
}
.voice-rec-btn.busy{ opacity:.55; pointer-events:none; }
@keyframes voiceRecPulse{
  0%,100%{ box-shadow:0 0 0 6px rgba(220, 60, 60, .06); }
  50%{ box-shadow:0 0 0 12px rgba(220, 60, 60, .12); }
}
.voice-rec-time{
  font-size:22px; font-weight:600;
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
}
.voice-rec-status{
  min-height:1.4em;
  font-size:12.5px; color:var(--gray-2);
  text-align:center; line-height:1.5;
}
.voice-rec-body .pad-input{ width:100%; }
.voice-rec-body .pad-row{ width:100%; margin-top:4px; }

/* ============ 红包气泡：扁平，无外发光 ============ */
.msg-red{
  position:relative;
  padding:0; overflow:hidden;
  background:#E85A48;
  color:#fff;
  min-width:212px; max-width:240px;
  cursor:pointer;
  border-radius:12px !important;
  box-shadow:none;
  transition:transform .18s var(--spring);
}
.msg-red:active{ transform:scale(.98); }
.msg.mine .msg-red{ background:#E85A48; color:#fff; }
.msg-red::before, .msg-red::after{ display:none; }
.red-top{
  position:relative; z-index:1;
  display:flex; align-items:center; gap:10px;
  padding:12px 12px 11px;
}
.red-ico{
  flex:0 0 auto;
  width:36px; height:36px;
  border-radius:8px;
  background:#F6E3B2;
  box-shadow:none;
  display:flex; align-items:center; justify-content:center;
}
.red-ico i{
  font-style:normal; font-weight:700;
  font-size:16px; line-height:1;
  color:#C2412E;
  font-family:"Noto Serif SC", "Songti SC", "STSong", serif;
  letter-spacing:.02em;
}
.red-word{ flex:1; min-width:0; }
.red-word b{
  display:block; font-size:14.5px; font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  text-shadow:none;
}
.red-word span{ display:block; font-size:11.5px; opacity:.82; margin-top:2px; }
.red-foot{
  position:relative; z-index:1;
  display:flex; align-items:center; justify-content:space-between;
  padding:5px 12px 6px;
  background:#D44C3B;
  font-size:10.5px; letter-spacing:.04em;
  opacity:1;
}
.red-foot em{ font-style:normal; font-family:var(--font-num), inherit; font-weight:600; letter-spacing:0; font-size:11.5px; }
.msg-red.done{
  background:#E7B7AD;
  box-shadow:none;
}
.msg-red.done .red-foot{ background:#D9A79C; }
.msg-red.done .red-ico{ background:#F4E6C8; box-shadow:none; }
.msg-red.done .red-ico i{ color:#A56A5E; }

/* ============ 转账气泡：扁平，无外发光 ============ */
.msg-transfer{
  position:relative;
  padding:0; overflow:hidden;
  background:#F09A3A;
  color:#fff;
  min-width:212px; max-width:240px;
  cursor:pointer;
  border-radius:12px !important;
  box-shadow:none;
  transition:transform .18s var(--spring);
}
.msg-transfer:active{ transform:scale(.98); }
.msg.mine .msg-transfer{ background:#F09A3A; color:#fff; }
.msg-transfer::before, .msg-transfer::after{ display:none; }
.tr-top{
  position:relative; z-index:1;
  display:flex; align-items:center; gap:10px;
  padding:12px 12px 11px;
}
.tr-ico{
  flex:0 0 auto;
  width:36px; height:36px;
  border-radius:50%;
  background:rgba(255,255,255,.22);
  box-shadow:none;
  display:flex; align-items:center; justify-content:center;
}
.tr-ico svg{
  width:18px; height:18px;
  fill:none; stroke:#fff;
  stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.tr-word{ flex:1; min-width:0; }
.tr-word b{
  display:block;
  font-size:20px; font-weight:650;
  font-family:var(--font-num), inherit;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.01em; line-height:1.15;
  text-shadow:none;
}
.tr-word b small{ font-size:13px; font-weight:600; margin-right:1px; }
.tr-word span{
  display:block; font-size:11.5px; opacity:.88; margin-top:2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.tr-foot{
  position:relative; z-index:1;
  display:flex; align-items:center; justify-content:space-between;
  padding:5px 12px 6px;
  background:#E08A2C;
  font-size:10.5px; letter-spacing:.04em;
  opacity:1;
}
.msg-transfer.done{
  background:#E4C09A;
  box-shadow:none;
}
.msg-transfer.done .tr-foot{ background:#D4AE88; }
.msg-transfer.back{
  background:#C5C8D0;
  box-shadow:none;
}
.msg-transfer.back .tr-foot{ background:#B4B8C2; }

/* ============ 长按气泡：浮动功能栏 ============ */
.msg-menu{
  position:absolute;
  z-index:95;
  display:flex;
  background:var(--ink);
  border-radius:14px;
  padding:4px;
  box-shadow:0 10px 30px rgba(0,0,0,.26);
  transform:scale(.86);
  opacity:0;
  pointer-events:none;
  transition:opacity .16s, transform .24s var(--spring);
}
.msg-menu.show{ transform:none; opacity:1; pointer-events:auto; }
.msg-menu button{
  border:none; background:transparent;
  color:var(--on-ink);
  font-family:inherit;
  font-size:12.5px;
  padding:8px 11px;
  border-radius:10px;
  cursor:pointer;
  white-space:nowrap;
  transition:background .16s;
}
@media (hover: hover) and (pointer: fine){
.msg-menu button:hover{ background:rgba(255,255,255,.14); }
}

.msg-menu button:active{ background:rgba(255,255,255,.22); }
@media (hover: hover) and (pointer: fine){
/* 深色下菜单本身是浅底，hover 用墨色半透明 */
html[data-theme="dark"] .msg-menu button:hover{ background:rgba(0,0,0,.1); }
}

html[data-theme="dark"] .msg-menu button:active{ background:rgba(0,0,0,.18); }

/* 多选：气泡前的勾选圈 */
.msg-pick{
  flex:0 0 auto;
  width:21px; height:21px;
  border-radius:50%;
  border:1.6px solid var(--gray-3);
  display:flex; align-items:center; justify-content:center;
  align-self:center;
}
.msg-pick svg{
  width:13px; height:13px;
  fill:none; stroke:#fff;
  stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;
  opacity:0;
}
.msg.picked .msg-pick{ background:var(--ink); border-color:var(--ink); }
.msg.picked .msg-pick svg{ opacity:1; }
.talk-body.selecting .msg{ cursor:pointer; }

/* 多选操作栏（替换底栏） */
.talk-select-bar{
  display:flex; align-items:center; gap:10px;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--hairline);
  background:var(--bg);
}
.talk-select-bar[hidden]{ display:none; }
.tsb-count{ flex:1; font-size:13px; color:var(--gray-1); }
.tsb-btn{
  border:none; background:var(--fill);
  color:var(--ink);
  font-family:inherit; font-size:13px; font-weight:500;
  padding:9px 16px;
  border-radius:999px;
  cursor:pointer;
  transition:background .18s, transform .18s var(--spring);
}
.tsb-btn:active{ transform:scale(.95); }
.tsb-btn.danger{ background:var(--danger); color:#fff; }
.tsb-btn.ghost{ background:transparent; color:var(--gray-1); }

/* 重回方向弹窗：快捷方向标签 */
.regen-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 12px; }
.regen-tag{
  border:none; background:var(--fill);
  color:var(--gray-1);
  font-family:inherit; font-size:12px;
  padding:6px 11px;
  border-radius:999px;
  cursor:pointer;
  transition:background .18s, color .18s, transform .18s var(--spring);
}
.regen-tag:active{ transform:scale(.95); }
.regen-tag.on{ background:var(--ink); color:var(--bg); }
.regen-keep{
  display:flex; align-items:flex-start; gap:8px;
  margin:2px 0 12px;
  font-size:13px; line-height:1.45; color:var(--ink);
  cursor:pointer;
}
.regen-keep input{
  flex:0 0 auto; margin-top:2px;
  width:16px; height:16px;
  accent-color:var(--ink);
}
.regen-pick{
  display:flex; align-items:center; gap:4px;
  margin-bottom:6px;
  padding:6px 6px 6px 4px;
  background:var(--fill);
  border-radius:14px;
}
.regen-pick[hidden]{ display:none !important; }
.regen-pick > button:not(.tsb-btn){
  flex:0 0 auto;
  width:32px; height:32px;
  border:none; background:transparent;
  color:var(--ink);
  font-size:20px; line-height:1;
  cursor:pointer;
}
.regen-pick > button:disabled{ opacity:.28; cursor:default; }
.regen-pick > span{
  flex:1; min-width:0;
  text-align:center;
  font-size:12.5px; color:var(--gray-1);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.regen-pick .tsb-btn{ flex:0 0 auto; padding:6px 10px; font-size:12px; }

/* 输入栏上方的引用条 / 编辑条 */
.talk-quote-bar{
  display:flex; align-items:center; gap:10px;
  padding:8px 12px;
  background:var(--fill);
  border-radius:14px;
  margin-bottom:2px;
}
.talk-quote-bar[hidden]{ display:none; }
.tqb-line{
  flex:0 0 auto;
  width:2.5px; height:26px;
  border-radius:2px;
  background:var(--ink);
  opacity:.5;
}
.tqb-text{
  flex:1; min-width:0;
  font-size:12.5px; color:var(--gray-1);
  line-height:1.5;
  overflow:hidden;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.tqb-text b{ color:var(--ink); font-weight:600; }
.tqb-close{
  flex:0 0 auto;
  width:26px; height:26px;
  border:none; background:transparent;
  color:var(--gray-2);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.tqb-close svg{
  width:15px; height:15px;
  fill:none; stroke:currentColor;
  stroke-width:2; stroke-linecap:round;
}
@media (hover: hover) and (pointer: fine){
.tqb-close:hover{ background:rgba(var(--tint-rgb),.06); color:var(--ink); }
}


/* ============ 编辑消息弹窗（居中） ============ */
.msg-edit-card{
  max-width:340px;
  max-height:82%;
  padding-bottom:16px;
}
.msg-edit-body{ padding:12px 18px 0; }
.msg-edit-input{
  min-height:108px;
  max-height:28vh;
  resize:vertical;
  font-size:15px;
  line-height:1.65;
  padding:14px 15px;
  border-radius:18px;
  background:var(--fill);
  box-shadow:inset 0 0 0 1px transparent;
  transition:box-shadow .18s;
}
.msg-edit-input:focus{
  outline:none;
  box-shadow:inset 0 0 0 1.5px var(--ink);
}
.msg-edit-types{
  display:flex; flex-wrap:wrap; gap:8px;
  margin-top:14px;
}
.msg-edit-type{
  border:none;
  background:var(--fill);
  color:var(--ink);
  font:inherit; font-size:12.5px; font-weight:560;
  padding:7px 12px;
  border-radius:999px;
  cursor:pointer;
  box-shadow:inset 0 0 0 1px transparent;
  transition:background .15s, color .15s, box-shadow .15s;
}
.msg-edit-type:active{ transform:scale(.97); }
.msg-edit-type.on{
  background:var(--ink);
  color:var(--on-ink);
}
.msg-edit-type[data-conv="split"].on{
  background:var(--ink);
  color:var(--on-ink);
}
.msg-edit-actions{
  display:flex; gap:8px;
  margin-top:16px;
}
.msg-edit-actions .save-btn{ flex:1; margin:0; }

.loc-chips{
  display:flex; flex-wrap:wrap; gap:8px;
  margin:0 0 12px;
}
.loc-chip{
  border:none; border-radius:999px;
  background:var(--fill); color:var(--ink);
  font-family:inherit; font-size:12.5px; font-weight:600;
  padding:7px 12px; cursor:pointer;
  max-width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.loc-chip:active{ transform:scale(.96); }
.loc-here-btn{
  width:100%; margin-top:10px;
  height:40px; border:none; border-radius:14px;
  background:var(--fill); color:var(--ink);
  font-family:inherit; font-size:14px; font-weight:600;
  cursor:pointer;
}
.loc-here-btn:disabled{ opacity:.5; }
.loc-here-btn:active{ transform:scale(.98); }

/* 语音输入面板 / 金额输入面板 */
.pad-body{ padding:4px 20px 8px; }
.pad-input{
  width:100%;
  border:none;
  background:var(--fill);
  color:var(--ink);
  font-family:inherit;
  font-size:15px;
  line-height:1.55;
  padding:13px 15px;
  border-radius:16px;
  resize:none;
  box-sizing:border-box;
}
.pad-input::placeholder{ color:var(--gray-3); }
.pad-amount{
  width:100%;
  border:none; border-bottom:1.5px solid var(--hairline);
  background:transparent;
  color:var(--ink);
  font-family:inherit;
  font-size:34px; font-weight:600;
  letter-spacing:.01em;
  padding:6px 0 12px;
  text-align:center;
  font-variant-numeric:tabular-nums;
  box-sizing:border-box;
}
.pad-amount::placeholder{ color:var(--gray-3); font-weight:500; }
.pad-amount:focus{ outline:none; border-bottom-color:var(--ink); }
.pad-hint{
  font-size:12px; color:var(--gray-2);
  text-align:center;
  margin:12px 0 0;
  line-height:1.65;
}
.pad-row{ display:flex; align-items:center; gap:10px; margin-top:16px; }
.pad-row .pad-input{ flex:1; font-size:14px; padding:11px 14px; }
.pad-dur{
  flex:0 0 auto;
  font-size:12px; color:var(--gray-2);
  font-variant-numeric:tabular-nums;
}

/* ============ 虚拟图片（TA 用文字描述的「图片」）：纯文字气泡 ============ */
.msg-photo-text{ white-space:pre-wrap; word-break:break-word; }
.msg-photo-text .photo-mark{ opacity:.55; font-weight:600; }

/* 线下邀请沿用聊天页的纸张、细线和圆角，不铺亮色渐变。 */
.msg-offinv,.msg.mine .msg-offinv{
  display:block;width:min(280px,78vw);max-width:100%;min-width:0;box-sizing:border-box;
  padding:0;overflow:hidden;background:var(--bg);color:var(--ink);
  border:1px solid var(--hairline);border-radius:17px !important;
  box-shadow:0 5px 20px #0000000b;cursor:pointer;
}
.msg-offinv:active{transform:scale(.99)}
.msg-offinv .oi-overline{display:flex;align-items:center;gap:7px;padding:16px 16px 6px;font-size:10px;letter-spacing:.1em;color:var(--gray-2)}
.msg-offinv .oi-line{width:13px;height:1px;background:currentColor}
.msg-offinv .oi-mark{margin-left:auto;letter-spacing:.14em;font-size:8px;opacity:.65}
.msg-offinv .oi-head{display:flex;align-items:center;gap:9px;padding:7px 16px 0}
.msg-offinv .oi-avatar{width:32px;height:32px;flex:0 0 auto;object-fit:cover;border-radius:11px}
.msg-offinv .oi-head span{min-width:0;display:flex;flex-direction:column;gap:2px}
.msg-offinv .oi-head b{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-offinv .oi-head small{font-size:10px;color:var(--gray-2)}
.msg-offinv .oi-say{margin:0;padding:17px 16px 15px;font-size:14px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}
.msg-offinv .oi-meta{display:flex;flex-direction:column;gap:5px;padding:0 16px 16px}
.msg-offinv .oi-meta span{min-width:0;display:flex;gap:12px;font-size:11px;line-height:1.55;overflow-wrap:anywhere}
.msg-offinv .oi-meta b{flex:0 0 26px;font-size:10px;font-weight:400;color:var(--gray-2)}
.msg-offinv .oi-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--hairline);font-size:10px;color:var(--gray-2)}
.msg-offinv .oi-foot span:last-child{color:var(--ink)}
.msg-offinv .oi-foot i{font-size:13px;font-style:normal;margin-left:4px}
.msg-offinv.done{opacity:.72}
.msg-offinv.no .oi-foot span:last-child{color:var(--gray-2)}
/* Only this invitation decorates the shared centered action sheet. */
#payActBackdrop.offinv-dialog .center-card{width:min(360px,calc(100vw - 40px));padding:0;overflow:hidden;border:1px solid var(--hairline);border-radius:22px;background:var(--bg);color:var(--ink);box-shadow:0 24px 70px #00000024}
#payActBackdrop.offinv-dialog .cc-title{padding:18px 20px 0;font-size:12px;font-weight:600;color:var(--gray-2);letter-spacing:.04em}
#payActBackdrop.offinv-dialog #payActList{padding:0 20px 20px}
.oi-dialog-intro{padding:14px 0 0}.oi-dialog-kicker{display:block;font-size:9px;letter-spacing:.19em;color:var(--gray-2)}
.oi-dialog-person{display:flex;align-items:center;gap:11px;margin-top:19px}
.oi-dialog-person img{width:43px;height:43px;object-fit:cover;border-radius:14px}
.oi-dialog-person div{display:flex;flex-direction:column;gap:4px}
.oi-dialog-person strong{font-size:15px;font-weight:600}.oi-dialog-person span{font-size:11px;color:var(--gray-2)}
.oi-dialog-intro p{margin:22px 0 18px;font-size:16px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}
.oi-dialog-details{padding:11px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.oi-dialog-details div{display:flex;gap:16px;padding:6px 0;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.oi-dialog-details small{flex:0 0 35px;font-size:10px;color:var(--gray-2)}
.oi-dialog-details span{min-width:0;flex:1}
.oi-dialog-actions{display:flex;flex-direction:column;gap:9px;margin-top:20px}
.oi-dialog-actions button{min-height:42px;border:0;border-radius:12px;font:inherit;font-size:12px;cursor:pointer}
.oi-dialog-actions .oi-go{display:flex;justify-content:center;align-items:center;gap:8px;background:var(--ink);color:var(--on-ink,#fff);font-weight:600}
.oi-dialog-actions .oi-go span{font-size:15px;font-weight:400}
.oi-dialog-actions .oi-decline{background:var(--fill);color:var(--gray-1)}
/* Notes overlays the conversation; keep messages rendered underneath. */
html.memo-open #talkBody{ pointer-events:none; }

/* ============ 共享备忘录悬浮球 / 面板 ============ */
.memo-float,
.memo-float-preview{
  --memo-float-size: 52px;
  --memo-float-radius: 50%;
  --memo-float-bg: var(--ink);
  --memo-float-fg: #fff;
  width: var(--memo-float-size);
  height: var(--memo-float-size);
  border-radius: var(--memo-float-radius);
  background-color: var(--memo-float-bg, var(--ink));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 10px 24px -8px rgba(11,11,15,.55);
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  touch-action: none;
  position: relative;
  overflow: hidden;
  flex: 0 0 auto;
}
.memo-float{
  position: absolute;
  z-index: 94;
}
.memo-float.snap{
  transition: left .24s cubic-bezier(.2,.75,.2,1), top .24s cubic-bezier(.2,.75,.2,1), opacity .24s ease;
}
.memo-float.will-dock{ opacity: .72; }
.memo-float.show{ display: flex; }
.memo-float-preview{
  display: flex;
  cursor: default;
  touch-action: auto;
  box-shadow: 0 6px 16px -6px rgba(11,11,15,.4);
}
.memo-float svg,
.memo-float-preview svg{
  width: 42%;
  height: 42%;
  fill: none;
  stroke: var(--memo-float-fg, #fff);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.memo-float.has-img svg,
.memo-float-preview.has-img svg{ display: none; }
.memo-float.has-img,
.memo-float-preview.has-img{
  background-color: transparent;
}
.memo-float[data-count]:not([data-count=""])::after,
.memo-float-preview[data-count]:not([data-count=""])::after{
  content: attr(data-count);
  position: absolute; top: -2px; right: -2px;
  min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px;
  background: #E5342B; color: #fff;
  font-size: 10px; font-weight: 600; line-height: 18px; text-align: center;
  box-sizing: border-box;
  z-index: 1;
}
.memo-float.no-badge[data-count]::after,
.memo-float-preview.no-badge[data-count]::after{ display: none; }
.memo-float.docked.dock-right[data-count]:not([data-count=""])::after{
  right: auto;
  left: -2px;
}
.memo-card .cc-title{
  display:grid; grid-template-columns:32px 1fr 32px;
  align-items:center; gap:6px;
}
.memo-card .cc-title span{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  text-align:center;
}
.memo-close, .memo-back{
  width:32px; height:32px;
  border:none; background:transparent; color:var(--gray-1);
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; border-radius:10px; padding:0;
}
.memo-card .memo-back[hidden]{
  display:inline-flex !important; visibility:hidden; pointer-events:none;
}
.memo-close svg, .memo-back svg{ width:18px; height:18px; stroke:currentColor; stroke-width:1.9; fill:none; }
.memo-body{ padding-bottom:18px !important; }
.memo-list{
  display:flex; flex-direction:column; gap:8px;
  max-height:min(34vh, 260px); overflow:auto;
  margin-bottom:10px;
}
.memo-empty{
  margin:8px 0 14px; text-align:center;
  font-size:13px; color:var(--gray-2); line-height:1.6;
}
.memo-empty[hidden]{ display:none; }
.memo-item{
  display:flex; align-items:center; gap:10px;
  width:100%; padding:10px 12px;
  border:none; background:var(--fill);
  border-radius:14px; text-align:left;
  font:inherit; color:inherit; cursor:pointer;
}
.memo-item:active{ opacity:.82; }
.memo-item-main{ flex:1; min-width:0; }
.memo-item-text{
  margin:0; font-size:14px; font-weight:600; line-height:1.4;
  color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.memo-item-meta{
  display:block; margin-top:3px;
  font-size:11px; font-weight:450; color:var(--gray-2);
}
.memo-item-num{
  flex:0 0 auto; font-size:20px; font-weight:650; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; color:var(--ink);
}
.memo-count{
  margin:0 0 10px; text-align:center;
  font-size:22px; font-weight:650; letter-spacing:-.02em; color:var(--ink);
}
.memo-rename{ display:flex; gap:6px; align-items:center; margin-bottom:10px; }
.memo-rename .pad-input{ flex:1; margin:0; padding:10px 12px; font-size:14px; }
.memo-textbtn{
  flex:0 0 auto; border:none; background:transparent;
  color:var(--gray-1); font:inherit; font-size:13px; font-weight:600;
  padding:8px 4px; cursor:pointer;
}
.memo-textbtn.danger{ color:#E5342B; }
.memo-log{
  display:flex; gap:10px; align-items:flex-start;
  padding:10px 12px; background:var(--fill); border-radius:14px;
}
.memo-log-delta{
  flex:0 0 auto; min-width:42px;
  font-size:15px; font-weight:650; font-variant-numeric:tabular-nums;
  color:var(--ink); white-space:nowrap;
}
.memo-log-delta.down{ color:#E5342B; }
.memo-log-note{
  margin:0; font-size:13px; line-height:1.5;
  color:var(--ink); white-space:pre-wrap; word-break:break-word;
}
.memo-log-note.muted{ color:var(--gray-2); }
.memo-log-meta{
  display:block; margin-top:3px;
  font-size:11px; color:var(--gray-2);
}
.memo-addbar{ display:flex; justify-content:flex-end; margin-top:2px; }
.memo-plus{
  width:36px; height:36px; border-radius:50%;
  border:none; background:var(--ink); color:var(--on-ink);
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; padding:0;
}
.memo-plus svg{
  width:18px; height:18px; stroke:currentColor; fill:none;
  stroke-width:2; stroke-linecap:round;
  transition:transform .2s;
}
.memo-plus.open{ background:var(--fill); color:var(--ink); }
.memo-plus.open svg{ transform:rotate(45deg); }
.memo-compose{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.memo-compose[hidden]{ display:none; }
.memo-log-body{ flex:1; min-width:0; }
.memo-log-side{ flex:0 0 auto; padding:0; font-size:12px; }
.memo-log.editing{ flex-direction:column; gap:8px; }
.memo-log.editing .save-btn{ flex:1; width:auto; margin:0; height:40px; font-size:14px; }
.memo-compose-row{ display:flex; gap:8px; align-items:center; }
.memo-compose .pad-input{ margin:0; }
.memo-num{
  width:88px; flex:0 0 88px; text-align:center;
  padding:11px 8px; font-size:16px; font-weight:600;
}
.memo-unit{ width:76px; flex:0 0 76px; text-align:center; padding:11px 8px; font-size:14px; }
.memo-note{ font-size:14px; min-height:64px; }
.memo-compose .save-btn{ margin-top:2px; height:44px; font-size:15px; }
.memo-compose-row .save-btn{
  flex:1; width:auto; margin:0; height:44px; font-size:15px;
}

/* 聊天图片：气泡缩略图 + 点击看原图 lightbox */
.talk-img-thumb{ cursor:zoom-in; }
.talk-img-viewer{
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:10px;
}
.talk-img-viewer img{
  max-width:100vw; max-height:88vh;
  object-fit:contain; display:block;
}
.talk-img-viewer-tip{ color:rgba(255,255,255,.65); font-size:12px; }

.calllog-delete{display:block;margin:0 16px 10px auto;border:0;border-radius:10px;padding:6px 10px;background:var(--bg);color:var(--danger);font:inherit;font-size:12px;cursor:pointer;}

/* 本地搜索与工具分页，跟随现有黑白主题。 */
.talk-panel{display:block;min-width:0}
.talk-tool-pages{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;min-width:0}
.talk-tool-pages::-webkit-scrollbar{display:none}
.talk-tool-page{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:88px;min-height:176px;scroll-snap-align:start;align-content:start}
.talk-tool-page[aria-label="记录工具"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.talk-tool-dots{display:flex;justify-content:center;gap:4px;margin-top:3px}
.talk-tool-dots button{border:0;background:none;padding:10px;cursor:pointer}
.talk-tool-dots button::after{content:'';display:block;width:5px;height:5px;border-radius:9px;background:var(--gray-3,#aaa)}
.talk-tool-dots button.on::after{width:15px;background:var(--ink,#111)}
.cr-search-card{max-width:560px!important;width:calc(100% - 28px)!important;max-height:calc(var(--app-h,100dvh) - 36px);overflow:auto;text-align:left}
#chatSearchKind{margin-top:12px;padding:8px 12px;border-radius:12px;border:1px solid var(--line,rgba(var(--tint-rgb),.1));background:var(--fill);color:var(--ink);font:inherit;font-size:12px;max-width:100%}
#chatSearchList{max-height:45vh;overscroll-behavior:contain;padding-bottom:8px}
#chatSearchList .chat-search-item{width:100%;text-align:left;flex-shrink:0;white-space:normal;overflow-wrap:anywhere;font-family:inherit;padding:13px;border-color:var(--line,rgba(var(--tint-rgb),.1));background:var(--fill)}
#chatSearchList .src{font-weight:500;font-size:11px;opacity:.6}
.cr-excerpt{display:block;font-size:13px;line-height:1.65}
#chatSearchList small{display:block;font-size:10px;opacity:.5;margin-top:8px}
#chatSearchList mark,#chatSourceBody mark{background:var(--ink,#111);color:var(--on-ink,#fff);padding:0 2px;border-radius:3px}
.cr-more{background:var(--fill);color:var(--ink);border:1px solid var(--line,rgba(var(--tint-rgb),.1));border-radius:12px;padding:12px;font:inherit;font-size:12px;flex-shrink:0}
#chatSourceBackdrop{z-index:10010}
#chatSourceBody{max-height:57vh;overflow:auto;overscroll-behavior:contain;margin:12px 0;text-align:left}
.cr-source-row{padding:13px;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.8;margin-bottom:10px;border:1px solid var(--line,rgba(var(--tint-rgb),.1))}
.cr-source-row b{display:block;font-size:11px;opacity:.6;margin-bottom:6px}
.cr-source-row.matched{background:var(--fill);border-color:var(--ink)}
@media(min-width:600px){#chatSearchList{max-height:50vh}}

#chatSourceBody{margin:12px 18px}
#chatSourceClose{width:calc(100% - 36px);margin-left:18px}

/* 阅读导航与消息资料页 */
.talk-view{position:relative}
.chat-reading-nav{position:absolute;right:16px;z-index:6;display:flex;gap:7px}
.chat-reading-nav[hidden],#chatUnreadBtn[hidden]{display:none!important}
.chat-reading-nav button{border:1px solid var(--hairline);border-radius:30px;background:var(--card);color:var(--ink);padding:9px 13px;font:inherit;font-size:11px;box-shadow:0 3px 18px rgba(var(--tint-rgb),.08)}
.chat-unread-divider{display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;color:var(--gray-2);margin:16px 0}
.chat-unread-divider::before,.chat-unread-divider::after{content:'';height:1px;background:var(--hairline);flex:1}
.msg-quote[data-quote-id]{cursor:pointer}
.chat-located .msg-bubble{outline:1px solid var(--gray-3);outline-offset:4px}
.center-backdrop.record-backdrop{padding:14px;z-index:95}
.record-media-backdrop{z-index:98}
.center-card.record-hub{max-width:560px;max-height:85%;width:100%;padding:20px 18px;display:flex;flex-direction:column;overflow:hidden;text-align:left}
.record-hub-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}
.record-hub-head b{font-size:18px;line-height:1.4}
.record-hub-head small{display:block;color:var(--gray-2);font-size:11px;margin-top:5px}
.record-hub-head button,.record-media-actions button{border:1px solid var(--hairline);border-radius:20px;background:var(--fill);color:var(--ink);font:inherit;font-size:12px;padding:9px 13px;flex-shrink:0}
.record-collection-body,#recordMediaBody{overflow:auto;overscroll-behavior:contain;min-height:0}
.record-favorite{border:1px solid var(--hairline);border-radius:17px;margin-bottom:12px;overflow:hidden;background:var(--fill)}
.record-favorite-open{display:block;width:100%;text-align:left;border:0;padding:14px;background:none;color:var(--ink);font:inherit}
.record-favorite small{color:var(--gray-2);font-size:11px}
.record-favorite p{font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0}
.record-unstar{display:block;margin:0 14px 12px auto;border:0;background:none;color:var(--gray-1);font:inherit;font-size:11px;padding:5px}
.record-empty{padding:22px 12px;color:var(--gray-2);font-size:13px;line-height:1.8;text-align:center}
.record-album{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.record-photo{position:relative;padding:0;border:0;background:var(--fill);border-radius:13px;overflow:hidden;aspect-ratio:1;min-width:0}
.record-photo img{width:100%;height:100%;object-fit:cover;display:block}
.record-photo small{position:absolute;bottom:0;left:0;right:0;padding:5px;background:rgba(0,0,0,.4);color:#fff;font-size:9px}
.record-album .record-empty,.record-more{grid-column:1/-1}
.record-more{width:100%;border:1px solid var(--hairline);border-radius:13px;padding:10px;background:var(--fill);color:var(--ink);font:inherit;font-size:12px}
#recordMediaBody{margin:18px 0}
#recordMediaBody img{max-width:100%;max-height:48vh;object-fit:contain;display:block;margin:0 auto 14px;border-radius:12px}
#recordMediaBody p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.8}
.record-media-actions{display:flex;gap:8px;flex-shrink:0}
.record-archive-star{border:0;border-radius:16px;padding:7px 12px;background:var(--fill);color:var(--gray-1);font:inherit;font-size:11px;margin-top:12px}
.msg-menu{max-height:80vh;overflow:auto}

/* Collections fill the app; the header owns its safe area and never scrolls away. */
.center-backdrop.record-collection{padding:0;background:var(--bg);align-items:stretch;overflow:hidden;}
.center-card.record-collection-page{width:100%;height:100%;min-height:0;max-width:none;max-height:none;box-sizing:border-box;border:0;border-radius:0;box-shadow:none;background:var(--bg);color:var(--ink);padding:0;transform:none;}
.record-collection-page .record-hub-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding:calc(var(--head-top,0px) + 14px) 18px 16px;border-bottom:1px solid var(--hairline);margin:0;background:var(--bg);color:var(--ink);}
.record-collection-page .record-hub-head>div{min-width:0;}
.record-collection-page .record-hub-head b{display:block;font-size:18px;overflow-wrap:anywhere;}
.record-collection-page .record-hub-head small{line-height:1.5;overflow-wrap:anywhere;}
.record-collection-page [data-record-close]{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:44px;padding:10px 12px;border-radius:14px;font-size:13px;color:var(--ink);white-space:nowrap;}
.record-collection-page [data-record-close] svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.record-collection-body{flex:1;min-height:0;padding:18px 18px calc(var(--foot-bottom,0px) + 18px);}
.record-collection-body.record-album{align-content:start;}

.center-card.chat-import-card{max-width:420px;text-align:left;padding:22px;}
.chat-import-card>b{font-size:18px;}.chat-import-card>p{font-size:13px;line-height:1.7;}.chat-import-note{color:var(--gray-2);}.chat-import-card>small{font-size:11px;color:var(--gray-2);}
#chatImportPreview{max-height:35vh;overflow:auto;margin:15px 0;overflow-wrap:anywhere;}#chatImportPreview article{padding:12px;border-radius:12px;background:var(--fill);margin:8px 0;}#chatImportPreview b{font-size:11px;color:var(--gray-2);}#chatImportPreview p{font-size:13px;line-height:1.7;white-space:pre-wrap;margin:7px 0 0;}
.chat-import-actions{display:flex;gap:10px;}.chat-import-actions button{flex:1;border:0;border-radius:12px;padding:11px;background:var(--fill);color:var(--ink);font:inherit;font-size:13px;}#chatImportSave{background:var(--ink);color:var(--on-ink);}#chatImportSave:disabled{opacity:.4;}

/* v1.6.45: compact calls, readable speaker alignment and message actions. */
.call-screen{background:linear-gradient(160deg,#1d1d23,#111115)}.call-head{padding:8px 16px 0}.call-mode-tag{border:0;color:#e9e9ec;font-family:inherit;cursor:pointer;background:#ffffff0d}.call-mode-tag:disabled{opacity:.4;cursor:default}.call-hero{padding:8px 16px 10px}.call-avatar,.call-avatar-initial{width:60px;height:60px;border-radius:21px;box-shadow:0 6px 20px #0002}.call-avatar-initial{font-size:24px}.call-name{margin-top:8px;font-size:17px}.call-status{font-size:11px;margin-top:4px}.call-body{padding:12px 18px;gap:14px}.call-line{padding:0;margin:0;border-radius:0;max-width:88%;flex-shrink:0;animation:none;cursor:default;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.call-line.me{align-self:flex-end;text-align:right;color:#f1f1f4}.call-line.ta{align-self:flex-start;text-align:left}.call-msg-name{font-size:10px;line-height:1.5;color:#ffffff70;margin-bottom:5px}.call-msg-content{background:none;border-radius:0;padding:0;font-size:14px;line-height:1.8;white-space:pre-wrap}.call-line.me .call-msg-content{background:none;border-radius:0}.call-line.aside{padding:5px 10px;background:none;font-style:normal;font-size:11px;line-height:1.8;max-width:90%;color:#ffffff70}.call-line.sys{max-width:95%}.call-foot{padding:8px 14px calc(10px + env(safe-area-inset-bottom));gap:9px;border-top:1px solid #ffffff09}.call-input-row{gap:7px}.call-input{border-radius:13px;padding:10px 11px;font-size:13px;background:#ffffff0c}.call-act-btn{width:38px;height:40px;padding:0;border-radius:13px;display:grid;place-items:center;background:#ffffff0b}.call-act-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.call-round{gap:3px;font-size:10px;padding:3px 6px}.call-round i{width:42px;height:42px}.call-round i svg{width:22px;height:22px}.call-btn-row{gap:30px}.call-context-menu[hidden],.call-select-bar[hidden]{display:none}
.call-context-menu{position:absolute;z-index:11010;display:flex;align-items:center;max-width:calc(100% - 16px);overflow-x:auto;white-space:nowrap;background:#34343c;color:#fff;border:1px solid #ffffff20;border-radius:10px;padding:3px;box-shadow:0 5px 18px #0005}
.call-context-menu button{flex-shrink:0;border:0;border-radius:7px;background:none;color:inherit;font:inherit;font-size:12px;line-height:1.4;padding:10px 13px;cursor:pointer}
.call-context-menu button:active{background:#ffffff15}.call-context-menu .danger,.call-select-bar .danger{color:#ef9097}
.call-select-bar{display:flex;align-items:center;gap:8px;flex-shrink:0;padding:8px 14px;border-top:1px solid #ffffff12;color:#ffffffc0;font-size:12px}
.call-select-bar span{flex:1;text-align:center}.call-select-bar button{border:0;background:none;color:inherit;font:inherit;padding:8px;cursor:pointer}.call-select-bar button:disabled{opacity:.35}
.call-body.selecting .call-line{position:relative;max-width:100%;width:100%;padding-left:30px;box-sizing:border-box;cursor:pointer}
.call-body.selecting .call-line::before{content:'';position:absolute;left:0;top:4px;width:17px;height:17px;border:1px solid #ffffff60;border-radius:50%;box-sizing:border-box}
.call-body.selecting .call-line.picked::before{content:'✓';background:#ffffffd0;color:#222;border-color:transparent;display:grid;place-items:center;font-size:12px;line-height:1}
#callEditBackdrop{z-index:11020}#heartBackdrop.call-heart-active{z-index:11030}.call-screen.group .call-av{width:40px;height:40px;border-radius:13px}.call-screen.group .call-hero{padding-top:8px}.call-screen .call-joined-tip{font-size:10px;line-height:1.5}.call-screen.ringing .call-hero{padding-top:20px}

/* 线下每层：章节主题 → 场景细目 → 正文 → 心声等状态 */
@font-face{
  font-family:'Canoe Allura';
  src:url('../assets/fonts/Allura-Regular.ttf') format('truetype');
  font-weight:400; font-style:normal; font-display:swap;
}
.off-scene-head{
  margin:0 0 20px; padding:4px 0 14px;
  color:var(--sk-off-ink,var(--ink)); text-align:center; white-space:normal;
  border-bottom:1px solid rgba(var(--ink-rgb,34,34,34),.13);
}
.off-scene-title{
  font-family:'Kaiti SC','STKaiti','KaiTi','Songti SC','Noto Serif CJK SC',serif;
  font-size:21px; font-weight:500; line-height:1.65;
  letter-spacing:.34em; padding-left:.34em;
}
.off-scene-en{
  font-family:'Canoe Allura','Snell Roundhand','Segoe Script',cursive;
  font-size:22px; font-weight:400; line-height:1.25;
  margin:0 0 12px; opacity:.72; overflow-wrap:anywhere;
}
.off-scene-details{
  max-width:100%; overflow-x:auto; overscroll-behavior-x:contain;
  scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.off-scene-details::-webkit-scrollbar{display:none;}
.off-scene-row{
  display:flex; width:max-content; min-width:100%; align-items:center;
  justify-content:space-between; gap:10px; white-space:nowrap;
  font-family:system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  font-size:10px; line-height:1.8; letter-spacing:.01em; opacity:.78;
}
.off-scene-cell{flex:none; white-space:nowrap;}
.off-scene-title + .off-scene-details{margin-top:8px;}
@media(max-width:350px){
  .off-scene-title{font-size:20px;}
  .off-scene-en{font-size:20px;}
  .off-scene-row{font-size:9px; gap:8px;}
}

/* 默认小表情：跟随文字颜色和字号，保留原作粉腮红。 */
svg.inline-emoji{display:inline-block!important;width:1.4em!important;height:1.4em!important;max-width:none;max-height:none;vertical-align:-.3em;margin:0 .07em;flex:none;overflow:visible;color:inherit;pointer-events:none;}
.inline-emoji-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;width:100%;}
.inline-emoji-pick{border:0;background:transparent;color:var(--ink,#26272a);min-width:0;min-height:52px;padding:7px 2px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;border-radius:10px;cursor:pointer;}
.inline-emoji-pick:active,.inline-emoji-pick:focus-visible{background:rgba(128,128,128,.12);outline:1px solid currentColor;}
.inline-emoji-pick svg.inline-emoji{font-size:19px;}
.inline-emoji-pick span{font-size:10px;line-height:1.3;white-space:nowrap;}
.inline-emoji-hint{grid-column:1/-1;font-size:11px;color:var(--muted,#777);margin:3px 0 9px;}
#stickerGrid:has(.inline-emoji-grid){display:block;}
.inline-emoji-draft{padding:6px 14px 8px;background:var(--card,#fafafa);color:var(--ink,#26272a);border-top:1px solid rgba(128,128,128,.12);font-size:14px;max-height:92px;overflow:auto;overflow-wrap:anywhere;white-space:pre-wrap;}
.inline-emoji-draft[hidden]{display:none;}
.inline-emoji-draft small{display:block;font-size:10px;color:var(--muted,#777);margin-bottom:4px;}
/* 选择表情时让出底部操作区域，保留悬浮球的位置与设置。 */
body:has(#stickerPanel:not([hidden])) #memoFloat{visibility:hidden;pointer-events:none;}

/* Entire if story is a copy target, including title and body. */
.off-sb-ifs li{padding:0;}
.off-if-copy{display:block;width:100%;padding:8px 10px;border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
.off-if-copy:focus-visible{outline:2px solid var(--ink);outline-offset:4px;}
.off-if-copy:active{opacity:.7;}

/* Complete story dates remain visible on narrow screens. */
.off-scene-row{width:100%;min-width:0;flex-wrap:wrap;justify-content:flex-start;column-gap:14px;row-gap:3px;white-space:normal}.off-scene-cell{max-width:100%;overflow-wrap:anywhere}.off-scene-details{overflow-x:visible}

.off-scene-cell:not(:first-child){white-space:normal}

.talk-blank-menu{position:fixed!important;z-index:12000!important;min-width:174px;padding:5px;background:var(--card,#fff);color:var(--ink,#111);border:1px solid var(--hairline,#e5e5e5);border-radius:13px;box-shadow:0 7px 25px #0002;max-width:calc(100vw - 24px)}.talk-blank-menu[hidden]{display:none!important}.talk-blank-menu button{display:block;width:100%;padding:12px 14px;border:0;border-radius:9px;background:transparent;color:inherit;font:13px var(--font-body,sans-serif);text-align:left;white-space:nowrap}.talk-blank-menu button:focus-visible,.talk-blank-menu button:hover{background:var(--fill,#f5f5f5)}

#callNarrationBtn{font-size:11px;flex-shrink:0}#callNarrationBtn[aria-pressed="true"]{background:#ffffff30}.call-user-aside{font-style:italic;opacity:.75}

/* Keep errors above call and heart overlays. */
#errBackdrop{z-index:12050}

.off-title-text{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}