diff --git a/static/css/components/pager-directory.css b/static/css/components/pager-directory.css
index d010caa..25d51e4 100644
--- a/static/css/components/pager-directory.css
+++ b/static/css/components/pager-directory.css
@@ -46,6 +46,7 @@
 
 /* ---- Directory panel (left side of split) ---- */
 .pdir-panel {
+    display: flex;
     width: 200px;
     flex-shrink: 0;
     border-right: 1px solid var(--border-color);
@@ -102,7 +103,7 @@
     flex-shrink: 0;
 }
 .pdir-proto--p { background: rgba(var(--accent-cyan-rgb), 0.15); color: var(--accent-cyan); }
-.pdir-proto--f { background: rgba(143, 123, 214, 0.15); color: var(--accent-purple); }
+.pdir-proto--f { background: rgba(var(--accent-purple-rgb), 0.15); color: var(--accent-purple); }
 
 .pdir-addr {
     font-size: var(--text-xs);
diff --git a/static/css/core/variables.css b/static/css/core/variables.css
index d912c6d..716659d 100644
--- a/static/css/core/variables.css
+++ b/static/css/core/variables.css
@@ -45,6 +45,7 @@
     --accent-amber-dim: rgba(214, 168, 94, 0.18);
     --accent-yellow: #e1c26b;
     --accent-purple: #8f7bd6;
+    --accent-purple-rgb: 143, 123, 214;
 
     /* Text hierarchy */
     --text-primary: #d7e0ee;