diff --git a/.changeset/di-accent-token.md b/.changeset/di-accent-token.md
new file mode 100644
index 0000000..6f85513
--- /dev/null
+++ b/.changeset/di-accent-token.md
@@ -0,0 +1,16 @@
+---
+"@btravstack/theme": minor
+---
+
+Add `--pkg-di`, blue `#3E7FD4`, for `@btravstack/di`.
+
+Blue is plumbing — the connections behind the wall that everything visible runs
+on, which is what a wiring container is. The hex is the logo's own lighter blue
+(the barrel rim, the plunger, the needle hub), so chrome and artwork stay one
+color.
+
+di's docs site currently sets `--accent: #2A62B8`, the logo's *deep* blue. That
+hex scores 3.22 against `--card` on the dark scheme, below the 5.00–7.25 band
+the other four package accents occupy, so the landing takes the lighter blue
+instead: 4.72 on the dark card, 7.10 as darkened text on white (AA). Repointing
+di's docs to match is btravstack/di's half.
diff --git a/apps/website/.vitepress/theme/Landing.vue b/apps/website/.vitepress/theme/Landing.vue
index 9994b12..07f5069 100644
--- a/apps/website/.vitepress/theme/Landing.vue
+++ b/apps/website/.vitepress/theme/Landing.vue
@@ -44,8 +44,9 @@ interface Project {
   docs: string;
 }
 
-// Ordered as the stack reads — errors, the domain built on them, then the
-// transports that carry it. unthrown leads: the other three build on it.
+// Ordered as the stack reads — errors, the domain built on them, the wiring
+// that assembles it, then the transports that carry it. unthrown leads: the
+// other four build on it.
 const projects: Project[] = [
   {
     key: "unthrown", tag: "Errors", name: "unthrown", pkg: "unthrown", npm: "unthrown",
@@ -63,6 +64,14 @@ const projects: Project[] = [
     install: "pnpm add @btravstack/entity",
     repo: "https://github.com/btravstack/entity", docs: "https://btravstack.github.io/entity/",
   },
+  {
+    key: "di", tag: "Wiring", name: "di", pkg: "@btravstack/di", npm: "@btravstack/di",
+    logo: "/logos/di", repoFull: "btravstack/di", stars0: 1,
+    blurb: "A module-based container. Ports are the vocabulary your application defines, providers bind them at one edge, and modules declare what they import and export — so internals stay private in a graph that is one flat map at runtime.",
+    points: ["Ports named by the domain, not the adapter", "Unmet dependencies are compile errors", "Scoped resources release themselves"],
+    install: "pnpm add @btravstack/di unthrown",
+    repo: "https://github.com/btravstack/di", docs: "https://btravstack.github.io/di/",
+  },
   {
     key: "amqp", tag: "Messaging", name: "amqp-contract", pkg: "@amqp-contract/contract", npm: "@amqp-contract/contract",
     logo: "/logos/amqp-contract", repoFull: "btravstack/amqp-contract", stars0: 18,
@@ -186,8 +195,8 @@ onMounted(() => {
 
     <!-- The stack — each package in its own color -->
     <section id="packages" class="btv-section">
-      <h2 class="btv-h2">Four libraries, one stack.</h2>
-      <p class="btv-section-lead">Errors, domain, messaging and workflows — four focused packages that compose into one coherent backend.</p>
+      <h2 class="btv-h2">Five libraries, one stack.</h2>
+      <p class="btv-section-lead">Errors, domain, wiring, messaging and workflows — five focused packages that compose into one coherent backend.</p>
       <div class="btv-panels">
         <article v-for="p in projects" :key="p.name" class="btv-panel" :style="{ '--pkg': `var(--pkg-${p.key})` }">
           <div class="btv-panel-top">
@@ -263,7 +272,7 @@ onMounted(() => {
       <a href="https://github.com/btravstack" target="_blank" rel="noopener" class="btv-cta btv-cta--big">View on GitHub <span aria-hidden="true">↗</span></a>
     </section>
 
-    <!-- Ft3 · index footer (genuine hub for the four docs sites) -->
+    <!-- Ft3 · index footer (genuine hub for the five docs sites) -->
     <footer class="btv-foot">
       <div class="btv-foot-grid">
         <div class="btv-foot-brandcol">
@@ -298,7 +307,7 @@ onMounted(() => {
 /* Hallmark · genre: atmospheric (studied) · macrostructure: Ecosystem Index · design-system: design.md · designed-as-app
  * theme: studied-DNA (source: https://tanstack.com/) · studied: yes · DNA-source: url + screenshot
  * observed-DNA: neutral-black canvas · per-library accents · heavy grotesque display · real-stats hero · elevated panels
- * nav: N1b three-section · footer: Ft3 index (genuine hub for 4 docs sites) · hero: wordmark-led + T4 stat strip (real numbers only)
+ * nav: N1b three-section · footer: Ft3 index (genuine hub for 5 docs sites) · hero: wordmark-led + T4 stat strip (real numbers only)
  * enrichment: H9 original gradient mascot (Tier-B, kept) — the one character moment
  * contrast: pass (40–41) · honest: pass (46 — stars live from GitHub, downloads live from npm or "—") · chrome: pass (47)
  * tokens: pass (48) · responsive: pass (49)
diff --git a/apps/website/public/logos/di-dark.svg b/apps/website/public/logos/di-dark.svg
new file mode 100644
index 0000000..3fcea93
--- /dev/null
+++ b/apps/website/public/logos/di-dark.svg
@@ -0,0 +1,30 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-58 -2 118 128" width="118" height="128" fill="none">
+  <!-- dependency injection, from the author's own sketch: the syringe tilted for
+       action, the beet not totally formed — dome, eyes and smile only,
+       temporal-contract's mid-formation grammar — slid down to the needle end,
+       next in line to be injected. One drop is already out. -->
+  <g transform="rotate(-38 0 56)">
+    <ellipse cx="0" cy="0" rx="18" ry="6.5" fill="#2A62B8"/>
+    <rect x="-5.5" y="3" width="11" height="20" rx="3" fill="#2A62B8"/>
+    <rect x="-24" y="22" width="48" height="7.5" rx="3.75" fill="#3E7FD4"/>
+    <rect x="-16" y="29" width="32" height="54" rx="6" fill="#EAF2FB" stroke="#3E7FD4" stroke-width="3.5"/>
+    <rect x="-12.5" y="32.5" width="25" height="8" rx="3" fill="#2A62B8"/>
+    <g stroke="#3E7FD4" stroke-width="2" opacity="0.5" stroke-linecap="round">
+      <path d="M-13.5,47 L-6.5,47"/>
+      <path d="M-13.5,55 L-8.5,55"/>
+      <path d="M-13.5,63 L-6.5,63"/>
+    </g>
+    <g transform="translate(0,80.6) scale(0.72)">
+      <path d="M0,-24 C-13,-24 -20,-16 -20,-8 C-20,-3 -18,0 -16,1 L16,1 C18,0 20,-3 20,-8 C20,-16 13,-24 0,-24 Z" fill="#CE3D80"/>
+      <path d="M8,-22 C15,-19 20,-14 20,-8 C20,-4 19,-1 17,1 L10,1 C13,-6 12,-15 8,-22 Z" fill="#8E1A52" opacity="0.85"/>
+      <circle cx="-7" cy="-12" r="3.1" fill="#3A0D24"/>
+      <circle cx="-6" cy="-13" r="1.1" fill="#FFFFFF"/>
+      <circle cx="6" cy="-12" r="3.1" fill="#3A0D24"/>
+      <circle cx="7" cy="-13" r="1.1" fill="#FFFFFF"/>
+      <path d="M-4,-6 Q0,-2.5 4,-6" stroke="#3A0D24" stroke-width="2.2" stroke-linecap="round" fill="none"/>
+    </g>
+    <path d="M-7,83 L7,83 L2.5,91 L-2.5,91 Z" fill="#3E7FD4"/>
+    <path d="M-1.3,91 L1.3,91 L0.45,113 L-0.45,113 Z" fill="#9FB2C8"/>
+  </g>
+  <path d="M46,103 C48.5,105.5 50,108 48.5,110.5 C46.5,113 43.5,111.5 43.5,108.5 C43.5,106 44.5,104 46,103 Z" fill="#CE3D80"/>
+</svg>
diff --git a/apps/website/public/logos/di-light.svg b/apps/website/public/logos/di-light.svg
new file mode 100644
index 0000000..9e479a2
--- /dev/null
+++ b/apps/website/public/logos/di-light.svg
@@ -0,0 +1,34 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-58 -2 118 128" width="118" height="128" fill="none">
+  <!-- dependency injection, from the author's own sketch: the syringe tilted for
+       action, the beet not totally formed — dome, eyes and smile only,
+       temporal-contract's mid-formation grammar — slid down to the needle end,
+       next in line to be injected. One drop is already out.
+
+       Light-canvas variant: the three values that read against the canvas are
+       inverted — glass barrel, plunger head and needle shaft. The blue and the
+       beet are unchanged; only what was light-on-black becomes dark-on-white. -->
+  <g transform="rotate(-38 0 56)">
+    <ellipse cx="0" cy="0" rx="18" ry="6.5" fill="#2A62B8"/>
+    <rect x="-5.5" y="3" width="11" height="20" rx="3" fill="#2A62B8"/>
+    <rect x="-24" y="22" width="48" height="7.5" rx="3.75" fill="#3E7FD4"/>
+    <rect x="-16" y="29" width="32" height="54" rx="6" fill="#2A2730" stroke="#3E7FD4" stroke-width="3.5"/>
+    <rect x="-12.5" y="32.5" width="25" height="8" rx="3" fill="#3E7FD4"/>
+    <g stroke="#3E7FD4" stroke-width="2" opacity="0.5" stroke-linecap="round">
+      <path d="M-13.5,47 L-6.5,47"/>
+      <path d="M-13.5,55 L-8.5,55"/>
+      <path d="M-13.5,63 L-6.5,63"/>
+    </g>
+    <g transform="translate(0,80.6) scale(0.72)">
+      <path d="M0,-24 C-13,-24 -20,-16 -20,-8 C-20,-3 -18,0 -16,1 L16,1 C18,0 20,-3 20,-8 C20,-16 13,-24 0,-24 Z" fill="#CE3D80"/>
+      <path d="M8,-22 C15,-19 20,-14 20,-8 C20,-4 19,-1 17,1 L10,1 C13,-6 12,-15 8,-22 Z" fill="#8E1A52" opacity="0.85"/>
+      <circle cx="-7" cy="-12" r="3.1" fill="#3A0D24"/>
+      <circle cx="-6" cy="-13" r="1.1" fill="#FFFFFF"/>
+      <circle cx="6" cy="-12" r="3.1" fill="#3A0D24"/>
+      <circle cx="7" cy="-13" r="1.1" fill="#FFFFFF"/>
+      <path d="M-4,-6 Q0,-2.5 4,-6" stroke="#3A0D24" stroke-width="2.2" stroke-linecap="round" fill="none"/>
+    </g>
+    <path d="M-7,83 L7,83 L2.5,91 L-2.5,91 Z" fill="#3E7FD4"/>
+    <path d="M-1.3,91 L1.3,91 L0.45,113 L-0.45,113 Z" fill="#5A6675"/>
+  </g>
+  <path d="M46,103 C48.5,105.5 50,108 48.5,110.5 C46.5,113 43.5,111.5 43.5,108.5 C43.5,106 44.5,104 46,103 Z" fill="#CE3D80"/>
+</svg>
diff --git a/design.md b/design.md
index 6d39a7e..3b1dee9 100644
--- a/design.md
+++ b/design.md
@@ -1,7 +1,7 @@
 # Design — btravstack · "Beetroot Stack" (studied DNA)
 
 A locked design system for the btravstack org (landing + `@btravstack/theme` +
-the four docs sites). Every page redesign reads this file before emitting code.
+the five docs sites). Every page redesign reads this file before emitting code.
 Do not regenerate per page — extend or amend this file when the system needs to
 grow.
 
@@ -9,9 +9,9 @@ grow.
 *colorful stack of distinct tools* on a near-neutral black canvas: the
 beetroot pink is the ORG accent (wordmark, links, CTAs, mascot), while each
 package glows in **its own accent** — amqp orange, temporal indigo, unthrown
-teal, entity amber. Weight-contrast typography (one grotesque at 400 vs
-800), elevation through surface lightness, real numbers in the hero, and the
-gradient beetroot mascot as the one character moment.
+teal, entity amber, di blue. Weight-contrast typography (one grotesque at
+400 vs 800), elevation through surface lightness, real numbers in the hero,
+and the gradient beetroot mascot as the one character moment.
 
 ## Provenance
 
@@ -37,7 +37,7 @@ atmospheric (studied register — dark, quiet, confident; no blooms).
   tokens — floating hero mark with a subtle halo, elevated feature cards,
   the site's own package accent everywhere via the one-knob override.
 - Nav: **N1b three-section** — wordmark · centered links · toggle + GitHub.
-- Footer: **Ft3 index** — justified: the landing is a genuine hub for four
+- Footer: **Ft3 index** — justified: the landing is a genuine hub for five
   docs sites. Brand column + Docs column + GitHub column + MIT line. No
   social row, no Legal filler.
 
@@ -56,6 +56,7 @@ atmospheric (studied register — dark, quiet, confident; no blooms).
 | `--pkg-temporal` | `#6B76F2` | darken 30% at point of use |
 | `--pkg-unthrown` | `#3FB0A5` | darken 30% at point of use |
 | `--pkg-entity` | `#C8871F` | darken 30% at point of use |
+| `--pkg-di` | `#3E7FD4` | darken 30% at point of use |
 
 **The multi-accent rule (the studied signature).** The canvas and chrome are
 near-neutral; color belongs to the *products*. Package names, category dots
@@ -106,8 +107,9 @@ color glow on package-panel hover only.
 ## Logos
 
 The original soft gradient marks stay — mascot, rabbit, hourglass, no-throw,
-shield, and the start liftoff beet. They read perfectly on the near-black
-canvas and each sits inside its package-colored panel context. A package's
+shield, the di syringe, and the start liftoff beet. They read perfectly on
+the near-black canvas and each sits inside its package-colored panel context.
+A package's
 product mark is not a "character moment" — it's the logo of that panel, the
 same way each docs site carries its own.
 
@@ -151,6 +153,7 @@ The canonical export lives at `packages/theme/src/tokens.css` (published as
   --pkg-temporal:  #6B76F2;
   --pkg-unthrown:  #3FB0A5;
   --pkg-entity:    #C8871F;
+  --pkg-di:        #3E7FD4;
   --font-display:  "Geist", sans-serif; /* 800 for display */
   --font-body:     "Geist", sans-serif;
   --font-mono:     "JetBrains Mono", monospace;
diff --git a/packages/theme/src/tokens.css b/packages/theme/src/tokens.css
index 714e7c1..3133396 100644
--- a/packages/theme/src/tokens.css
+++ b/packages/theme/src/tokens.css
@@ -44,6 +44,7 @@
   --pkg-temporal: #6B76F2;   /* Temporal's indigo */
   --pkg-unthrown: #3FB0A5;   /* outside the signal register: not a signal, a value */
   --pkg-entity:   #C8871F;   /* amber encases and preserves: sealed, immutable */
+  --pkg-di:       #3E7FD4;   /* blue is plumbing: the connections behind the wall */
 
   /* ── Surfaces (DARK scheme — canonical: near-neutral black) ──── */
   --bg:        oklch(13% 0.006 310);   /* ≈ #080709 — the canvas */