1 files changed, 38 insertions, 65 deletions
diff --git a/static/output.css b/static/output.css
index 1517e8d..2ba01ad 100644
--- a/static/output.css
+++ b/static/output.css
@@ -12,6 +12,8 @@
     --color-sky-200: oklch(90.1% 0.058 230.902);
     --color-sky-300: oklch(82.8% 0.111 230.318);
     --spacing: 0.25rem;
+    --text-4xl: 2.25rem;
+    --text-4xl--line-height: calc(2.5 / 2.25);
     --font-weight-medium: 500;
     --font-weight-bold: 700;
     --font-weight-extrabold: 800;
@@ -181,9 +183,6 @@
   .relative {
     position: relative;
   }
-  .sticky {
-    position: sticky;
-  }
   .z-0 {
     z-index: 0;
   }
@@ -223,6 +222,9 @@
   .my-auto {
     margin-block: auto;
   }
+  .mt-2 {
+    margin-top: calc(var(--spacing) * 2);
+  }
   .mt-auto {
     margin-top: auto;
   }
@@ -232,6 +234,9 @@
   .mr-auto {
     margin-right: auto;
   }
+  .mb-4 {
+    margin-bottom: calc(var(--spacing) * 4);
+  }
   .mb-auto {
     margin-bottom: auto;
   }
@@ -244,8 +249,11 @@
   .flex {
     display: flex;
   }
-  .h-\[92vh\] {
-    height: 92vh;
+  .h-4\/12 {
+    height: calc(4/12 * 100%);
+  }
+  .h-16 {
+    height: calc(var(--spacing) * 16);
   }
   .h-auto {
     height: auto;
@@ -253,8 +261,17 @@
   .h-screen {
     height: 100vh;
   }
-  .max-h-\[80\%\] {
-    max-height: 80%;
+  .min-h-16 {
+    min-height: calc(var(--spacing) * 16);
+  }
+  .w-6\/12 {
+    width: calc(6/12 * 100%);
+  }
+  .w-10\/12 {
+    width: calc(10/12 * 100%);
+  }
+  .w-16 {
+    width: calc(var(--spacing) * 16);
   }
   .max-w-full {
     max-width: 100%;
@@ -268,9 +285,6 @@
   .flex-5 {
     flex: 5;
   }
-  .flex-none {
-    flex: none;
-  }
   .flex-grow {
     flex-grow: 1;
   }
@@ -380,6 +394,10 @@
   .font-spectral {
     font-family: var(--font-spectral);
   }
+  .text-4xl {
+    font-size: var(--text-4xl);
+    line-height: var(--tw-leading, var(--text-4xl--line-height));
+  }
   .font-bold {
     --tw-font-weight: var(--font-weight-bold);
     font-weight: var(--font-weight-bold);
@@ -437,7 +455,7 @@
   --secondary-color: var(--main-light-color);
   --interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/interlocked-hexagons.svg');
   --interlocked-hexagons-background-repeat: repeat;
-  --interlocked-hexagons-background-size: 10vh;
+  --interlocked-hexagons-background-size: 10vw;
   --squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/squares-and-triangles.svg');
   --squares-and-triangles-background-repeat: repeat;
 }
@@ -452,7 +470,7 @@
   --secondary-color: var(--main-medium-color);
   --interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/interlocked-hexagons.svg');
   --interlocked-hexagons-background-repeat: repeat;
-  --interlocked-hexagons-background-size: 10vh;
+  --interlocked-hexagons-background-size: 10vw;
   --squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/squares-and-triangles.svg');
   --squares-and-triangles-background-repeat: repeat;
 }
@@ -517,18 +535,12 @@
   width: 5vw;
   background-size: 10vw;
 }
-body:has(.lg-container:not([class~="lg-inline"])) .desktop-sidebar-custom {
-  display: none !important;
-}
 .mobile-topbar-custom {
   width: 90vw;
-  height: 8%;
-  background-size: 16vh;
+  height: 10vh;
+  background-size: 20vh;
   margin-left: 5vw;
 }
-body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
-  display: none !important;
-}
 .logo-custom {
   width: 3.5vw;
   height: 20vw;
@@ -602,26 +614,11 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
 .w-vw90 {
   width: 90vw;
 }
-.w-p60 {
-  width: 60%;
-}
-.w-p80 {
-  width: 80%;
-}
-.w-p100 {
-  width: 100%;
-}
-.w-vmax4 {
-  width: 4vmax;
-}
-.h-vh40 {
-  height: 40vh;
-}
 .h-vh90 {
   height: 90vh;
 }
-.h-vmax4 {
-  height: 4vmax;
+.w-p80 {
+  width: 80%;
 }
 .mt-vmin0-8 {
   margin-top: 0.8vmin;
@@ -657,9 +654,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
 .pr-vmin1-2 {
   padding-right: 1.2vmin;
 }
-.p-vmin0-8 {
-  padding: 0.8vmin;
-}
 .p-vmin2-4 {
   padding: 2.4vmin;
 }
@@ -668,16 +662,9 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
 }
 .lg-backdrop {
   background-color: var(--background-light-color);
-  opacity: 0.8 !important;
-}
-.lg-container:not([class~="lg-inline"]) .lg-outer {
-  width: 90%;
-  height: 90%;
-  margin: 5vh 5vw;
 }
 .lg-thumb-outer {
   background-color: var(--background-light-color) !important;
-  opacity: 0.8 !important;
 }
 .lg-prev {
   background-color: var(--background-light-color);
@@ -694,16 +681,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
   padding-top: 0;
   height: 1vmax;
 }
-.lg-container:not([class~="lg-inline"]) .lg-counter {
-  font-size: 2vmax;
-  height: 2vmax;
-}
-.lg-content {
-  top: 3vmax !important;
-}
-.lg-container:not([class~="lg-inline"]) .lg-content {
-  top: 4vmax !important;
-}
 .lg-toolbar .lg-icon {
   padding: 0 0.7vmax;
   font-size: 1.5vmax !important;
@@ -711,10 +688,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
   width: auto;
   color: var(--main-dark-color);
 }
-.lg-container:not([class~="lg-inline"]) .lg-toolbar .lg-icon {
-  font-size: 3vmax !important;
-  height: 3vmax;
-}
 .lg-toolbar .lg-icon:hover {
   color: var(--main-medium-color);
 }
@@ -781,15 +754,15 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
     display: none;
   }
   .nav-icon-custom {
-    font-size: 5vh !important;
+    font-size: 6vh !important;
     -webkit-text-stroke: 0.1vh var(--sidebar-stroke-color);
-    width: 8vh;
-    height: 8vh;
+    width: 10vh;
+    height: 10vh;
     align-content: center;
     text-align: center;
   }
   .nav-icon-custom:hover {
-    font-size: 7vh;
+    font-size: 8vh;
   }
   .bg-pattern-body {
     background-size: 10vh;