diff --git a/frontend/src/app/main/ui/ds/_borders.scss b/frontend/src/app/main/ui/ds/_borders.scss
index 2c3ee5cb84..e1864f47f9 100644
--- a/frontend/src/app/main/ui/ds/_borders.scss
+++ b/frontend/src/app/main/ui/ds/_borders.scss
@@ -11,6 +11,7 @@ $br-8: px2rem(8);
 $br-4: px2rem(4);
 $br-6: px2rem(6);
 $br-circle: 50%;
+$br-full: px2rem(9999);
 
 $b-1: px2rem(1);
 $b-2: px2rem(2);
diff --git a/frontend/src/app/main/ui/ds/controls/switcher/switcher.cljs b/frontend/src/app/main/ui/ds/controls/switcher/switcher.cljs
index 7576413f07..650a49fdd9 100644
--- a/frontend/src/app/main/ui/ds/controls/switcher/switcher.cljs
+++ b/frontend/src/app/main/ui/ds/controls/switcher/switcher.cljs
@@ -41,7 +41,7 @@
         controlled? (some? checked)
         current-checked (if controlled? checked internal-checked)
         
-        ;; Handle toggle
+        ;; Toggle handler
         handle-toggle (mf/use-fn
                        (mf/deps controlled? current-checked on-change internal-checked*)
                        (fn [event]
@@ -52,7 +52,7 @@
                              (when on-change
                                (on-change new-checked event))))))
         
-        ;; Handle keyboard events
+        ;; Keyboard events
         handle-keydown (mf/use-fn
                         (mf/deps handle-toggle)
                         (fn [event]
diff --git a/frontend/src/app/main/ui/ds/controls/switcher/switcher.scss b/frontend/src/app/main/ui/ds/controls/switcher/switcher.scss
index d959ca6cb2..5e11dfb315 100644
--- a/frontend/src/app/main/ui/ds/controls/switcher/switcher.scss
+++ b/frontend/src/app/main/ui/ds/controls/switcher/switcher.scss
@@ -30,13 +30,9 @@ $switcher-transition-duration: 0.2s;
 }
 
 .switcher-label {
-  color: var(--color-foreground-primary);
+  color: var(--title-foreground-color);
   cursor: pointer;
   user-select: none;
-  
-  &:hover {
-    color: var(--color-foreground-primary);
-  }
 }
 
 .switcher {
@@ -48,7 +44,6 @@ $switcher-transition-duration: 0.2s;
   background: transparent;
   padding: 0;
   
-  // Focus ring using DS tokens - teal border around track
   &:focus-visible {
     .switcher-track {
       outline: $b-2 solid var(--color-accent-tertiary);
@@ -62,7 +57,7 @@ $switcher-transition-duration: 0.2s;
     
     .switcher-label {
       cursor: not-allowed;
-      color: var(--color-foreground-secondary);
+      color: var(--text-foreground-color);
     }
     
     .switcher-track {
@@ -146,16 +141,14 @@ $switcher-transition-duration: 0.2s;
 
 .switcher-track {
   position: relative;
-  border-radius: 9999px; 
+  border-radius: $br-full; 
   background-color: var(--color-background-quaternary); 
   transition: background-color $switcher-transition-duration ease-in-out;
   
-  // ON state - use success/teal color from DS
   .switcher.is-checked & {
     background-color: var(--color-accent-success);
   }
   
-  // Hover states (only when not disabled)
   .switcher:not(.is-disabled):hover:not(.is-checked) & {
     background-color: var(--color-background-quaternary);
   }
@@ -172,18 +165,15 @@ $switcher-transition-duration: 0.2s;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
   transition: transform $switcher-transition-duration ease-in-out, background-color $switcher-transition-duration ease-in-out;
   
-  // ON state - contrasting thumb (white in dark theme, dark in light theme)
   .switcher.is-checked & {
     background-color: var(--color-foreground-primary);
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
   }
   
-  // Hover states - contrasting thumb for OFF state
   .switcher:not(.is-disabled):hover:not(.is-checked) & {
     background-color: var(--color-foreground-primary);
   }
   
-  // Hover states - keep contrasting thumb for ON state
   .switcher:not(.is-disabled):hover.is-checked & {
     background-color: var(--color-foreground-primary);
   }