Theme modern: flaches Band im Slack-Look, Karten mit Schatten

Der metallisch schattierte Zylinder ist raus. Er sah fotorealistisch aus
und damit wie ein Fremdkoerper auf einem flachen, ruhigen Blatt. An seiner
Stelle steht eine deckende Flaeche mit einer blassen zweiten dahinter --
kein Verlauf, keine Woelbung, keine Glanzkante.

Zwei Toene, umschaltbar unter "Band" im Bedienfeld: Orange #F1B729 und
"HiveGrid Teal", was --dark-bg #30313D meint und nicht --accent-teal.
Der Unterschied steht jetzt in rules.md, damit die Verwechslung nicht
noch einmal passiert.

Das Band laeuft ueber Slide 3 bis 5 (BAND_VON / BAND_BIS). Slide 1 und 6
sollen ruhig sein, Slide 2 traegt ihre eigene orangene Leitung. Gezeichnet
als geschlossene Flaeche statt als dicke Linie: eine Linie bekommt am Ende
eine Kappe rechtwinklig zur Laufrichtung, und die stand bei schraeger Bahn
seitlich ueber die Naht.

Schatten sind fuer dieses Theme erlaubt, entgegen 5. Ohne sie stehen die
Karten gestochen auf dem Grund statt darueber. Als SVG-feDropShadow, weil
die Karten gezeichnet sind und ein CSS-Schatten vom clip-path beschnitten
wuerde. Noch nicht 3-fach exportgeprueft -- das steht als Auflage in der
Regel.

Ausserdem:

- Slide 1: die G-Marke in der Bauchbinde statt einer leeren Wabe, das
  Badge der Landingpage (Monospace, 10 Grad gedreht) statt des Chips, und
  das Foto fuellt die Inhaltsspalte statt 620 von 1080 px.
- Slide 6: das selbst gezeichnete Konfetti war ein Kleckshaufen und ist
  jetzt "rocket" aus dem Feather-Satz.
- Kacheln haben wieder einen Boden statt harter Kontur.
- migrateState 7 raeumt die gespeicherten Vis-Positionen einmalig weg:
  die Masse haben sich geaendert, und der offene Tab schreibt die Datei
  sonst zurueck (POST-2.md 6).

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

rules.md

@@ -59,10 +59,11 @@ nur — die Unterschiede stecken in den CSS-Werten und in den Zeichen-Primitiven
 | 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).
+**Karten stehen weiß auf weiß und tragen über Kante und Schatten.** 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. Der
+Schatten ist die Ausnahme von §5, die dieses Theme sich nimmt; dort steht,
+warum und mit welchen Werten.
 
 **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
@@ -72,43 +73,52 @@ 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.
+- **Flach und deckend, wie die Formen bei Slack.** Eine kräftige Fläche,
+  dahinter eine blasse zweite als Tiefe. Kein Verlauf, keine Wölbung, keine
+  Glanzkante. Ein Zwischenstand hatte hier einen metallisch schattierten
+  Zylinder aus vierzig Streifen — fotorealistisch und damit ein Fremdkörper
+  auf einem flachen, ruhigen Blatt. Er steht im Commit *„Theme modern:
+  Metallband, Icon-Satz und echte G-Marke"*, falls ihn jemand wiederhaben will.
+- **Zwei Töne, umschaltbar** unter *Band* im Bedienfeld (`BAND_TOENE`):
 
-**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`:
+  | Ton | Fläche | Blasse zweite |
+  |---|---|---|
+  | `orange` | `--accent-yellow` `#F1B729` | `#FCE7B4` |
+  | `teal` | `--dark-bg` `#30313D` | `#D3D5DE` |
 
-> **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.
+  > **„HiveGrid Teal" ist `--dark-bg` `#30313D`, nicht `--accent-teal`.** Im
+  > Haus heißt der dunkle Ton des Story-Abschnitts auf der Website so. Er ist
+  > ein blaustichiges Anthrazit; `--accent-teal` `#0D6E6E` ist ein anderes
+  > Grün und trägt im Theme `modern` die Zeichenkacheln. Beim Reden über
+  > Farben lohnt die Nachfrage, welches gemeint ist.
+- **Der Umschalter greift an `.bg`, nicht über `applyAll`.** Das Band setzt
+  `buildSlide`, nicht der Neuaufbau der Seiten; der Handler tauscht deshalb
+  `.bg .layer-band` direkt aus.
+- **Die Bahn steht als Stützpunkte da, nicht als Formel** (`BAND_BAHN`, einer
+  je halbe Slide). Eine Sinuskurve war kürzer, ließ sich aber nicht steuern:
+  auf Slide 5 lief sie quer durch die Kacheln, und dort verschwinden die
+  orangenen Zeichen. Jeder Wert ist am gerenderten Bild geprüft, nicht
+  gerechnet. Wer `BAND_VON` oder `BAND_BIS` ändert, muss die Liste mitziehen:
+  die Punkte verteilen sich gleichmäßig über die neue Strecke, und alle
+  Werte verschieben sich.
+- **Wo das Band läuft, steht in `BAND_VON` / `BAND_BIS`** — Anzahl Slides ohne
+  Band am Anfang und am Ende. Bei Post 2 sind das 2 und 1, das Band trägt also
+  Slide 3 bis 5. Slide 1 und die letzte sollen ruhig sein, Slide 2 trägt ihre
+  eigene orangene Leitung und würde sich damit beißen.
+- **Als gefüllte Fläche gezeichnet, nicht als dicke Linie.** Eine Linie bekommt
+  am Ende eine Kappe rechtwinklig zur Laufrichtung; bei schräger Bahn steht die
+  seitlich über die Naht hinaus, und auf der Nachbarslide bleibt ein Splitter
+  stehen. Eine geschlossene Kontur endet exakt senkrecht — dann genügen zwei
+  Pixel Abstand zur Naht.
 
-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`.
+**Was über dem Band liegt, ist eine Karte mit Schatten.** Nicht randlos: der
+Versuch mit reinen Konturen sah gestochen aus. Kleine Karten über einem Band
+sind die Vorlage; eine randlose Karte über die ganze Fläche war der Fehler
+davor, weil das Band dahinter komplett verschwand.
+
+> **Eine Ausnahme bleibt: Slide 3.** Deren Karte *ist* die Visualisierung, ein
+> Oberflächen-Panel mit Fortschrittsbalken und Statuszeilen. Die kann nicht
+> randlos sein, also zeigt sich das Band dort nur in den Seitenrändern.
 
 **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
@@ -140,7 +150,7 @@ derselben Datei.
 | `--accent-yellow` | `#F1B729` | Primärer Akzent, Marker, G-Marke |
 | `--accent-yellow-light` | `#FFE082` | Badge-Hintergrund |
 | `--accent-yellow-dark` | `#3E2C0A` | Badge-Text |
-| `--accent-teal` | `#0D6E6E` | Sekundär, aktuell ungenutzt |
+| `--accent-teal` | `#0D6E6E` | Sekundär; im Theme `modern` die Zeichenkacheln |
 | `--dark-bg` | `#30313D` | Dunkle Variante + Formen-Ebene |
 
 ### Flächen & Text
@@ -418,6 +428,15 @@ aussehen lässt. Flächig gesetzt wirkt es ruhiger und passt zur Website, die
 denselben Weg geht. Nebenbei ist es beim Export billiger — jeder unscharfe
 Filter muss beim 3-fachen Rendern dreifach berechnet werden.
 
+> **Für das Theme `modern` ist diese Regel aufgehoben.** Dort schweben Karten
+> über einem durchlaufenden Band, und ohne Schatten stehen sie gestochen auf
+> dem Grund statt darüber. Der Schatten ist ein SVG-`feDropShadow`
+> (`dy 7`, `stdDeviation 10`, `#101828` bei 14 %), kein `box-shadow`: die
+> Karten sind gezeichnet und nicht im DOM, und ein CSS-Schatten würde vom
+> `clip-path` ohnehin mit beschnitten. Der Kostenpunkt aus dem Absatz oben
+> bleibt — **nach jeder Änderung daran einmal 3-fach exportieren und
+> hinsehen.** Im Theme `notebook` gilt die Regel unverändert.
+
 ### Was global gilt und was pro Slide
 
 | Einstellung | Geltung | Warum |