@unson/brainbase-mcp 0.5.0 → 0.6.0

package/README.md

@@ -49,6 +49,14 @@ Brainbaseの価値は、情報を多く保存することではありません
 
 組織向けのRBAC、承認、監査、マルチユーザー、managed connector、hosted runtimeは、共通の脳モデルを変えずに組織版で追加する領域です。
 
+### UIの所有境界
+
+- 単一利用者でも成立する共通UIは、このOSSリポジトリが所有します。
+- 組織版はOSS UIを依存として組み込み、組織・メンバー・権限・承認・監査・tenant管理だけを追加します。
+- 顧客固有のbranding、feature flag、接続先設定は顧客設定リポジトリが所有し、共通UIを複製しません。
+
+共通UIの最初の公開単位として、知識UIとMana委任UIを `@unson/brainbase-mcp/ui/*` から利用できます。
+
 実装済み・develop・計画中の境界は、[現在の状態](https://brainbase.pages.dev/guide/status)を参照してください。
 
 ## 10分で試す

package/contracts/judgment-dag/digest.json

@@ -25,8 +25,8 @@
     },
     {
       "path": "README.md",
-      "sha256": "ec2f2419e7f43e2abdbedf6535e6d57a095e920f6c42b9e250bbabb50c00b745"
+      "sha256": "eec54fc479eee1deba5c0abbfb3d733596229c87a2c4bacfc446b52e3c0140ed"
     }
   ],
-  "digest": "dbe232857d29a3178013c82fc80d87dadecf0fa07ebf5ca5d260b0eed35c34fb"
+  "digest": "f4b1b5eb55f71eaa481666c5f9503959a6c3ccf6fa8e7d28536653e8e1ab2f38"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unson/brainbase-mcp",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "Local-first Brainbase judgment OS that lets supported AI agents reuse a user's approved goals, priorities, decisions, and judgment criteria.",
   "type": "module",
   "license": "MIT",
@@ -27,6 +27,11 @@
       "types": "./dist/portable-graph.d.ts",
       "import": "./dist/portable-graph.js"
     },
+    "./ui/outcome-knowledge": "./ui/outcome-knowledge.js",
+    "./ui/outcome-knowledge.css": "./ui/outcome-knowledge.css",
+    "./ui/outcome-mana": "./ui/outcome-mana.js",
+    "./ui/outcome-mana.css": "./ui/outcome-mana.css",
+    "./ui/icons/*": "./ui/icons/*",
     "./dist/*": "./dist/*",
     "./contracts/judgment-dag/schema.json": "./contracts/judgment-dag/schema.json",
     "./contracts/judgment-dag/fixture.json": "./contracts/judgment-dag/fixture.json",
@@ -43,6 +48,7 @@
   "files": [
     "dist",
     "contracts",
+    "ui",
     "docs/architecture/judgment-dag-core.md",
     "docs/management/judgment-dag-milestones.md",
     "README.md",
@@ -98,5 +104,5 @@
   "engines": {
     "node": ">=20"
   },
-  "gitHead": "00ba08ebc953a3f8db66e9b624eceebd331c1e24"
+  "gitHead": "bb89a4a28af112943449b37f61d5eb59fca8d72f"
 }

package/ui/icons/mana/LICENSE.tabler.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020-2025 Paweł Kuna
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/ui/icons/mana/affiliate.svg

@@ -0,0 +1,20 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+  class="icon icon-tabler icons-tabler-outline icon-tabler-affiliate"
+>
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M5.931 6.936l1.275 4.249m5.607 5.609l4.251 1.275" />
+  <path d="M11.683 12.317l5.759 -5.759" />
+  <path d="M5.5 5.5m-1.5 0a1.5 1.5 0 1 0 3 0a1.5 1.5 0 1 0 -3 0" />
+  <path d="M18.5 5.5m-1.5 0a1.5 1.5 0 1 0 3 0a1.5 1.5 0 1 0 -3 0" />
+  <path d="M18.5 18.5m-1.5 0a1.5 1.5 0 1 0 3 0a1.5 1.5 0 1 0 -3 0" />
+  <path d="M8.5 15.5m-4.5 0a4.5 4.5 0 1 0 9 0a4.5 4.5 0 1 0 -9 0" />
+</svg>

package/ui/icons/mana/brand-github.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+  class="icon icon-tabler icons-tabler-outline icon-tabler-brand-github"
+>
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" />
+</svg>

package/ui/icons/mana/brand-google-drive.svg

@@ -0,0 +1,17 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+  class="icon icon-tabler icons-tabler-outline icon-tabler-brand-google-drive"
+>
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M12 10l-6 10l-3 -5l6 -10z" />
+  <path d="M9 15h12l-3 5h-12" />
+  <path d="M15 15l-6 -10h6l6 10z" />
+</svg>

package/ui/icons/mana/brand-slack.svg

@@ -0,0 +1,18 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+  class="icon icon-tabler icons-tabler-outline icon-tabler-brand-slack"
+>
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M12 12v-6a2 2 0 0 1 4 0v6m0 -2a2 2 0 1 1 2 2h-6" />
+  <path d="M12 12h6a2 2 0 0 1 0 4h-6m2 0a2 2 0 1 1 -2 2v-6" />
+  <path d="M12 12v6a2 2 0 0 1 -4 0v-6m0 2a2 2 0 1 1 -2 -2h6" />
+  <path d="M12 12h-6a2 2 0 0 1 0 -4h6m-2 0a2 2 0 1 1 2 -2v6" />
+</svg>

package/ui/icons/mana/cpu.svg

@@ -0,0 +1,24 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+  class="icon icon-tabler icons-tabler-outline icon-tabler-cpu"
+>
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M5 5m0 1a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1z" />
+  <path d="M9 9h6v6h-6z" />
+  <path d="M3 10h2" />
+  <path d="M3 14h2" />
+  <path d="M10 3v2" />
+  <path d="M14 3v2" />
+  <path d="M21 10h-2" />
+  <path d="M21 14h-2" />
+  <path d="M14 21v-2" />
+  <path d="M10 21v-2" />
+</svg>

package/ui/outcome-knowledge.css

@@ -0,0 +1,365 @@
+/* Knowledge outcome workspace. The component owns its layout so the shared
+   shell cannot turn an operational master/detail surface into stacked cards. */
+.knowledge-outcome {
+  --knowledge-paper: var(--paper, #fbfbf8);
+  --knowledge-canvas: var(--canvas, #f2f3ef);
+  --knowledge-ink: var(--ink, #111412);
+  --knowledge-muted: var(--muted, #656b67);
+  --knowledge-quiet: var(--quiet, #929894);
+  --knowledge-line: var(--line, #d9ddd8);
+  --knowledge-line-strong: var(--line-dark, #bfc5c0);
+  --knowledge-green: var(--green, #087d62);
+  --knowledge-green-soft: var(--green-soft, #e5f1ec);
+  --knowledge-amber: var(--amber, #c9870c);
+  --knowledge-amber-soft: var(--amber-soft, #fff0c7);
+  --knowledge-red: var(--red, #d92335);
+  --knowledge-red-soft: var(--red-soft, #fde9eb);
+  display: grid;
+  gap: 0;
+  min-width: 0;
+  color: var(--knowledge-ink);
+  background: transparent;
+  font-family: Geist, "Noto Sans JP", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  line-height: 1.5;
+}
+
+.knowledge-outcome *,
+.knowledge-outcome *::before,
+.knowledge-outcome *::after { box-sizing: border-box; }
+.knowledge-outcome button,
+.knowledge-outcome input,
+.knowledge-outcome select,
+.knowledge-outcome textarea { font: inherit; }
+.knowledge-outcome h2,
+.knowledge-outcome h3,
+.knowledge-outcome h4,
+.knowledge-outcome p { margin: 0; }
+.knowledge-outcome h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); letter-spacing: -0.035em; line-height: 1.2; }
+.knowledge-outcome h3 { font-size: 1.05rem; letter-spacing: -0.015em; line-height: 1.3; }
+.knowledge-outcome h4 { font-size: .79rem; letter-spacing: .01em; line-height: 1.35; }
+.knowledge-outcome [hidden] { display: none !important; }
+
+/* Header: a compact title bar leaves the working canvas visible immediately. */
+.knowledge-outcome .knowledge-outcome-head {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: 1rem 1.5rem;
+  align-items: start;
+  padding: 0 0 .9rem;
+  border: 0;
+  border-bottom: 1px solid var(--knowledge-line);
+  border-radius: 0;
+  background: transparent;
+}
+.knowledge-outcome .knowledge-header-main { min-width: 0; }
+.knowledge-outcome .knowledge-header-main > p { margin-top: .35rem; color: var(--knowledge-muted); font-size: .82rem; }
+.knowledge-outcome .knowledge-header-meta { display: flex; align-items: flex-start; justify-content: flex-end; }
+.knowledge-outcome .knowledge-project-context {
+  display: inline-flex;
+  align-items: center;
+  min-height: 1.8rem;
+  border: 1px solid var(--knowledge-line);
+  border-radius: 999px;
+  padding: .25rem .65rem;
+  color: var(--knowledge-muted);
+  background: var(--knowledge-paper);
+  font-size: .72rem;
+  white-space: nowrap;
+}
+.knowledge-outcome .knowledge-eyebrow,
+.knowledge-outcome .knowledge-view-kicker {
+  display: block;
+  color: var(--knowledge-green);
+  font-size: .65rem;
+  font-weight: 760;
+  letter-spacing: .105em;
+  text-transform: uppercase;
+}
+.knowledge-outcome .knowledge-view-heading { display: grid; gap: .25rem; }
+.knowledge-outcome .knowledge-view-heading > div { min-width: 0; }
+.knowledge-outcome .knowledge-view-heading p { margin-top: .25rem; color: var(--knowledge-muted); font-size: .76rem; }
+
+/* The tabs describe modes. The body below remains one workspace with a
+   stable inspector, so users do not lose context while moving between modes. */
+.knowledge-outcome .knowledge-outcome-nav {
+  display: flex;
+  gap: .15rem;
+  min-width: 0;
+  overflow-x: auto;
+  grid-column: 1 / -1;
+  margin-top: .35rem;
+  border-bottom: 1px solid var(--knowledge-line);
+}
+.knowledge-outcome .knowledge-tab {
+  min-height: 2.55rem;
+  border: 0;
+  border-bottom: 2px solid transparent;
+  border-radius: 0;
+  padding: .68rem .75rem .58rem;
+  color: var(--knowledge-muted);
+  background: transparent;
+  cursor: pointer;
+  font-size: .79rem;
+  font-weight: 650;
+  white-space: nowrap;
+}
+.knowledge-outcome .knowledge-tab:hover,
+.knowledge-outcome .knowledge-tab[aria-current="page"] { border-bottom-color: var(--knowledge-green); color: var(--knowledge-ink); }
+
+/* Master/detail geometry. Keep the split usable on compact laptops; stack
+   only when the content pane can no longer hold a useful inspector width. */
+.knowledge-outcome .knowledge-outcome-body {
+  display: grid;
+  grid-template-columns: minmax(18rem, .78fr) minmax(0, 1.22fr);
+  gap: 0;
+  min-width: 0;
+  align-items: stretch;
+}
+.knowledge-outcome .knowledge-outcome-primary,
+.knowledge-outcome .knowledge-outcome-detail {
+  display: grid;
+  gap: 0;
+  min-width: 0;
+  padding: 1.15rem 0 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+.knowledge-outcome .knowledge-outcome-primary { padding-right: 1.35rem; }
+.knowledge-outcome .knowledge-outcome-detail {
+  align-content: start;
+  padding-left: 1.35rem;
+  border-left: 1px solid var(--knowledge-line);
+}
+.knowledge-outcome .knowledge-discovery-view,
+.knowledge-outcome .knowledge-focused-view { min-width: 0; }
+.knowledge-outcome .knowledge-discovery-view { display: grid; gap: 0; }
+.knowledge-outcome .knowledge-discovery-toolbar { margin-top: 1rem; }
+.knowledge-outcome .knowledge-discovery-list { min-width: 0; }
+
+/* Inspector is a rail, not a second card stack. */
+.knowledge-outcome .knowledge-inspector-heading {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: .75rem;
+  min-height: 1.4rem;
+  padding-bottom: .75rem;
+  border-bottom: 1px solid var(--knowledge-line);
+}
+.knowledge-outcome .knowledge-inspector-state { color: var(--knowledge-quiet); font-size: .72rem; }
+.knowledge-outcome .knowledge-inspector-detail,
+.knowledge-outcome .knowledge-inspector .knowledge-detail-panel,
+.knowledge-outcome .knowledge-inspector > .knowledge-inspector-lifecycle,
+.knowledge-outcome .knowledge-inspector > .knowledge-commit-state { min-width: 0; }
+
+/* Search toolbar and list ledger. */
+.knowledge-outcome .knowledge-filters {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(6.3rem, 1fr));
+  gap: .5rem;
+  align-items: end;
+  padding: 0 0 .85rem;
+  border: 0;
+  border-bottom: 1px solid var(--knowledge-line);
+  border-radius: 0;
+  background: transparent;
+}
+.knowledge-outcome .knowledge-filters > label:first-child { grid-column: 1 / -1; }
+.knowledge-outcome .knowledge-filters label,
+.knowledge-outcome .knowledge-field {
+  display: grid;
+  gap: .28rem;
+  min-width: 0;
+  color: var(--knowledge-muted);
+  font-size: .7rem;
+  font-weight: 700;
+}
+.knowledge-outcome .knowledge-filter-actions,
+.knowledge-outcome .knowledge-form-actions,
+.knowledge-outcome .knowledge-detail-actions,
+.knowledge-outcome .knowledge-lifecycle-actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
+.knowledge-outcome .knowledge-filter-actions {
+  grid-column: 1 / -1;
+  align-self: end;
+}
+.knowledge-outcome .knowledge-filter-actions .button { white-space: nowrap; }
+.knowledge-outcome .knowledge-control {
+  width: 100%;
+  min-width: 0;
+  border: 1px solid var(--knowledge-line-strong);
+  border-radius: .4rem;
+  padding: .52rem .58rem;
+  color: var(--knowledge-ink);
+  background: var(--knowledge-paper);
+}
+.knowledge-outcome .knowledge-control:focus-visible,
+.knowledge-outcome button:focus-visible,
+.knowledge-outcome summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--knowledge-green) 28%, transparent); outline-offset: 2px; }
+.knowledge-outcome .knowledge-textarea { min-height: 6rem; resize: vertical; }
+.knowledge-outcome .knowledge-field small { color: var(--knowledge-quiet); font-size: .69rem; font-weight: 400; }
+
+.knowledge-outcome .knowledge-panel-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: .65rem;
+  padding: .9rem 0 .65rem;
+  border-bottom: 1px solid var(--knowledge-line);
+}
+.knowledge-outcome .knowledge-panel-head > div { min-width: 0; }
+.knowledge-outcome .knowledge-panel-head p { margin-top: .22rem; color: var(--knowledge-muted); font-size: .7rem; }
+.knowledge-outcome .knowledge-count { color: var(--knowledge-quiet); font-size: .72rem; white-space: nowrap; }
+.knowledge-outcome .knowledge-list-rows { display: grid; gap: 0; margin-top: 0; }
+.knowledge-outcome .knowledge-list-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto auto auto;
+  gap: .45rem;
+  align-items: center;
+  width: 100%;
+  min-height: 3.75rem;
+  border: 0;
+  border-bottom: 1px solid var(--knowledge-line);
+  border-radius: 0;
+  padding: .65rem .35rem;
+  color: inherit;
+  background: transparent;
+  cursor: pointer;
+  text-align: left;
+}
+.knowledge-outcome .knowledge-list-row:hover,
+.knowledge-outcome .knowledge-list-row[aria-pressed="true"] { box-shadow: inset 3px 0 var(--knowledge-green); background: var(--knowledge-green-soft); }
+.knowledge-outcome .knowledge-row-title { min-width: 0; overflow: hidden; font-size: .8rem; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
+.knowledge-outcome .knowledge-row-type,
+.knowledge-outcome .knowledge-row-scope,
+.knowledge-outcome .knowledge-row-state { color: var(--knowledge-muted); font-size: .68rem; white-space: nowrap; }
+.knowledge-outcome .knowledge-empty,
+.knowledge-outcome .knowledge-detail-empty,
+.knowledge-outcome .knowledge-unknown-copy { color: var(--knowledge-muted); padding: 1.1rem .25rem; font-size: .8rem; }
+.knowledge-outcome .knowledge-skeleton-row { display: grid; grid-template-columns: 4rem minmax(0, 1fr) 3rem; gap: .6rem; padding: .8rem .35rem; }
+.knowledge-outcome .knowledge-skeleton-line { display: block; height: .72rem; border-radius: 999px; background: linear-gradient(90deg, var(--knowledge-canvas), #fff, var(--knowledge-canvas)); background-size: 220% 100%; animation: knowledge-shimmer 1.4s linear infinite; }
+.knowledge-outcome .knowledge-skeleton-line.short { width: 4rem; }
+.knowledge-outcome .knowledge-skeleton-line.tiny { width: 3rem; }
+@keyframes knowledge-shimmer { to { background-position: -220% 0; } }
+
+/* The inspector's details are separated by rules and hierarchy instead of
+   repeated rounded containers. */
+.knowledge-outcome .knowledge-detail-panel,
+.knowledge-outcome .knowledge-lifecycle-panel,
+.knowledge-outcome .knowledge-use-evidence,
+.knowledge-outcome .knowledge-commit-state {
+  margin: 0;
+  padding: 1rem 0 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+.knowledge-outcome .knowledge-detail-panel > h3 { margin-top: .15rem; }
+.knowledge-outcome .knowledge-detail-panel > .knowledge-eyebrow { margin-top: .15rem; }
+.knowledge-outcome .knowledge-definition { display: grid; grid-template-columns: minmax(5rem, .48fr) minmax(0, 1fr); gap: .3rem .7rem; margin: .95rem 0; font-size: .76rem; }
+.knowledge-outcome .knowledge-definition dt { color: var(--knowledge-muted); }
+.knowledge-outcome .knowledge-definition dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
+.knowledge-outcome .knowledge-subsection { margin-top: .95rem; padding-top: .8rem; border-top: 1px solid var(--knowledge-line); }
+.knowledge-outcome .knowledge-subsection h4 { margin-bottom: .42rem; }
+.knowledge-outcome .knowledge-source-pointer { margin-top: .55rem; overflow-wrap: anywhere; font-size: .74rem; }
+.knowledge-outcome .knowledge-source-link { color: var(--knowledge-green); }
+.knowledge-outcome .knowledge-reference-list,
+.knowledge-outcome .knowledge-history-list { margin: .45rem 0 0; padding-left: 1.1rem; color: var(--knowledge-muted); font-size: .74rem; }
+.knowledge-outcome .knowledge-long-text { overflow-wrap: anywhere; white-space: pre-wrap; }
+.knowledge-outcome .knowledge-detail-actions { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--knowledge-line); }
+.knowledge-outcome .knowledge-inspector-lifecycle { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--knowledge-line); }
+
+/* Focused modes have one clear workspace boundary. Their inner panels remain
+   visually quiet so a proposal or test result reads as one task. */
+.knowledge-outcome .knowledge-focused-view { display: grid; gap: .9rem; min-width: 0; }
+.knowledge-outcome .knowledge-capture-view,
+.knowledge-outcome .knowledge-preview-view,
+.knowledge-outcome .knowledge-destination-view {
+  padding: 1rem 1.05rem 1.1rem;
+  border: 1px solid var(--knowledge-line);
+  border-radius: .65rem;
+  background: var(--knowledge-paper);
+}
+.knowledge-outcome .knowledge-capture-panel,
+.knowledge-outcome .knowledge-review-panel,
+.knowledge-outcome .knowledge-preview-panel,
+.knowledge-outcome .knowledge-destination,
+.knowledge-outcome .knowledge-use-evidence,
+.knowledge-outcome .knowledge-commit-state { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
+.knowledge-outcome .knowledge-capture-panel,
+.knowledge-outcome .knowledge-review-panel { display: grid; gap: .75rem; }
+.knowledge-outcome .knowledge-review-region { margin-top: .15rem; padding-top: .9rem; border-top: 1px solid var(--knowledge-line); }
+.knowledge-outcome .knowledge-destination,
+.knowledge-outcome .knowledge-preview-panel { display: grid; gap: .8rem; }
+.knowledge-outcome .knowledge-destination-form,
+.knowledge-outcome .knowledge-preview-form,
+.knowledge-outcome .knowledge-capture-form,
+.knowledge-outcome .knowledge-lifecycle-form { display: grid; gap: .7rem; }
+.knowledge-outcome .knowledge-form-actions { padding-top: .75rem; }
+.knowledge-outcome .knowledge-destination-form .knowledge-button { justify-self: start; }
+
+/* Shared actions, notices, comparison and preview evidence. */
+.knowledge-outcome .knowledge-button { min-height: 2.25rem; border: 1px solid transparent; border-radius: .4rem; padding: .5rem .7rem; cursor: pointer; transition: background 120ms ease, border-color 120ms ease, transform 100ms ease; }
+.knowledge-outcome .knowledge-button:active { transform: translateY(1px); }
+.knowledge-outcome .knowledge-button:disabled { cursor: wait; opacity: .55; }
+.knowledge-outcome .knowledge-button.primary { border-color: var(--knowledge-green); color: #fff; background: var(--knowledge-green); }
+.knowledge-outcome .knowledge-button.primary:hover { background: color-mix(in srgb, var(--knowledge-green) 86%, #000); }
+.knowledge-outcome .knowledge-button.secondary { border-color: var(--knowledge-line-strong); color: var(--knowledge-ink); background: transparent; }
+.knowledge-outcome .knowledge-button.secondary:hover { border-color: var(--knowledge-green); background: var(--knowledge-green-soft); }
+.knowledge-outcome .knowledge-button.danger { border-color: color-mix(in srgb, var(--knowledge-red) 35%, var(--knowledge-line)); color: var(--knowledge-red); background: var(--knowledge-red-soft); }
+.knowledge-outcome .knowledge-notice { display: flex; flex-wrap: wrap; gap: .4rem .65rem; align-items: center; margin-top: .65rem; padding: .65rem .7rem; border-left: 3px solid var(--knowledge-green); background: var(--knowledge-green-soft); font-size: .78rem; }
+.knowledge-outcome .knowledge-notice.warning { border-left-color: var(--knowledge-amber); background: var(--knowledge-amber-soft); }
+.knowledge-outcome .knowledge-notice.error { border-left-color: var(--knowledge-red); background: var(--knowledge-red-soft); }
+.knowledge-outcome .knowledge-inline-status { color: var(--knowledge-muted); font-size: .78rem; }
+.knowledge-outcome .knowledge-warning-copy { color: var(--knowledge-amber); font-size: .78rem; }
+.knowledge-outcome .knowledge-success-copy { color: var(--knowledge-green); font-size: .78rem; }
+.knowledge-outcome .knowledge-permission-copy { color: var(--knowledge-muted); font-size: .78rem; }
+.knowledge-outcome .knowledge-comparison { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: .7rem; margin-top: .55rem; }
+.knowledge-outcome .knowledge-source-column,
+.knowledge-outcome .knowledge-proposal-column { min-width: 0; border: 1px solid var(--knowledge-line); border-radius: .45rem; padding: .75rem; }
+.knowledge-outcome .knowledge-source-column { background: var(--knowledge-canvas); }
+.knowledge-outcome .knowledge-proposal-column { background: var(--knowledge-paper); }
+.knowledge-outcome .knowledge-source-column h4,
+.knowledge-outcome .knowledge-proposal-column h4 { margin-bottom: .55rem; }
+.knowledge-outcome .knowledge-choice-group { display: grid; gap: .35rem; margin: .7rem 0; border: 1px solid var(--knowledge-line); border-radius: .4rem; padding: .55rem; }
+.knowledge-outcome .knowledge-choice-group legend { color: var(--knowledge-muted); font-size: .72rem; font-weight: 700; padding: 0 .2rem; }
+.knowledge-outcome .knowledge-choice { display: flex; gap: .4rem; align-items: center; color: var(--knowledge-ink); font-size: .78rem; }
+.knowledge-outcome .knowledge-action-details { border: 1px solid var(--knowledge-line); border-radius: .4rem; padding: .58rem; }
+.knowledge-outcome .knowledge-action-details + .knowledge-action-details { margin-top: .5rem; }
+.knowledge-outcome .knowledge-action-details summary { cursor: pointer; font-size: .8rem; font-weight: 700; }
+.knowledge-outcome .knowledge-action-details.danger { border-color: color-mix(in srgb, var(--knowledge-red) 35%, var(--knowledge-line)); }
+.knowledge-outcome .knowledge-isolation-badge { display: inline-flex; margin-top: .55rem; border-radius: 999px; padding: .22rem .5rem; font-size: .7rem; font-weight: 700; }
+.knowledge-outcome .knowledge-isolation-badge.confirmed { color: var(--knowledge-green); background: var(--knowledge-green-soft); }
+.knowledge-outcome .knowledge-isolation-badge.unknown { color: var(--knowledge-amber); background: var(--knowledge-amber-soft); }
+.knowledge-outcome .knowledge-preview-executed,
+.knowledge-outcome .knowledge-preview-example { margin-top: .7rem; padding-top: .75rem; border-top: 1px solid var(--knowledge-line); }
+.knowledge-outcome .knowledge-preview-results { display: grid; gap: .4rem; margin: .55rem 0 0; padding: 0; list-style: none; }
+.knowledge-outcome .knowledge-preview-result { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .45rem; align-items: center; padding: .55rem; border: 1px solid var(--knowledge-line); border-radius: .4rem; font-size: .75rem; }
+.knowledge-outcome .knowledge-preview-result p { grid-column: 1 / -1; color: var(--knowledge-muted); }
+.knowledge-outcome .knowledge-evidence-adopted { color: var(--knowledge-green); }
+.knowledge-outcome .knowledge-evidence-excluded { color: var(--knowledge-muted); }
+
+@media (max-width: 880px) {
+  .knowledge-outcome .knowledge-outcome-body { grid-template-columns: minmax(0, 1fr); }
+  .knowledge-outcome .knowledge-outcome-primary { padding-right: 0; }
+  .knowledge-outcome .knowledge-outcome-detail { margin-top: 1.4rem; padding: 1.15rem 0 0; border-top: 1px solid var(--knowledge-line); border-left: 0; }
+}
+
+@media (max-width: 700px) {
+  .knowledge-outcome .knowledge-outcome-head { grid-template-columns: minmax(0, 1fr); gap: .65rem; }
+  .knowledge-outcome .knowledge-header-meta { justify-content: flex-start; }
+  .knowledge-outcome .knowledge-filters,
+  .knowledge-outcome .knowledge-comparison { grid-template-columns: minmax(0, 1fr); }
+  .knowledge-outcome .knowledge-filter-actions { grid-column: auto; }
+  .knowledge-outcome .knowledge-list-row { grid-template-columns: minmax(0, 1fr) auto; }
+  .knowledge-outcome .knowledge-row-type,
+  .knowledge-outcome .knowledge-row-scope { grid-column: auto; }
+  .knowledge-outcome .knowledge-row-state { grid-column: 2; grid-row: 1; }
+  .knowledge-outcome .knowledge-preview-result { grid-template-columns: minmax(0, 1fr) auto; }
+  .knowledge-outcome .knowledge-preview-result > :last-child { grid-column: 1 / -1; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .knowledge-outcome .knowledge-skeleton-line { animation: none; }
+  .knowledge-outcome .knowledge-button { transition: none; }
+}