tweaks, text ticker, donate warn

_includes/styles/base/animations.css

@@ -40,4 +40,21 @@
     45% { opacity: 0% }
     50% { opacity: 100% }
     100% { opacity: 100% }
+}
+
+@keyframes outline-blink {
+    0% { outline-width: 0rem; }
+    50% { outline-width: .45rem; }
+    100% { outline-width: 0rem; }
+}
+
+@keyframes ticker {
+    0% {
+        transform: translate3d(0, 0, 0);
+        visibility: visible;
+    }
+
+    100% {
+        transform: translate3d(-100%, 0, 0);
+    }
 }

_includes/styles/base/base.css

@@ -205,9 +205,13 @@ span[title] {
     }
 }
 
-/* code (enforced monospace) */
-.code {
-    font-family: 'JetBrains Mono', monospace, 'Segoe UI', Tahoma, Geneva, Verdana, system-ui, sans-serif !important;
+/* code */
+code {
+    border-radius: .2rem;
+    font-family: monospace;
+    border: .1rem solid var(--border);
+    padding: .1rem .2rem;
+    vertical-align: bottom;
 }
 
 /* caption styled text */
@@ -326,6 +330,28 @@ details.cw[open] {
     padding: .15rem;
 }
 
+/* ticker */
+ticker-container {
+    animation: ticker 65s linear infinite;
+    box-sizing: content-box;
+    display: inline-flex;
+    flex-flow: row nowrap;
+    padding-left: 60rem;
+    position: relative;
+
+    &:hover { animation-play-state: paused; }
+
+    p {
+        border-radius: .5rem;
+        display: inline-block;
+        margin: 0;
+        margin-right: 4rem;
+        outline: .15rem solid var(--border);
+        padding: .2rem .4rem;
+        white-space: nowrap;
+    }
+}
+
 /* card styling */
 card-container {
     display: grid;

_includes/styles/base/navbar.css

@@ -22,6 +22,21 @@
     vertical-align: middle;
     z-index: 100;
 
+    .important {
+        &::after {
+            background: var(--accent);
+            border-radius: 100%;
+            bottom: -.2rem;
+            content: "";
+            height: 1rem;
+            outline: .13rem solid color-mix(in srgb,var(--accent)60%,transparent);
+            position: absolute;
+            right: -.3rem;
+            width: 1rem;
+            animation: outline-blink ease-in-out 1s infinite;
+        }
+    }
+
     navbar-left {
         display: inline-flex;
         flex-direction: row;
@@ -40,10 +55,10 @@
         align-content: center;
         border-radius: 1rem;
         display: inline-flex;
+        position: relative;
         flex-direction: row;
         height: 1.9rem;
         outline: .13rem solid var(--border);
-        overflow: hidden;
         padding: 0px .2em !important;
         text-decoration: unset !important;
     }
@@ -52,6 +67,7 @@
         background-color: var(--accent);
         color: var(--background);
         outline-color: color-mix(in srgb, var(--accent) 60%, transparent);
+        overflow: clip;
 
         .synth-icon {
             height: 2rem;
@@ -74,7 +90,6 @@
         align-items: center;
         background-color: var(--background);
         color: var(--foreground);
-        overflow: clip;
         padding: 0 .4rem !important;
         text-shadow: none;
         transition: all .3s;