tell user animation is skippable

assets/base.css

@@ -42,7 +42,7 @@ li {
 
 /* lil text on the borders :3 */
 
-.title, .credit {
+.title, .credit, .skip-notice {
     height: 24px;
     background-color: var(--c-bg);
     color: var(--c-title);
@@ -63,6 +63,14 @@ li {
     color: var(--c-fg)
 }
 
+.skip-notice {
+    bottom: 0;
+    right: 8px;
+    color: var(--c-fg);
+    background-color: transparent;
+    font-weight: normal
+}
+
 /* here are some @media rules to choose when to display ascii art */
 
 .ascii, .splash {
@@ -202,3 +210,18 @@ html {
     animation: 1.5s 1 linear splash-bg;
     animation-delay: 3s
 }
+
+@keyframes splash-fg {
+    0%, 100% {
+        color: var(--c-bg);
+    }
+}
+
+.skip-notice {
+    animation-duration: 4.5s, 1.5s;
+    animation-iteration-count: 1, 1;
+    animation-timing-function: linear, linear;
+    animation-name: appear, splash-fg;
+    animation-delay: 0s, 3s;
+    visibility: hidden;
+}

index.html

@@ -64,6 +64,7 @@
             </ul>
         </main></div>
         <span class="credit skip"><a href="https://girlkissing.tips">site by Magdalunaa :3</a></span>
+        <span class="skip-notice skip">Click to skip</span>
     </body>
     <script src="/assets/main.js"></script>
 </html>