feat: improve mobile style

app/globals.scss

@@ -6,6 +6,7 @@
   --primary: rgb(29, 147, 171);
   --second: rgb(231, 248, 255);
   --hover-color: #f3f3f3;
+  --bar-color: var(--primary);
 
   /* shadow */
   --shadow: 50px 50px 100px 10px rgb(0, 0, 0, 0.1);
@@ -24,6 +25,8 @@
   --second: rgb(27 38 42);
   --hover-color: #323232;
 
+  --bar-color: var(--primary);
+
   --border-in-light: 1px solid rgba(255, 255, 255, 0.192);
 }
 
@@ -79,7 +82,9 @@ body {
 }
 
 ::-webkit-scrollbar {
-  width: 20px;
+  --bar-width: 1px;
+  width: var(--bar-width);
+  height: var(--bar-width);
 }
 
 ::-webkit-scrollbar-track {
@@ -87,9 +92,8 @@ body {
 }
 
 ::-webkit-scrollbar-thumb {
-  background-color: rgba(0, 0, 0, 0.05);
+  background-color: var(--bar-color);
   border-radius: 20px;
-  border: 6px solid transparent;
   background-clip: content-box;
 }