scss/westgate/_categories.scss

@@ -20,8 +20,7 @@ li[component="categories/category"] {
   transition:
     background 0.18s ease,
     border-color 0.18s ease,
-    box-shadow 0.18s ease,
-    transform 0.18s ease;
+    box-shadow 0.18s ease;
 }
 
 li[component="categories/category"].unread {
@@ -29,8 +28,15 @@ li[component="categories/category"].unread {
 }
 
 li[component="categories/category"] .icon {
-  border: 1px solid rgba(246, 223, 163, 0.34);
+  border: 1px solid var(--wg-etched-highlight);
   border-radius: 6px !important;
+  // ACP colors arrive candy-bright; the plum wash and filter pull the
+  // plate into the velvet register while keeping the per-category hue
+  background-image: linear-gradient(
+    160deg,
+    rgba(42, 18, 34, 0.42),
+    rgba(9, 8, 11, 0.58)
+  );
   box-shadow:
     inset 0 1px 0 rgba(255, 242, 204, 0.28),
     inset 0 0 0 1px rgba(18, 15, 22, 0.62),
@@ -38,7 +44,7 @@ li[component="categories/category"] .icon {
     0 0 0 1px rgba(56, 48, 42, 0.9),
     0 0 0 2px rgba(124, 105, 62, 0.24),
     0 9px 18px rgba(0, 0, 0, 0.32);
-  filter: saturate(0.82) contrast(1.12);
+  filter: saturate(0.62) contrast(1.12);
   text-shadow:
     0 1px 0 rgba(0, 0, 0, 0.72),
     0 -1px 0 rgba(255, 238, 190, 0.18),
@@ -46,7 +52,13 @@ li[component="categories/category"] .icon {
 }
 
 body.template-category .category-header .icon {
-  border: 1px solid rgba(246, 223, 163, 0.34);
+  border: 1px solid var(--wg-etched-highlight);
+  background-image: linear-gradient(
+    160deg,
+    rgba(42, 18, 34, 0.42),
+    rgba(9, 8, 11, 0.58)
+  );
+  filter: saturate(0.62) contrast(1.12);
   box-shadow:
     inset 0 1px 0 rgba(255, 242, 204, 0.28),
     inset 0 0 0 1px rgba(18, 15, 22, 0.62),
@@ -272,7 +284,7 @@ ul.category-children {
     rgba(30, 28, 34, 0.62) 46%,
     rgba(36, 18, 29, 0.78)
   );
-  border: 1px solid rgba(246, 223, 163, 0.3);
+  border: 1px solid var(--wg-etched-highlight);
   border-radius: 4px !important;
   box-shadow:
     inset 0 1px 0 rgba(255, 240, 190, 0.28),

scss/westgate/_surfaces.scss

@@ -224,8 +224,26 @@ li[component="category/topic"] .user-icon {
   text-transform: none;
 }
 
+// 404: core ships a beige dog glyph; wear the cowl instead
+.template-404 i.fa-dog {
+  display: inline-block;
+  width: 4.5rem;
+  height: 4.5rem;
+  background-color: var(--wg-gold-soft);
+  -webkit-mask: url("./plugins/nodebb-theme-westgate/game-icons/cowled.svg")
+    center / contain no-repeat;
+  mask: url("./plugins/nodebb-theme-westgate/game-icons/cowled.svg")
+    center / contain no-repeat;
+
+  &::before {
+    content: "";
+  }
+}
+
 // replace core's grey-triangle default cover with the velvet material
-.cover[style*="cover-default.png"] {
+// (.cover on profiles, .list-cover on the groups list)
+.cover[style*="cover-default.png"],
+.list-cover[style*="cover-default.png"] {
   background-image:
     radial-gradient(120% 90% at 18% 0%, rgba(58, 24, 48, 0.6), transparent 60%),
     linear-gradient(100deg, #2a1222, #110f15 55%, #09080b) !important;