feat(design): gruenes "P" als Browsersymbol

Ersetzt das perinco-Punktzeichen im Reiter durch ein gruenes P.

- favicon-p.svg: gezeichnete Form statt gesetzter Schrift, damit sie auf
  jedem Rechner gleich aussieht und in jeder Groesse scharf bleibt. Auf
  dunklen Reiterleisten schaltet sie per prefers-color-scheme in ein
  helleres Gruen.
- favicon-p-32.png und favicon-p-180.png als Rueckfall fuer Browser ohne
  SVG-Symbol, apple-touch-icon-p.png mit weisser Flaeche, weil iOS
  durchsichtige Symbole auf Schwarz legt.

Eigene Dateinamen statt favicon.png: Apache laesst Bilder ein Jahr im
Cache liegen, unter gleichem Namen saehe man das neue Symbol sonst erst
nach einem harten Neuladen.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

index.html

@@ -2,11 +2,22 @@
 <html lang="de" class="h-full">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/png" href="/favicon.png" />
+    <!--
+      Browsersymbol: gruenes "P". SVG zuerst - es bleibt in jeder Groesse scharf
+      und wechselt auf dunklen Reiterleisten in ein helleres Gruen; das PNG ist
+      der Rueckfall fuer Browser ohne SVG-Symbol.
+
+      Eigene Dateinamen statt favicon.png: Apache laesst Bilder ein Jahr im
+      Cache liegen, unter gleichem Namen saehe man das neue Symbol sonst erst
+      nach einem harten Neuladen.
+    -->
+    <link rel="icon" type="image/svg+xml" href="/favicon-p.svg" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-p-32.png" />
+    <link rel="icon" type="image/png" sizes="180x180" href="/favicon-p-180.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
     <meta name="theme-color" content="#6ba04a" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
-    <link rel="apple-touch-icon" href="/favicon.png" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon-p.png" />
     <meta name="robots" content="noindex, nofollow" />
     <title>Pulse · perinco</title>
     <script>

public/favicon-p.svg

@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <!--
+    Browsersymbol: ein gruenes "P" auf durchsichtigem Grund.
+
+    Als Vektor, damit es in jeder Groesse scharf bleibt - vom 16 px grossen
+    Reiter bis zur Lesezeichenleiste. Die Form ist gezeichnet, nicht gesetzt:
+    eine Schrift waere auf jedem Rechner eine andere.
+
+    Stamm und Bogen liegen im ersten Teilpfad, die Punze im zweiten;
+    fill-rule="evenodd" stanzt sie aus.
+  -->
+  <style>
+    path { fill: #2e8b22; }
+    /* Auf dunklen Reiterleisten ist das Markengruen zu satt - dort heller. */
+    @media (prefers-color-scheme: dark) {
+      path { fill: #57c23c; }
+    }
+  </style>
+  <path fill-rule="evenodd" d="M9 3.5h8.5a8 8 0 0 1 0 16H15v9H9Z M15 8.3h2.5a3.2 3.2 0 0 1 0 6.4H15Z" />
+</svg>