/* 浏览器参会页样式：与客户端同一套暗色 + 金色，但一切都为"竖屏单手"服务。
   字号与点击区都按 44px 最小热区来，手机上不会点不中。 */
:root {
  --bg: #101317;
  --bg2: #171b21;
  --line: #242a33;
  --gold: #e3b979;
  --gold2: #d4a95e;
  --text: #e8eaf0;
  --muted: #9aa1ad;
  /* 三色规则（2026-10-27）：只有深底/浅字/暖金。这两个变量名保留，值统一成金与灰，
     免得漏改的地方变成"未定义色"。 */
  --red: #e3b979;
  --green: #8f959f;
  /* 声明深色：安卓 WebView 的"自动深色"看到这条就不再反色整页，
     系统控件（滚动条/光标/选择框）也跟着深色走，暗底上不会冒出白杠。 */
  color-scheme: dark;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  background: radial-gradient(1200px 600px at 50% -10%, #1c2129 0%, var(--bg) 55%);
  color: var(--text);
  font: 15px/1.7 -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior: none;
  /* 锁住"文本自动放大"：微信 X5 与安卓 WebView 会按系统字号给正文做 font boosting，
     不锁的话说明文字被放大、按钮被顶出屏幕。真机上系统字号调大的用户不少。 */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
/* dvh 是"动态视口高度"（iOS 地址栏收起/展开时不跳），但 Android 微信 X5 与
   iOS 15.4 以前的内核**不认 dvh**：只写 dvh 时这条整句作废，height 变 auto，
   参会页会塌成一条（真机上就是白屏只剩卡片）。必须先给 vh 兜底。 */
.screen { display: none; height: 100vh; height: 100dvh; }
.screen.is-active { display: flex; }
[data-screen="home"], [data-screen="waiting"] { align-items: center; justify-content: center; padding: 24px; }

.card {
  width: 100%; max-width: 440px; background: var(--bg2); border: 1px solid var(--line);
  border-radius: 18px; padding: 28px 24px; box-shadow: 0 12px 48px rgba(0, 0, 0, .5);
}
.mark { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.dot { width: 10px; height: 10px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 12px rgba(227, 185, 121, .8); }
.mark b { font-weight: 600; letter-spacing: 2px; }
h1 { font-size: 20px; font-weight: 600; margin-bottom: 6px; }
.sub { color: var(--muted); font-size: 13px; margin-bottom: 18px; }
label { display: block; font-size: 12px; color: var(--muted); margin: 14px 0 6px; letter-spacing: 1px; }
textarea, input {
  width: 100%; background: #0d1014; color: var(--text); border: 1px solid var(--line);
  border-radius: 12px; padding: 12px 14px; font: inherit; font-size: 14px; resize: none;
  outline: none; transition: border-color .15s;
}
textarea:focus, input:focus { border-color: var(--gold2); }
textarea { font-family: ui-monospace, Consolas, monospace; letter-spacing: 1px; }
.btn {
  display: block; width: 100%; text-align: center; padding: 14px; border: 0; border-radius: 12px;
  font-size: 15px; font-weight: 600; letter-spacing: 1px; cursor: pointer;
  background: linear-gradient(135deg, var(--gold), var(--gold2)); color: #151515; margin-top: 18px;
}
.btn:disabled { opacity: .55; cursor: default; }
.btn.ghost { background: transparent; color: var(--muted); border: 1px solid var(--line); font-weight: 500; }
/* hidden 属性会被 .btn 的 display:block 压掉（作者样式优先于 UA 的 [hidden]{display:none}）：
   手机上没有共享屏幕、或设备只有一个摄像头时，按钮本该收起，实际会留成一个死按钮。 */
.btn[hidden] { display: none; }
.hint { font-size: 12.5px; color: var(--muted); margin-top: 12px; min-height: 20px; }
.hint:empty { display: none; }   /* 没消息就不占位（极简：卡上只留 LOGO+名字+按钮） */
.kv { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; background: #0d1014; border: 1px solid var(--line); border-radius: 12px; margin-bottom: 6px; }
.kv span { color: var(--muted); font-size: 12px; }
.kv b { font-family: ui-monospace, Consolas, monospace; letter-spacing: 3px; color: var(--gold); }

/* ---------- 会议 ---------- */
[data-screen="meeting"] { flex-direction: column; }
[data-screen="meeting"] header {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 16px; padding-top: max(12px, env(safe-area-inset-top));
  border-bottom: 1px solid var(--line); font-size: 13px; color: var(--muted);
}
[data-screen="meeting"] header .left { display: flex; align-items: center; gap: 8px; }
[data-screen="meeting"] header .right { display: flex; align-items: center; gap: 8px; }
[data-screen="meeting"] header .sep { opacity: .4; }
/* 录制中角标：录的是别人的脸，必须一眼看得见；只用金色（三色规则），不加红点 */
.rec-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--gold); letter-spacing: .5px;
  border: 1px solid rgba(227, 185, 121, .45); background: rgba(227, 185, 121, .12);
  padding: 2px 8px; border-radius: 999px; white-space: nowrap;
}
.rec-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); animation: recPulse 1.4s infinite ease-in-out; }
@keyframes recPulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
.rec-badge[hidden] { display: none; }
/* 角标可点（直达录制控制） */
.rec-badge[role="button"] { cursor: pointer; }

/* 录制控制排：开始/结束 与 暂停/继续 并排 */
.rec-row { display: flex; gap: 8px; }
.rec-row .btn { flex: 1; }

/* ---------- 更多：美颜 / 录制 / 共享屏幕 ---------- */
.more-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
.more-box { padding: 14px 16px 6px; border-bottom: 1px solid var(--line); }
.more-box:last-child { border-bottom: 0; }
.more-box h4 { font-size: 13px; font-weight: 600; color: var(--text); letter-spacing: 1px; margin-bottom: 10px; }
.more-box .hint { margin: 0 0 10px; }
.more-box .btn { margin-top: 0; }
.more-box .btn.is-on { border-color: rgba(227, 185, 121, .55); background: rgba(227, 185, 121, .12); color: var(--gold); }
/* 会中改名：输入框 + 按钮一行 */
.name-row { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.name-input {
  flex: 1; min-width: 0; height: 38px; padding: 0 12px; border-radius: 10px;
  background: var(--bg2); border: 1px solid var(--line); color: var(--text);
  font: inherit; font-size: 14px;
  /* 手机聚焦时不要被系统按字号放大（<16px 会放大整页，按钮被顶出屏幕） */
  -webkit-text-size-adjust: 100%;
}
.name-input:focus { outline: none; border-color: rgba(227, 185, 121, .55); }
.name-row .btn { flex: none; margin-top: 0; }
.seg { display: flex; gap: 8px; margin-bottom: 10px; }
.seg button {
  flex: 1; padding: 11px 0; border-radius: 12px; border: 1px solid var(--line);
  background: #0d1014; color: var(--muted); font: inherit; font-size: 13px; cursor: pointer;
}
.seg button.is-on { border-color: rgba(227, 185, 121, .55); background: rgba(227, 185, 121, .12); color: var(--gold); }
.seg button:disabled { opacity: .45; }
.live { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px rgba(227, 185, 121, .8); }
.kv-mini b { font-family: ui-monospace, Consolas, monospace; color: var(--gold); letter-spacing: 2px; }
.mini-btn {
  background: transparent; border: 1px solid var(--line); border-radius: 999px;
  color: var(--muted); font: inherit; font-size: 12px; padding: 5px 10px; cursor: pointer;
  min-height: 40px;   /* 触摸目标：手机上拇指可点（2026-10-25 真人路径体检） */
}
.mini-btn b { font-family: ui-monospace, Consolas, monospace; color: var(--gold); letter-spacing: 2px; }

#stage {
  flex: 1; display: grid; gap: 8px; padding: 8px; overflow: hidden;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  /* 行高强制均分舞台高度：宽屏下 16:9 会算出比舞台还高的格子，
     两行一叠就把底部（名字胶囊在那）裁出视野——2026-10-22 实测踩到。
     格子始终铺满分到的行，比例交给 object-fit: cover 去照顾。 */
  grid-auto-rows: minmax(0, 1fr);
  align-content: stretch;
}
#stage[data-n="1"] { grid-template-columns: 1fr; }
#stage[data-n="2"] { grid-template-columns: 1fr; }
#stage[data-share="1"] { grid-template-columns: 1fr; }

.tile {
  position: relative; background: #0b0e12; border: 1px solid var(--line);
  border-radius: 14px; overflow: hidden; min-height: 0; min-width: 0;
  width: 100%; height: 100%;
}
.tile video { width: 100%; height: 100%; object-fit: cover; display: block; background: #0b0e12; }
/* 自视镜像：前置自拍看着自己才是对的（微信/腾讯会议都这样）。
   切到后置摄像头后必须取消镜像，否则拍到的白板/实物在自视里是左右反的。 */
.tile.is-self video { transform: scaleX(-1); }
.tile.is-self.rear video { transform: none; }
.tile .name {
  position: absolute; left: 10px; bottom: 10px; max-width: 70%;
  padding: 4px 10px; border-radius: 999px; font-size: 12px;
  background: rgba(8, 10, 14, .72); backdrop-filter: blur(6px);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tile .badge { position: absolute; right: 10px; bottom: 10px; font-size: 11px; color: var(--muted); }
.tile.is-self .name { color: var(--gold); }
.tile video.muted-avatar { display: none; }
.tile .avatar {
  position: absolute; inset: 0; display: none; align-items: center; justify-content: center;
  font-size: 34px; color: var(--gold); background: radial-gradient(60% 60% at 50% 40%, #1a1f27, #0b0e12);
}
.tile.no-video .avatar { display: flex; }

/* 谁在说话：金色描边 + 轻微光晕，200ms 一拍，停说约 1 秒后熄灭 */
.tile.speaking { border-color: var(--gold); box-shadow: 0 0 0 1.5px var(--gold), 0 0 16px rgba(227, 185, 121, .3); }
.tile.speaking .name { color: var(--gold); }
/* 远端静音：左上角 🔇 角标（state 报文主口径 + 轨道 mute 叠加） */
.tile .mic-flag {
  position: absolute; left: 8px; top: 8px; z-index: 2;
  padding: 3px 7px; border-radius: 7px; font-size: 12px; line-height: 1;
  background: rgba(8, 10, 14, .62); border: 1px solid rgba(255, 255, 255, .12);
}
.tile .mic-flag[hidden] { display: none; }
/* 举手：名字条后面缀 ✋（state 报文驱动，与主持端同源） */
.tile.hand .name::after { content: " ✋"; }
/* 自动播放被浏览器拒绝：tile 中间亮提示，点击任意处重试后消失 */
.tile .tap-cue {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  padding: 8px 16px; border: 1px solid var(--gold); border-radius: 999px;
  background: rgba(8, 10, 14, .82); color: var(--gold); font-size: 13px;
  cursor: pointer; white-space: nowrap; z-index: 2;
}
.tile .tap-cue[hidden] { display: none; }
/* 一键诊断：小号文字按钮，安静但找得到 */
.diag-link {
  margin-top: 10px; padding: 6px 0; width: 100%;
  background: none; border: none; color: var(--muted);
  font-size: 12px; text-decoration: underline; cursor: pointer;
}
.diag-link:hover { color: var(--gold); }
.diag-link[hidden] { display: none; }

/* 底栏实际高度：12+54+12（触摸热区）/ 窄屏 12+48+12，再加安全区。
   面板用这个值定位自己，两处必须同步改。 */
:root { --dock-h: calc(66px + max(12px, env(safe-area-inset-bottom, 0px))); }

[data-screen="meeting"] footer {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  padding: 12px 16px; padding-bottom: max(12px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line); background: rgba(13, 16, 20, .9);
}
.ctrl {
  width: 54px; height: 54px; border-radius: 50%; border: 1px solid var(--line);
  background: #12161c; color: var(--text); display: grid; place-items: center; cursor: pointer;
}
.ctrl svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ctrl.on { color: var(--gold); border-color: rgba(227, 185, 121, .45); }
.ctrl.off { color: var(--gold); border-color: rgba(227, 185, 121, .45); background: rgba(227, 185, 121, .1); }
.ctrl.danger { color: var(--gold); border-color: rgba(227, 185, 121, .5); }

.toast {
  position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%) translateY(10px);
  background: rgba(20, 24, 30, .96); border: 1px solid var(--line); color: var(--text);
  padding: 10px 16px; border-radius: 999px; font-size: 13px; opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; max-width: 88vw; text-align: center; z-index: 30;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
/* 两条顶部横幅同一个样子：深底 + 金边（三色规则，不引入红）。
   offline = 我自己和服务器断了；host-lost = 我和主持人之间的链路断了（可能只是他断网）。
   两者必须分开说——真机上主持人在地铁里掉线一分钟，参会者被告知"会议已结束"，
   人就全散了，主持人回来也找不回来。 */
#offline, #host-lost, #link-stuck {
  top: max(12px, env(safe-area-inset-top)); bottom: auto;
  background: rgba(16, 19, 23, .95); border: 1px solid rgba(227, 185, 121, .5);
  color: var(--gold); display: none;
}
#offline.show-warn.is-on, #host-lost.show-warn.is-on, #link-stuck.show-warn.is-on {
  display: block; opacity: 1; transform: translateX(-50%) translateY(0);
}
/* 这条字数比另外两条长得多：不放宽就缩成 195px 宽、五行的细长条（手机上极难读） */
#link-stuck { width: max-content; line-height: 1.55; }

/* ---------- 聊天抽屉 ---------- */
#btn-chat { position: relative; }
#btn-chat .badge {
  position: absolute; top: -2px; right: -2px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: var(--gold); color: #14100a; font-size: 11px; line-height: 18px;
  text-align: center; font-weight: 600; box-shadow: 0 0 0 2px var(--bg);
}
#btn-chat .badge[hidden] { display: none; }

.sheet {
  /* 关键：面板必须坐在底栏**上面**（bottom = 底栏高度），否则手机上面板会整块盖住
     聊天/成员按钮，"再点一次同一个按钮就收起"根本点不到——点了落在面板上。
     2026-10-28 自动化实测抓到的就是这个（F1 聊天 true→true）。 */
  position: fixed; left: 0; right: 0; z-index: 25;
  /* 键盘弹起时必须整体抬到键盘上方：iOS 只缩 visualViewport，fixed 元素仍按布局视口
     排版，聊天输入框（在面板最下面）会被键盘整块埋掉——打字看不见自己打的字。
     --kb-h 由 JS 按 visualViewport 实时写入，没有键盘时是 0。 */
  bottom: calc(var(--dock-h) + var(--kb-h, 0px));
  display: flex; flex-direction: column;
  height: min(62vh, 520px);
  height: min(62dvh, 520px);
  /* 抬起来之后还要把高度收住，否则面板顶会窜出屏幕上沿（键盘占了近半屏时尤其明显） */
  max-height: calc(100vh - var(--dock-h) - var(--kb-h, 0px) - 8px);
  max-height: calc(100dvh - var(--dock-h) - var(--kb-h, 0px) - 8px);
  background: var(--bg2); border-top: 1px solid var(--line);
  border-radius: 18px 18px 0 0; box-shadow: 0 -14px 48px rgba(0, 0, 0, .55);
}
.sheet[hidden] { display: none; }
.sheet-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--line); font-size: 14px;
}
.sheet-x {
  background: transparent; border: 0; color: var(--muted); font: inherit; font-size: 13px;
  /* 触摸目标：手机上 34px 高的"收起"实测点不准（第十二轮可用性体检抓到的） */
  padding: 6px 4px; cursor: pointer; min-width: 44px; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
}
.chat-list {
  flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px;
  -webkit-overflow-scrolling: touch;
}
.chat-list .msg { display: flex; flex-direction: column; gap: 3px; max-width: 84%; }
.chat-list .msg.mine { align-self: flex-end; align-items: flex-end; }
.chat-list .who { font-size: 11.5px; color: var(--muted); }
.chat-list .bubble {
  padding: 9px 13px; border-radius: 14px; background: #0d1014; border: 1px solid var(--line);
  font-size: 14px; line-height: 1.55; word-break: break-word; white-space: pre-wrap;
}
.chat-list .msg.mine .bubble {
  background: rgba(227, 185, 121, .14); border-color: rgba(227, 185, 121, .35); color: var(--text);
}
.chat-list .sys { align-self: center; color: var(--muted); font-size: 12px; }
.sheet-foot {
  display: flex; gap: 10px; padding: 10px 14px 14px; border-top: 1px solid var(--line);
}
.sheet-foot input { flex: 1; background: #0d1014; color: var(--text); border: 1px solid var(--line);
  border-radius: 12px; padding: 12px 14px; font: inherit; font-size: 14px; outline: none; }
.sheet-foot input:focus { border-color: var(--gold2); }
.sheet-foot .send {
  min-width: 64px; border: 0; border-radius: 12px; font: inherit; font-size: 14px; font-weight: 600;
  background: linear-gradient(135deg, var(--gold), var(--gold2)); color: #151515; cursor: pointer;
}
.sheet-foot .send:disabled { opacity: .5; }

/* 七个按钮（含共享/举手）要挤进 360px 宽的手机：共享按钮在手机上被 JS 藏掉，
   实际 6 个；热区仍 >44px，只是间距收窄 */
@media (max-width: 420px) {
  /* 底栏实际高度：12+54+12（触摸热区）/ 窄屏 12+48+12，再加安全区。
   面板用这个值定位自己，两处必须同步改。 */
:root { --dock-h: calc(66px + max(12px, env(safe-area-inset-bottom, 0px))); }

[data-screen="meeting"] footer { gap: 8px; padding-left: 8px; padding-right: 8px; }
  :root { --dock-h: calc(60px + max(12px, env(safe-area-inset-bottom, 0px))); }
  .ctrl { width: 48px; height: 48px; }
  .ctrl svg { width: 21px; height: 21px; }
}

/* 手机竖屏 3 人以上：两列。单列会把每个人压成一条横带（六人时实测 374×108），
   两列是 183×230，人脸大得多，也更符合手机上"2×3 宫格"的直觉。共享画面仍单列。 */
@media (max-width: 700px) {
  #stage[data-many="1"]:not([data-share="1"]) { grid-template-columns: 1fr 1fr; }
}

/* ---------- 宽屏适配（2026-10-25 真机反馈：电脑上两人竖排被压扁裁脸、聊天抽屉盖住全场） ---------- */
@media (min-width: 700px) {
  /* 两人/三人：横排网格，别再竖着叠 */
  #stage[data-n="2"] { grid-template-columns: 1fr 1fr; }
  #stage:not([data-n="1"]):not([data-share="1"]) { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  /* 单人格子别铺满全宽：按视口高度反推 16:9 上限，脸不会被横向拉爆 */
  .tile { max-width: calc((100vh - 210px) * 16 / 9); justify-self: center; }
  /* 聊天/投票/成员抽屉在宽屏改成右侧面板，不再盖住视频 */
  .sheet {
    left: auto; right: 0; top: 0; bottom: 0;
    width: 360px; height: auto; max-height: none;
    border-radius: 0; border-top: 0; border-left: 1px solid var(--line);
    box-shadow: -14px 0 48px rgba(0, 0, 0, .45);
  }
  /* 抽屉开着时，主区（含离开按钮）向左让位，别被盖住 */
  [data-screen="meeting"]:has(.sheet:not([hidden])) #stage { margin-right: 360px; }
  [data-screen="meeting"]:has(.sheet:not([hidden])) header { padding-right: 372px; }
  [data-screen="meeting"]:has(.sheet:not([hidden])) footer { padding-right: 372px; }
}

/* ---------- 投票 ---------- */
.vote-box { flex: 1; overflow-y: auto; padding: 14px 16px 20px; }
.vote-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 28px 0; }
.vote-card { display: flex; flex-direction: column; gap: 12px; }
.vote-q { font-size: 15px; font-weight: 600; line-height: 1.5; }
.vote-rows { display: flex; flex-direction: column; gap: 10px; }
.vote-row { display: flex; flex-direction: column; gap: 6px; }
.vote-opt {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 14px; border-radius: 12px; background: #0d1014; border: 1px solid var(--line);
  color: var(--text); font: inherit; font-size: 14px; cursor: pointer; text-align: left;
}
.vote-opt b { font-family: ui-monospace, Consolas, monospace; color: var(--gold); }
.vote-opt.picked { border-color: rgba(227, 185, 121, .55); background: rgba(227, 185, 121, .1); }
.vote-opt:disabled { cursor: default; opacity: .75; }
.vote-bar { height: 4px; border-radius: 999px; background: #0d1014; overflow: hidden; }
.vote-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold2), var(--gold)); transition: width .25s; }
.vote-meta { font-size: 12.5px; color: var(--muted); }
.vote-detail { font-size: 12.5px; color: var(--muted); line-height: 1.9; word-break: break-word; }

/* ---------- 成员 ---------- */
.members-list { flex: 1; overflow-y: auto; padding: 8px 16px; }
.member-row {
  display: flex; align-items: center; gap: 10px; padding: 12px 0;
  border-bottom: 1px solid var(--line); font-size: 14px;
}
.member-row:last-child { border-bottom: 0; }
.member-row .who { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-row .tag {
  font-size: 11px; padding: 2px 8px; border-radius: 999px;
  border: 1px solid rgba(227, 185, 121, .4); color: var(--gold);
}
.member-row .via { font-size: 11.5px; color: var(--muted); font-family: ui-monospace, Consolas, monospace; }
.member-row .via.direct { color: var(--green); }
.members-note { padding: 10px 16px 16px; color: var(--muted); font-size: 12px; line-height: 1.7; }

/* ---------- 屏幕共享 ---------- */
.tile .badge.share {
  position: absolute; right: 10px; bottom: 10px; font-size: 11px;
  padding: 3px 9px; border-radius: 999px;
  background: rgba(227, 185, 121, .18); border: 1px solid rgba(227, 185, 121, .45); color: var(--gold);
}
.tile[data-sharing="1"] video { object-fit: contain; background: #05070a; }
/* 共享时自己那格显示的是屏幕内容：不能镜像，否则整页文字全反 */
.tile.is-self[data-sharing="1"] video { transform: none; }

/* ---------- 中继模式角标（>6 人时出现在顶栏，让人知道画面经服务器转发） ---------- */
.sfu-badge {
  margin-left: 8px; font-size: 11px; padding: 2px 8px; border-radius: 999px;
  color: var(--gold); background: rgba(227, 185, 121, .12);
  border: 1px solid rgba(227, 185, 121, .35); white-space: nowrap;
}

/* 隐私说明（折叠一行字，不占地方） */
.privacy-mini { margin-top: 16px; font-size: 12px; color: var(--muted); }
.privacy-mini summary { cursor: pointer; padding: 6px 0; text-align: center; letter-spacing: 1px; }
.privacy-mini summary:hover { color: var(--gold); }
.privacy-mini p { margin: 4px 0 0; line-height: 1.85; color: var(--muted); }