Kundenansicht neu: Glas-Logo auf der Anmeldung und Startbild der App

- public/neu/glas-logo.js: das Bauteil „liquid-glass-logo-reveal“ (21st.dev, Shader und
  Zeitleiste aus zanwei/glass-icon-reveal, MIT, Hinweis im Kopf) in reines JavaScript übertragen:
  WEBklar-Zeichen als Zeichenfläche (Stern und Punkt ausgestanzt), weiß, keine Schleife,
  Textur 512 px (auf dem Handy ~3× schneller bereit), Hintergrund läuft zum Rand aus,
  kein Rauschen auf reinem Weiß, ohne WebGL2 das ruhende Logo als CSS-Maske.
- Anmeldung (Handy und PC): Glas-Logo statt App-Icon, der Name erscheint, sobald das Glas
  losgelassen hat; ein Klick spielt es erneut; reduzierte Bewegung zeigt das ruhende Logo.
- Installierte App: startbild.js im Kopf von Übersicht und Anmeldung deckt beim ersten Öffnen
  je App-Start weiß ab, spielt das Glas-Logo (Tempo 1,25) und blendet dann weich aus; ein Tipp
  überspringt, spätestens nach 6,5 s ist es weg. Danach ruht das Logo der Anmeldung.
- Tests: knGlasLogo (Zeitleiste, Glasbreite < 1,3 Kacheln, MIT-Hinweis, Startbild in der VM),
  Seitenprüfungen der Anmeldung und der Übersicht kennen die neuen Skripte.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

public/neu/oeffentlich/oeffentlich.css

@@ -19,8 +19,16 @@
 .kn-seite a.kn-login-logo { text-decoration: none; }
 .kn-login-haupt { min-height: 100svh; display: flex; align-items: center; justify-content: center; padding: calc(88px + env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); }
 .kn-login-spalte { width: 100%; max-width: 360px; }
-.kn-login-marke { display: none; }
-.kn-login-titel { margin: 0 0 24px; font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.02em; }
+/* Logo mit Glas-Animation (login-logo.js): das Feld braucht Platz für die Glaskachel (Kachel = Höhe / 1,4), das ruhende Logo
+   ist danach etwa 80 px breit. Der Name liegt im unteren Weiß des Feldes und erscheint erst, wenn das Glas losgelassen hat
+   (nach ~3,2 s); nach dem Startbild der App und bei reduzierter Bewegung steht er sofort da. */
+.kn-login-marke { display: flex; flex-direction: column; align-items: center; margin: 0 0 28px; font-size: 15px; font-weight: 600; }
+.kn-login-glas { width: 100%; height: 220px; -webkit-tap-highlight-color: transparent; }
+.kn-login-marke > span { position: relative; margin-top: -58px; animation: kn-login-name .5s ease 3.2s both; }
+@keyframes kn-login-name { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
+.kn-login-marke.kn-login-ruht > span { animation: none; }
+@media (prefers-reduced-motion: reduce) { .kn-login-marke > span { animation: none; } }
+.kn-login-titel { margin: 0 0 24px; font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.02em; text-align: center; }
 .kn-login-form { display: flex; flex-direction: column; gap: 12px; }
 .kn-feld-eingabe {
   width: 100%; height: 44px; min-width: 0; margin: 0; padding: 0 12px; border: 0; border-radius: var(--kn-radius);
@@ -44,9 +52,8 @@
 .kn-login-hinweis + .kn-login-hinweis { margin-top: 16px; }
 .kn-seite a.kn-login-wichtig { color: var(--kn-text); font-weight: 600; }
 @media (max-width: 880px), (pointer: coarse) and (max-height: 500px) {
-  .kn-login-marke { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 0 0 32px; font-size: 15px; font-weight: 600; }
-  .kn-login-marke img { width: 64px; height: 64px; border-radius: var(--kn-radius-lg); box-shadow: var(--kn-ring); }
-  .kn-login-titel { text-align: center; }
+  .kn-login-glas { height: 190px; }
+  .kn-login-marke > span { margin-top: -50px; }
 }
 
 /* ------------------------------------------------------------------ Kündigen und Widerrufen (schlicht) --- */