Updates

site.css

@@ -123,8 +123,10 @@ mark {
   text-decoration-thickness: 0.1rem;
 }
 
-a {
+a,
+label {
   color: inherit;
+  --glowColor: var(--c-accent);
 }
 a[href] {
   appearance: none;
@@ -140,16 +142,16 @@ nav label:has(input:focus-visible),
 nav label:has(input:checked) {
   outline: none;
   color: var(--c-text-dark);
-  background-color: var(--c-accent);
+  background-color: var(--glowColor);
   box-shadow:
-    0 0 0.5rem var(--c-accent),
-    0 0 1rem var(--c-accent);
+    0 0 0.5rem var(--glowColor),
+    0 0 1rem var(--glowColor);
   text-decoration: none;
   border-radius: 0.5rem;
   & img {
     box-shadow:
-      0 0 0.5rem var(--c-accent),
-      0 0 1rem var(--c-accent);
+      0 0 0.5rem var(--glowColor),
+      0 0 1rem var(--glowColor);
   }
 }
 :is(a[href], button, nav label):focus-visible,
@@ -162,10 +164,17 @@ nav label:has(input:focus-visible) {
   &::before {
     content: "#";
   }
+  --glowColor: oklch(
+    var(--tag-luminance) 0.25
+      calc(25 + 360 * var(--tagIndex, 0) / var(--totalTags, 1)) / 0.3
+  );
   color: oklch(
     var(--tag-luminance) 0.25
       calc(25 + 360 * var(--tagIndex, 0) / var(--totalTags, 1)) / 0.8
   );
+  &:hover {
+    color: var(--c-text-dark);
+  }
 }
 
 main p img {
@@ -295,15 +304,14 @@ ul.collection {
   padding-left: 0;
   > li {
     list-style-type: none;
-    display: grid;
-    align-items: baseline;
-    grid-template-columns: auto auto 1fr;
+    > aside {
+      display: inline;
+    }
     > p {
       &::before {
         content: none;
       }
       width: 100%;
-      grid-column: 1/-1;
     }
     + li {
       margin-top: 1rem;
@@ -758,9 +766,9 @@ body .isso-post-action {
   border-radius: 0.5rem;
   background: radial-gradient(
     ellipse farthest-side at 50% 50%,
-    var(--c-accent) 10%,
-    color-mix(in lch, var(--c-accent), transparent) 25%,
-    color-mix(in lch, var(--c-accent), transparent 80%) 35%,
+    var(--glowColor) 10%,
+    color-mix(in lch, var(--glowColor), transparent) 25%,
+    color-mix(in lch, var(--glowColor), transparent 80%) 35%,
     transparent
   );
   animation: 1s ease normal forwards ripple;
@@ -784,6 +792,13 @@ body .isso-post-action {
   margin: 0.5rem 0;
 }
 
+.feature {
+  > p:first-child::first-line {
+    font-size: var(--s2);
+    font-weight: 200;
+  }
+}
+
 /* Prism Material with some adjustments */
 code[class*="language-"],
 pre[class*="language-"] {