minor color and styles improvements

ui/src/css/ruleField.css

@@ -35,8 +35,10 @@
         font-size: var(--smFontSize);
         padding: 8px 10px;
         color: var(--surfaceTxtHintColor);
-        background: var(--surfaceAlt4Color);
-        box-shadow: inset 1px -1px 2px rgba(0,0,0,0.03);
+        background: var(--inputFocusColor);
+        border: 1px solid var(--surfaceAlt5Color);
+        border-top: 0;
+        border-right: 0;
         transition:
             color var(--animationSpeed),
             background var(--animationSpeed);
@@ -44,14 +46,17 @@
         &:active,
         &:focus-visible {
             color: var(--successColor);
-            background: var(--surfaceAlt5Color);
+            background: var(--inputBorderColor);
         }
         &[disabled] {
             cursor: not-allowed;
             color: var(--surfaceTxtDisabledColor);
-            background: var(--surfaceAlt4Color);
+            background: var(--surfaceAlt3Color);
         }
     }
+    .input:focus-within ~ .superuser-toggle {
+        background: var(--inputBorderColor);
+    }
     label {
         position: relative;
         z-index: 2;