@takagaki/cortex-decisions-viewer 0.5.0 → 0.6.0

package/dist/render.js

@@ -1107,6 +1107,18 @@ a:hover { text-decoration: underline; }
   display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
 }
 .ds-card-main { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; }
+/* 能力モーダルの中の「内部ソースのカード」だけ縦組みにする（2026-08-21）。
+   横並びのままだと、名前ブロックが左の細い列になり、その右に設定一式が積まれる
+   （オーナー指摘「なんで左側に共有資料、資料というふうに出てるんだ？」）。
+   **flex-wrap: nowrap を必ず含める。** .ds-card は flex-wrap: wrap で、
+   direction を column にしても wrap は残る。このカードは max-height: 90vh の
+   column flex（.modal）の縮みうる子なので、wrap したままだと自動最小サイズが
+   「最も高い子1つ分」まで落ち、縦に潰れて中身が複数列に折り返す＝指摘された
+   「左に列がある」状態を、もっと壊れた形で作り直すことになる。
+   **子結合子（>）で書く。** 子孫セレクタだと、中に入れ子にしたレコードの行の
+   .ds-card-main にも当たり（特異度で勝つ）、行の名前ブロックが伸びなくなる。 */
+.ds-card.ds-capbody { flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 10px; }
+.ds-card.ds-capbody > .ds-card-main { flex: 0 0 auto; }
 .ds-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; }
 .ds-type { font-size: 12px; font-weight: 600; color: var(--muted); flex: 0 0 auto; }
 .ds-name { font-size: 14.5px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@@ -1271,7 +1283,7 @@ a.ds-name:hover { text-decoration: underline; }
      min-width: 0         … flex の子が min-content より縮めるようにする（無いと折り返しても溢れる） */
 .ds-tile-name, .ds-tile-desc, .ds-tile-sub, .ds-tile-note,
 .ds-check-label, .ds-check-action, .ds-check-detail,
-.ds-pipe-label, .ds-pipe-todo, .ds-owner-state,
+.ds-pipe-label, .ds-pipe-todo,
 .ds-empty, .sec-how, .modal-desc, .ds-toggle-msg,
 .ds-drive-note, .ds-inactive-note, .ds-legacy-chip, .ds-keys-code, .ds-gate-help {
   min-width: 0; white-space: normal; overflow-wrap: anywhere;
@@ -1282,8 +1294,10 @@ a.ds-name:hover { text-decoration: underline; }
 .ds-toggle-btn:disabled { opacity: .6; cursor: default; }
 .ds-toggle-btn.ds-danger { color: #b42318; border-color: #f3c6c1; }
 .ds-toggle-btn.ds-danger:hover:not(:disabled) { border-color: #b42318; color: #b42318; background: #fff5f4; }
-.ds-subitems { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
-.ds-subitem { border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; background: #fff; }
+/* .ds-subitems / .ds-subitem は撤去した（2026-08-21）。共有資料のフォルダと Figma の
+   ファイルの行は、Slack / GitHub と同じ .ds-list > .ds-card になったので、
+   行間（gap）も .ds-list に揃う。**.ds-removed の規則は .ds-subitem に依存していない**
+   ので、そのまま両方の行に効く。 */
 /* 削除できたことを行に残す。一覧そのものは翌朝まで更新されないので、消えたように見せない */
 .ds-removed .ds-name { text-decoration: line-through; color: var(--muted); }
 .ds-toggle-msg { font-size: 12px; color: var(--muted); }
@@ -1337,13 +1351,10 @@ a.ds-name:hover { text-decoration: underline; }
    とは別物で、同じ色にすると「押して繋ぎましょう」と読まれる */
 .ds-gate-off { color: #9ca3af; }
 .ds-pipes { display: flex; flex-direction: column; gap: 8px; }
-/* 組織ごとの接続状況。トークンは組織ごとにしか効かないので、ここが判断の単位になる */
-.ds-owners { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
-.ds-owner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 12px;
-  border: 1px solid var(--border); border-radius: 8px; background: var(--bg); }
-.ds-owner-name { font-weight: 700; font-size: 13px; }
-.ds-owner-state { font-size: 12.5px; }
-.ds-owner-install { font-size: 12.5px; margin-left: auto; white-space: nowrap; }
+/* GitHub App のインストールへのリンク。**独立した「組織ごとの接続状況」の節は
+   2026-08-20 に廃止した**（行のラベル＋必要な行だけ囲う形へ）が、
+   このクラスだけは案内と手順の両方で使い続けている */
+.ds-owner-install { font-size: 12.5px; white-space: nowrap; }
 /* 実行状況の行に直し方を添える。同じ run の未達を別の節にも出すと画面に2回並ぶ */
 .ds-pipe-wrap { display: flex; flex-direction: column; gap: 3px; }
 .ds-pipe-todo { font-size: 12.5px; color: var(--muted); line-height: 1.7; padding-left: 4px; }
@@ -1368,17 +1379,10 @@ a.ds-name:hover { text-decoration: underline; }
 /* 「この接続は何のためのものでないか」（2026-08-18）。**説明文より強く出す**——
    ここを読み飛ばした人が、社内チャンネルのためにボタンを押し、必ず失敗する */
 .ds-scope-note { color: var(--text); }
-/* いまの接続先（設定を変える口の直前に置く。値は本文色で、ラベルだけ弱める） */
-.ds-current { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 0 0 8px; font-size: 12.5px; }
-.ds-current-label { color: var(--muted); flex: 0 0 auto; }
-.ds-current-value { color: var(--text); font-weight: 600; word-break: break-all; }
-.ds-current-value.is-unset { color: var(--muted); font-weight: 400; }
-/* 接続先の一覧（#127）。**1件のときは従来どおりラベルの右に1行**——単数の案件で
-   見た目が変わると、複数対応と関係のない全案件に「何か変わった」と読ませる */
-.ds-target-list { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
-.ds-target-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
-/* 行の中のボタンは行に揃える（.ds-toggle の縦マージンは節と節の間隔なので効かせない） */
-.ds-target-row .ds-toggle-btn { flex: 0 0 auto; }
+/* .ds-current / .ds-current-label / .ds-current-value / .ds-target-list /
+   .ds-target-row は撤去した（2026-08-21）。Backlog の接続先の行は、Slack / GitHub /
+   Figma / Drive と同じ .ds-list > .ds-card になったので、行間も見た目も .ds-list と
+   .ds-card に揃う（それまでは同じモーダルの中でここだけ独自レイアウトだった）。 */
 /* 入力欄のすぐ下。貼る直前に読める位置に置く */
 .sec-note { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 6px 0 0; }
 .sec-how p { margin: 0; }
@@ -1412,6 +1416,17 @@ a.ds-name:hover { text-decoration: underline; }
 /* まだ受信していない接続先（複数接続のとき混在する）。稼働中の行と見分けが付く濃さに落とす */
 .rt-live-line.is-waiting { color: var(--muted); font-weight: 500; }
 /* 手順は畳んで残す（張り替え・再確認用）。開いたときだけ間隔を空ける */
+/* 鍵カードの発行手順。**畳んであるだけで、中身は消していない**（2026-08-21）。
+   **マージンは持たせない**——.ops-card は column flex の gap: 10px なので、
+   自前のマージンを足すとここだけ間隔が広くなる（短く見せたいカードで逆効果）。
+   閉じているときに最後の段落の下マージンが残らないよう、中の余白も畳む */
+.sec-fold { border: none; margin: 0; }
+.sec-fold > summary { cursor: pointer; color: var(--muted); font-size: 12px; }
+.sec-fold[open] > summary { margin-bottom: 8px; }
+.sec-fold > .sec-how:last-child { margin-bottom: 0; }
+/* 鍵の入力欄も同じ理由でマージンを持たせない（.ds-addform の中は従来どおり6px）。
+   子結合子で書くのは、リアルタイム同期カードの .rt-url（.rt-url-row の中）に当てないため */
+.ops-card > .sec-input { margin-bottom: 0; }
 .rt-steps-fold > summary { cursor: pointer; color: var(--muted); font-size: 12px; }
 .rt-steps-fold[open] > summary { margin-bottom: 10px; }
 .rt-steps-fold[open] > *:not(summary) { margin-top: 10px; }
@@ -1617,8 +1632,12 @@ ${capabilityState.toString()}
   var countEl = { textContent: "" }; // 件数表示は廃止（ヘッダーから削除済み）
   var footerEl = document.getElementById("footer-meta");
 
+  // **画面の版も出す（2026-08-20）。** 新しい画面は案件ごとに順次切り替わるので、
+  // **案件によって版が違う**。出していないと「直したはずなのに直っていない」の正体が
+  // 「その案件だけ古い版」であることを切り分けられない
   footerEl.textContent = "生成: " + SITE.generatedAt +
-    (SITE.repoBaseUrl ? "  /  " + SITE.repoBaseUrl.split("://").pop() + " (" + SITE.branch + ")" : "");
+    (SITE.repoBaseUrl ? "  /  " + SITE.repoBaseUrl.split("://").pop() + " (" + SITE.branch + ")" : "") +
+    (SITE.viewerVersion ? "  /  画面 v" + SITE.viewerVersion : "");
 
   /**
    * 「貼り付けて使う文字列」を、選べる形＋コピーボタンで出す。
@@ -1628,6 +1647,19 @@ ${capabilityState.toString()}
    * clipboard API が使えない環境（http・古いブラウザ・権限拒否）では、**選択までしてやって**
    * 次の一手を伝える（何も起きないのが一番悪い）。
    */
+  /**
+   * 共有資料の取り込みに使う Google アカウント（2026-08-20）。
+   *
+   * **画面に出す。** それまでは「取り込み用アカウント」としか書いておらず、
+   * **誰を招待すればいいのかが画面から分からなかった**——担当者に聞かないと
+   * 手順が完了できなかった。
+   *
+   * **艦隊で1つ。** 案件ごとに違うものではないので定数で足りる
+   * （案件ごとになったら fleet-status から運ぶ器に変える）。
+   * 議事録の取り込みでも同じアカウントを使っている。
+   */
+  var DRIVE_INGEST_ACCOUNT = "cortex-notetaker@classmethod.jp";
+
   function copyRow(text) {
     // **input と button を使わない。** 追加フォームの中に置くので、input を足すと
     // 「先頭がURL欄・末尾が名前欄」、button を足すと「最初のボタンが送信」という
@@ -2073,6 +2105,10 @@ ${capabilityState.toString()}
     // **状態の語で「招待」と言わない**——言うと、何度招待しても直らないものを繰り返させる
     "missing_scope": { text: "権限が足りません", cls: "ds-gate-warn" },
     "unreachable": { text: "アクセス不可", cls: "ds-gate-warn" },
+    // **この素の語が出るのは、まだ対応していない種別のときだけ。**
+    // slack / github は下の DS_GATE_NO_TOKEN で経路ごとに言い換える（dsGateOf を通す）。
+    // 残してあるのは「知らない種別のソースを黙って消さない」ため——新しいアダプタが
+    // 増えた日に、行が状態を持たずに並ぶより、素の語でも出ているほうがよい
     "no_token": { text: "トークン未設定", cls: "ds-gate-muted" },
     "unknown": { text: "不明", cls: "ds-gate-muted" },
   };
@@ -2111,6 +2147,27 @@ ${capabilityState.toString()}
       cls: "ds-gate-muted",
       help: "このチャンネルがあるお客様の Slack ワークスペースが、まだ接続されていない（または接続が切れている）状態です。「Slack ワークスペースに接続する」から接続してください。",
     },
+    /* -------------------------------------------------------------------------
+     * GitHub。**「トークン未設定」と言ってはいけない**（2026-08-21）
+     * -------------------------------------------------------------------------
+     * 読み取り用の個人アクセストークンは廃止し、GitHub App のインストールトークンに
+     * 一本化した。**画面のどこにも、そのトークンを入れる欄はもう無い。**
+     * それでも「トークン未設定」と出すと、上の DS_GATE_NO_TOKEN の項が書いている
+     * 2026-08-18 の不具合と同じ形になる——しかも**探した先が存在しない**ぶん悪い。
+     *
+     * engine 側は、画面がこう言う前提で値を返している（scripts/fleet-status.mjs の
+     * probeGithubGate）: App のトークンを持たずに読もうとして 404/403 で落ちたなら、
+     * 原因はスコープではなく**この組織に App が入っていない**。
+     * **同じモーダルの中で、組織の案内が「App を入れてください」と言っているのに
+     * 行と能力タイルが「トークン未設定」と言う**状態を作らないこと。
+     *
+     * **help は付けない。** 次の一手（インストール導線）は組織ごとの案内
+     * （githubNotConnectedNodes）が1つだけ持つ。行ごとに繰り返すと一覧が案内で埋まる。
+     * ----------------------------------------------------------------------- */
+    github: {
+      text: "App が未インストール",
+      cls: "ds-gate-muted",
+    },
   };
   /**
    * Slack のチャンネルが社内ワークスペースのものか。**workspace の有無だけで決まる**
@@ -2138,10 +2195,26 @@ ${capabilityState.toString()}
     if (!s || s.indexOf("（名前未取得") === 0) return s;
     return "#" + s.replace(/^#+/, "");
   }
-  /** 行に出す接続状態。no_token だけは経路（社内/顧客）で文面が分かれる */
+  /**
+   * 行に出す接続状態。**no_token だけは経路で文面が分かれる。**
+   *
+   * | 種別 | no_token の意味 | 語 |
+   * |---|---|---|
+   * | slack（社内） | 中央 Bot の鍵が無い。**画面から設定できない** | 管理者の設定が必要です |
+   * | slack（顧客） | お客様のワークスペースが未接続。接続で直せる | トークン未設定 |
+   * | github | 読む鍵が1本も無かった＝**この組織に App が入っていない** | App が未インストール |
+   *
+   * **ここを通さずに語を書き写さないこと。** 行バッジ・能力タイルの要約・
+   * 「接続を確認」の結果が同じ関数を通るので、片方だけ古くなることが構造的に起きない
+   * （attentionSummary / probeVerdict の項に、実際に割れた経緯がある）。
+   */
   function dsGateOf(s) {
-    if (s.gate === "no_token" && s.type === "slack") {
-      return isInternalSlack(s) ? DS_GATE_NO_TOKEN.internal : DS_GATE_NO_TOKEN.customer;
+    if (s.gate === "no_token") {
+      if (s.type === "slack") {
+        return isInternalSlack(s) ? DS_GATE_NO_TOKEN.internal : DS_GATE_NO_TOKEN.customer;
+      }
+      // github-issues / github-discussions のどちらも同じ原因（組織単位の App）
+      if (String(s.type || "").indexOf("github") === 0) return DS_GATE_NO_TOKEN.github;
     }
     return DS_GATE[s.gate] || DS_GATE["unknown"];
   }
@@ -2153,6 +2226,14 @@ ${capabilityState.toString()}
    * 場所が画面に無いので、探した人が顧客ワークスペースの接続へ吸い込まれる（DS_GATE_NO_TOKEN
    * の項の事故がここから始まっている）。1件でも顧客側が混ざるときは従来の文面のまま——
    * そちらは接続で直せるので、経路を名指しできない要約に倒す方が正しい。
+   *
+   * **GitHub も同じ理由で「トークン」と言わない（2026-08-21）。** 読み取り用の個人
+   * アクセストークンは廃止済みで、**入力欄が画面のどこにも無い**。ここが古い語のまま
+   * 残っていたので、同じモーダルの中で組織の案内は「App を入れてください」・
+   * その直下の行と能力タイルは「トークン未設定」という食い違いが出ていた。
+   *
+   * **語は dsGateOf から引く（写経しない）。** 行バッジと同じ関数を通すので、
+   * 片方だけ古くなることが構造的に起きない。
    */
   function attentionSummary(items) {
     var bad = items.filter(function (s) { return sourceNeedsAttention(s); });
@@ -2160,8 +2241,19 @@ ${capabilityState.toString()}
     var head = "⚠️ " + bad.length + "件";
     var noToken = bad.filter(function (s) { return s.gate === "no_token"; });
     if (noToken.length !== bad.length) return head + "に問題";
-    var allInternal = noToken.every(function (s) { return isInternalSlack(s); });
-    return head + "が読めていません（" + (allInternal ? "管理者の設定が必要です" : "トークン未設定") + "）";
+    // 原因を名指しできるのは、行バッジの語が**1つに揃っている**ときだけ
+    var texts = {};
+    noToken.forEach(function (s) { texts[dsGateOf(s).text] = true; });
+    var names = [];
+    for (var t in texts) if (Object.prototype.hasOwnProperty.call(texts, t)) names.push(t);
+    if (names.length === 1) return head + "が読めていません（" + names[0] + "）";
+    // 語が割れた。**Slack の中だけで割れているなら従来どおり顧客側の語に倒す**——
+    // そちらは接続で直せるので、「管理者の設定が必要です」と言い切ると直せる人を止める。
+    // 種別をまたいで割れているとき（Slack と GitHub が同時に読めていない等）は、
+    // 次にする人も操作も違うので1つの原因として書けない。件数だけにする
+    var allSlack = noToken.every(function (s) { return s.type === "slack"; });
+    if (allSlack) return head + "が読めていません（" + DS_GATE_NO_TOKEN.customer.text + "）";
+    return head + "に問題";
   }
   /**
    * Slack のチャンネルを、所属する組織ごとに分ける（2026-08-20）。
@@ -2169,7 +2261,7 @@ ${capabilityState.toString()}
    * ## なぜ純関数にするか
    *
    * ここが**判断の全部**。描画に混ぜると「どう分けたか」を実測できなくなる。
-   * sourceGroup は受け取ったものを並べるだけで、意味を持たない
+   * 並べる側は受け取ったものを出すだけで、意味を持たない
    * （GitHub は組織・Backlog はスペースで同じ形が要るため）。
    *
    * ## 分け方
@@ -2371,6 +2463,193 @@ ${capabilityState.toString()}
     }
   }
 
+  /**
+   * GitHub のリポジトリを、組織ごとに分ける（2026-08-20・Slack からの横展開）。
+   *
+   * ## Slack との違い
+   *
+   * **帰属を API に聞く必要が無い。** 組織は ref（owner/repo）に入っている。
+   * だから判定は文字列を切るだけで、実測も印も要らない。
+   *
+   * ## 接続状態は台帳（githubOwners）から引く
+   *
+   * トークンは**組織ごとにしか効かない**（Fine-grained PAT も App の
+   * インストールトークンも1組織分）ので、状態の単位も組織。
+   *
+   * @returns [{ key, title, items, state }] state は "ok" | "warn" | "unsure" | null
+   */
+  /** 台帳から、その組織の情報を引く（無ければ null＝断定しない） */
+  function githubOwnerMeta(owner) {
+    var list = fleetVal("githubOwners") || [];
+    for (var i = 0; i < list.length; i++) {
+      if (list[i] && list[i].owner === owner) return list[i];
+    }
+    return null;
+  }
+
+  function groupGithubByOwner(items, owners) {
+    var known = {};
+    (owners || []).forEach(function (o) { if (o && o.owner) known[o.owner] = o; });
+    var order = [];
+    var byKey = {};
+    (items || []).forEach(function (s) {
+      var owner = String(s.ref || "").split("/")[0] || "";
+      var g = byKey[owner];
+      if (!g) {
+        var o = known[owner];
+        // **台帳に無ければ断定しない。** 夜間バッチの成果物なので、
+        // 立ち上げ直後の案件には無い（「0件」と「知らない」を同じ扱いにすると嘘になる）
+        var state = null;
+        // **「warn」 は else 側の総取り。** ここに載っていない値は全部「未接続」に落ちるので、
+        // engine が 「source」 に新しい値を足したら**必ずここも足す**——載せ忘れると、
+        // 読めている組織が顧客の画面で一斉に「まだ接続されていません」になる。
+        //
+        // 「workflow」 は「App は無いが、ワークフロー自身のトークンで全部読めた」＝**接続OK**。
+        // 「token」（廃止した個人アクセストークンで読めていた）も**当面 OK のまま受ける**——
+        // 画面（Amplify で即配布）と engine（案件スタブが 「@v1」 を指しており、タグを
+        // 進めるまで古い 「fleet-status.json」 のまま）は**別々に配られる**ので、
+        // どちらを先に出しても片側だけ新しい期間ができる。その間に 「token」 を落とすと、
+        // コミット済みの値を読んだ画面が偽の警告を出す。**外すのはフェーズ2**（engine の
+        // v1 が全案件へ行き渡ったことを確かめてから）。
+        if (o) {
+          state = (o.source === "app" || o.source === "workflow" || o.source === "token") ? "ok"
+            : o.source === "unknown" ? "unsure"
+              : "warn";
+        }
+        g = { key: owner, title: owner || "（組織不明）", items: [], state: state, meta: o || null };
+        byKey[owner] = g;
+        order.push(g);
+      }
+      g.items.push(s);
+    });
+    // **繋がっている組織を先に、繋がっていない組織を後に。**
+    // 直すものが無い人にも「未接続」が最初に見えるのは、優先順位が逆
+    order.sort(function (a, b) {
+      var rank = function (g) { return g.state === "warn" ? 2 : g.state === "unsure" ? 1 : 0; };
+      return rank(a) - rank(b);
+    });
+    return order;
+  }
+
+  /**
+   * GitHub のリポジトリを**平らに**並べる（2026-08-20）。
+   *
+   * Slack と同じ形。並び順は組織ごとだが**箱で囲まない**。
+   * どの組織かは**行のラベル**が示し、**接続が要る組だけ**案内が行を抱える。
+   */
+  function githubRows(items) {
+    var owners = fleetVal("githubOwners");
+    var out = [];
+    groupGithubByOwner(items, owners).forEach(function (g) {
+      // **行ごとに meta を引く。** issues と discussions でアイコンとラベルが違う
+      var cards = g.items.map(function (x) {
+        return extSourceCard(x, DS_TYPE[x.type] || { icon: "🔗", label: x.type || "その他" });
+      });
+      if (g.state === "warn") {
+        out.push(orgNoteBox(githubNotConnectedNodes(g), cards));
+        return;
+      }
+      if (g.state === "unsure") {
+        // **確かめられなかった夜は、そう言う。** gh の不在・タイムアウト・
+        // ネットワーク断で起きる。「接続OK」と出すと同じ画面の集計と食い違い、
+        // 「未接続」と出すと繋がっている組織に偽の警告を出す——どちらも嘘。
+        // **導線は出さない**（すでに入っているかもしれないので、押させる理由が無い）
+        out.push(orgNoteBox(githubUnsureNodes(g), cards));
+        return;
+      }
+      cards.forEach(function (n) { out.push(n); });
+    });
+    return out;
+  }
+
+  /** 確かめられなかった組織の案内。**導線は出さない** */
+  function githubUnsureNodes(g) {
+    var o = g.meta || {};
+    return [
+      el("div", { class: "ds-orgnote-title", text: "⚠️ " + g.title + " の接続を確認できませんでした" }),
+      el("p", {
+        class: "ds-group-note",
+        // **件数を出す。** 4リポのうち3つは確かめられている夜に
+        // 「4リポジトリを確かめられていません」と読めるのは実態と違う
+        text: (o.repos || g.items.length) + "リポジトリ中 "
+          + (o.unchecked != null ? o.unchecked : (o.repos || g.items.length))
+          + "件の接続を確かめられていません。翌朝の表示をご確認ください。",
+      }),
+    ];
+  }
+
+  /**
+   * 繋がっていない組織の案内。
+   *
+   * **「読めない」の原因は1つではない。** 以前はどの組織にも
+   * 「この組織に Cortex の GitHub App を入れると読めるようになります」と出していたが、
+   * **App は入っているのにそのリポジトリが選ばれていない**組織にはこれが効かない。
+   * インストールは済んでいるので、押しても画面は変わらず、何度押しても直らない。
+   *
+   * 「appInstalled」 が原因を分ける（engine がインストールトークンを取れたかどうか）:
+   *
+   * | 値 | 意味 | 案内 |
+   * |---|---|---|
+   * | 「false」 | App のトークンが取れなかった＝未インストール | インストールへ |
+   * | 「true」  | 取れたのに読めない＝そのリポジトリが未選択 | **インストール設定**へ |
+   * | 「null」  | その夜は確かめられなかった | **どちらも出さない**（押しても直るとは限らない） |
+   *
+   * **自社か顧客かで文言を分けない。** 組織名（「classmethod-*」）で分岐すると、
+   * 新しい自社組織が増えたときに黙って間違った案内を出す。どちらにも通じる文にする。
+   */
+  function githubNotConnectedNodes(g) {
+    var out = [];
+    var o = g.meta || {};
+    var repos = o.repos || g.items.length;
+    var unread = o.unreadable != null ? o.unreadable : g.items.length;
+    var installed = o.appInstalled;
+    out.push(el("div", { class: "ds-orgnote-title", text: "⚠️ " + g.title + " はまだ接続されていません" }));
+    // **読める件数を出す。** 総数だけ出すと、同じ画面の集計と食い違う（#101 で3度直した形）
+    var head = repos + "リポジトリ中 " + unread + "件が読めていません。";
+    if (installed === true) {
+      // App は入っている。**インストールをもう一度促さないこと**——済んでいる操作を促すのは
+      // 「設定する必要が無いものに設定を促す」偽の警告と同じで、しかも直らない
+      //
+      // **原因を1つに断定しない（2026-08-21）。** 「appInstalled」 が分けられるのは
+      // 「①未インストール」と「②未選択／③消えた・改名」までで、**②と③は分かれない**。
+      // 「対象に選ばれていません」と言い切ると、③の人は一覧に無いリポジトリを
+      // 探し続けることになる（押しても直らない導線と同じ形）。逃げ道を1文で示す。
+      //
+      // **設定画面の宛先も断定しない。** リンク先は 「/settings/installations」＝
+      // **押した本人の**インストール一覧で（appSettingsLink の項に、組織の設定ページが
+      // 管理者以外で 404 になる理由がある）、App を入れたのが別のメンバーや
+      // 顧客側のオーナーなら**着いた先は空**。そこで詰まる人に次の宛先を渡す。
+      out.push(el("p", {
+        class: "ds-group-note",
+        text: head + "GitHub App はこの組織に入っていますが、これらのリポジトリが読み取りの対象に選ばれていません。"
+          + "インストール設定を開いて、対象のリポジトリを追加してください。"
+          + "設定は App を入れた方の画面に出ます。見当たらない場合は、この組織で App を入れた方にご依頼ください。"
+          + "リポジトリ自体が一覧に見当たらない場合は、移動・改名・削除されている可能性があるので、登録から外してください。"
+          + "お客様の組織では、組織のオーナーに承認を依頼してください。",
+      }));
+      out.push(appSettingsLink("インストール設定を開く →"));
+      return out;
+    }
+    if (installed === false) {
+      out.push(el("p", {
+        class: "ds-group-note",
+        text: head + "この組織に Cortex の GitHub App を入れると読めるようになります（Issues の読み取りだけ）。"
+          + "お客様の組織では、組織のオーナーに承認を依頼してください。",
+      }));
+      out.push(appInstallLink("この組織にインストール →"));
+      return out;
+    }
+    // 「null」（確かめられなかった）と、この値を知らない古い fleet-status.json。
+    // **導線を出さない。** どちらが原因か分からないので、押させると外れたほうを
+    // 押させることになる（済んでいるインストールをもう一度、あるいは効かない設定画面へ）
+    out.push(el("p", {
+      class: "ds-group-note",
+      text: head + "原因（GitHub App が入っていない／入っているがこれらのリポジトリが選ばれていない）は、"
+        + "今回の実行では確かめられませんでした。翌朝の表示をご確認ください。",
+    }));
+    return out;
+  }
+
   /**
    * Slack のチャンネルを**平らに**並べる（2026-08-20）。
    *
@@ -2581,6 +2860,63 @@ ${capabilityState.toString()}
    */
   var GITHUB_APP_INSTALL_URL = "https://github.com/apps/classmethod-cortex-app/installations/new";
 
+  /**
+   * GitHub App のインストールへ行くリンク（2026-08-20 に部品化）。
+   *
+   * **同じものを2箇所に書かない。** 組織ごとの案内と、追加フォームの手順が
+   * 同じ導線を持つ（#138 で「1箇所にしか無い」ことが事故になったので、
+   * **むしろ複数あるのが正しい**）。写経すると、URLの張り替えで片方だけ古くなる。
+   *
+   * **正本は手順の側。** 組織ごとの案内は行が無いと出ないので、
+   * 行0件の案件では手順側しか残らない。
+   *
+   * **⚠️ ただし手順は追加フォームの中にあり、追加フォームは
+   * SITE.intake が無いと丸ごと消える**（renderExternalAdders の冒頭）。
+   * つまり **intake 無し＋行0件** の案件では App の導線が1本も無くなる。
+   * いまは config.ts の intakeUrl が艦隊で1つ・全案件に渡っているので
+   * その組み合わせは起きない（2026-08-20 に確認）。
+   * **案件ごとに intake を出し分けるようになったら、ここを見直すこと。**
+   */
+  function appInstallLink(label) {
+    return el("a", {
+      class: "ds-owner-install",
+      href: GITHUB_APP_INSTALL_URL,
+      target: "_blank", rel: "noopener",
+      text: label || "GitHub App を入れる →",
+    });
+  }
+
+  /**
+   * すでに入っている App の**インストール設定**（対象リポジトリの追加）へ行くリンク。
+   *
+   * **インストールとは別の宛先。** 「installations/new」 は「入れる」ための画面で、
+   * すでに入っている組織の人が押しても対象リポジトリは増えない。
+   * リポジトリの追加は、その人が入れた先（個人 or 組織）の設定画面で行う。
+   *
+   * **組織名を URL に埋め込まない。** 組織ごとの設定ページは
+   * 「github.com/organizations/<組織>/settings/installations」 だが、**その組織の
+   * 管理者でないと 404 になる**。読み取り対象の組織のオーナーが Cortex の利用者とは
+   * 限らない（お客様の組織がまさにそれ）ので、404 に飛ばすより、
+   * 本人のインストール一覧から辿らせるほうが確実に着く。
+   * ——「GITHUB_APP_INSTALL_URL」 の「確かめられないものを顧客に押させない」と同じ判断。
+   *
+   * ⚠ **ただし「押した本人が入れた App」しか出ない。** App を入れたのが別のメンバーや
+   * 顧客側のオーナーなら、着いた先は空になる。だから**案内の本文の側が**
+   * 「App を入れた方の画面に出ます／見当たらない場合はその方にご依頼ください」と断っている
+   * （githubNotConnectedNodes）。**リンクだけ残して本文の断りを消さないこと**——
+   * 消すと「開けば必ずそこにある」前提の案内に戻り、着いた先が空の人が詰む。
+   */
+  var GITHUB_APP_SETTINGS_URL = "https://github.com/settings/installations";
+
+  function appSettingsLink(label) {
+    return el("a", {
+      class: "ds-owner-install",
+      href: GITHUB_APP_SETTINGS_URL,
+      target: "_blank", rel: "noopener",
+      text: label || "インストール設定を開く →",
+    });
+  }
+
   /**
    * 接続状況のライブ値（op=state の応答）。取得前・取得失敗時は null。
    *
@@ -2826,7 +3162,14 @@ ${capabilityState.toString()}
         // いまはタイルが飛び先。両方に付けると同じ id が2つある不正なHTMLになり、
         // モーダルの中身がタイルより前に来る変更が入った瞬間、getElementById が
         // 「開いていないモーダルの中」を指して黙って無反応になる
-        var card = el("div", { class: "ds-card" + (inactive ? " ds-inactive" : "") }, [
+        //
+        // **ds-capbody を付けて縦組みにする（2026-08-21・オーナー指摘）。**
+        // .ds-card は横並びの flex なので、名前ブロック（col）と設定一式（ctl）が
+        // 左右に並び、「共有資料 資料」だけが左の細い列に見えていた。
+        // Slack / GitHub の行と同じ「上にレコード・下にフォーム」に見せるため、
+        // **このカードのときだけ** 縦に積む（.ds-card そのものの CSS は変えない
+        // ——extSourceCard が使っており、変えると Slack と GitHub の行が壊れる）。
+        var card = el("div", { class: "ds-card ds-capbody" + (inactive ? " ds-inactive" : "") }, [
           el("div", { class: "ds-card-main" }, [
             el("span", { class: "ds-icon", text: DS_KIND_ICON[s.kind] || "📁" }),
             el("span", { class: "ds-type", text: s.kind || "" }),
@@ -2871,8 +3214,13 @@ ${capabilityState.toString()}
       var groups = [];
       var byType = {};
       sources.forEach(function (s) {
-        var g = byType[s.type];
-        if (!g) { g = { type: s.type, items: [] }; byType[s.type] = g; groups.push(g); }
+        // **GitHub は種別をまたいで1つにまとめる（2026-08-20）。**
+        // issues と discussions を別グループにすると、**同じ組織の案内が2箱出る**
+        // （組織ごとの畳み直しが箱をまたげない。実測で再現した）。
+        // 組織は type ではなく ref に入っているので、まとめて渡すのが正しい
+        var key = String(s.type).indexOf("github") === 0 ? "__github__" : s.type;
+        var g = byType[key];
+        if (!g) { g = { type: key, items: [] }; byType[key] = g; groups.push(g); }
         g.items.push(s);
       });
       var UNIT = { "slack": "チャンネル", "github-issues": "リポジトリ", "github-discussions": "リポジトリ" };
@@ -2886,6 +3234,15 @@ ${capabilityState.toString()}
           slackRows(g.items, meta).forEach(function (n) { pushCap("チャット", n); });
           return;
         }
+        // **GitHub も組織ごとに分ける（2026-08-20・Slack からの横展開）。**
+        // それまでは「リポジトリの一覧」と「組織ごとの接続状況」が**別々に並んで**おり、
+        // どの行がどの組織のものか、行を見ても分からなかった。
+        if (g.type === "__github__") {
+          // **meta は行ごとに引く。** issues と discussions が混ざるので、
+          // グループの type から1つに決められない
+          githubRows(g.items).forEach(function (n) { pushCap("開発", n); });
+          return;
+        }
         var cards = el("div", { class: "ds-list" });
         g.items.forEach(function (s) { cards.appendChild(extSourceCard(s, meta)); });
         if (g.items.length >= 4) {
@@ -2929,125 +3286,49 @@ ${capabilityState.toString()}
     // 読み取れていない組として現れ、そこに接続ボタンが出る。
     // 0件なら繋ぐ相手もまだ無いので、入口が要る場面にならない。
     pushCap("チャット", adders.querySelector('[data-adder="slack"]'));
-    // **組織ごとの接続状況を、開発の一番上に置く。** トークンは組織ごとにしか
-    // 効かない（Fine-grained PAT も GitHub App のインストールトークンも1組織分）ので、
-    // 「N件が読めていません」だけでは何をすればよいか決まらない。
-    // どの組織が繋がっていないかと、そこへの導線を出す
-    var owners = fleetVal("githubOwners") || [];
-    if (owners.length) {
-      var obox = el("div", { class: "ds-owners" });
-      obox.appendChild(el("div", { class: "ds-sub", text: "組織ごとの接続状況" }));
-      owners.forEach(function (o) {
-        var ok = o.source === "app" || o.source === "token";
-        // **確かめられなかった夜は、そう言う。** gh の不在・タイムアウト・ネットワーク断で
-        // 起きる。「接続OK」と出すと、同じ画面の集計行が「⚠️ 2件に問題」と言っている
-        // 横で食い違う。「未接続」と出すと、繋がっている組織に設定を促す偽の警告になる。
-        // どちらも嘘なので、確かめていないことをそのまま出す
-        var unsure = o.source === "unknown";
-        var row = el("div", { class: "ds-owner" }, [
-          el("span", { class: "ds-owner-name", text: o.owner }),
-          el("span", { class: "ds-owner-state ds-gate-" + (ok ? "ok" : "warn"),
-            // **読める件数を出す。** 総数だけ出すと、同じ画面の
-            // 「⚠️ 15件が読めていません」と食い違う（#101 で3度直した形）
-            // **確かめられなかった件数を出す。** 未接続側は「18リポジトリ中 15件が
-            // 読めていません」と出しているのに、こちらだけ総数だと同じ節の中で
-            // 表現が揃わない。4リポ中1つだけ揺れた夜に「4リポジトリを確かめられて
-            // いません」と読めるのも実態と違う
-            text: unsure
-              ? "⚠️ 確認できませんでした　" + o.repos + "リポジトリ中 " +
-                (o.unchecked || o.repos) + "件の接続を確かめられていません"
-              : ok
-                ? "● 接続OK　" + o.repos + "リポジトリ" + (o.source === "app" ? "（GitHub App）" : "")
-                : "⚠️ 未接続　" + o.repos + "リポジトリ中 " + o.unreadable + "件が読めていません" }),
-        ]);
-        // **未接続のときだけ導線を出す。** 繋がっている組織に「インストール」を
-        // 出すと、押す必要が無いものを押させることになる。
-        // 確かめられなかっただけの組織にも出さない——すでに入っているかもしれないので
-        if (!ok && !unsure) {
-          row.appendChild(el("a", {
-            class: "ds-owner-install",
-            // どの組織かはこの行に出ているので、選ばせる形で足りる（URLの形は
-            // GITHUB_APP_INSTALL_URL のコメントを参照）
-            href: GITHUB_APP_INSTALL_URL,
-            target: "_blank", rel: "noopener",
-            text: "この組織にインストール →",
-          }));
-        }
-        obox.appendChild(row);
-      });
-      pushCap("開発", obox);
-    } else {
-      // **組織が1件も無い案件にも、App の入口を置く（#138）。**
-      // githubOwners は夜間バッチの成果物なので、立ち上げ直後の案件には無い。
-      // インストールの導線を「未接続の組織の行」の中にしか置いていなかったため、
-      // **まだ何も繋いでいない案件＝一番 App を入れてほしい案件**の画面に、
-      // App へ行く道が1本も無かった（実機で踏んだ）。
-      var obox0 = el("div", { class: "ds-owners" });
-      obox0.appendChild(el("div", { class: "ds-sub", text: "組織ごとの接続状況" }));
-      obox0.appendChild(el("div", { class: "ds-owner" }, [
-        el("span", { class: "ds-owner-state ds-gate-idle", text: "⦿ 未接続　読み取っている組織はまだありません" }),
-        el("a", {
-          class: "ds-owner-install",
-          href: GITHUB_APP_INSTALL_URL,
-          target: "_blank", rel: "noopener",
-          text: "組織に GitHub App をインストール →",
-        }),
-      ]));
-      pushCap("開発", obox0);
-    }
+    // **組織ごとの接続状況は、行と一体にした（2026-08-20・Slack からの横展開）。**
+    //
+    // それまでは「リポジトリの一覧」と「組織ごとの接続状況」が**別々に並んで**おり、
+    // 行を見てもどの組織のものか分からず、状況を見てもどの行の話か分からなかった。
+    // いまは:
+    //   - どの組織かは**行のラベル**（extSourceCard）
+    //   - 繋がっていない組織は**案内が行を抱える**（githubRows）
+    //
+    // **⚠️ App の導線は、追加フォームの手順に常設してある（#138）。**
+    // 組織ごとの案内は**行が無いと出ない**ので、
+    // **行0件の案件＝一番 App を入れてほしい案件**にはそちらしか無い。
+    // 「案内側に導線があるから手順側は省く」とやると #138 が再発する。
+    //
+    // 立ち上げ直後（githubOwners が空）でも、追加フォームは必ず出る
+    // （adders はグループの外に置いてある）。
 
     pushCap("開発", adders.querySelector('[data-adder="github"]'));
 
-    /**
-     * GitHub の読み取りトークンを入れる欄が要るか（#118）。
-     *
-     * トークンは **GitHub App が入っていない組織のフォールバック**でしかない。全組織が
-     * App（か登録済みトークン）で読めている案件に入力欄を出すと、実機で言われたとおり
-     * 「App に移行したのに、なぜトークンを求められるのか」になる。押す必要が無いものを
-     * 押させるのは、未設定の警告を出し続けるのと同じ種類の誤りなので畳む。
-     *
-     * **判断材料が無いときは出す。** githubOwners は fleet-status.json 由来で、
-     * 夜間バッチがまだ走っていない案件には無い。「情報が無い」を「接続済み」に寄せると、
-     * **一番繋ぎたい立ち上げ直後の案件**から唯一の入口が消える。
-     *
-     * **unknown（確かめられなかった組織）も「要る」側に倒す。** 実態は none かもしれず、
-     * 隠す方に倒すと直せなくなる（画面には組織ごとに「確認できませんでした」と出ている）。
-     *
-     * **「無い」と「空」は別物（#138・オーナー判断 2026-08-18）。**
-     *   - 値そのものが来ていない（undefined）… fleet-status.json をまだ持っていない、または
-     *     取得に失敗した。**情報が無いので出す**（上の #118 の意図はここが担う）。
-     *   - 空の配列（[]）… 夜間バッチは走ったが、読み取り対象の開発リポジトリが0件。
-     *     読むものが無いのだから鍵も要らない。**出さない**。
-     * 以前はどちらも空配列に丸めていたので、0件の案件にも欄が出続けていた。
-     * **この2つを混ぜると #118 を壊す**（立ち上げ直後の案件から唯一の入口が消える）。
-     */
-    function githubTokenNeeded() {
-      var list = fleetVal("githubOwners");
-      if (!Array.isArray(list)) return true;
-      if (!list.length) return false;
-      return list.some(function (o) { return !o || (o.source !== "app" && o.source !== "token"); });
+    // **0件の案件にも1行だけ残す（#138 のオーナー判断・置き場所だけ移した）。**
+    // 元は GitHub の読み取りトークンの鍵カードを畳んだ跡地に出していたが、
+    // その鍵ごと廃止したので、GitHub の節の側で持つ。
+    //
+    // **消さないこと。** 立ち上げ直後の案件は、この節に行が1本も無い
+    //（＝組織ごとの案内も出ない）。何も言わないと、上のフォームが何のためにあるのか、
+    // 登録したあと何が起きるのかが画面から読み取れない。
+    //
+    // **「[]」（夜間バッチは走ったが対象0件）と 「undefined」（まだ走っていない）は別物。**
+    // 後者に「まだありません」と書くと、実際には登録済みかもしれない案件に嘘を言う
+    var ownersNow = fleetVal("githubOwners");
+    if (Array.isArray(ownersNow) && ownersNow.length === 0) {
+      pushCap("開発", el("p", {
+        class: "sec-how ds-all-connected",
+        text: "読み取り対象の開発リポジトリがまだありません。上のフォームで登録すると、"
+          + "読めているかどうかを翌朝からここに出します。",
+      }));
     }
 
     // 連携の鍵は、その能力のところへ置く（画面下まで往復させない）
-    var SECRET_CAP = { figma: "デザイン", backlog: "課題管理", "external-sources": "開発" };
+    // **GitHub（「external-sources」）はここに無い。** 読み取りトークンは廃止し、
+    // 読み取りは GitHub App に一本化した。**この表に戻すと入力欄が復活する**
+    var SECRET_CAP = { figma: "デザイン", backlog: "課題管理" };
     (SITE.secretKinds || []).forEach(function (k) {
       if (!SECRET_FORMS[k]) return;
-      // 全組織が繋がっているなら、入力欄ではなく**そう言う1行**に畳む（#118）。
-      // 何も出さないと「トークンはどこで入れるのか」が分からなくなる
-      if (k === "external-sources" && !githubTokenNeeded()) {
-        // **0件の案件に「すべての組織に接続済み」と言わない（#138）。** 組織が1つも無いのに
-        // 接続済みと書けば嘘になる。畳む理由が違うので、文も分ける——次の一歩
-        //（リポジトリを登録する）が同じモーダルの上にあることまで書く
-        var ownersNow = fleetVal("githubOwners");
-        var noRepos = Array.isArray(ownersNow) && ownersNow.length === 0;
-        pushCap(SECRET_CAP[k], el("p", {
-          class: "sec-how ds-all-connected",
-          text: noRepos
-            ? "読み取り対象の開発リポジトリがまだありません。このモーダルの上にあるリポジトリの追加フォームで登録すると、トークンが要るかどうかをここに出します。"
-            : "すべての組織に接続済みです（GitHub App / 登録済みトークン）。読み取りトークンの登録は要りません。",
-        }));
-        return;
-      }
       // **意図的にOFFにした能力にだけ、入力欄を出さない（0.4.71）。** 使わないと決めたものに
       // 鍵を求めるのは、設定する必要が無いものに設定を促す偽の警告と同じ。
       // 何も出さないと「トークンはどこで入れるのか」が分からなくなるので、理由を1行だけ残す
@@ -3065,6 +3346,13 @@ ${capabilityState.toString()}
         }));
         return;
       }
+      // **Backlog は接続先のスペースごとにカードを出す（2026-08-20・#127）。**
+      // キーはスペースごとに別なので、欄が1つだと**どちらの鍵を入れたのか
+      // 誰にも分からない**まま片方の棚に入る（入れたのに動かない、が起きる）。
+      if (k === "backlog") {
+        backlogSecretCards().forEach(function (n) { pushCap(SECRET_CAP[k], n); });
+        return;
+      }
       pushCap(SECRET_CAP[k], secretCard(k, SECRET_FORMS[k]));
     });
 
@@ -3089,7 +3377,9 @@ ${capabilityState.toString()}
       "開発": { icon: "🐙", desc: "IssuesをGoldの材料に" },
     };
     var STATE_LABEL = { ok: "● 接続OK", idle: "⦿ 未接続", off: "未使用", warn: "⚠️" };
-    var SECRET_OF_CAP = { "デザイン": "figma", "課題管理": "backlog", "開発": "external-sources" };
+    // **「開発」はここに無い。** GitHub の読み取りトークンは廃止したので、
+    // 鍵の未設定を語る相手がいない（読めていないときは組織ごとの案内が拾う）
+    var SECRET_OF_CAP = { "デザイン": "figma", "課題管理": "backlog" };
 
     // ---- セットアップの残り（checks）----
     //
@@ -3292,10 +3582,6 @@ ${capabilityState.toString()}
       // 新規案件——**まさに何を入れれば繋がるのかを知りたい場面**——から、
       // 鍵が未設定であることの手がかりまで消える
       var sk = SECRET_OF_CAP[cap];
-      // **GitHub は「トークンが無い」＝「読めていない」ではない（#118）。** App で読めている
-      // 案件に未設定の警告を出すと、直す必要が無いものを直させることになる。
-      // 読めていない組織があるときは、この下の checks とタイルの状態（warn）が拾う
-      var tokenIsFallback = sk === "external-sources" && !githubTokenNeeded();
       // **#125②: 導出があるときは導出で判断する。** OFF（意図的に止めた）にだけ出さない
       // ——入れる必要が無いものについて設定を促す偽の警告になる。
       //
@@ -3304,7 +3590,7 @@ ${capabilityState.toString()}
       // 0.4.70 は unset で入力欄を畳んでいたので注記も抑えていたが、案A で欄を出すようにしたため揃えた
       // 導出が無いデータでは判断材料が無いので、注記を出す側（＝入力欄と揃う側）に倒す
       var tokenRelevant = derived != null ? derived !== "off" : true;
-      if (!tokenIsFallback && tokenRelevant && sk && (SITE.secretKinds || []).indexOf(sk) >= 0 && !((fleetVal("secretSources") || {})[sk])) {
+      if (tokenRelevant && sk && (SITE.secretKinds || []).indexOf(sk) >= 0 && !((fleetVal("secretSources") || {})[sk])) {
         body.appendChild(el("div", { class: "ds-tile-note", text: "⚠ トークンが未設定です" }));
       }
       // セットアップの残りのうち、この能力のもの。**鍵の注記と同じ位置**に出して
@@ -3780,6 +4066,42 @@ ${capabilityState.toString()}
    * **読み手が見に行くのと別の棚へ黙って入る**（入れたのに動かない、が一番起きてほしくない形）。
    * 名乗らなければサーバが従来どおり名簿の値を使う。
    */
+  /**
+   * Backlog のAPIキーの欄を、接続先のスペースごとに出す（2026-08-20・#127）。
+   *
+   * **キーはスペースごとに別。** 欄が1つだと、複数スペースの案件で
+   * 「どちらの鍵を入れたのか」が誰にも分からないまま片方の棚に入る。
+   *
+   * ## 「現在:」は複数スペースのとき出さない
+   *
+   * 夜間の実測（secretSources.backlog）は**種別ごと**の1つの値で、
+   * スペース別の充足を表せない。1枚目に帰属させると
+   * **片方だけ入れた状態で両方に「登録済み」と出る**——画面が嘘をつく。
+   * 器がスペース別になるまでは、複数のときは全カードで出さない。
+   *
+   * ## 接続先がまだ無いとき
+   *
+   * カードは1枚だけ出す（スペースは名乗らない）。サーバは名簿の値に倒す。
+   */
+  function backlogSecretCards() {
+    var spaces = backlogSpacesNow();
+    if (spaces.length <= 1) return [secretCard("backlog", SECRET_FORMS["backlog"])];
+    return spaces.map(function (space) {
+      return secretCard("backlog", SECRET_FORMS["backlog"], { space: space, hideCurrent: true });
+    });
+  }
+
+  /** 画面が見ている接続先のスペース一覧（重複なし） */
+  function backlogSpacesNow() {
+    var list = backlogTargetsNow(null);
+    var domains = [];
+    for (var i = 0; i < list.length; i++) {
+      var d = String(list[i].domain || "").toLowerCase();
+      if (d && domains.indexOf(d) === -1) domains.push(d);
+    }
+    return domains;
+  }
+
   function backlogSecretSpace() {
     var list = backlogTargetsNow(null);
     var domains = [];
@@ -3805,17 +4127,25 @@ ${capabilityState.toString()}
     var targets = backlogTargetsNow(s);
     var editable = backlogTargetsEditable();
 
-    var listEl = el("div", { class: "ds-target-list" });
-    var current = el("div", { class: "ds-current" }, [
-      el("span", { class: "ds-current-label", text: "現在の接続先" }),
-      listEl,
-    ]);
+    // **Slack / GitHub / Figma / Drive と同じレコードの行にする（2026-08-21・オーナー指摘）。**
+    // それまでは「現在の接続先」というラベル付きの独自レイアウト（.ds-current /
+    // .ds-target-row）で、同じモーダルの中でもここだけ行間と見た目が違っていた。
+    var listEl = el("div", { class: "ds-list" });
+    // **0件の1行は一覧の外に置く**（Figma / Drive と同じ形）。中に .ds-card として
+    // 置くと「行が1件ある」と読まれ、一覧を数えるテストにも行として数えられる
+    var emptyEl = el("p", { class: "ds-empty", text: "同期する接続先はまだ登録されていません（未設定）。" });
     // 追加・削除の結果はここに1つだけ出す（行を描き直しても消えない位置）
     var msg = el("div", { class: "ds-toggle-msg" });
 
     function removeRow(t) {
-      var row = el("div", { class: "ds-target-row" }, [
-        el("span", { class: "ds-current-value", text: t.domain + " / " + t.projectKey }),
+      // **ds-type はツール名**（能力名を入れると上の見出しと重複する）。
+      // **名前はリンクにする**——Drive / Figma の行と同じく、正本を新しいタブで開ける
+      var row = el("div", { class: "ds-card" }, [
+        el("div", { class: "ds-card-main" }, [
+          el("span", { class: "ds-icon", text: "📋" }),
+          el("span", { class: "ds-type", text: "Backlog" }),
+          dsNameEl(t.domain + " / " + t.projectKey, "https://" + t.domain + "/projects/" + t.projectKey),
+        ]),
       ]);
       if (!editable) return row;
       var btn = el("button", { class: "ds-toggle-btn ds-danger", type: "button", text: "この接続先を外す" });
@@ -3842,12 +4172,13 @@ ${capabilityState.toString()}
 
     function paint() {
       while (listEl.firstChild) listEl.removeChild(listEl.firstChild);
-      if (!targets.length) {
-        // **行ごと消さない。** 表示が無いと「まだ何も無い」のか「出し忘れ」なのか区別できない
-        listEl.appendChild(el("span", { class: "ds-current-value is-unset", text: "未設定" }));
-        return;
-      }
       for (var i = 0; i < targets.length; i++) listEl.appendChild(removeRow(targets[i]));
+      // **0件を黙って見せない。** 表示が無いと「まだ何も無い」のか「出し忘れ」なのか
+      // 区別できない。**一覧の外**（Figma / Drive と同じ）に、件数に応じて出し入れする
+      // ——出しっぱなしにすると、設定済みの案件にも「未設定」と書いた行が残る
+      var here = emptyEl.parentNode === box;
+      if (!targets.length && !here) box.insertBefore(emptyEl, listEl.nextSibling);
+      else if (targets.length && here) box.removeChild(emptyEl);
     }
 
     /**
@@ -3870,8 +4201,10 @@ ${capabilityState.toString()}
       return { onTargets: adoptTargets, staleNote: TARGETS_RACE_NOTE };
     }
 
+    // **box を先に作る。** paint() は 0件の1行を box へ出し入れするので、
+    // 箱が無いと最初の描画で「未設定」の行が出ない
+    var box = el("div", {}, [listEl]);
     paint();
-    var box = el("div", {}, [current]);
     if (editable) {
       box.appendChild(addForm({
         // **「追加」に戻す（#127）。** 1件しか持てなかった頃は「保存」（置き換え）だったが、
@@ -3879,7 +4212,27 @@ ${capabilityState.toString()}
         title: "＋ 接続先を追加",
         placeholder: "https://<スペース>.backlog.jp/projects/<プロジェクトキー>",
         requiredNote: "BacklogのURLを入力してください（プロジェクトキーが入った形。数字だけのURLは受け付けません）。",
-        hint: "Backlog でこの案件のプロジェクトを開き、ブラウザのURLをそのまま貼ってください（課題の画面のURLでも構いません）。APIキーは下の「Backlog のAPIキー」から別に登録します。増えるのは同期先だけで、ビューアからの起票先は変わりません。リアルタイム同期を使う場合は、追加したプロジェクトの Backlog 側にも案件専用URLの登録が要ります。",
+        // **手順のリストにする（2026-08-20・Slack からの横展開）。**
+        // **リスト（ol.sec-steps）そのものは維持する**——他の能力の手順と形を揃える。
+        //
+        // **鍵の発行手順は二重に持たない。** 正本は下の鍵カード
+        //（SECRET_FORMS.backlog の how）で、ここからは参照するだけ。
+        //
+        // ## 4行 → 2行に圧縮した（2026-08-21・オーナー指摘「何も変わってない気がする」）
+        //
+        // **この欄は URL を貼るだけ**なので、4行の説明が読む負担に見合わない。
+        // ただし**落としてよいのは1行目だけ**だった（欄を見れば分かる内容）。残り3つは
+        // ここ以外に置き場が無いので、**消さずに2行へ畳んでいる**:
+        //   - 「起票先は変わりません」… 追加の確認をやめたとき（2026-08-20）に
+        //     ここへ移してきたもの。落とすと知る手段が無くなる
+        //   - 「スペースごとに別のキー」… 鍵カードからは読めない。1スペースの案件は
+        //     カードのタイトルにスペース名が出ないので、これから2つ目を足す人に届かない
+        //   - 「案件専用URLの登録」… 救出先の realtimeSyncCard() は稼働中の案件では
+        //     手順一式を <details> に畳むので、**いちばん要る人に対して閉じている**
+        hint: [
+          "URL を貼ると同期先が増えます。ビューアからの起票先は変わりません（スペースごとに別のAPIキーが要ります）。",
+          "リアルタイム同期を使うなら、追加したプロジェクトにも案件専用URLの登録が要ります。",
+        ],
         build: function (url) {
           return { op: "backlog-target-add", url: url, baseGeneration: targetsGenerationOf(targets) };
         },
@@ -4013,15 +4366,11 @@ ${capabilityState.toString()}
         box.appendChild(el("p", { class: "sec-how", text: "共有資料の取り込み設定を読み取れないため、この画面からは変更できません。cortex の担当者にご連絡ください。" }));
         used = true;
       } else if (s.driveState) {
-        // フォルダが1件も無いのに ON/OFF だけ出しても意味が無いので、追加フォームを先に出す
-        box.appendChild(addForm({
-          title: "＋ Google Drive のフォルダを追加",
-          placeholder: "https://drive.google.com/drive/folders/…",
-          namePlaceholder: "メモ（任意）",
-          requiredNote: "フォルダのURLを入力してください。",
-          hint: "このフォルダの中身が 共有資料 にコピーされ、Markdown 化されます。取り込み用アカウントをそのフォルダの閲覧者に招待しておいてください（招待が無いと読めません）。",
-          build: function (url, name) { return { op: "add-drive-folder", url: url, name: name }; },
-        }));
+        // **レコードが先・追加フォームが後（2026-08-21）。** Slack / GitHub と同じ並びに揃える。
+        // それまではフォームが先だった。理由は「フォルダが1件も無いのに ON/OFF だけ出しても
+        // 意味が無いから」だったが、**その ON/OFF トグルは既に廃止されている**（下の注記）。
+        // 理由が消えたのに順序だけ残っていた。デザインと課題管理は元から「レコード → フォーム」。
+        //
         // **ON/OFFのトグルは出さない。** フォルダを追加した時点で取り込みは始まる
         // （applyAddDriveFolder が enabled を立てる）ので「始める」を押す機会が無い。
         // 止めたいならフォルダを外す——登録そのものが意思表示、という会議と同じ考え方。
@@ -4029,11 +4378,19 @@ ${capabilityState.toString()}
         // 名前は任意。**無ければIDを出す**（既存の案件は名前を持っていない）
         var fnames = s.driveFolderNames || {};
         if (folders.length) {
-          var dlist = el("div", { class: "ds-subitems" });
+          var dlist = el("div", { class: "ds-list" });
           folders.forEach(function (id) {
             var fname = fnames[id];
-            var row = el("div", { class: "ds-subitem" }, [
-              dsNameEl(fname || id, "https://drive.google.com/drive/folders/" + id),
+            // **Slack / GitHub の行と同じ構造にする（ds-card > ds-card-main >
+            // ds-icon + ds-type + ds-name）。** extSourceCard は呼ばない——
+            // あちらは type / gate / origin など外部ソース固有の判断を抱えている。
+            // ds-type に入れるのは**ツール名**（能力名を入れると上の見出しと重複する）。
+            var row = el("div", { class: "ds-card" }, [
+              el("div", { class: "ds-card-main" }, [
+                el("span", { class: "ds-icon", text: "📁" }),
+                el("span", { class: "ds-type", text: "Google Drive" }),
+                dsNameEl(fname || id, "https://drive.google.com/drive/folders/" + id),
+              ]),
             ]);
             // **名前を出したときはIDも併記する。** 同名のフォルダを見分けられなくなるのと、
             // 「このIDを外す」という確認文と画面の表示が食い違うのを防ぐ
@@ -4054,12 +4411,41 @@ ${capabilityState.toString()}
                 return lines;
               },
               build: function () { return { op: "remove-drive-folder", id: id }; },
-              onDone: function () { row.className = "ds-subitem ds-removed"; },
+              // **クラスのハード代入をやめる**（片方だけ直し忘れる形を構造的に消す）
+              onDone: function () { row.classList.add("ds-removed"); },
             }));
             dlist.appendChild(row);
           });
           box.appendChild(dlist);
+        } else if (s.driveState === "empty") {
+          // **0件を黙って見せない。** 追加フォームだけだと「まだ登録していない」のか
+          // 「読めていない」のか区別できない。
+          //
+          // **判定は driveState === "empty" にする。** engine（fleet-status.mjs）は
+          // driveFolderIds を「1件以上あるときだけ」出すので、キーの有無では
+          // 未取得（unset / broken）と0件を見分けられない。unset / broken は
+          // 上の分岐で先に返しているので、ここへ来る empty は「読めていて0件」だけ。
+          box.appendChild(el("p", { class: "ds-empty", text: "取り込み対象のフォルダはまだ登録されていません。" }));
         }
+        box.appendChild(addForm({
+          title: "＋ Google Drive のフォルダを追加",
+          placeholder: "https://drive.google.com/drive/folders/…",
+          namePlaceholder: "メモ（任意）",
+          requiredNote: "フォルダのURLを入力してください。",
+          // **手順のリストにする（2026-08-20・Slack からの横展開）。**
+          //
+          // **取り込み用アカウントのアドレスを出す（オーナー判断・分類A）。**
+          // それまでは「取り込み用アカウントを招待してください」としか書いておらず、
+          // **誰を招待すればいいのかが画面から分からなかった**——担当者に聞かないと
+          // 完了できない手順になっていた。
+          // 招待されない限り何も読めないアカウントなので、出す判断をした。
+          hint: [
+            { text: "読み取りたい Google Drive のフォルダを開き、下のアカウントを閲覧者として招待します（招待が無いと読めません）。", node: copyRow(DRIVE_INGEST_ACCOUNT) },
+            "そのフォルダのURLを下の欄に貼って「追加」を押します。",
+            "追加したフォルダの中身が 共有資料 にコピーされ、Markdown 化されます。止めるときは、その行の「このフォルダを外す」を押します。",
+          ],
+          build: function (url, name) { return { op: "add-drive-folder", url: url, name: name }; },
+        }));
         used = true;
       }
     }
@@ -4073,10 +4459,18 @@ ${capabilityState.toString()}
       // 描画時点の件数で判定すると、3件を1件ずつ外していったとき最後の1件でも警告が出ない。
       var figsLeft = figs.length;
       if (figs.length) {
-        var flist = el("div", { class: "ds-subitems" });
+        var flist = el("div", { class: "ds-list" });
         figs.forEach(function (f) {
-          var row = el("div", { class: "ds-subitem" }, [
-            dsNameEl(f.name || f.key, "https://www.figma.com/design/" + f.key),
+          // **Slack / GitHub の行と同じ構造にする（ds-card > ds-card-main >
+          // ds-icon + ds-type + ds-name）。** extSourceCard は呼ばない——
+          // あちらは type / gate / origin など外部ソース固有の判断を抱えている。
+          // ds-type に入れるのは**ツール名**（能力名を入れると上の見出しと重複する）。
+          var row = el("div", { class: "ds-card" }, [
+            el("div", { class: "ds-card-main" }, [
+              el("span", { class: "ds-icon", text: "🎨" }),
+              el("span", { class: "ds-type", text: "Figma" }),
+              dsNameEl(f.name || f.key, "https://www.figma.com/design/" + f.key),
+            ]),
           ]);
           row.appendChild(removeButton({
             label: "このファイルを外す",
@@ -4100,7 +4494,8 @@ ${capabilityState.toString()}
             },
             build: function () { return { op: "remove-figma-file", key: f.key }; },
             onDone: function () {
-              row.className = "ds-subitem ds-removed";
+              // **クラスのハード代入をやめる**（片方だけ直し忘れる形を構造的に消す）
+              row.classList.add("ds-removed");
               figsLeft -= 1;
             },
           }));
@@ -4117,7 +4512,18 @@ ${capabilityState.toString()}
         placeholder: "https://www.figma.com/design/…",
         namePlaceholder: "メモ（任意）",
         requiredNote: "FigmaのURLを入力してください。",
-        hint: "このファイルの画面インベントリ（画面名・Figmaへのリンク）が毎晩同期されます。画像は取り込まれません。",
+        // **手順のリストにする（2026-08-20・Slack からの横展開）。**
+        // 一続きの文章だと、読む人が「自分がいま何をすべきか」を自分で切り出すことになる。
+        //
+        // **手順1・2は要約にとどめ、正本は下の鍵カードに置く**（SECRET_FORMS.figma の
+        // how / note）。全文をここに移すと二重になり、片方だけ直る形になる
+        // ——カードは接続マップとタイルの注記と条件を揃えているので、動かすと壊れやすい。
+        hint: [
+          "Figma でトークンを発行します（読み取りだけ。スコープ2つ）。手順は下の「Figma のトークン」の欄にあります。",
+          "発行したアカウントを、読み取りたい Figma ファイルに閲覧者として招待します（招待が無いと、トークンが正しくても読めません）。",
+          "そのファイルのURLを下の欄に貼って「追加」を押します。",
+          "追加したファイルは、画面名と Figma へのリンクが毎晩同期されます（画像は取り込まれません）。",
+        ],
         build: function (url, name) { return { op: "add-figma-file", url: url, name: name }; },
       }));
       used = true;
@@ -4215,7 +4621,21 @@ ${capabilityState.toString()}
         placeholder: "owner/repo または https://github.com/owner/repo",
         namePlaceholder: "メモ（任意）",
         requiredNote: "リポジトリを入力してください。",
-        hint: "このリポジトリの Issues が、毎晩の Gold 昇格の材料になります。",
+        // **手順のリストにする（2026-08-20・Slack からの横展開）。**
+        //
+        // **App の導線をここに常設する（#138 の再発防止・唯一の防波堤）。**
+        // それまでは「組織ごとの接続状況」という独立した一覧の中にしか
+        // 導線が無く、**まだ何も繋いでいない案件＝一番 App を入れてほしい案件**の
+        // 画面に App へ行く道が1本も無かった（実機で踏んだ）。
+        //
+        // **行が0件でも、この手順は必ず出る**（追加フォームはグループの外にある）。
+        // 組織ごとの案内は行が無いと出ないので、**常設の正本はこちら**。
+        // 「案内側に導線があるから手順側は省く」とやると即再発する。
+        hint: [
+          { text: "読み取りたいリポジトリがある組織に、Cortex の GitHub App を入れます（Issues の読み取りだけ）。", node: appInstallLink() },
+          "そのリポジトリを下の欄に入れて「追加」を押します（owner/repo でも、GitHub のURLでも構いません）。",
+          "追加したリポジトリの Issues が、毎晩の Gold 昇格の材料になります。止めるときは、その行の「読み取りを止める」を押します。",
+        ],
         build: function (repo, name) { return { op: "add-github-source", repo: repo, name: name }; },
         adder: "github",
       }));
@@ -4747,6 +5167,30 @@ ${capabilityState.toString()}
     // ようになった（explicit には出さない）が、Slack で explicit なのは登録ファイルに
     // 直接書いた例外的な行だけで、バッジのために文面をもう一組増やすには釣り合わない。
     // #119 以降、新しいデータの github は必ず explicit（詳細は ORIGIN_LABEL）
+    // **どの組織のリポジトリかを行に出す（2026-08-20）。**
+    // 組織ごとの独立した一覧をやめたので、**組織を言うのは行のラベルだけ**になった。
+    // トークンは組織ごとにしか効かないので、これが判断の単位になる
+    if (String(s.type).indexOf("github") === 0 && s.ref) {
+      var ghOwner = String(s.ref).split("/")[0];
+      if (ghOwner) {
+        // **何で読んでいるかを添える。** 台帳に無ければ何も言わない。
+        //
+        // **添えるのは App のときだけ（2026-08-21・読み取りトークンの廃止で判断し直した）。**
+        // かつては「App／個人トークン」で直し方が違ったが、個人トークンは廃止した。
+        // いま App が付かない行は 「workflow」（ワークフロー自身のトークンで読めた＝
+        // だいたい公開リポジトリ）で、**読めている以上その人に直す作業は無い**。
+        // ここに「（ワークフローのトークン）」のような札を足すと、直しようのない
+        // 内部事情を全行に並べることになる——押す必要が無いものを説明する側の混雑。
+        // 一方 App の札は「この組織はもう繋いである」という**運用上の意味**を持つので残す。
+        var ghMeta = githubOwnerMeta(ghOwner);
+        var via = ghMeta && ghMeta.source === "app" ? "（GitHub App）" : "";
+        badges.appendChild(el("span", {
+          class: "badge ds-workspace" + (ghMeta && ghMeta.source === "unknown" ? " ds-workspace-unknown" : ""),
+          text: ghOwner + via,
+          title: "トークンは組織ごとにしか効きません（Fine-grained PAT も GitHub App のインストールトークンも1組織分）。",
+        }));
+      }
+    }
     if (String(s.type).indexOf("github") === 0 && ORIGIN_LABEL[s.origin]) {
       badges.appendChild(el("span", {
         class: "badge ds-origin",
@@ -5136,12 +5580,25 @@ ${capabilityState.toString()}
     ].concat(steps));
   }
 
-  /** 鍵の入力欄に出す説明。kind は Lambda 側（resolveSecretTarget）と綴りを合わせること */
+  /**
+   * 鍵の入力欄に出す説明。kind は Lambda 側（resolveSecretTarget）と綴りを合わせること。
+   *
+   * **発行の手順（how / note / selfServe.note）は <details> に畳む**
+   *（2026-08-21・オーナー指摘「カードが長すぎる」）。**文言は消していない**——
+   * 畳んだ中に全部残っており、summary を開けば読める。
+   * 畳まないのは .sec-state / .sec-preferred / .sec-input（secretCard 側の 🔴 コメント参照）。
+   *
+   * **「畳まない種別」の枝は置いていない。** 当初は fold: true の opt-in にしていたが、
+   * 2026-08-21 に external-sources（GitHub の読み取りトークン）が廃止され、
+   * **残る2種別が両方とも畳む=その枝が到達不能になった**。
+   * 到達不能な枝は**壊しても何も起きない**ので、変異検証の網から静かに漏れる
+   * ——このリポジトリが繰り返し踏んでいる形なので、枝ごと落とした。
+   * **畳んではいけない種別を足すときに、テストと一緒に枝を戻すこと。**
+   */
   var SECRET_FORMS = {
     "figma": {
       icon: "🎨",
       title: "Figma のトークン",
-      desc: "デザインの画面インベントリと、Figma に付いたコメント（指摘）を毎晩同期するために使います。",
       // **必要なスコープは実装が叩くAPIから決まる。** sync-designs は
       //   GET /v1/files/{key}          → file_content:read（画面インベントリ）
       //   GET /v1/files/{key}/comments → file_comments:read（指摘の同期）
@@ -5158,7 +5615,6 @@ ${capabilityState.toString()}
     "backlog": {
       icon: "📋",
       title: "Backlog のAPIキー",
-      desc: "課題・Wiki・ドキュメントを毎晩同期するために使います。",
       how: "Backlog → 個人設定 → API で発行（この案件のプロジェクトが見えるアカウントで）",
       // **案件の担当者が自分で繋ぐ。** 以前は艦隊共通の読み取りアカウントを1つ運用していたが、
       // 案件が増えるたびに「その1人がプロジェクトへ参加追加してキーを配る」ことになり、
@@ -5175,21 +5631,6 @@ ${capabilityState.toString()}
           "（前の担当者のアカウントが無効になると同期が止まります）。",
       },
     },
-    "external-sources": {
-      icon: "🐙",
-      title: "GitHub の読み取りトークン",
-      desc: "開発リポジトリの Issues / Discussions を読み、Gold の原料にするために使います。",
-      // **第一の案内は GitHub App（#138）。** 実装の本線は App のインストールトークンで、
-      // 個人トークンは App を入れられない組織のフォールバックでしかない（既存案件は
-      // すでに App で読めている）。画面が個人トークンを勧め続けると、発行と入れ直しが
-      // 要る側に人が流れ続け、**入れ直しの要らない仕組みへ移れない**。
-      // 順序を入れ替えるだけで、どちらも残す——App を入れられない組織は実在する。
-      appFirst: {
-        text: "まず、読み取りたいリポジトリのある組織に Cortex の GitHub App を入れてください。トークンの発行も、期限が来たときの入れ直しも要りません。",
-        linkText: "組織に GitHub App をインストール →",
-      },
-      how: "App を入れられない組織では、代わりにトークンを使います。GitHub → Settings → Developer settings → Personal access tokens で、対象リポジトリに Contents / Issues の Read-only を付けて発行",
-    },
   };
 
   /**
@@ -5202,27 +5643,53 @@ ${capabilityState.toString()}
    * カードは #101 で能力モーダルの中へ移した（buildDataSources の pushCap 経由）。
    * まとめて並べる renderSecrets() は呼び出し元が無くなったので消してある。
    */
-  function secretPayload(intake, kind, value) {
+  function secretPayload(intake, kind, value, cardSpace) {
     var body = { projectKey: intake.projectKey, kind: kind, value: value };
     if (kind === "backlog") {
-      var space = backlogSecretSpace();
+      // **カードが担当するスペースを最優先する（2026-08-20）。**
+      // 複数スペースのときは欄がスペースごとに分かれているので、
+      // どの棚へ入れるかは**そのカードが知っている**。
+      // 1枚だけのときは従来どおり（1つに定まるなら名乗る・定まらなければ名簿に倒す）
+      var space = cardSpace || backlogSecretSpace();
       if (space) body.space = space;
     }
     return body;
   }
 
-  function secretCard(kind, meta) {
+  /**
+   * @param opts { space, hideCurrent }
+   *   space … このカードが担当する Backlog スペース（複数スペースのときだけ）
+   *   hideCurrent … 「現在:」を出さない（スペース別の充足を表せないため）
+   */
+  function secretCard(kind, meta, opts) {
+    var cardSpace = (opts && opts.space) || "";
+    var hideCurrent = !!(opts && opts.hideCurrent);
     // **いま何で動いているか**を先に出す。入れ直したのに反映されていない状態が
     // 画面で分かるようにする（接続状況は夜間バッチのスナップショットなので、
     // 保存の直後は前日の値のまま。時刻は上の節に出している）。
+    // **複数スペースのときは出さない。** この値は種別ごとの1つで、
+    // スペース別の充足を表せない——1枚目に帰属させると嘘になる
     var src = (fleetVal("secretSources") || {})[kind] || "";
+    // **どのスペースの鍵かを見出しに出す。** 欄が2つ並ぶので、
+    // 見分けが付かないと「どちらに入れたか」が分からなくなる
+    var cardTitle = cardSpace ? meta.title + "（" + cardSpace + "）" : meta.title;
     // **前方一致で見る。** #105 の移行期は「Secrets Manager（旧名）」も来る。
     // 完全一致にすると、旧名で動いている案件だけが repo secret と同じ見た目になり、
     // 「管理下にあるのに未移行」という一番知りたい状態が画面から消える
-    var state = src
-      ? el("p", { class: "sec-state" + (src.indexOf("Secrets Manager") === 0 ? " is-managed" : ""),
-                  text: "現在: " + src + " から取得中" })
-      : el("p", { class: "sec-state is-none", text: "現在: 未設定" });
+    // **複数スペースのときは、何も出さない（2026-08-20）。**
+    // この値は種別ごとの1つで、スペース別の充足を表せない。
+    // 「未設定」に倒すのも嘘——**片方は入っているかもしれない**。
+    // 出さない代わりに、どちらの鍵かは見出し（スペース名）で示す
+    var state = hideCurrent
+      // **消えた理由を書く（レビュー指摘）。** 1スペースの案件では出ていた行が
+      // 黙って消えると、利用者は「入っているのか未設定なのか」も
+      // 「なぜ表示が無いのか」も知る手段が無い
+      ? el("p", { class: "sec-state is-none",
+                  text: "スペースごとの登録状況は、まだ表示できません（貼り直すと、このスペースの鍵として上書きされます）" })
+      : src
+        ? el("p", { class: "sec-state" + (src.indexOf("Secrets Manager") === 0 ? " is-managed" : ""),
+                    text: "現在: " + src + " から取得中" })
+        : el("p", { class: "sec-state is-none", text: "現在: 未設定" });
 
     var input = el("input", { class: "sec-input", type: "password", placeholder: "トークンを貼り付け", autocomplete: "off" });
     var btn = el("button", { class: "ds-toggle-btn", type: "button", text: "保存" });
@@ -5246,7 +5713,7 @@ ${capabilityState.toString()}
           // こちらが渡すのは「どのスペースの鍵か」という材料だけ。
           // **押した時点で読む。** 組み立て時に固めると、接続先を登録した直後に
           // 貼った鍵が「スペースを特定できません」で断られる
-          body: JSON.stringify(secretPayload(intake, kind, value)),
+          body: JSON.stringify(secretPayload(intake, kind, value, cardSpace)),
         });
         var j = await res.json().catch(function () { return {}; });
         if (!res.ok) {
@@ -5272,38 +5739,50 @@ ${capabilityState.toString()}
       }
     });
 
+    // 発行の手順ひとそろい。**<details> に畳む**（文言は消さない。畳んだ中に全部残る）
+    var guidance = [
+      el("p", { class: "sec-how", text: meta.how }),
+      // **鍵の作り方に付随する注意（招待漏れ等）。** 発行手順（how）とは別に出す——
+      // 「トークンは正しいのに読めない」は権限の問題に見えないので、切り分けに時間がかかる。
+      meta.note ? el("p", { class: "sec-how", text: meta.note }) : null,
+      meta.selfServe ? el("p", { class: "sec-how", text: meta.selfServe.note }) : null,
+    ].filter(Boolean);
+    // **「畳んである中に何があるか」を summary に書く。** ただの「詳細」だと、
+    // 発行のしかたを探している人がここを開く手掛かりを持てない（rt カードと同じ流儀）
+    var guidanceBox = el("details", { class: "sec-fold" }, [el("summary", { text: "発行のしかた" })]);
+    for (var gi = 0; gi < guidance.length; gi++) guidanceBox.appendChild(guidance[gi]);
+
     // ライブ取得後に「現在: …」だけを差し替えるための目印（カードごと作り直すと入力が消える）
+    //
+    // **並びは「状態 → 貼る → 畳んだ手順」。** カードを短く見せるために、
+    // いちばんよく使う操作（貼って保存）を上へ出し、長い説明を下へ送っている。
+    //
+    // 🔴 **.sec-state / .sec-preferred / .sec-input は <details> の外に置くこと。**
+    //   - .sec-state … 保存したのに反映されていない状態が分かる唯一の手段。
+    //     押すまで見えないと成立しない
+    //   - .sec-preferred … 「誰のアカウントで発行するのか」を**手順より先に**伝える行。
+    //     未設定のときだけ出る＝これから貼る人にだけ出るので、畳むと存在理由が消える
+    //   - .sec-input … 貼る欄そのもの。ライブ差し替えもこのノードを直接触る
     return el("div", { class: "ops-card", "data-secret-kind": kind }, [
       el("div", { class: "ops-card-head" }, [
         el("span", { class: "ops-card-icon", text: meta.icon }),
-        el("h3", { class: "ops-card-title", text: meta.title }),
+        el("h3", { class: "ops-card-title", text: cardTitle }),
       ]),
-      el("p", { class: "ops-card-desc", text: meta.desc }),
+      // **desc は無い種別がある（2026-08-21）。** el() は text をそのまま textContent へ
+      // 代入するので、無条件に出すと画面に文字列 undefined が出る
+      meta.desc ? el("p", { class: "ops-card-desc", text: meta.desc }) : null,
       state,
       // **未設定のときだけ、先に試すべき手を出す。** 既に動いているカードに
       // 「まずこれをやれ」と出すと、直す必要が無いものを触らせることになる
       !src && meta.selfServe ? el("p", { class: "sec-preferred", text: meta.selfServe.text }) : null,
-      // **本線（App）はトークンの手順より先に、いつでも出す（#138）。**
-      // トークンで動いている案件こそ App へ移してほしいので、selfServe と違って
-      // 「未設定のときだけ」にはしない
-      meta.appFirst
-        ? el("p", { class: "sec-preferred" }, [
-            document.createTextNode(meta.appFirst.text + " "),
-            el("a", { href: GITHUB_APP_INSTALL_URL, target: "_blank", rel: "noopener", text: meta.appFirst.linkText }),
-          ])
-        : null,
-      el("p", { class: "sec-how", text: meta.how }),
-      // **鍵の作り方に付随する注意（招待漏れ等）。** 発行手順（how）とは別に出す——
-      // 「トークンは正しいのに読めない」は権限の問題に見えないので、切り分けに時間がかかる。
-      meta.note ? el("p", { class: "sec-how", text: meta.note }) : null,
-      meta.selfServe ? el("p", { class: "sec-how", text: meta.selfServe.note }) : null,
       input,
+      el("div", { class: "ds-toggle" }, [btn, msg]),
+      guidanceBox,
       // **扱いの説明はカードに持たせる。** 節の見出しの下に置いていたときは、
       // #101 でカードだけがモーダルへ移り、説明だけが画面から消えた。
       // 顧客にトークンの貼り付けを求める画面で、貼った値がどう扱われるかの
       // 説明が落ちるのは、いちばん落としてはいけない種類の欠落
       el("p", { class: "sec-note", text: "入れた値はここには表示されません（保存だけできます）。保存先は案件ごとに分かれているので、他の案件には影響しません。" }),
-      el("div", { class: "ds-toggle" }, [btn, msg]),
     ]);
   }