update styles

styles/main.css

@@ -6,24 +6,10 @@
 @import "./dashboard.css";
 
 * {
-  all: unset;
-  color: @foreground;
-  font-size: 16px;
-  font-family: "Product Sans", sans-serif;
-}
-
-/*
- * ── corner ────────────────────────────────────────────────────────────
-*/
-
-#corner {
-  background-color: @surface;
-  border-radius: 0px;
-}
-
-#corner-container {
-  min-width: 20px;
-  min-height: 20px;
+    all: unset;
+    color: @foreground;
+    font-size: 16px;
+    font-family: "Product Sans", sans-serif;
 }
 
 /*
@@ -31,38 +17,66 @@
 */
 
 tooltip {
-  background-color: @surfaceContainer;
-  border-radius: 10px;
-  padding: 6px 10px;
-  outline: none;
-  border: none;
-  box-shadow: none;
-  animation: tooltipShow 0.25s cubic-bezier(0.5, 0.25, 0, 1);
+    background-color: @surfaceContainer;
+    border-radius: 10px;
+    padding: 6px 10px;
+    outline: none;
+    border: none;
+    box-shadow: none;
+    animation: tooltipShow 0.25s cubic-bezier(0.5, 0.25, 0, 1);
 }
 
 tooltip label {
-  color: @onSurface;
-  outline: none;
-  border: none;
-  box-shadow: none;
-  font-weight: normal;
+    color: @onSurface;
+    outline: none;
+    border: none;
+    box-shadow: none;
+    font-weight: normal;
 }
 
 @keyframes tooltipShow {
-  from {
-    opacity: 0;
-  }
+    from {
+        opacity: 0;
+    }
 
-  to {
-    opacity: 1;
-  }
+    to {
+        opacity: 1;
+    }
 }
 
 /*
- * ── icon ──────────────────────────────────────────────────────────────
+ * ── dock ──────────────────────────────────────────────────────────────
 */
-#material-icon,
-#material-icon * {
-  all: unset;
-  font-family: "Material Symbols Outlined", "Material Symbols Sharp";
+#dock-icon {
+    padding: 0px 2px 0px 2px;
+}
+
+#dock {
+    padding: 10px;
+    background-color: alpha(@background, 0.8);
+    box-shadow: inset 0 -0.5px 0 0.5px alpha(@outlineVariant, 0.4);
+    border: 0.5px solid alpha(@outlineVariant, 0.4);
+    border-radius: 12px;
+    margin-bottom: 2px;
+}
+
+#dock-separator {
+    border-right: 1px solid alpha(@foreground, 0.3);
+}
+
+#dock-app-button {
+    padding: 2px;
+    margin-left: 2px;
+    margin-right: 2px;
+    border-radius: 12px;
+}
+
+.show-dock {
+    opacity: 1;
+    margin: 0;
+}
+
+.hide-dock {
+    opacity: 1;
+    margin: -80px;
 }