交互：表情面板 + 短文快发盒 + 双 UI 手机导航重做 + 社交链接与统计脚本接入

评论表情
- 发布 / 回复 / 编辑三处输入框挂上表情面板（EmojiPicker + emoji.js）：
  「表情 / 颜文字」两个 tab，光标处插入（insertAtCursor，未聚焦追加到
  末尾），面板自己管点外 / Esc 收起
- 操作钮 ✎ ✕ ↩ 圆图标改文字钮（回复 / 编辑 / 删除），删除悬停给红，
  补 focus-visible；编辑态去掉「正在改定此评：」交给 placeholder

双 UI 手机导航（参考 innei.in 的底部胶囊 + 上拉菜单）
- 余白：顶栏手机端整条退场，底部悬浮 dock（品牌 + NavBurger 汉堡），
  点开上拉毛玻璃菜单：mono 序号 01-05 + 中文大字 + 英文小字，当前项
  强调色 + 左缘短杠，逐项错峰 45ms 入场；dock 在菜单之下原位变 ✕
- classic：顶栏 brand 居中（三列网格）+ NavBurger + 下拉纸片；下滑隐藏
  上滑唤回——上滑要累计 40px 才算数（页面高度稳定时浏览器会回弹几十
  像素，那种「假上滑」不拉回顶栏）；首页 .sticky-head 用 var(--topbar-h)
  跟随顶栏一起滑
- NavBurger 两套 UI 共用；经典手机 FAB 避开右下角主题浮钮

sticky 失效修复
- body overflow-x:hidden 把 body 变成滚动容器，页内所有 position:sticky
  全部失明（首页筛选条吸顶从来没生效过）→ 改 overflow-x:clip，
  只裁剪不建滚动容器
- 余白手机端 .article-layout 裸 1fr 的自动最小尺寸是 min-content，
  长 token 把整列顶到 592px 横向溢出 → minmax(0,1fr) + overflow-wrap

短文快发盒（QuickShort，Twitter 式）
- 时间线顶部内联发布盒：头像 + 输入框 + 发布（Ctrl/⌘+Enter），手机收进
  右下角 FAB + 上拉 sheet；只有管理员会话在场才渲染（/api/admin/me
  探测），发布走真实 createPost(kind:short)——标题 / slug / 阅读时长
  后端自动生成。读者社交登录是阶段二产物，后端就绪前访客无法登录，
  所以天然只有站主可见；要放开给读者发，换探测和发布接口即可
- 经典 FAB 避开右下角主题浮钮（bottom 72），余白贴安全区（bottom 20）

社交链接 + 统计脚本接入
- Settings 的 social_links 前台两处渲染：经典左栏「常读标签」区域改为
  「社交账号」图标行（url 域名推导图标：GitHub / Telegram / X / 邮箱
  信封，认不出显示名称文字），右栏卡片下方 Twitter 式页脚小字区三排
  （导航行 / 社交图标行 / 项目源码 + 版权行）——项目源码是固定入口
  （本站 git remote），与版权同为固定元素，后台配置挤不掉
- Settings 加 custom_js：后台贴完整 <script> 片段（GA / Plausible /
  Umami），DOMParser 解析后逐个重建 script 节点插进 head（innerHTML
  塞的 script 不会执行）；公开页每页注入一次，/admin 不注入；
  站主自己的代码不做清洗（洗 JS 只会把统计脚本洗坏）
- 订阅卡删掉：RSS 入口在页脚小字里，一张卡只为一个链接不值得

杂项
- vite dev 加 --host：手机连局域网直接评审
- 评论 mock 的状态浮层窄屏上移，给底部 dock 让位
- 经典页脚在 12px 页边距下的排版对齐

验证
- 后端 go test 全绿；前端构建通过
- 浏览器逐状态过目：双 UI × 亮暗 × 桌面/手机；表情插入 / 短文发布真实
  入库（测试内容已删）/ dock 与 sheet 开合 / FAB 与主题浮钮不重叠 /
  顶栏隐藏与筛选条跟随同步

frontend/src/admin/SettingsView.vue

@@ -11,6 +11,30 @@ const error = ref('')
 const saving = ref(false)
 const savedAt = ref('')
 
+// ---------- 社交链接（settings.social_links <-> 多行文本） ----------
+// 文本框里每行一条「名称 | 链接」；数组存后端，文本框给人编辑。
+const socialText = ref('')
+
+function socialToText(ls) {
+  return (Array.isArray(ls) ? ls : [])
+    .filter((l) => l && l.label && l.url)
+    .map((l) => `${l.label} | ${l.url}`)
+    .join('\n')
+}
+
+function textToSocial(text) {
+  return String(text || '')
+    .split('\n')
+    .map((line) => {
+      const i = line.indexOf('|')
+      if (i < 0) return null
+      const label = line.slice(0, i).trim()
+      const url = line.slice(i + 1).trim()
+      return label && url ? { label, url } : null
+    })
+    .filter(Boolean)
+}
+
 // 这里只能选亮色皮肤（paper / sage / rose）。暗色端固定 ink，由访客在前台
 // 右下角 ThemeSwitcher 切到「深色」或「自动 + 系统暗」时启用。
 const lightSkins = [
@@ -122,6 +146,7 @@ async function load() {
     if (!UI_CONSTANTS.UIS.includes(settings.value.ui_id)) {
       settings.value.ui_id = UI_CONSTANTS.DEFAULT
     }
+    socialText.value = socialToText(settings.value.social_links)
     // 服务端保证非 null，这里再兜一层，并预建分区键，
     // 这样 v-model 绑定的文本框一开始就有值可写。
     if (!settings.value.custom_css || typeof settings.value.custom_css !== 'object') {
@@ -145,8 +170,10 @@ async function save() {
   saving.value = true
   error.value = ''
   try {
+    settings.value.social_links = textToSocial(socialText.value)
     const s = await adminApi.saveSettings(settings.value)
     settings.value = s
+    socialText.value = socialToText(s.social_links)
     // 保存后服务端会丢掉空的/超长的分区，重新补齐本地键，免得输入框失焦
     if (!settings.value.custom_css || typeof settings.value.custom_css !== 'object') {
       settings.value.custom_css = {}
@@ -355,6 +382,34 @@ async function save() {
             <label>ICP 备案号</label>
             <input v-model="settings.icp" class="input" spellcheck="false" placeholder="如 京 ICP 备 12345678 号" />
           </div>
+          <div class="field">
+            <label>社交链接（每行一条：名称 | 链接）</label>
+            <textarea
+              v-model="socialText"
+              class="input"
+              rows="4"
+              spellcheck="false"
+              placeholder="GitHub | https://github.com/yourname&#10;邮箱 | mailto:you@example.com"
+            ></textarea>
+            <p class="field-hint">
+              显示在经典版左栏「社交账号」和右栏页脚小字区。链接按域名自动配图标
+              （GitHub / Telegram / X / 邮箱等），没有图标的显示名称文字。
+            </p>
+          </div>
+          <div class="field">
+            <label>自定义 JS 代码（统计脚本等）</label>
+            <textarea
+              v-model="settings.custom_js"
+              class="input"
+              rows="6"
+              spellcheck="false"
+              placeholder="<script async src=&quot;https://www.googletagmanager.com/gtag/js?id=G-XXXX&quot;></script>&#10;<script>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments)} gtag('js', new Date()); gtag('config', 'G-XXXX');<\/script>"
+            ></textarea>
+            <p class="field-hint">
+              贴完整的 &lt;script&gt; 片段（Google Analytics / Plausible / Umami 等），
+              会在前台每个页面的 &lt;head&gt; 里执行，后台不注入。保存后刷新前台生效。
+            </p>
+          </div>
         </div>
 
         <div style="display: flex; align-items: center; gap: 12px; margin-top: 14px;">
@@ -433,4 +488,11 @@ async function save() {
   font-size: 12px;
   color: var(--admin-muted);
 }
+
+.field-hint {
+  margin: 6px 0 0;
+  font-size: 12px;
+  line-height: 1.7;
+  color: var(--admin-muted);
+}
 </style>