put index link titles as inline text for not (hover)

style/shiny/base.css

@@ -15,6 +15,7 @@
         hsl(155deg, 57%, 62%)
       );
   background: var(--gradient) fixed;
+  margin: 1em;
 
   --nsfw-sticker-rotate: 15deg;
 }

style/shiny/index.css

@@ -33,14 +33,11 @@ header h1::after {
 @media screen {
   .nsfw::after {
     content: url(../18_plus_white.svg);
-    display: inline-block;
-    height: 0.8em;
-    width: 0.8em;
+    height: 1em;
+    width: 1em;
     transform: rotate(var(--nsfw-sticker-rotate));
-    vertical-align: top;
-    opacity: 80%;
     mix-blend-mode: hard-light;
-    padding-left: 0.25em;
+    margin-left: 0.3em;
   }
 }
 
@@ -69,7 +66,7 @@ header h1::after {
   margin: 0;
   padding: 0;
   grid-template-columns: 50% 50%;
-  grid-gap: 1em 0;
+  grid-gap: 1em 1.5em;
   align-items: center;
   justify-content: center;
 
@@ -79,6 +76,10 @@ header h1::after {
 .list li {
   list-style: none;
   text-align: center;
+  display: grid;
+  grid-template-columns: auto min-content;
+  align-items: center;
+  justify-content: center;
 }
 
 .list a {
@@ -96,3 +97,11 @@ main {
     grid-gap: 1em;
   }
 }
+
+@media not (hover) {
+  .list a::after {
+    content: attr(title);
+    display: block;
+    font-size: 60%;
+  }
+}