Tons of changes, all of which I've forgotten. A number of refactors

exist. Nav menu partly operational on mobile.

src/partials/_pane_nav.scss

@@ -1,29 +1,64 @@
-@use "nav_logo";
+@use "nav_header";
 @use "nav_menu";
 @use "nav_location";
 @use "nav_quick_links";
 
 .pane_nav {
-    margin: var(--margin-pane);
+    --padding-mobile: 0.35rem;
+
+    margin: var(--spacing-large);
 
     width: min-content;
     height: min-content;
 
-    display: grid;
-    grid-auto-flow: row;
-    grid-template-rows: repeat(4, min-content);
-    gap: var(--spacing-menu-gap);
-    align-content: start;
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-medium);
 
     position: sticky;
-    top: var(--margin-pane);
-    left: var(--margin-pane);
+    top: var(--spacing-large);
+    left: var(--spacing-large);
 
     color: var(--accent-pink);
+
+    input[type="checkbox"] {
+        display: none;
+    }
 }
 
 @media only screen and (max-width: 500px) {
     .pane_nav {
-        width: 75%;
+        width: calc(
+            calc(50% - var(--spacing-large) + var(--spacing-small)) *
+                2
+        );
+
+        background-color: var(--background-2);
+        border-radius: var(--border-radius-leaf);
+        padding: 0 var(--spacing-small);
+
+        .nav_menu,
+        .quick_links,
+        .location {
+            display: none;
+        }
+
+        > * {
+            width: 100%;
+        }
+    }
+
+    .pane_nav > #toggle:checked {
+        + .header {
+            color: var(--highlight-hover);
+
+            + .nav_menu {
+                display: grid;
+
+                + .location + .quick_links {
+                    display: flex;
+                }
+            }
+        }
     }
 }