失敗清單改成「檔名 + 三角形，預設收合」（leo 實測版面被壓扁）

leo：「表格最左邊的標題被壓扁了…**可以顯示沒通過的名稱，旁邊有個三角形，
點擊看到失敗細節，default 摺疊起來，重點是找到問題在哪裏**」

## 真兇
我重用 `.step` 的橫向格線（`display:flex` + 原因擠在右邊）
⇒ 中文檔名被壓成**一行一個字**（實撞截圖）。

## 改法
改用原生 `<details>/<summary>`：三角形、鍵盤可操作、預設收合都不必自己寫。
檔名一行（`word-break: break-word`，長檔名換行但不是一字一行），
原因收在裡面，需要時才展開——**先看到「哪些檔沒過」，細節是第二層**。
CSS 用實際存在的 CIS 變數（`--ink-rgb`／`--amber`；原本誤用不存在的 `--hair`／`--ink-soft`）。

## 驗
`node --check` 過、`check-cis.sh` **全過**、go build 過。
⚠️ **未真機驗**（未打包送到 leo 手上）。

cmd/arcrun-app/frontend/src/main.js

@@ -112,16 +112,21 @@ function cardTrouble(s) {
 // 而原因本來就在 status.json 裡 —— 數字不能代替原因。
 function cardFailures(f) {
   if (!f || !f.items || !f.items.length) return '';
+  // 🔴 leo 2026-08-06：「**可以顯示沒通過的名稱，旁邊有個三角形，點擊看到失敗細節，
+  //    default 摺疊起來，重點是找到問題在哪裏**」
+  //    ——他要的是先看到「哪些檔沒過」，細節是需要時才展開。
+  //    先前把原因直接攤在旁邊，害檔名欄被擠成一行一個字（實撞截圖）。
+  //    用原生 <details>：三角形、鍵盤可操作、預設收合，都不必自己寫。
   return `
     <div class="card">
       <h3>${esc(f.title)}</h3>
       <div class="d">${esc(f.note)}</div>
-      <div class="steps" style="margin-top:10px">
+      <div class="faillist">
         ${f.items.map((it) => `
-          <div class="step">
-            <span class="t">${esc(it.name)}</span>
-            <span class="m">${esc(it.reason)}</span>
-          </div>`).join('')}
+          <details class="fail">
+            <summary>${esc(it.name)}</summary>
+            <div class="failwhy">${esc(it.reason)}</div>
+          </details>`).join('')}
       </div>
       ${f.more > 0 ? `<div class="d" style="margin-top:8px">…還有 ${f.more} 份</div>` : ''}
     </div>`;

cmd/arcrun-app/frontend/src/style.css

@@ -220,3 +220,26 @@ input[type=text], input[type=password] {
 .step.now  { font-weight: 600; }
 .step .t { flex: 1; }
 .step .m { font-size: 12.5px; color: rgba(var(--ink-rgb), .45); }
+
+/* 失敗清單：檔名一行、細節收在三角形裡（leo 2026-08-06：
+   「顯示沒通過的名稱，旁邊有個三角形，點擊看到失敗細節，default 摺疊起來」）。
+   先前重用 .step 的橫向格線，害中文檔名被擠成一行一個字。 */
+.faillist { margin-top: 12px; }
+.fail { border-top: 1px solid rgba(var(--ink-rgb), .10); }
+.fail:first-child { border-top: 0; }
+.fail > summary {
+  cursor: pointer;
+  padding: 10px 2px;
+  font-size: 14px;
+  line-height: 1.5;
+  word-break: break-word;   /* 長檔名要能換行，但不是一字一行 */
+  list-style: revert;       /* 保留原生三角形 */
+}
+.fail > summary::marker { color: var(--amber); }
+.fail[open] > summary { font-weight: 600; }
+.failwhy {
+  padding: 2px 2px 12px 18px;
+  font-size: 13px;
+  line-height: 1.7;
+  color: rgba(var(--ink-rgb), .68);
+}