diff --git a/frontend/src/components/admin/AdminSidebar.tsx b/frontend/src/components/admin/AdminSidebar.tsx
index 42d56d41..d55f9f1b 100644
--- a/frontend/src/components/admin/AdminSidebar.tsx
+++ b/frontend/src/components/admin/AdminSidebar.tsx
@@ -90,15 +90,17 @@ export const AdminSidebar: React.FC<AdminSidebarProps> = ({ isOpen, onClose }) =
                 onClick={() => onClose()}
                 className={`flex items-center px-3 py-2 text-sm font-medium rounded-lg transition-colors ${
                   isActive
-                    ? 'bg-primary-50 dark:bg-primary-900/30 text-accent-dark'
+                    ? 'bg-accent-dark text-white'
                     : 'text-neutral-700 dark:text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800 hover:text-neutral-900 dark:hover:text-neutral-100'
                 }`}
               >
-                {/* Active icon/text use the theme's accent-dark token so the
-                    sidebar follows the user's CI palette (LBM teal, custom
-                    branding, etc.) instead of the legacy primary green. */}
+                {/* Selected item: solid accent-dark fill with white text/icon
+                    for unambiguous high-contrast selection — matches the
+                    .tile-selected pattern used in the customizer. The accent
+                    -dark token defaults to the legacy primary green so users
+                    who haven't set CI colours yet see no migration regression. */}
                 <item.icon className={`w-5 h-5 mr-3 ${
-                  isActive ? 'text-accent-dark' : 'text-neutral-400'
+                  isActive ? 'text-white' : 'text-neutral-400'
                 }`} />
                 {t(item.nameKey)}
               </NavLink>
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 8c2e8d4c..c18e7866 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -134,14 +134,16 @@
   /*
    * Button styles.
    *
-   * Migration note: .btn-primary / .btn-secondary / .btn-outline keep the
-   * exact same visual contract they had before the 8-token migration —
-   * --color-primary still drives .btn-primary's background, white text on
-   * primary, and the legacy --color-primary-dark hover. This guarantees
-   * existing themes render identically after upgrade. The new .btn-alt
-   * implements the LBM "Alternative" button (outlined, inverts on hover)
-   * and the focus ring switches to var(--color-accent) so it reads on
-   * every surface (light, dark, branded).
+   * Migration note: .btn-primary now binds to --color-accent-dark instead
+   * of --color-primary. The two tokens are kept in lockstep by the
+   * customizer (handleChange syncs primaryColor → accentDarkColor) and by
+   * the migration helper (legacy themes get accentDarkColor = primaryColor),
+   * so existing instances render identically after upgrade — but new themes
+   * that set only accentDarkColor (the 8-token CI flow) now drive primary
+   * buttons correctly. White text + accent-dark fill matches the rest of
+   * the selected-state visual language (sidebar, tile-selected, segmented
+   * buttons). Hover stays on --color-primary-dark for the auto-darkened
+   * legacy behaviour.
    */
   .btn {
     @apply inline-flex items-center justify-center font-medium transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50;
@@ -151,7 +153,7 @@
   }
 
   .btn-primary {
-    background-color: var(--color-primary);
+    background-color: var(--color-accent-dark);
     color: white;
     @apply hover:opacity-90;
   }