diff --git a/.interface-design/system.md b/.interface-design/system.md
index 9360f96..e83cf9d 100644
--- a/.interface-design/system.md
+++ b/.interface-design/system.md
@@ -29,19 +29,32 @@
 
 ## Domain Colors
 
-Every section of the site has a color identity. On domain pages, links, hover states, and card borders use the domain color instead of amber.
+Every post type and section has its own unique color identity. On collection pages, sparklines, card borders, icons, labels, hover states, and permalink links all use the domain color. No two post types share the same color.
 
-### Domain Map (complete — every page accounted for)
+### Post Type Colors (each unique — no sharing)
 
-| Domain | Tailwind color | Light text | Dark text | Pages |
-|--------|---------------|------------|-----------|-------|
-| **Writing** | amber (= accent) | amber-700 | amber-400 | `/blog/`, `/articles/`, `/notes/`, `/bookmarks/`, `/digest/`, `/news/`, `/categories/`, individual posts |
-| **Social** | rose | rose-600 | rose-400 | `/likes/`, `/replies/`, `/reposts/`, `/interactions/` |
+| Post Type | Tailwind color | Light text | Dark text | Icon | Pages |
+|-----------|---------------|------------|-----------|------|-------|
+| **Articles** | indigo | indigo-600 | indigo-400 | document | `/articles/` |
+| **Notes** | teal | teal-600 | teal-400 | chat bubble | `/notes/` |
+| **Bookmarks** | amber | amber-600 | amber-400 | bookmark | `/bookmarks/` |
+| **Likes** | red | red-600 | red-400 | heart (filled) | `/likes/` |
+| **Replies** | sky | sky-600 | sky-400 | reply arrow | `/replies/` |
+| **Reposts** | green | green-600 | green-400 | refresh arrows | `/reposts/` |
+| **Photos** | purple | purple-600 | purple-400 | camera | `/photos/` |
+
+Each color is applied consistently across: sparkline wrapper, card `border-l`, SVG icon, label text, title hover, and permalink link.
+
+### Section Colors (non-post-type pages)
+
+| Section | Tailwind color | Light text | Dark text | Pages |
+|---------|---------------|------------|-----------|-------|
+| **Blog** (mixed) | amber | amber-600 | amber-400 | `/blog/` (sparkline only — individual cards use their post-type color) |
 | **Code** | emerald | emerald-600 | emerald-400 | `/github/`, `/github/starred/` |
 | **Music** | purple | purple-600 | purple-400 | `/funkwhale/`, `/listening/` |
 | **Video** | red | red-600 | red-400 | `/youtube/` |
 | **Reading** | orange | orange-600 | orange-400 | `/blogroll/`, `/podroll/`, `/readlater/` |
-| **Neutral** | — (use accent) | — | — | `/` (home), `/about/`, `/cv/`, `/slashes/`, `/search/`, `/changelog/`, `/404` |
+| **Neutral** | accent (amber) | — | — | `/` (home), `/about/`, `/cv/`, `/slashes/`, `/search/`, `/changelog/`, `/404` |
 
 ### Brand Colors (hardcoded hex — not domain colors)
 
@@ -381,6 +394,6 @@ Reusable utility classes defined in `css/tailwind.css`:
 
 Audit findings — remaining gaps between this system and the current code:
 
-1. **Domain colors on section pages** — some pages still use generic accent instead of domain color for links, hovers, card borders
+1. ~~**Domain colors on section pages**~~ — ✅ Done: all 7 post-type collections + blog.njk mixed view + recent-posts widget use per-type colors
 2. **Active states** — add to buttons where appropriate
 3. **Consistent card hover** — some older templates use `hover:border-surface-400` instead of domain-colored border hover
diff --git a/_includes/components/widgets/recent-posts.njk b/_includes/components/widgets/recent-posts.njk
index d0447b0..7d437ae 100644
--- a/_includes/components/widgets/recent-posts.njk
+++ b/_includes/components/widgets/recent-posts.njk
@@ -19,7 +19,7 @@
           <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
         </svg>
         <div class="min-w-0">
-          <a href="{{ post.url }}" class="text-sm text-accent-600 dark:text-accent-400 hover:underline break-all line-clamp-1">
+          <a href="{{ post.url }}" class="text-sm text-red-600 dark:text-red-400 hover:underline break-all line-clamp-1">
             Liked {{ likedUrl | replace("https://", "") | truncate(40) }}
           </a>
           <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
@@ -34,7 +34,7 @@
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z"/>
         </svg>
         <div class="min-w-0">
-          <a href="{{ post.url }}" class="text-sm text-accent-600 dark:text-accent-400 hover:underline line-clamp-1">
+          <a href="{{ post.url }}" class="text-sm text-amber-600 dark:text-amber-400 hover:underline line-clamp-1">
             {{ post.data.title or ("Bookmarked " + (bookmarkedUrl | replace("https://", "") | truncate(35))) }}
           </a>
           <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
@@ -49,7 +49,7 @@
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
         </svg>
         <div class="min-w-0">
-          <a href="{{ post.url }}" class="text-sm text-accent-600 dark:text-accent-400 hover:underline break-all line-clamp-1">
+          <a href="{{ post.url }}" class="text-sm text-green-600 dark:text-green-400 hover:underline break-all line-clamp-1">
             Reposted {{ repostedUrl | replace("https://", "") | truncate(40) }}
           </a>
           <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
@@ -73,14 +73,37 @@
         </div>
       </div>
 
+      {% elif post.data.title %}
+      {# Article #}
+      <div class="flex items-start gap-2">
+        <svg class="w-4 h-4 text-indigo-500 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+        </svg>
+        <div class="min-w-0">
+          <a href="{{ post.url }}" class="text-sm text-indigo-600 dark:text-indigo-400 hover:underline line-clamp-1">
+            {{ post.data.title }}
+          </a>
+          <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
+            {{ (post.data.published or post.date) | dateDisplay }}
+          </time>
+        </div>
+      </div>
+
       {% else %}
-      {# Article / Note / other #}
-      <a href="{{ post.url }}" class="text-sm text-accent-600 dark:text-accent-400 hover:underline line-clamp-1">
-        {{ post.data.title or post.data.name or (post.templateContent | striptags | truncate(50)) or "Note" }}
-      </a>
-      <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
-        {{ (post.data.published or post.date) | dateDisplay }}
-      </time>
+      {# Note #}
+      <div class="flex items-start gap-2">
+        <svg class="w-4 h-4 text-teal-500 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"/>
+        </svg>
+        <div class="min-w-0">
+          <a href="{{ post.url }}" class="text-sm text-teal-600 dark:text-teal-400 hover:underline line-clamp-1">
+            {{ post.templateContent | striptags | truncate(50) or "Note" }}
+          </a>
+          <time class="text-xs text-surface-500 block font-mono" datetime="{{ post.data.published }}">
+            {{ (post.data.published or post.date) | dateDisplay }}
+          </time>
+        </div>
+      </div>
       {% endif %}
     </li>
     {% endfor %}
diff --git a/articles.njk b/articles.njk
index 31bd844..902b884 100644
--- a/articles.njk
+++ b/articles.njk
@@ -14,7 +14,7 @@ permalink: "articles/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNu
     <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100">Articles</h1>
     {% set sparklineSvg = collections.articles | postingFrequency %}
     {% if sparklineSvg %}
-    <div class="flex-1 min-w-0 text-amber-600 dark:text-amber-400">{{ sparklineSvg | safe }}</div>
+    <div class="flex-1 min-w-0 text-indigo-600 dark:text-indigo-400">{{ sparklineSvg | safe }}</div>
     {% endif %}
   </div>
   <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
@@ -25,10 +25,10 @@ permalink: "articles/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNu
   {% if paginatedArticles.length > 0 %}
   <ul class="post-list">
     {% for post in paginatedArticles %}
-    <li class="h-entry post-card border-l-[3px] border-l-amber-400 dark:border-l-amber-500">
+    <li class="h-entry post-card border-l-[3px] border-l-indigo-400 dark:border-l-indigo-500">
       <div class="post-header">
         <h2 class="text-xl font-semibold mb-1 flex-1">
-          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-amber-600 dark:hover:text-amber-400" href="{{ post.url }}">
+          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-indigo-600 dark:hover:text-indigo-400" href="{{ post.url }}">
             {{ post.data.title or "Untitled" }}
           </a>
         </h2>
@@ -52,7 +52,7 @@ permalink: "articles/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNu
       <p class="p-summary text-surface-700 dark:text-surface-300 mt-3">
         {{ post.templateContent | striptags | truncate(250) }}
       </p>
-      <a href="{{ post.url }}" class="text-sm text-amber-600 dark:text-amber-400 hover:underline mt-3 inline-block">
+      <a href="{{ post.url }}" class="text-sm text-indigo-600 dark:text-indigo-400 hover:underline mt-3 inline-block">
         Read more &rarr;
       </a>
     </li>
diff --git a/blog.njk b/blog.njk
index 3d06181..80838e1 100644
--- a/blog.njk
+++ b/blog.njk
@@ -48,8 +48,10 @@ permalink: "blog/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber
       {% set borderClass = "border-l-[3px] border-l-sky-400 dark:border-l-sky-500" %}
     {% elif hasPhotos %}
       {% set borderClass = "border-l-[3px] border-l-purple-400 dark:border-l-purple-500" %}
+    {% elif post.data.title %}
+      {% set borderClass = "border-l-[3px] border-l-indigo-400 dark:border-l-indigo-500" %}
     {% else %}
-      {% set borderClass = "border-l-[3px] border-l-amber-400 dark:border-l-amber-500" %}
+      {% set borderClass = "border-l-[3px] border-l-teal-400 dark:border-l-teal-500" %}
     {% endif %}
     <li class="h-entry post-card {{ borderClass }}">
 
@@ -263,7 +265,7 @@ permalink: "blog/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber
       {# ── Article card (unchanged) ── #}
       <div class="post-header">
         <h2 class="text-xl font-semibold mb-1">
-          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-amber-600 dark:hover:text-amber-400" href="{{ post.url }}">
+          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-indigo-600 dark:hover:text-indigo-400" href="{{ post.url }}">
             {{ post.data.title }}
           </a>
         </h2>
@@ -287,7 +289,7 @@ permalink: "blog/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber
       <p class="p-summary text-surface-700 dark:text-surface-300 mt-3">
         {{ post.templateContent | striptags | truncate(250) }}
       </p>
-      <a href="{{ post.url }}" class="text-sm text-amber-600 dark:text-amber-400 hover:underline mt-3 inline-block">
+      <a href="{{ post.url }}" class="text-sm text-indigo-600 dark:text-indigo-400 hover:underline mt-3 inline-block">
         Read more &rarr;
       </a>
 
@@ -315,7 +317,7 @@ permalink: "blog/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber
         {{ post.templateContent | safe }}
       </div>
       <div class="post-footer mt-3">
-        <a href="{{ post.url }}" class="text-sm text-amber-600 dark:text-amber-400 hover:underline">
+        <a href="{{ post.url }}" class="text-sm text-teal-600 dark:text-teal-400 hover:underline">
           Permalink
         </a>
       </div>
diff --git a/notes.njk b/notes.njk
index 86dbf6b..a86ed3c 100644
--- a/notes.njk
+++ b/notes.njk
@@ -14,7 +14,7 @@ permalink: "notes/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumbe
     <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100">Notes</h1>
     {% set sparklineSvg = collections.notes | postingFrequency %}
     {% if sparklineSvg %}
-    <div class="flex-1 min-w-0 text-amber-600 dark:text-amber-400">{{ sparklineSvg | safe }}</div>
+    <div class="flex-1 min-w-0 text-teal-600 dark:text-teal-400">{{ sparklineSvg | safe }}</div>
     {% endif %}
   </div>
   <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
@@ -25,7 +25,7 @@ permalink: "notes/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumbe
   {% if paginatedNotes.length > 0 %}
   <ul class="post-list">
     {% for post in paginatedNotes %}
-    <li class="h-entry post-card border-l-[3px] border-l-amber-400 dark:border-l-amber-500">
+    <li class="h-entry post-card border-l-[3px] border-l-teal-400 dark:border-l-teal-500">
       <div class="post-header">
         <a class="u-url" href="{{ post.url }}">
           <time class="dt-published text-sm text-surface-500 dark:text-surface-400 font-medium font-mono" datetime="{{ post.date | isoDate }}">
@@ -48,7 +48,7 @@ permalink: "notes/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumbe
         {{ post.templateContent | safe }}
       </div>
       <div class="post-footer mt-3">
-        <a href="{{ post.url }}" class="text-sm text-amber-600 dark:text-amber-400 hover:underline">
+        <a href="{{ post.url }}" class="text-sm text-teal-600 dark:text-teal-400 hover:underline">
           Permalink
         </a>
       </div>