Improve style

- Add more depth to .block
- Make footer lighter
- Stylize scrollbar

static/style/main.scss

@@ -54,9 +54,10 @@ h1 {
 
 a {
   color: unset;
-  text-decoration: underline;
+  text: {
-  text-decoration-color: $blue;
+    decoration: underline {color: $blue};
-  text-underline-offset: 1px;
+    underline-offset: 1px;
+  }
   transition: 0.3s ease;
 
   &:hover {
@@ -67,6 +68,7 @@ a {
     transition: none !important;
     display: inline-block;
     transform: scale(.98) !important;
+    background-color: $mantle !important;
   }
 
   &.block {
@@ -74,6 +76,7 @@ a {
 
     &:hover {
       transform: scale(1.02) translateY(-.25rem);
+      background-color: $surface1;
     }
   }
 }
@@ -98,7 +101,7 @@ footer {
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
-  background-color: $crust;
+  background-color: $mantle;
   margin-top: 2rem;
   padding: 1rem;
   column-gap: 4ch;
@@ -136,6 +139,8 @@ footer {
   }
   &.green {
     background-color: color.mix($surface0, $green, 60%);
+    &:hover { background-color: color.mix($surface1, $green, 60%); }
+    &:active { background-color: color.mix($mantle, $green, 60%) !important; }
   }
 
   & .header {
@@ -185,6 +190,28 @@ footer {
   border-radius: .2em;
 }
 
+
+::-webkit-scrollbar {
+  width: .5rem;
+
+  &-button {
+    display: none;
+  }
+
+  &-track {
+    background-color: $base;
+  }
+
+  &-thumb {
+    background-color: $overlay0;
+    border-radius: .25rem;
+
+    &:hover {
+      background-color: $overlay1;
+    }
+  }
+}
+
 @font-face {
   font-family: Monocraft;
   src: url("/static/font/Monocraft.ttc");