more minor padding, spacing, and link styling tweaks

src/App.scss

@@ -55,7 +55,7 @@ nav {
   box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
   box-shadow: var(--topBarShadow);
   box-sizing: border-box;
-  height: calc(var(--navbar-height) + 1px);
+  height: var(--navbar-height);
   position: fixed;
   backdrop-filter: blur(12px) saturate(1.2);
 }
@@ -121,6 +121,7 @@ nav {
   justify-content: center;
   min-height: 100vh;
   overflow-x: clip;
+  padding: 0 calc(var(--columnGap) / 2);
 
   .column {
     --___columnMargin: var(--columnGap);

src/components/checkbox/checkbox.vue

@@ -52,7 +52,7 @@ export default {
     border-radius: $fallback--checkboxRadius;
     border-radius: var(--checkboxRadius, $fallback--checkboxRadius);
     box-shadow: 0px 0px 2px black inset;
-    box-shadow: var(--inputShadow);
+    box-shadow: 0 0 0 1px var(--icon, $fallback--icon) inset;
     background-color: $fallback--fg;
     background-color: var(--input, $fallback--fg);
     vertical-align: top;

src/components/conversation/conversation.vue

@@ -281,8 +281,7 @@
   .thread-ancestor-has-other-replies .conversation-status,
   .thread-ancestor:last-child .conversation-status,
   .thread-ancestor:last-child .thread-ancestor-dive-box,
-  &:last-child .conversation-status,
+  & .conversation-status:last-child {
-  &.-expanded .thread-tree .conversation-status {
     border-bottom: none;
   }
 

src/components/desktop_nav/desktop_nav.scss

@@ -89,13 +89,25 @@
     width: 2em;
     height: 100%;
     text-align: center;
+    display: inline-block;
 
     &.router-link-active {
-      font-size: 1.2em;
+      // box-shadow: 0 -2px 0 var(--selectedMenuText, $fallback--text) inset;
-      margin-top: 0.05em;
+      position: relative;
+      &:after {
+        content: '';
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 4px;
+        background-color: $fallback--fg;
+        background-color: var(--btn, $fallback--fg);
+        border-radius: $fallback--btnRadius;
+        border-radius: var(--btnRadius, $fallback--btnRadius);
+      }
 
       .svg-inline--fa {
-        font-weight: bolder;
         color: $fallback--text;
         color: var(--selectedMenuText, $fallback--text);
         --lightText: var(--selectedMenuLightText, $fallback--lightText);

src/components/status/status.scss

@@ -287,6 +287,15 @@
       vertical-align: middle;
       object-fit: contain;
     }
+
+    a {
+      color: $fallback--text;
+      color: var(--text, $fallback--text);
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
   }
 
   .status-fadein {

src/components/timeline_menu_tabs/timeline_menu_tabs.vue

@@ -64,13 +64,26 @@
     width: 2em;
     height: 100%;
     text-align: center;
+    display: inline-block;
 
     &.router-link-active {
-      border-bottom: 2px solid var(--selectedMenuText, $fallback--text);
+      padding-bottom: 0.6em;
-      padding-bottom: 0.8em;
+      position: relative;
+      &:after {
+        content: '';
+        position: absolute;
+        bottom: 1px;
+        left: 0;
+        width: 100%;
+        height: 4px;
+        background-color: $fallback--fg;
+        background-color: var(--btn, $fallback--fg);
+        border-radius: $fallback--btnRadius;
+        border-radius: var(--btnRadius, $fallback--btnRadius);
+      }
 
       .svg-inline--fa {
-        font-weight: bolder;
+        // font-weight: bolder;
         color: $fallback--text;
         color: var(--selectedMenuText, $fallback--text);
         --lightText: var(--selectedMenuLightText, $fallback--lightText);

src/panel.scss

@@ -83,7 +83,7 @@
 
   &.-sticky {
     position: sticky;
-    top: var(--navbar-height);
+    top: calc(var(--navbar-height) + 1px);
   }
 
   &::after,