友链卡片固定在评论列表上方(不再被新评论挤到中间)：整条评论用class隐藏，卡片插入atk-list-body首位

themes/Ying/assets/js/modules/artalk.js

@@ -723,10 +723,14 @@ artalk.on('comment-rendered', function(node) {
         var content = String(d2.content || '').trim().replace(/\/+$/, '').toLowerCase();
         if (content !== 'https://usj.cc/link-apply') return;
 
-        // 幂等 + 自愈：class 每次渲染都补一次（隐藏原评论内容的 CSS 规则依赖它），
+        // 幂等 + 自愈：class 每次渲染都补一次（CSS 靠它隐藏整条评论），
-        // 已有卡片就直接返回，避免 Artalk 重渲染时出现第二张卡片
+        // 卡片始终挂在评论列表"上方"（.atk-list-body 的第一个子节点），
+        // 这样发新评论/切换排序都不会把卡片夹到评论中间。
         el2.classList.add('atk-fl-apply');
-        if (el2.querySelector('.atk-fl-card')) return;
+        var listBody = document.querySelector('.atk-list-body') || document.querySelector('.atk-list');
+        var oldHolder = document.querySelector('.atk-fl-card-wrap');
+        if (oldHolder && listBody && oldHolder.parentNode === listBody && oldHolder.isConnected) return;
+        if (oldHolder && oldHolder.parentNode) oldHolder.parentNode.removeChild(oldHolder);
 
         el2.style.cursor = 'pointer';
         el2.title = '点击申请友链';
@@ -785,9 +789,21 @@ artalk.on('comment-rendered', function(node) {
             var nickRow = card.querySelector('span > span');
             nickRow.appendChild(bw);
         }
-        // 卡片直接挂在评论节点（.atk-comment）下：宽度与评论输入框一致
+        // 卡片包一层容器挂到列表上方（宽度与评论区一致，且不受列表排序/新增影响）
         if (contentEl) contentEl.innerHTML = '';
-        commentEl.appendChild(card);
+        var holder = document.createElement('div');
+        holder.className = 'atk-fl-card-wrap';
+        holder.appendChild(card);
+        if (listBody) {
+            if (listBody.firstChild) listBody.insertBefore(holder, listBody.firstChild);
+            else listBody.appendChild(holder);
+        } else {
+            commentEl.appendChild(holder);
+        }
+        // 点击卡片即打开申请弹窗（原来挂在 el2 上，现在卡片已移出评论节点）
+        holder.addEventListener('click', function () {
+            if (window.flApplyOpenModal) window.flApplyOpenModal();
+        });
 
         // ── 打字机效果（PJAX 安全：卡片被移除/替换时定时器自动停止） ──
         // 注意：不要用 prefers-reduced-motion 跳过打字 —— Windows 关闭"动画效果"

themes/Ying/layouts/partials/artalk.html

@@ -100,15 +100,15 @@
        PJAX 下每次切页评论区都会重建卡片 → 入场动画与打字机自然重播；
        打字机定时器在 artalk.js 里会检测卡片是否还在文档中（切页后自动停）。 */
 
-    /* 卡片评论：常规内容（头像/昵称/正文/页脚）整体隐藏。
+    /* 被转换成卡片的评论：整条从列表里隐藏（卡片已移到列表上方单独显示，
-       必须用 class + !important，不能用 JS 内联 display:none ——
+       用 class + !important 声明式隐藏，Artalk 重渲染也压得住） */
-       Artalk 发完新评论会重渲染 .atk-main，内联样式会被抹掉，
+    .atk-comment-wrap.atk-fl-apply {
-       原评论正文（那条 URL）就会重新冒出来把卡片挤下去（刷新才恢复）。 */
-    .atk-comment-wrap.atk-fl-apply > .atk-main,
-    .atk-comment-wrap.atk-fl-apply > .atk-comment > .atk-main,
-    .atk-comment.atk-fl-apply > .atk-main {
         display: none !important;
     }
+    /* 卡片容器：固定在评论列表最上方 */
+    .atk-fl-card-wrap {
+        margin: 0 0 6px;
+    }
     .atk-fl-card {
         animation: flApplyIn .5s cubic-bezier(.22, 1, .36, 1) both;
     }