Rename the site to pl8list rewind with a dubplate mark

The infinity sign becomes a dubplate: a wobbling riddim groove around a red label
with a rewind arrow, after the soundsystem rewind where a tune the dance loves is
pulled back and run again. Icons, manifest, titles, legal pages and the README use
the new name; cookie names, storage keys and the link key info keep pl8inf so no
one is signed out or loses settings.

web/src/main.ts

@@ -92,7 +92,7 @@ async function loadMore(): Promise<void> {
         updateRadioEnd();
       } else setStatus(mode.mode !== "classic" || Object.keys(filters).length
         ? "nothing new matches this feed and your filters right now. loosen them, or check back in a bit."
-        : "nothing new right now, the crawler is still digging. try again in a bit.");
+        : "the plate's empty for now, the crawler is still digging. try again in a bit.");
       setTimeout(() => { if (gen === feedGen) loading = false; }, 8000);
       return;
     }
@@ -296,7 +296,7 @@ function updateMediaSession(track: Track): void {
   navigator.mediaSession.metadata = new MediaMetadata({
     title: cleanTitle(track.title),
     artist: track.artist_name,
-    album: "pl8list ∞",
+    album: "pl8list rewind",
     artwork,
   });
 }

web/src/style.css

@@ -66,8 +66,9 @@ button {
   background: linear-gradient(#000c, #0000);
 }
 
-.logo { font-weight: 600; margin-right: auto; }
-.logo b { color: var(--accent); }
+.logo { font-weight: 600; margin-right: auto; display: inline-flex; align-items: center; gap: 0.4em; white-space: nowrap; }
+.logo b { color: var(--accent); font-weight: 700; }
+.logo svg { width: 1.3em; height: 1.3em; color: var(--accent); flex: none; }
 #stats { color: var(--muted); font-size: 0.8rem; }
 #help-btn { width: 2.2em; padding: 0.35em 0; }
 #volume { display: flex; align-items: center; gap: 0.3rem; }
@@ -682,8 +683,11 @@ button.primary svg { width: 1em; height: 1em; }
   flex-direction: column;
   gap: 0.9rem;
 }
-.login-box h1 { margin: 0; font-size: 2.4rem; }
+.login-box h1 { margin: 0; font-size: 2.4rem; display: flex; align-items: center; gap: 0.3em; }
 .login-box h1 b { color: var(--accent); }
+/* A wheel up: the plate is pulled back once, then rests. */
+.login-mark { width: 1.2em; height: 1.2em; color: var(--accent); flex: none; animation: wheel-up 1.1s 0.3s cubic-bezier(0.3, 0, 0.2, 1) both; }
+@keyframes wheel-up { from { transform: rotate(0); } to { transform: rotate(-720deg); } }
 .tagline { margin: 0 0 0.8rem; color: var(--muted); }
 .login-box form { display: flex; flex-direction: column; gap: 0.6rem; }
 .login-box label { color: var(--muted); font-size: 0.9rem; }
@@ -719,6 +723,7 @@ button.primary svg { width: 1em; height: 1em; }
   #station { place-items: end stretch; padding: 0; }
   .station-box { width: 100%; border-radius: var(--radius-l) var(--radius-l) 0 0; padding-bottom: max(1.4rem, env(safe-area-inset-bottom)); }
   #mode-chip { max-width: 9rem; }
+  .logo-pl8 { display: none; }
   /* A station chip says more than the logo; there is no room for both. */
   #bar:has(#mode-chip:not([hidden])) .logo { display: none; }
   #likes { width: auto; }