diff --git a/themes/theme-theraiwy-dark.css b/themes/theme-theraiwy-dark.css
index ce7e195..696d3fb 100644
--- a/themes/theme-theraiwy-dark.css
+++ b/themes/theme-theraiwy-dark.css
@@ -1391,7 +1391,7 @@ div[id^="pveLogView-"] .x-grid-cell-inner,
 }
 
 .x-grid-item-over {
-    background-color: hsla(214, 8%, 98%, 0.02) !important;
+    background-color: var(--pm-hover-subtle) !important;
 }
 
 .x-grid-item-over .x-grid-cell {
@@ -1450,7 +1450,7 @@ div[id^="pveLogView-"] .x-grid-cell-inner,
 .x-grid-with-col-lines .x-grid-cell,
 .x-grid-with-col-lines .x-grid-item-over .x-grid-cell,
 .x-grid-with-col-lines .x-grid-item-selected .x-grid-cell {
-    border-color: hsla(214, 8%, 98%, 0.07) !important;
+    border-color: var(--pm-border) !important;
     border-right-color: transparent !important;
 }
 
@@ -1912,7 +1912,7 @@ div[id^="pbsNodeInfoPanel"][id$="-body"] {
 
 /* Hover state - ONLY via :hover pseudo-class */
 .x-treelist-row:hover::before {
-    background: rgb(40, 43, 47) !important;
+    background: var(--pm-bg-elevated) !important;
     opacity: 0.5 !important;
     transform: scale(1) !important;
 }
@@ -1924,32 +1924,32 @@ div[id^="pbsNodeInfoPanel"][id$="-body"] {
 
 /* But if it's ALSO being hovered directly, show the effect */
 .x-treelist-row-over:hover::before {
-    background: rgb(40, 43, 47) !important;
+    background: var(--pm-bg-elevated) !important;
     opacity: 0.5 !important;
     transform: scale(1) !important;
 }
 
 /* Selected state background */
 .x-treelist-item-selected>.x-treelist-row::before {
-    background: rgb(40, 43, 47) !important;
+    background: var(--pm-bg-elevated) !important;
     opacity: 1 !important;
     transform: scale(1) !important;
 }
 
 /* Selected + hover - slightly lighter */
 .x-treelist-item-selected>.x-treelist-row:hover::before {
-    background: rgb(50, 53, 57) !important;
+    background: var(--pm-border) !important;
     opacity: 1 !important;
 }
 
-/* Selected item text - BLUE like UniFi */
+/* Selected item text - accent red */
 .x-treelist-item-selected>.x-treelist-row .x-treelist-item-text {
-    color: rgb(71, 151, 255) !important;
+    color: var(--pm-accent) !important;
 }
 
-/* Selected item icon - BLUE like UniFi */
+/* Selected item icon - accent red */
 .x-treelist-item-selected>.x-treelist-row .x-treelist-item-icon {
-    color: rgb(71, 151, 255) !important;
+    color: var(--pm-accent) !important;
 }
 
 /* Parent item containing selected child - WHITE text and icon */
@@ -2808,12 +2808,12 @@ svg text {
 /* Override any remaining dark text */
 .x-form-item-body,
 .x-form-item {
-    color: hsla(214, 8%, 88%, 1) !important;
+    color: var(--pm-text) !important;
 }
 
 /* Tree node text */
 .x-tree-node-text {
-    color: hsla(214, 8%, 88%, 1) !important;
+    color: var(--pm-text) !important;
 }
 
 .x-treelist-item-text {