initial css and config changes for login page

app/javascript/flavours/glitch/styles/login.scss

@@ -2,8 +2,8 @@
 @import 'reset';
 
 :root {
-    --color-bg: #191b22;
-    --color-fg: #fff;
+    --color-bg: #1e1f29;
+    --color-fg: #f7f7fa;
 }
 
 body {
@@ -64,29 +64,29 @@ form {
 
 :focus-visible,
 button:focus-visible {
-    outline: 2px solid #66befe;
+    outline: 2px solid #bd93f9;
     outline-offset: 3px;
 }
 
 button {
     padding: 7px 10px;
-    border: 1px solid lighten(#66befe, 7%);
+    border: 1px solid lighten(#bd93f9, 7%);
     border-radius: 4px;
     box-sizing: border-box;
-    color: #2a2b2f;
+    color: #1e1f29;
     font-family: inherit;
     font-size: inherit;
     font-weight: 500;
     text-align: center;
     white-space: nowrap;
-    background-color: #66befe;
+    background-color: #1e1f29;
 
     &:hover {
-        background-color: #89caff;
+        background-color: #bd93f9;
     }
 
     &:disabled {
-        background-color: #9baec8;
+        background-color: #CEBBED;
         cursor: default;
     }
 }
@@ -95,28 +95,28 @@ input[type='text'] {
     display: block;
     margin: 0;
     padding: 15px;
-    border: 1px solid lighten(#282c37, 7%);
+    border: 1px solid lighten(#1e1f29, 7%);
     border-radius: 4px;
     box-sizing: border-box;
     box-shadow: none;
-    color: #9baec8;
+    color: #CEBBED;
     font-family: inherit;
     font-size: inherit;
     line-height: 18px;
-    background: #282c37;
+    background: #1e1f29;
 }
 
 .content {
     padding: 15px;
     border-radius: 4px;
-    border: 1px solid lighten(#39404f, 7%);
+    border: 1px solid lighten(#2f313d, 7%);
     color: #fff;
-    background-color: #39404f;
+    background-color: #2f313d;
 }
 
 .link-footer {
     padding-inline: 10px;
-    color: #97a8b4;
+    color: var(--color-fg);
     font-size: 0.875rem;
 
     a {