fix(web): fix UP card layout and fan delta semantics

reaction_board/web/static/style.css

@@ -698,7 +698,7 @@ h1, h2, h3, p { margin: 0; }
   .detail-hero { flex-direction: row; align-items: flex-start; }
   .hero-cover { width: 300px; flex: 0 0 300px; }
   .video-thumb { width: 112px; }
-  .video-card { grid-template-columns: 28px 112px minmax(0, 1fr) 14px; }
+  .video-card, .up-card { grid-template-columns: 28px 112px minmax(0, 1fr) 14px; }
   .video-card.no-rank, .up-card.no-rank { grid-template-columns: 112px minmax(0, 1fr) 14px; }
   .secondary-stat.optional { display: inline; }
 }
@@ -753,7 +753,7 @@ h1, h2, h3, p { margin: 0; }
 }
 
 @media (max-width: 380px) {
-  .video-card { grid-template-columns: 22px 82px minmax(0, 1fr) 10px; gap: 7px; }
+  .video-card, .up-card { grid-template-columns: 22px 82px minmax(0, 1fr) 10px; gap: 7px; }
   .video-card.no-rank, .up-card.no-rank { grid-template-columns: 82px minmax(0, 1fr) 10px; }
   .video-thumb { width: 82px; }
   .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

reaction_board/web/static/views/rankings.js

@@ -11,8 +11,9 @@ const VIDEO_SORTS = [
   ["interaction", "互动率"], ["growth", "增长"], ["growth_rate", "增速"],
 ];
 const UP_SORTS = [
-  ["views", "总播放"], ["count", "视频数"], ["avg_views", "平均播放"],
-  ["interaction", "总互动"], ["avg_interaction", "平均互动"], ["latest", "最近发布"],
+  ["avg_views", "平均播放"], ["avg_interaction", "平均互动"],
+  ["interaction", "总互动"], ["latest", "最近发布"],
+  ["count", "视频数"], ["views", "总播放"],
 ];
 const METRIC_PRIMARY = new Set(["view", "like", "coin", "favorite", "share", "reply", "danmaku"]);
 
@@ -75,7 +76,7 @@ function listHtml(data, scope, sort, startRank) {
 
 export async function renderRankings(root, { query }) {
   const scope = query.get("scope") === "up" ? "up" : "video";
-  const defaultSort = scope === "up" ? "views" : "heat";
+  const defaultSort = scope === "up" ? "avg_views" : "heat";
   const sort = query.get("sort") || defaultSort;
   const within = query.get("within_days") || "all";
   const growthDays = query.get("growth_days") || "7";
@@ -133,7 +134,7 @@ export async function renderRankings(root, { query }) {
   root.querySelectorAll("[data-scope]").forEach((button) => button.addEventListener("click", () => {
     replaceQuery({
       scope: button.dataset.scope,
-      sort: button.dataset.scope === "up" ? "views" : "heat",
+      sort: button.dataset.scope === "up" ? "avg_views" : "heat",
       page: null,
     });
   }));

reaction_board/web/static/views/up.js

@@ -35,7 +35,7 @@ export async function renderUp(root, { params, query }) {
 
   root.innerHTML = `<section class="page up-page">
     <header class="page-head">
-      <a class="back-link" href="#/rank?scope=up&sort=views">← 返回 UP 榜</a>
+      <a class="back-link" href="#/rank?scope=up&sort=avg_views">← 返回 UP 榜</a>
       <a class="button ghost" href="${escapeAttr(up.space_url)}" target="_blank" rel="noreferrer">B 站空间</a>
     </header>
 
@@ -65,10 +65,10 @@ export async function renderUp(root, { params, query }) {
       <p class="section-note">按该 UP 全部视频的每日播放合计绘制；缺失日期断开。</p>
     </section>
 
-    <section class="panel chart-panel">
+    ${videos.length > 1 ? `<section class="panel chart-panel">
       ${sectionHeader("单视频播放对比")}
       ${topForBar.length ? `<div class="chart chart-tall" id="up-bars"></div>` : emptyState("暂无视频数据")}
-    </section>
+    </section>` : ""}
 
     <section class="panel">
       <div class="section-head">