Theme modern: Metallband, Icon-Satz und echte G-Marke

Das Band laeuft als durchgehende Zeichnung ueber den ganzen Streifen,
jede Slide zeigt ihren Ausschnitt ueber --slide-i. An der Naht laeuft es
weiter statt neu anzusetzen -- der Uebergang, den ein Carousel sonst
nicht hat.

Es ist ein Rohr, kein Farbband: vierzig Streifen aus einer Rampe, die
Glanzstelle eingerueckt bei 20 % und fast weiss, der Kernschatten bei
78 % statt an der Unterkante, darunter Licht vom Grund zurueck. Der
erste Anlauf mit vier weichen Streifen sah nach Bonbon aus.

Damit das Band quer durch die Komposition laufen darf, liegt jede
Visualisierung jetzt auf einer deckenden Karte. Linienwerk auf
Transparenz verschwindet darin. Slide 5 musste dafuer von 988 auf 896
schrumpfen, Slide 6 bekam links Einzug.

Ausserdem:

- Feather-Icons aus @subframe/core statt selbst gezeichneter Zeichen,
  auf Slide 2 bis 5. Slide 6 behaelt ihre Nachbauten aus WaitlistNext.
- Die echte G-Marke auf dem Ring, als Polygon statt als Bilddatei.
- Die 01/02/03 auf Slide 6 sind raus.
- Slide 1 uebernimmt den Rahmen der Ueber-uns-Seite: Radius 38 auf
  teal-hellem Grund, Foto 4,2 % eingerueckt.
- Der Grund ist wieder #FFFFFF, wie Post 1 und Post 2. Den Kontrast
  tragen die Karten jetzt ueber die Kante (#D5DBE1).
- Slide 4 und 5 hiessen abweichend vom Original; Beschriftungen und
  Fliesstext gleichen jetzt post2.html.

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

rules.md

@@ -33,6 +33,12 @@ werden** — das passiert nicht automatisch.
 Beitrag; das Theme sagt, *wie er aussieht*. Beide Themes teilen Aufbau, Texte
 und Kompositionen der Visualisierungen.
 
+> **Der Grund ist über alle Beiträge hinweg derselbe: `--surface` `#FFFFFF`.**
+> Kein Theme darf ihn ändern. Im Profilraster stehen die Beiträge nebeneinander,
+> und schon ein leicht getönter Grund fällt dort als Fehler auf. Ein Theme, das
+> mehr Kontrast für seine Karten braucht, holt ihn sich über die Kante
+> (`--border-neutral` `#D5DBE1`), nicht über den Grund.
+
 | Theme | Erkennungszeichen | Datei |
 |---|---|---|
 | `notebook` | Rasterhintergrund, Zeichenblock-Optik, Marker in der Überschrift, handgezogene Formen | `post2.html` |
@@ -45,11 +51,75 @@ nur — die Unterschiede stecken in den CSS-Werten und in den Zeichen-Primitiven
 
 | | notebook | modern |
 |---|---|---|
-| Grund | Raster, 78 px | einfarbig, keine Textur |
+| Grund | Raster, 78 px | weiß, keine Textur |
+| Über alle Slides | — | ein durchgehendes Band |
 | Akzent in der Überschrift | Marker-Fläche | farbiges Wort |
 | Formen | `strich` schwingt, Ecken schießen über | exakt, keine Abweichung |
 | Flächen | Schraffur | Füllung |
 | Zweitfarbe | keine | Teal `#0D6E6E` |
+| Zeichen | selbst gezeichnet | Feather aus `@subframe/core` |
+
+**Karten stehen weiß auf weiß und tragen über ihre Kante.** `#D5DBE1`, nicht
+`#E5E5E5` — die hellere Linie verschwindet auf Weiß. Den Grund zu tönen wäre
+der einfachere Weg und ist verboten, siehe oben. Auf der Website reicht
+`#E5E5E5`, weil dort ein Schatten mitträgt; hier nicht (§7).
+
+**Das Band ist ein einziges Bild über den ganzen Streifen.** Jede Slide zeigt
+ihren Ausschnitt, verschoben über `--slide-i`. An der Naht läuft es deshalb
+weiter, statt neu anzusetzen — das ist der Übergang, den ein Carousel sonst
+nicht hat, weil jede Slide für sich steht. Drei Punkte, die daran hängen:
+
+- **Die Wellenlänge darf kein Vielfaches von 1080 sein.** Sonst liegt an jeder
+  Naht derselbe Punkt der Welle, meist ein Scheitel, und ein waagerechtes Band
+  an der Kante sagt dem Auge nichts.
+- **Der Querschnitt ist ein Rohr, kein Farbband.** Vierzig schmale Streifen,
+  versetzt entlang derselben Bahn, eingefärbt aus der Rampe `BAND_RAMPE`. Was
+  Metall von Bonbon unterscheidet, steht in diesen vier Punkten:
+  - Die **Glanzstelle liegt nicht an der Oberkante**, sondern eingerückt bei
+    20 %, und sie ist schmal und fast weiß. Ein breites weiches Hellgelb
+    obenauf ist genau der Bonbon-Eindruck.
+  - Der **dunkelste Punkt liegt nicht an der Unterkante**, sondern bei 78 %.
+    Darunter kommt Licht vom weißen Grund zurück.
+  - Der **Tonumfang ist groß**: `#6E4205` bis fast Weiß. Metall hat Kontrast,
+    lackierter Kunststoff nicht.
+  - Beide **Silhouetten sind aufgehellt** (Fresnel), dazu ein paar
+    Längsstreifen als Schliff.
+- **Kein SVG-Verlauf.** Nicht weil Verläufe verboten wären — verboten sind sie
+  nur beim Marker (§5) —, sondern weil ein `linearGradient` immer geradlinig
+  durch die Bounding-Box läuft. Das Band wellt sich, der Verlauf würde also
+  quer statt längs schattieren. Versetzte Streifen folgen der Kurve von selbst.
+- **Der Versatz ist senkrecht, nicht rechtwinklig zur Bahn.** Dadurch wird das
+  Band an den Flanken um bis zu 14 % schmaler. Das liest sich als Verkürzung
+  und ist erwünscht; echte Parallelkurven bekommen an engen Radien
+  Selbstschnitte.
+- **Volle Deckkraft.** Jede Abschwächung nimmt dem Band genau das wieder weg,
+  was es zum Körper macht.
+
+**Das Band läuft quer durch die Komposition, nicht am Rand entlang.** Es liegt
+in `.bg` und damit unter allem. Damit das trägt, gilt für das Theme `modern`:
+
+> **Jede Visualisierung liegt auf einer deckenden Karte.** Linienwerk auf
+> Transparenz verschwindet im Band. Alle sechs Slides von Post 2 sind deshalb
+> auf `chamferFlaeche(0, 0, W, H, KARTE, 22, true)` gesetzt — das Band taucht
+> dahinter ab und kommt daneben wieder hoch, wie der Schlauch in der Vorlage
+> von awork. Eine weiße Ummantelung um einzelne Linien war der erste Versuch
+> und sah nach Panne aus.
+
+Daraus folgt: **`visW` darf den Satzspiegel nicht überschreiten.** Solange eine
+Visualisierung Linienwerk war, durfte sie breiter sein als 896; als Karte muss
+sie auf die 92er Kante. `.vis svg` skaliert über `--vis-w` mit, die Innenmaße
+bleiben also unangetastet — bei Slide 5 genügte `visW: 988 → 896`.
+
+**Die Zeichen kommen aus dem Icon-Satz der Software, nicht aus der Hand.**
+`@subframe/core`, dieselben Feather-Icons, mit denen die Oberfläche gebaut ist
+(im Pitch-Paket unter `node_modules/@subframe/core/…/icons/final/`). Sie liegen
+als `FEATHER`-Tabelle in der Datei, gezogen mit dem Skript aus dem
+Gesprächsverlauf. Zwei Fallen beim Ziehen: die Props stehen teils als Zahl ohne
+Anführungszeichen (`x: 3`), und bei Icons mit nur einem Kind muss der
+`<svg>`-Rahmen weg, sonst rendert nichts.
+
+Ausnahme ist Slide 6 in `post2-alt.html`: deren drei Zeichen sind Nachbauten
+aus `WaitlistNext.tsx` und bleiben es.
 
 **Teal ist die Zweitfarbe des Themes `modern`.** In `notebook` kommt sie nicht
 vor. Damit hat der bisher ungenutzte Marken-Ton eine Aufgabe: er trägt