close but not there yet

another media expolre digital content snippet idear
it build trash switch to bigpc
2026-07-20 19:44:35 +02:00 · 2026-07-20 08:36:20 +02:00 · 2026-07-19 13:25:41 +02:00 · 2026-07-19 12:56:21 +02:00 · 2026-07-19 12:37:36 +02:00 · 2026-07-17 22:14:29 +02:00
13 changed files with 2345 additions and 326 deletions
@@ -1,2 +1,3 @@
 66_plasmaTr
+export/
 91_sonnensystem
@@ -1,28 +0,0 @@
-= Meta: System der aufsteigenden Dateien =
-:toc:
-:icons: font
-
-== Willkomen auserwählter Leser/Schreiber
-
-Hier sollten die Dinge eigendlich schon reibungslos funktionieren.
-Aber soweit unten kann es schon mal vorkommen das etwas in stocken gerät, lass dich davon nicht entmutigen.
-Frage den der dir diese Dokumente gegeben hat nach hilfe oder wo weitere zu finden ist.
-
-
-
-[cols="4*", options="header"]
-.Sichtbarkeit der Texte
-|===
-|**`galaxie`**
-|`alpha`, `testing`
-|Gast-Schreiber, Beta-Leser
-|Lore-Bibel, Styleguides, No-Go-Wortlisten, Validation-Hooks.
-|**`galaxienhaufen`**
-|`staging`, `release`
-|Lektorat, Setzer
-|Typografie-Themes, EPUB/PDF-Generatoren, Kapitel-Includes, Layout-Assets.
-|**`universum`**
-|`main` / `v1.0`
-|Öffentlichkeit, Leser
-|Kanonischer Text, Open-Source-Lizenz, Enzyklopädie/Glossar.
-|===
@@ -0,0 +1,641 @@
+= Design-System: Maschinen-Instanzen
+:toc:
+:toclevels: 3
+
+Project X Tribut • Universelles UI-, HUD- und Grafiksystem
+
+*Version:* 1.0.0 +
+*Zielplattformen:* Web, HTML5 Canvas, Browser-Games, Diagnose-Terminals, Tools, Dashboards +
+*Designsprache:* Hard-Sci-Fi • Industrial Computing • Retro-Terminal • Maschinenästhetik
+
+== 1. Designphilosophie
+
+Das Design-System *Maschinen-Instanzen* definiert die visuelle Sprache des gesamten Computer-Historyz-Universums.
+
+Die Gestaltung orientiert sich an industriellen Steuerungssystemen, wissenschaftlichen Diagnoseterminals und kybernetischen Maschinenkomplexen. Sämtliche Farben, Formen und Effekte besitzen eine funktionale Bedeutung.
+
+Die Benutzeroberfläche soll nicht dekorativ wirken, sondern wie ein Bestandteil einer realen Maschine.
+
+=== Grundprinzipien
+
+. Funktion vor Dekoration.
+. Jede Farbe besitzt eine semantische Bedeutung.
+. Scharfe Kanten statt organischer Formen.
+. Monospace-Typografie als Standard.
+. Technische Lesbarkeit hat Vorrang vor visuellen Effekten.
+. Informationen werden durch Farbe, Position und Kontrast vermittelt.
+. Animationen dienen der Zustandskommunikation und niemals ausschließlich der Verzierung.
+
+== 2. Farbpalette
+
+=== 2.1 Kernfarben
+
+[cols="1,1,3",options="header"]
+|===
+|Name
+|Hex
+|Bedeutung
+
+|Deep Void
+|`#05070a`
+|Globaler Hintergrund, tiefste Darstellungsebene
+
+|Terminal Base
+|`#0b0e14`
+|Fenster, Container und Panel-Flächen
+
+|Tech Cyan
+|`#00f2ff`
+|Interaktion, Fokus, aktive Systeme
+
+|Harvest Green
+|`#00ff73`
+|Erfolg, Ressourcengewinn, Wiederherstellung
+
+|Amber Gold
+|`#ffb700`
+|Warnungen, besondere Objekte, Missionsziele
+
+|Critical Red
+|`#ff3e3e`
+|Kritische Zustände, Fehler, Gefahr
+
+|Steel Grey
+|`#888899`
+|Sekundäre Informationen, deaktivierte Elemente
+|===
+
+=== 2.2 Semantische Zustände
+
+[cols="1,1",options="header"]
+|===
+|Zustand
+|Farbe
+
+|Information
+|Tech Cyan
+
+|Erfolg
+|Harvest Green
+
+|Warnung
+|Amber Gold
+
+|Kritisch
+|Critical Red
+
+|Deaktiviert
+|Steel Grey
+
+|Fokus
+|Tech Cyan + Glow
+|===
+
+=== 2.3 Priorisierung
+
+==== Primär
+
+Interaktive Objekte:
+
+* Buttons
+* Links
+* Menüs
+* Aktive Systeme
+
+Verwenden:
+
+[source,text]
+----
+Tech Cyan
+----
+
+==== Sekundär
+
+Nicht-interaktive Daten:
+
+* Metadaten
+* Diagnostikwerte
+* Statistiken
+
+Verwenden:
+
+[source,text]
+----
+Steel Grey
+----
+
+==== Kritisch
+
+Fehler oder Gefahr:
+
+[source,text]
+----
+Critical Red
+----
+
+== 3. Typografie
+
+=== 3.1 Schriftarten
+
+Ausschließlich Monospace-Schriften.
+
+Bevorzugte Reihenfolge:
+
+[source,text]
+----
+JetBrains Mono
+Fira Code
+Courier Prime
+monospace
+----
+
+=== 3.2 Typografische Regeln
+
+==== Beschriftungen
+
+Verwendung von Kleinbuchstaben.
+
+Beispiel:
+
+[source,text]
+----
+shield status
+resource storage
+diagnostics
+----
+
+==== Statusmeldungen
+
+Fett darstellen.
+
+Beispiel:
+
+[source,text]
+----
+WARNING
+SHIELD FAILURE
+RECOVERY COMPLETE
+----
+
+=== 3.3 Lesbarkeit
+
+Grundregeln:
+
+[source,css]
+----
+line-height: 1.4;
+letter-spacing: 0.02em;
+----
+
+Text muss stets lesbar bleiben.
+
+Dekorative Effekte dürfen niemals die Lesbarkeit reduzieren.
+
+=== 3.4 Text-Glow
+
+Optional:
+
+[source,css]
+----
+text-shadow:
+0 0 3px rgba(0,242,255,0.3);
+----
+
+Maximal:
+
+* 3px Blur
+* 30 % Deckkraft
+
+== 4. Layout-System
+
+=== 4.1 Raster
+
+Empfohlenes Grundraster:
+
+[source,text]
+----
+8px System
+----
+
+Abstände erfolgen in Vielfachen von:
+
+[source,text]
+----
+8
+16
+24
+32
+48
+64
+----
+
+=== 4.2 Informationshierarchie
+
+Von links nach rechts:
+
+[source,text]
+----
+Systemstatus
+↓
+Navigation
+↓
+Primäre Inhalte
+↓
+Kontextinformationen
+----
+
+=== 4.3 Bildaufteilung
+
+Für Spiele:
+
+[source,text]
+----
+Links:
+Systeme / HUD
+
+Mitte:
+Gameplay
+
+Rechts:
+Freier Sichtbereich
+----
+
+== 5. HUD-Spezifikation
+
+=== 5.1 Grundkonzept
+
+HUD-Elemente wirken wie physische Bestandteile der Maschine.
+
+Keine schwebenden Fantasy-Elemente.
+
+Keine organischen Formen.
+
+=== 5.2 Statusanzeigen
+
+==== Schild
+
+Farbübergang:
+
+[source,text]
+----
+>60%
+Tech Cyan
+
+30%-60%
+Amber Gold
+
+<30%
+Critical Red
+----
+
+==== Ressourcen
+
+Verwendung:
+
+[source,text]
+----
+Harvest Green
+----
+
+==== Systemfehler
+
+Verwendung:
+
+[source,text]
+----
+Critical Red
+----
+
+== 6. Canvas-Effekte
+
+=== 6.1 Scan-Lines
+
+Zweck:
+
+Simulation eines industriellen Monitors.
+
+Empfohlene Farbe:
+
+[source,css]
+----
+rgba(255,255,255,0.03)
+----
+
+Regeln:
+
+* Über der Spielwelt
+* Unter der UI
+* Dürfen Lesbarkeit nicht beeinträchtigen
+
+=== 6.2 Glitch-Effekte
+
+Technische Störungen werden durch kurze Cyan-Artefakte dargestellt.
+
+Regeln:
+
+* Maximal 150 ms sichtbar
+* Nur ereignisgesteuert
+* Keine permanente Darstellung
+
+Mögliche Auslöser:
+
+* Schildausfall
+* Respawn
+* Energieumschaltung
+* Speichertransfer
+* Diagnostikfehler
+
+=== 6.3 Bildschirmrauschen
+
+Optional:
+
+[source,css]
+----
+opacity: 0.02 - 0.04
+----
+
+Niemals dominant.
+
+== 7. Rahmen-System
+
+=== 7.1 Grundregel
+
+Vermeide klassische Betriebssystem-Fenster.
+
+Stattdessen:
+
+[source,text]
+----
+┌─────────
+
+└─────────
+----
+
+oder Corner-Brackets.
+
+=== 7.2 Rundungen
+
+Nicht vorgesehen.
+
+Maximal:
+
+[source,css]
+----
+border-radius: 2px;
+----
+
+=== 7.3 Linien
+
+Immer:
+
+[source,css]
+----
+1px
+----
+
+Farbe:
+
+[source,text]
+----
+Steel Grey
+----
+
+Aktiv:
+
+[source,text]
+----
+Tech Cyan
+----
+
+== 8. Buttons
+
+=== Normal
+
+[source,css]
+----
+background: transparent;
+color: #888899;
+border: 1px solid #888899;
+----
+
+=== Hover
+
+[source,css]
+----
+color: #00f2ff;
+border-color: #00f2ff;
+
+box-shadow:
+0 0 8px #00f2ff;
+----
+
+=== Aktiv
+
+[source,css]
+----
+background: #00f2ff;
+color: #05070a;
+----
+
+=== Disabled
+
+[source,css]
+----
+opacity: 0.4;
+pointer-events: none;
+----
+
+== 9. Panels und Container
+
+=== Standard
+
+[source,css]
+----
+background: #0b0e14;
+border: 1px solid #888899;
+
+backdrop-filter: blur(4px);
+----
+
+=== Overlays
+
+Dürfen Schatten besitzen.
+
+Beispiel:
+
+[source,css]
+----
+box-shadow:
+8px 8px 0 rgba(0,0,0,0.8);
+----
+
+=== Schatten-Regel
+
+Verboten:
+
+* Weiche Material-Schatten
+* Neumorphe Effekte
+* Mobile-App-Schatten
+
+Erlaubt:
+
+* Harte technische Schatten
+
+== 10. Icon-System
+
+=== Stil
+
+Alle Icons müssen:
+
+* SVG-basiert sein
+* Geometrisch wirken
+* Scharfe Kanten besitzen
+
+=== Unzulässig
+
+* Airbrush
+* Illustrationen
+* Farbverläufe
+* Cartoon-Stil
+
+=== Zulässig
+
+* Technische Symbole
+* Schaltpläne
+* Maschinen-Piktogramme
+
+== 11. Asset-Pipeline
+
+=== Flächen
+
+Nur Vollfarben.
+
+=== Nicht erlaubt
+
+* Farbverläufe
+* Weiche Lichtflächen
+* Fototexturen im UI
+
+=== Ausnahmen
+
+Folgende Effekte dürfen Verläufe enthalten:
+
+* Glow
+* Bloom
+* Partikel
+* Plasma
+* Energieeffekte
+
+== 12. Lichtsystem
+
+=== Ziel
+
+Licht soll technisch wirken.
+
+Nicht magisch.
+
+Nicht organisch.
+
+Nicht dekorativ.
+
+=== Glow-Regeln
+
+Empfohlen:
+
+[source,css]
+----
+box-shadow:
+0 0 6px currentColor;
+----
+
+Eigenschaften:
+
+* Kurzer Radius
+* Hoher Kontrast
+* Klar abgegrenzte Lichtquellen
+
+== 13. Animationen
+
+=== Erlaubt
+
+* Blinken
+* Pulsieren
+* Statuswechsel
+* Diagnostik-Animationen
+* Ladeanzeigen
+
+=== Nicht erlaubt
+
+* Verspielte Übergänge
+* Elastische Animationen
+* Übertriebene Bewegungen
+
+=== Animationsdauer
+
+Empfohlen:
+
+[source,text]
+----
+100ms - 300ms
+----
+
+HUD-Reaktionen:
+
+[source,text]
+----
+50ms - 150ms
+----
+
+== 14. Referenz-CSS
+
+[source,css]
+----
+:root {
+  --bg-deep: #05070a;
+  --bg-panel: #0b0e14;
+
+  --accent-cyan: #00f2ff;
+  --accent-green: #00ff73;
+  --accent-amber: #ffb700;
+  --accent-red: #ff3e3e;
+
+  --text-dim: #888899;
+}
+
+body {
+  background: var(--bg-deep);
+  color: var(--text-dim);
+
+  font-family:
+    "JetBrains Mono",
+    "Fira Code",
+    "Courier Prime",
+    monospace;
+}
+
+.panel {
+  background: var(--bg-panel);
+  border: 1px solid var(--text-dim);
+  backdrop-filter: blur(4px);
+}
+
+.button:hover {
+  color: var(--accent-cyan);
+  border-color: var(--accent-cyan);
+
+  box-shadow:
+    0 0 8px var(--accent-cyan);
+}
+----
+ 
+== Design-Leitsatz
+
+*Maschinen-Instanzen ist kein futuristisches Betriebssystem.*
+
+Es ist die Benutzeroberfläche einer gewaltigen industriellen Maschine, die zufällig von Menschen bedient wird.
+
+Jedes Element soll vermitteln, dass unter der Oberfläche reale Energieflüsse, Diagnosesysteme, Speicherabbilder, Förderanlagen und Maschinenprozesse arbeiten.
+
+Dekoration ist optional.
+
+*Funktion ist Pflicht.*
@@ -0,0 +1,648 @@
+# Design-System: Maschinen-Instanzen
+### Project X Tribut • Universelles UI-, HUD- und Grafiksystem
+
+**Version:** 1.0.0  
+**Zielplattformen:** Web, HTML5 Canvas, Browser-Games, Diagnose-Terminals, Tools, Dashboards  
+**Designsprache:** Hard-Sci-Fi · Industrial Computing · Retro-Terminal · Maschinenästhetik
+
+---
+
+# 1. Designphilosophie
+
+Das Design-System *Maschinen-Instanzen* definiert die visuelle Sprache des gesamten Computer-Historyz-Universums.
+
+Die Gestaltung orientiert sich an industriellen Steuerungssystemen, wissenschaftlichen Diagnoseterminals und kybernetischen Maschinenkomplexen. Sämtliche Farben, Formen und Effekte besitzen eine funktionale Bedeutung.
+
+Die Benutzeroberfläche soll nicht dekorativ wirken, sondern wie ein Bestandteil einer realen Maschine.
+
+## Grundprinzipien
+
+1. Funktion vor Dekoration.
+2. Jede Farbe besitzt eine semantische Bedeutung.
+3. Scharfe Kanten statt organischer Formen.
+4. Monospace-Typografie als Standard.
+5. Technische Lesbarkeit hat Vorrang vor visuellen Effekten.
+6. Informationen werden durch Farbe, Position und Kontrast vermittelt.
+7. Animationen dienen der Zustandskommunikation und niemals ausschließlich der Verzierung.
+
+---
+
+# 2. Farbpalette
+
+## 2.1 Kernfarben
+
+| Name | Hex | Bedeutung |
+|--------|--------|--------|
+| Deep Void | `#05070a` | Globaler Hintergrund, tiefste Darstellungsebene |
+| Terminal Base | `#0b0e14` | Fenster, Container und Panel-Flächen |
+| Tech Cyan | `#00f2ff` | Interaktion, Fokus, aktive Systeme |
+| Harvest Green | `#00ff73` | Erfolg, Ressourcengewinn, Wiederherstellung |
+| Amber Gold | `#ffb700` | Warnungen, besondere Objekte, Missionsziele |
+| Critical Red | `#ff3e3e` | Kritische Zustände, Fehler, Gefahr |
+| Steel Grey | `#888899` | Sekundäre Informationen, deaktivierte Elemente |
+
+---
+
+## 2.2 Semantische Zustände
+
+| Zustand | Farbe |
+|----------|----------|
+| Information | Tech Cyan |
+| Erfolg | Harvest Green |
+| Warnung | Amber Gold |
+| Kritisch | Critical Red |
+| Deaktiviert | Steel Grey |
+| Fokus | Tech Cyan + Glow |
+
+---
+
+## 2.3 Priorisierung
+
+### Primär
+
+Interaktive Objekte:
+
+- Buttons
+- Links
+- Menüs
+- Aktive Systeme
+
+Verwenden:
+
+```text
+Tech Cyan
+```
+
+### Sekundär
+
+Nicht-interaktive Daten:
+
+- Metadaten
+- Diagnostikwerte
+- Statistiken
+
+Verwenden:
+
+```text
+Steel Grey
+```
+
+### Kritisch
+
+Fehler oder Gefahr:
+
+```text
+Critical Red
+```
+
+---
+
+# 3. Typografie
+
+## 3.1 Schriftarten
+
+Ausschließlich Monospace-Schriften.
+
+Bevorzugte Reihenfolge:
+
+```text
+JetBrains Mono
+Fira Code
+Courier Prime
+monospace
+```
+
+---
+
+## 3.2 Typografische Regeln
+
+### Beschriftungen
+
+Verwendung von Kleinbuchstaben.
+
+Beispiel:
+
+```text
+shield status
+resource storage
+diagnostics
+```
+
+### Statusmeldungen
+
+Fett darstellen.
+
+Beispiel:
+
+```text
+WARNING
+SHIELD FAILURE
+RECOVERY COMPLETE
+```
+
+---
+
+## 3.3 Lesbarkeit
+
+Grundregeln:
+
+```css
+line-height: 1.4;
+letter-spacing: 0.02em;
+```
+
+Text muss stets lesbar bleiben.
+
+Dekorative Effekte dürfen niemals die Lesbarkeit reduzieren.
+
+---
+
+## 3.4 Text-Glow
+
+Optional:
+
+```css
+text-shadow:
+0 0 3px rgba(0,242,255,0.3);
+```
+
+Maximal:
+
+- 3px Blur
+- 30% Deckkraft
+
+---
+
+# 4. Layout-System
+
+## 4.1 Raster
+
+Empfohlenes Grundraster:
+
+```text
+8px System
+```
+
+Abstände erfolgen in Vielfachen von:
+
+```text
+8
+16
+24
+32
+48
+64
+```
+
+---
+
+## 4.2 Informationshierarchie
+
+Von links nach rechts:
+
+```text
+Systemstatus
+↓
+Navigation
+↓
+Primäre Inhalte
+↓
+Kontextinformationen
+```
+
+---
+
+## 4.3 Bildaufteilung
+
+Für Spiele:
+
+```text
+Links:
+Systeme / HUD
+
+Mitte:
+Gameplay
+
+Rechts:
+Freier Sichtbereich
+```
+
+---
+
+# 5. HUD-Spezifikation
+
+## 5.1 Grundkonzept
+
+HUD-Elemente wirken wie physische Bestandteile der Maschine.
+
+Keine schwebenden Fantasy-Elemente.
+
+Keine organischen Formen.
+
+---
+
+## 5.2 Statusanzeigen
+
+### Schild
+
+Farbübergang:
+
+```text
+>60%
+Tech Cyan
+
+30%-60%
+Amber Gold
+
+<30%
+Critical Red
+```
+
+---
+
+### Ressourcen
+
+Verwendung:
+
+```text
+Harvest Green
+```
+
+---
+
+### Systemfehler
+
+Verwendung:
+
+```text
+Critical Red
+```
+
+---
+
+# 6. Canvas-Effekte
+
+## 6.1 Scan-Lines
+
+Zweck:
+
+Simulation eines industriellen Monitors.
+
+Empfohlene Farbe:
+
+```css
+rgba(255,255,255,0.03)
+```
+
+Regeln:
+
+- Über der Spielwelt
+- Unter der UI
+- Dürfen Lesbarkeit nicht beeinträchtigen
+
+---
+
+## 6.2 Glitch-Effekte
+
+Technische Störungen werden durch kurze Cyan-Artefakte dargestellt.
+
+Regeln:
+
+- Maximal 150 ms sichtbar
+- Nur ereignisgesteuert
+- Keine permanente Darstellung
+
+Mögliche Auslöser:
+
+- Schildausfall
+- Respawn
+- Energieumschaltung
+- Speichertransfer
+- Diagnostikfehler
+
+---
+
+## 6.3 Bildschirmrauschen
+
+Optional:
+
+```css
+opacity: 0.02 - 0.04
+```
+
+Niemals dominant.
+
+---
+
+# 7. Rahmen-System
+
+## 7.1 Grundregel
+
+Vermeide klassische Betriebssystem-Fenster.
+
+Stattdessen:
+
+```text
+┌─────────
+
+└─────────
+```
+
+bzw. Corner-Brackets.
+
+---
+
+## 7.2 Rundungen
+
+Nicht vorgesehen.
+
+Maximal:
+
+```css
+border-radius: 2px;
+```
+
+---
+
+## 7.3 Linien
+
+Immer:
+
+```css
+1px
+```
+
+Farbe:
+
+```text
+Steel Grey
+```
+
+Aktiv:
+
+```text
+Tech Cyan
+```
+
+---
+
+# 8. Buttons
+
+## Normal
+
+```css
+background: transparent;
+color: #888899;
+border: 1px solid #888899;
+```
+
+---
+
+## Hover
+
+```css
+color: #00f2ff;
+border-color: #00f2ff;
+
+box-shadow:
+0 0 8px #00f2ff;
+```
+
+---
+
+## Aktiv
+
+```css
+background: #00f2ff;
+color: #05070a;
+```
+
+---
+
+## Disabled
+
+```css
+opacity: 0.4;
+pointer-events: none;
+```
+
+---
+
+# 9. Panels und Container
+
+## Standard
+
+```css
+background: #0b0e14;
+border: 1px solid #888899;
+
+backdrop-filter: blur(4px);
+```
+
+---
+
+## Overlays
+
+Dürfen Schatten besitzen.
+
+Beispiel:
+
+```css
+box-shadow:
+8px 8px 0 rgba(0,0,0,0.8);
+```
+
+---
+
+## Schatten-Regel
+
+Verboten:
+
+- weiche Material-Schatten
+- neumorphe Effekte
+- mobile App Shadows
+
+Erlaubt:
+
+- harte technische Schatten
+
+---
+
+# 10. Icon-System
+
+## Stil
+
+Alle Icons müssen:
+
+- SVG-basiert sein
+- geometrisch wirken
+- scharfe Kanten besitzen
+
+---
+
+## Unzulässig
+
+- Airbrush
+- Illustrationen
+- Farbverläufe
+- Cartoon-Stil
+
+---
+
+## Zulässig
+
+- technische Symbole
+- Schaltpläne
+- Maschinen-Piktogramme
+
+---
+
+# 11. Asset-Pipeline
+
+## Flächen
+
+Nur Vollfarben.
+
+---
+
+## Nicht erlaubt
+
+- Farbverläufe
+- weiche Lichtflächen
+- Fototexturen im UI
+
+---
+
+## Ausnahmen
+
+Folgende Effekte dürfen Verläufe enthalten:
+
+- Glow
+- Bloom
+- Partikel
+- Plasma
+- Energieeffekte
+
+---
+
+# 12. Lichtsystem
+
+## Ziel
+
+Licht soll technisch wirken.
+
+Nicht magisch.
+
+Nicht organisch.
+
+Nicht dekorativ.
+
+---
+
+## Glow-Regeln
+
+Empfohlen:
+
+```css
+box-shadow:
+0 0 6px currentColor;
+```
+
+Eigenschaften:
+
+- kurzer Radius
+- hoher Kontrast
+- klar abgegrenzte Lichtquellen
+
+---
+
+# 13. Animationen
+
+## Erlaubt
+
+- Blinken
+- Pulsieren
+- Statuswechsel
+- Diagnostik-Animationen
+- Ladeanzeigen
+
+---
+
+## Nicht erlaubt
+
+- verspielte Übergänge
+- elastische Animationen
+- übertriebene Bewegungen
+
+---
+
+## Animationsdauer
+
+Empfohlen:
+
+```text
+100ms - 300ms
+```
+
+HUD-Reaktionen:
+
+```text
+50ms - 150ms
+```
+
+---
+
+# 14. Referenz-CSS
+
+```css
+:root {
+  --bg-deep: #05070a;
+  --bg-panel: #0b0e14;
+
+  --accent-cyan: #00f2ff;
+  --accent-green: #00ff73;
+  --accent-amber: #ffb700;
+  --accent-red: #ff3e3e;
+
+  --text-dim: #888899;
+}
+
+body {
+  background: var(--bg-deep);
+  color: var(--text-dim);
+
+  font-family:
+    "JetBrains Mono",
+    "Fira Code",
+    "Courier Prime",
+    monospace;
+}
+
+.panel {
+  background: var(--bg-panel);
+  border: 1px solid var(--text-dim);
+  backdrop-filter: blur(4px);
+}
+
+.button:hover {
+  color: var(--accent-cyan);
+  border-color: var(--accent-cyan);
+
+  box-shadow:
+    0 0 8px var(--accent-cyan);
+}
+```
+
+---
+
+# Design-Leitsatz
+
+**Maschinen-Instanzen ist kein futuristisches Betriebssystem.**
+
+Es ist die Benutzeroberfläche einer gewaltigen industriellen Maschine, die zufällig von Menschen bedient wird.
+
+Jedes Element soll vermitteln, dass unter der Oberfläche reale Energieflüsse, Diagnosesysteme, Speicherabbilder, Förderanlagen und Maschinenprozesse arbeiten.
+
+Dekoration ist optional.
+
+Funktion ist Pflicht.
@@ -0,0 +1,259 @@
+= REVERSE GAME DESIGN DOCUMENT (GDD)
+:toc: left
+:toclevels: 3
+
+Projekt: Maschinen-Instanzen – Asteroiden-Sektor (Project X Tribut)
+
+*Version:* 1.0.0 +
+*Genre:* Hard-Sci-Fi / Retro-Shmup (2.5D) +
+*Setting:* Das „Computer Historyz“-Universum (Sektor: Oortsche Wolke 42)
+
+== 1. Vision & Kernkonzept
+
+Ein endloses, horizontales Shoot-'em-up in 2D, das innerhalb einer echten 3D-Umgebung gerendert wird.
+
+Der Spieler steuert eine kybernetische Ernte-Instanz (Bergbau-Schiff), die am Rand eines gigantischen, planetengroßen Maschinen-Ansaugstutzens operiert.
+
+Das Spiel kombiniert rasante Arcade-Asteroiden-Zerstörung mit taktischem Power-Routing (Energie-Management) unter harten Hard-Sci-Fi-Rahmenbedingungen.
+
+== 2. Globale Farbpalette & Ästhetik
+
+Diese Farbpalette definiert das visuelle Leitbild für alle zukünftigen Spiele in diesem Universum, unabhängig davon, ob sie als Pixel-Art-, Vektor- oder PBR-basierte 3D-Titel umgesetzt werden.
+
+=== 2.1 UI-, HUD- und Terminal-Farben (Window-Maker-Stil)
+
+Die Benutzeroberfläche basiert auf dem kalten, funktionalen Look klassischer Unix-Terminals, kombiniert mit modernen Glow-Effekten.
+
+[cols="1,1,3",options="header"]
+|===
+|Farbe
+|Hex-Code
+|Semantischer Nutzen
+
+|Deep Void
+|`#05070a`
+|Globaler Weltraum-Hintergrund, tiefste Schatten.
+
+|Terminal Base
+|`#0d1117`
+|Hintergrund für Menüs, HUD-Panels und Dialogfenster.
+
+|Panel Border
+|`#444c56`
+|Rahmen von UI-Fenstern, häufig kombiniert mit inneren Highlights für 3D-Bevel-Effekte.
+
+|Tech Cyan
+|`#58a6ff`
+|Primäre Akzentfarbe. Standard-Text, normale Laser, Hologramme, aktiver Schild (HP > 60 %) und UI-Glow.
+
+|Harvest Green
+|`#39d353`
+|Erfolgs-Feedback, gesammelte Ressourcen und Laser-Stufe 2.
+
+|Amber Gold
+|`#d29922`
+|Warnungen, Highscores, wertvolle Materialien, Schild (HP < 60 %) und Laser-Stufe 3.
+
+|Critical Red
+|`#f85149`
+|Lebensgefahr, kritischer Schild (HP < 30 %), Triebwerks-Exhaust und Laser-Stufe 4+.
+|===
+
+=== 2.2 Materialfarben (3D-Modelle und 2D-Sprites)
+
+Für gerenderte 3D-Objekte und gezeichnete 2D-Sprites gelten folgende Materialdefinitionen:
+
+[cols="1,1,2,2",options="header"]
+|===
+|Element
+|Farbe
+|3D-Eigenschaften (PBR)
+|2D-Eigenschaften
+
+|Maschinen-Hülle
+|`#1f6feb` (Blau-Metallic)
+|Roughness: 0.4, Metalness: 0.8
+|Satte dunkle Blautöne mit hartem weißen Specular-Highlight.
+
+|Triebwerke / Rohre
+|`#21262d` (Dunkelgrau)
+|Roughness: 0.9, Metalness: 1.0
+|Nahezu schwarze Flächen mit hohem Kontrast.
+
+|Eis-Asteroid
+|`#d0e8ff` (Blass-Eisblau)
+|Roughness: 0.9, Metalness: 0.1
+|Helle Töne, geringe Schattenbildung, weiße Staubpartikel.
+
+|Fels-Asteroid
+|`#6b4a31` (Braun)
+|Roughness: 1.0, Metalness: 0.1
+|Matte, strukturierte und körnige Oberflächen.
+
+|Eisen-Asteroid
+|`#888899` (Grau/Silber)
+|Roughness: 0.3, Metalness: 0.9
+|Spiegelnde Oberflächen mit deutlich sichtbaren Glanzlichtern.
+|===
+
+== 3. Gameplay & Mechaniken
+
+=== 3.1 Das Plasma-Blasen-Paradoxon (Movement)
+
+. *Lore-Hintergrund:*
+  Das Schiff erzeugt ein Magnetfeld zum Sammeln von Weltraumstaub. Dadurch entsteht eine künstliche Atmosphäre im Vakuum.
+
+. *Mechanik:*
+  Das Schiff wird aerodynamisch gesteuert. Es fliegt nicht auf festen Schienen, sondern neigt sich beim Steigen und Sinken entlang einer simulierten Roll-/Yaw-Bewegung.
+
+. *Feedback:*
+  Die Plasma-Blase pulsiert visuell. Mit steigender Schildenergie wächst ihre Größe von 0.6× bis 1.5× der Schiffsausdehnung.
+
+=== 3.2 Taktisches Power-Routing (Energie-Management)
+
+Die zentrale Hard-Sci-Fi-Mechanik basiert auf zwei Ressourcen:
+
+* *Schild (Defensive)*
+* *Laser / Score (Offensive)*
+
+Der Spieler kann Energie in Echtzeit zwischen beiden Systemen umverteilen.
+
+. *Schild laden (Defensive):*
+  Der Spieler opfert Score beziehungsweise Laserstufen, um den Schild wiederherzustellen.
+
+. *Laser pushen (Offensive):*
+  Energie wird dem Schild entzogen und in die Waffensysteme umgeleitet.
+
+. *Visuelle Regel:*
+  Dieses Risiko-Belohnungs-System muss in jeder Umsetzung über die Farbskala von `Tech Cyan` bis `Critical Red` dargestellt werden.
+
+=== 3.3 Asteroiden-Split-Physik & Materialklassen
+
+Gegnerische Asteroiden teilen sich beim Zerstören in zwei kleinere und schnellere Fragmente.
+
+. *Eis (Level 1-2):*
+  1× Basis-HP. Schnell, aber äußerst fragil.
+
+. *Gestein (Level 2-4):*
+  2× Basis-HP. Standardgegner.
+
+. *Eisen (Level 3-5):*
+  4× Basis-HP. Massive Brocken mit dreifachem Scorewert. Schwache Laser werden vollständig blockiert.
+
+=== 3.4 Das Cylon-Recovery-System (Game Over / Respawn)
+
+. *Mechanik:*
+  Es existiert kein endgültiger Tod. Beim Verlust der Hülle wird das Speicherabbild gesichert.
+
+. *Ablauf:*
+  Das Spiel pausiert.
+
+  Ein Diagnostik-Terminal meldet:
+
+[source,text]
+----
+DIAGNOSTICS
+Hull Destroyed
+----
+
+  Ein roter Fortschrittsbalken füllt sich, während das Bewusstsein in eine neue Instanz übertragen wird.
+
+  Der Spieler behält Laser-Level und Langzeitfortschritt, verliert jedoch Zeit sowie laufende Multiplikatoren.
+
+== 4. Räumliche Komposition (Kamera & Level-Architektur)
+
+=== 4.1 Der C-Rahmen (Die Maschine)
+
+. *Konzept:*
+  Der Spieler operiert nicht im leeren Raum. Die linke Bildschirmseite wird von der gewaltigen Hauptmaschine eingenommen.
+
+. *Layout:*
+  Das Mahlwerk erscheint als massive Struktur im oberen und unteren linken Bildbereich.
+
+  * 3D: Box-Geometry
+  * 2D: Parallax-Layer
+
+. *Der Korridor:*
+  Die mittlere Zone der linken Bildschirmhälfte bleibt frei und garantiert Sicht auf das Spielgeschehen.
+
+. *Reaktivität:*
+  Trümmerfragmente werden nach links in den Schlund der Maschine gesaugt.
+
+  Mit zunehmender Materialzufuhr:
+
+  * Rotieren die Häcksler schneller.
+  * Verstärkt sich der Plasma-Halo.
+  * Steigt die visuelle Aktivität der Anlage.
+
+=== 4.2 UI-Platzierung (HUD)
+
+Das HUD integriert sich in den physischen C-Rahmen der Maschine.
+
+. *Oben links:*
+  Schiff-Diagnostik (Schild, Laser, Statuswerte).
+
+. *Unten links:*
+  Ressourcenanzeige (Punkte, Highscore, Materialzähler).
+
+. *Ziel:*
+  Die rechte und zentrale Bildhälfte bleiben vollständig für das eigentliche Spielgeschehen reserviert.
+
+== 5. Technische Struktur (Code-Architektur)
+
+Für Programmierer definiert die Konfiguration `GAME_CONFIG` die zentrale Wahrheitsquelle.
+
+Magic Numbers im Quellcode sind nicht zulässig.
+
+Jede Umsetzung des Spiels muss mindestens folgende Strukturobjekte enthalten:
+
+. `world`
+
+Konstanten für Scrollgeschwindigkeit, Zeitskalierung und globale Simulation.
+
+. `player`
+
+Geschwindigkeit, Kollisionsradius und Basiswerte des Spielerschiffs.
+
+. `laser`
+
+Feuerrate, Schaden und Upgrade-Grenzen (Level 1-5).
+
+. `asteroidTypes`
+
+Dictionary zur Zuordnung von:
+
+* Eis
+* Gestein
+* Eisen
+
+mit:
+
+* HP-Multiplikatoren
+* Asset-Pfaden
+* Sprite-Dateien (`.png`)
+* 3D-Modellen (`.glb`)
+
+. `levelWaves`
+
+Wahrscheinlichkeitsmatrix zur Definition der Spawn-Verteilung von Asteroidentypen innerhalb der Progression.
+
+
+=== Zusammenfassung des erstellten Spiels
+
+. *Achsengerechtes Gameplay (Horizontal Scroll Shmup):*
+  Du navigierst dein Schiff auf der linken Seite des Bildschirms, während Asteroiden aus dem scheinbar unendlichen interstellaren Vakuum auf dich zurasen.
+
+. *Kombiniertes 3D im Browser:*
+  Sämtliche Raumschiffkomponenten (Düse, Triebwerke, Flügel) sowie die unregelmäßig geformten Asteroiden werden dynamisch per Code in einer 3D-Umgebung erzeugt, gerendert und manipuliert.
+
+. *Plasma-Blasen-Physik:*
+  Um das Schiff pulsiert ein transparentes Energiefeld, das den in der Lore beschriebenen Strömungswiderstand simuliert und die besondere Flugcharakteristik der Ernte-Instanzen nachvollziehbar macht.
+
+. *Asteroids-Split-Mechanik:*
+  Große Asteroiden zerbrechen bei Beschuss kinetisch korrekt in zwei kleinere und schnellere Fragmente. Diese müssen wiederum zerstört werden, um wertvolle Rohstoffe zu bergen.
+
+. *Cylonen-Reboot-System:*
+  Wird die Schiffshülle zerstört, erscheint ein retro-futuristisches Cylon-Interface mit Diagnose- und Transpositionsmeldungen. Anschließend wird das unsterbliche Speicherabbild in ein neues Chassis übertragen.
+
+. *Web-Audio-Synthesizer:*
+  Sämtliche Soundeffekte werden in Echtzeit synthetisiert. Dazu gehören Laser-Frequenzrampen, tieffrequente Asteroidenexplosionen sowie das charakteristische Aufheulen des Reboot-Vorgangs.
@@ -0,0 +1,103 @@
+# REVERSE GAME DESIGN DOCUMENT (GDD)
+
+**Projekt:** Maschinen-Instanzen – Asteroiden-Sektor (Project X Tribut)
+
+**Version:** 1.0.0  
+**Genre:** Hard-Sci-Fi / Retro-Shmup (2.5D)  
+**Setting:** Das „Computer Historyz“-Universum (Sektor: Oortsche Wolke 42)
+
+## 1. Vision & Kernkonzept
+
+Ein endloses, horizontales Shoot-'em-up in 2D, das innerhalb einer echten 3D-Umgebung gerendert wird.
+
+Der Spieler steuert eine kybernetische Ernte-Instanz (Bergbau-Schiff), die am Rand eines gigantischen, planetengroßen Maschinen-Ansaugstutzens operiert.
+
+Das Spiel kombiniert rasante Arcade-Asteroiden-Zerstörung mit taktischem Power-Routing (Energie-Management) unter harten Hard-Sci-Fi-Rahmenbedingungen.
+
+## 2. Globale Farbpalette & Ästhetik
+
+Diese Farbpalette definiert das visuelle Leitbild für alle zukünftigen Spiele in diesem Universum, unabhängig davon, ob sie als Pixel-Art-, Vektor- oder PBR-basierte 3D-Titel umgesetzt werden.
+
+### 2.1 UI-, HUD- und Terminal-Farben (Window-Maker-Stil)
+
+Die Benutzeroberfläche basiert auf dem kalten, funktionalen Look klassischer Unix-Terminals, kombiniert mit modernen Glow-Effekten.
+
+| Farbe | Hex-Code | Semantischer Nutzen |
+|---------|---------|---------|
+| Deep Void | `#05070a` | Globaler Weltraum-Hintergrund, tiefste Schatten. |
+| Terminal Base | `#0d1117` | Hintergrund für Menüs, HUD-Panels und Dialogfenster. |
+| Panel Border | `#444c56` | Rahmen von UI-Fenstern, häufig kombiniert mit inneren Highlights für 3D-Bevel-Effekte. |
+| Tech Cyan | `#58a6ff` | Primäre Akzentfarbe. Standard-Text, normale Laser, Hologramme, aktiver Schild (HP > 60 %) und UI-Glow. |
+| Harvest Green | `#39d353` | Erfolgs-Feedback, gesammelte Ressourcen und Laser-Stufe 2. |
+| Amber Gold | `#d29922` | Warnungen, Highscores, wertvolle Materialien, Schild (HP < 60 %) und Laser-Stufe 3. |
+| Critical Red | `#f85149` | Lebensgefahr, kritischer Schild (HP < 30 %), Triebwerks-Exhaust und Laser-Stufe 4+. |
+
+### 2.2 Materialfarben (3D-Modelle und 2D-Sprites)
+
+Für gerenderte 3D-Objekte und gezeichnete 2D-Sprites gelten folgende Materialdefinitionen:
+
+| Element | Farbe | 3D-Eigenschaften (PBR) | 2D-Eigenschaften |
+|---------|---------|---------|---------|
+| Maschinen-Hülle | `#1f6feb` (Blau-Metallic) | Roughness: 0.4, Metalness: 0.8 | Satte dunkle Blautöne mit hartem weißen Specular-Highlight |
+| Triebwerke / Rohre | `#21262d` (Dunkelgrau) | Roughness: 0.9, Metalness: 1.0 | Nahezu schwarze Flächen mit hohem Kontrast |
+| Eis-Asteroid | `#d0e8ff` (Blass-Eisblau) | Roughness: 0.9, Metalness: 0.1 | Helle Töne, geringe Schattenbildung, weiße Staubpartikel |
+| Fels-Asteroid | `#6b4a31` (Braun) | Roughness: 1.0, Metalness: 0.1 | Matte, strukturierte und körnige Oberflächen |
+| Eisen-Asteroid | `#888899` (Grau/Silber) | Roughness: 0.3, Metalness: 0.9 | Spiegelnde Oberflächen mit deutlich sichtbaren Glanzlichtern |
+
+## 3. Gameplay & Mechaniken
+
+### 3.1 Das Plasma-Blasen-Paradoxon (Movement)
+
+1. **Lore-Hintergrund:**  
+   Das Schiff erzeugt ein Magnetfeld zum Sammeln von Weltraumstaub. Dadurch entsteht eine künstliche Atmosphäre im Vakuum.
+
+2. **Mechanik:**  
+   Das Schiff wird aerodynamisch gesteuert. Es fliegt nicht auf festen Schienen, sondern neigt sich beim Steigen und Sinken entlang einer simulierten Roll-/Yaw-Bewegung.
+
+3. **Feedback:**  
+   Die Plasma-Blase pulsiert visuell. Mit steigender Schildenergie wächst ihre Größe von 0.6× bis 1.5× der Schiffsausdehnung.
+
+### 3.2 Taktisches Power-Routing (Energie-Management)
+
+Die zentrale Hard-Sci-Fi-Mechanik basiert auf zwei Ressourcen:
+
+- **Schild (Defensive)**
+- **Laser / Score (Offensive)**
+
+Der Spieler kann Energie in Echtzeit zwischen beiden Systemen umverteilen.
+
+1. **Schild laden (Defensive):**  
+   Der Spieler opfert Score beziehungsweise Laserstufen, um den Schild wiederherzustellen.
+
+2. **Laser pushen (Offensive):**  
+   Energie wird dem Schild entzogen und in die Waffensysteme umgeleitet.
+
+3. **Visuelle Regel:**  
+   Dieses Risiko-Belohnungs-System muss in jeder Umsetzung über die Farbskala von `Tech Cyan` bis `Critical Red` dargestellt werden.
+
+### 3.3 Asteroiden-Split-Physik & Materialklassen
+
+Gegnerische Asteroiden teilen sich beim Zerstören in zwei kleinere und schnellere Fragmente.
+
+1. **Eis (Level 1-2):**  
+   1× Basis-HP. Schnell, aber äußerst fragil.
+
+2. **Gestein (Level 2-4):**  
+   2× Basis-HP. Standardgegner.
+
+3. **Eisen (Level 3-5):**  
+   4× Basis-HP. Massive Brocken mit dreifachem Scorewert. Schwache Laser werden vollständig blockiert.
+
+### 3.4 Das Cylon-Recovery-System (Game Over / Respawn)
+
+1. **Mechanik:**  
+   Es existiert kein endgültiger Tod. Beim Verlust der Hülle wird das Speicherabbild gesichert.
+
+2. **Ablauf:**  
+   Das Spiel pausiert.
+
+   Ein Diagnostik-Terminal meldet:
+
+   ```text
+   DIAGNOSTICS
+   Hull Destroyed
@@ -0,0 +1,348 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="UTF-8">
+    <title>Computer Historyz - Progressive Klick-Decryption</title>
+    <style>
+        /* --- KERNFARBEN AUS DESIGN-DOKU: MASCHINEN-INSTANZEN --- */
+        :root {
+            --bg-deep: #05070a;
+            --bg-panel: #0b0e14;
+            
+            --accent-cyan: #00f2ff;
+            --accent-green: #00ff73;
+            --accent-amber: #ffb700;
+            --accent-red: #ff3e3e;
+            
+            --text-dim: #888899;
+            --font-mono: "JetBrains Mono", "Fira Code", "Courier Prime", monospace;
+        }
+
+        body {
+            background: var(--bg-deep);
+            color: var(--text-dim);
+            font-family: var(--font-mono);
+            margin: 20px;
+            line-height: 1.5;
+        }
+
+        .panel {
+            background: var(--bg-panel);
+            border: 1px solid var(--text-dim);
+            backdrop-filter: blur(4px);
+            padding: 15px;
+            margin-bottom: 25px;
+            box-shadow: 0 0 6px rgba(0, 242, 255, 0.1);
+        }
+
+        .panel-title {
+            color: var(--accent-green);
+            font-weight: bold;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+            margin-top: 0;
+            margin-bottom: 15px;
+            border-bottom: 1px dashed var(--text-dim);
+            padding-bottom: 5px;
+        }
+
+        input, textarea, button {
+            background: #07090e;
+            border: 1px solid var(--text-dim);
+            color: var(--accent-green);
+            padding: 8px;
+            font-family: var(--font-mono);
+            width: 100%;
+            box-sizing: border-box;
+            margin-bottom: 10px;
+        }
+
+        input:focus, textarea:focus {
+            outline: none;
+            border-color: var(--accent-cyan);
+            box-shadow: 0 0 6px var(--accent-cyan);
+        }
+
+        button {
+            cursor: pointer;
+            font-weight: bold;
+            background: #0c161a;
+            border-color: var(--accent-cyan);
+            color: var(--accent-cyan);
+            transition: all 0.2s ease;
+        }
+
+        button:hover {
+            background: var(--accent-cyan);
+            color: var(--bg-deep);
+            box-shadow: 0 0 6px var(--accent-cyan);
+        }
+
+        /* --- CRYPTO BLÖCKE SYSTEM --- */
+        .lock-chain {
+            white-space: pre-wrap;
+            word-break: break-all;
+            background: #020407;
+            padding: 12px;
+            border-left: 3px solid var(--text-dim);
+            margin: 15px 0;
+            color: #555566;
+            transition: all 0.3s ease;
+            opacity: 0.6;
+        }
+
+        /* Zustand: Block wartet darauf, geklickt zu werden */
+        .lock-chain.is-active {
+            border-left: 3px solid var(--accent-amber);
+            color: var(--accent-cyan);
+            cursor: pointer;
+            opacity: 1;
+            box-shadow: 0 0 6px rgba(255, 183, 0, 0.2);
+            animation: pulse-active 2s infinite ease-in-out;
+        }
+
+        /* Zustand: Erfolgreich decodiert */
+        .lock-chain.is-decrypted {
+            border-left: 3px solid var(--accent-green);
+            color: var(--accent-green);
+            background: transparent;
+            white-space: normal;
+            opacity: 1;
+            animation: none;
+            cursor: default;
+        }
+
+        /* Zustand: Fehler bei der Entschlüsselung */
+        .lock-chain.error {
+            border-left: 3px solid var(--accent-red);
+            color: var(--accent-red);
+            opacity: 1;
+            animation: blink-error 1s infinite;
+        }
+
+        @keyframes pulse-active {
+            0% { background: #020407; }
+            50% { background: #0a121c; }
+            100% { background: #020407; }
+        }
+
+        @keyframes blink-error {
+            50% { opacity: 0.4; }
+        }
+
+        .control-panel {
+            max-width: 600px;
+        }
+        
+        .status-badge {
+            display: inline-block;
+            padding: 2px 6px;
+            font-size: 0.85em;
+            background: #111;
+            border: 1px solid var(--text-dim);
+            margin-bottom: 10px;
+        }
+    </style>
+</head>
+<body>
+
+    <div class="panel control-panel">
+        <div class="panel-title">Decryption Control Deck</div>
+        <label for="master-pass">Master-Passwort (Key 0):</label>
+        <input type="password" id="master-pass" value="OortscheWolke2448">
+        <button onclick="initializeCryptoChain()">Krypto-Kette initialisieren</button>
+        <div id="deck-status" class="status-badge" style="color: var(--accent-amber);">Status: Warte auf Initialisierung...</div>
+    </div>
+
+    <div class="panel">
+        <div class="panel-title">Dokument-Struktur (Instanzen-Protokoll)</div>
+        
+        <h3>Knotenpunkt-Datenstrom</h3>
+        <p><em>Dieser Textbereich liegt außerhalb der Kette und bleibt dauerhaft sichtbar.</em></p>
+        
+        <div class="lock-chain" id="block-0" onclick="triggerBlockDecryption(0)">&#x02;
+4a21184a44f9deeb8db93ee5c56dfba2d28fbfb3970b880197d19e9eb10a
+a011de36bdfc1103f6f14066094ef5ad0554ba739cae9dfc01991a0c0f99
+8ee2954aef83fbdf9842a2acb119cb
+&#x03;</div>
+
+        <div class="lock-chain" id="block-1" onclick="triggerBlockDecryption(1)">&#x02;
+108b688d01a3579ab5a6c117b38d388f8d689b9d3ff02102554dfa45bbca
+c0a7cc02ccff5d8ee9d110f01ccba1dd010ea4fbc11e22778da5a6c1deba
+99a9cf588b
+&#x03;</div>
+
+        <div class="lock-chain" id="block-2" onclick="triggerBlockDecryption(2)">&#x02;
+92da21085ba1f43a99e7d9b9d62da3ffde4bb8df115dd0ca31bdaef9d877
+bbad84ff4da92da74e99a4c11100bb17dca5ffca188e7d22cb54fb77ac90
+d22bb488de1a56daff8e9b
+&#x03;</div>
+    </div>
+
+    <div class="panel">
+        <div class="panel-title">Ketten-Generator (Text-zu-Klick-Block)</div>
+        <textarea id="gen-input" rows="4">Das Ur-Ding der Erbauer war die Energie.
+Die Hauptmaschinen sind monumentale Datenbanken.
+Das Nina-Protokoll verhindert den Ressourcen-Kollaps.</textarea>
+        <button onclick="generateNewChain()">Neue Krypto-Kette generieren</button>
+        <div id="gen-output" style="white-space: pre; font-family: var(--font-mono); color: var(--accent-cyan); margin-top: 10px; font-size: 0.9em;"></div>
+    </div>
+
+<script>
+    // --- STATE MACHINE FÜR DIE KLICK-KETTE ---
+    let currentActiveIndex = -1; 
+    let nextKeyString = "";      
+
+    // --- UTILITIES (Native Web Crypto) ---
+    function bufToHex(buf) {
+        return Array.from(new Uint8Array(buf)).map(b => b.toString(16).padStart(2, '0')).join('');
+    }
+
+    function hexToBuf(hex) {
+        const bytes = new Uint8Array(hex.length / 2);
+        for (let i = 0; i < hex.length; i += 2) {
+            bytes[i / 2] = parseInt(hex.substring(i, i + 2), 16);
+        }
+        return bytes.buffer;
+    }
+
+    async function deriveKey(passwordString) {
+        const encoder = new TextEncoder();
+        const data = encoder.encode(passwordString);
+        const hash = await crypto.subtle.digest('SHA-256', data);
+        return await crypto.subtle.importKey('raw', hash, { name: 'AES-GCM' }, false, ['encrypt', 'decrypt']);
+    }
+
+    // --- INTERAKTIVE LOGIK ---
+    
+    // Schritt 1: Master-Passwort laden und Block 0 scharf schalten
+    function initializeCryptoChain() {
+        const masterPassword = document.getElementById('master-pass').value;
+        if (!masterPassword) {
+            updateStatus("FEHLER: Passwort fehlt", "var(--accent-red)");
+            return;
+        }
+
+        nextKeyString = masterPassword;
+        currentActiveIndex = 0;
+        
+        // Alle UI-Klassen zurücksetzen
+        const blocks = document.querySelectorAll('.lock-chain');
+        blocks.forEach((block, idx) => {
+            block.classList.remove('is-active', 'is-decrypted', 'error');
+            // Wenn es der erste Block ist, aktiv schalten
+            if(idx === 0) {
+                block.classList.add('is-active');
+            }
+        });
+
+        updateStatus("Kette bereit. Klicke auf Block 1...", "var(--accent-cyan)");
+    }
+
+    // Schritt 2: Klick-Handler für die einzelnen Blöcke
+    async function triggerBlockDecryption(blockIndex) {
+        // Ignoriere Klicks, wenn der Block noch nicht an der Reihe ist
+        if (blockIndex !== currentActiveIndex) return;
+
+        const block = document.getElementById(`block-${blockIndex}`);
+        let rawContent = block.innerText.replace(/\r?\n|\r/g, "");
+        
+        // Format-Sicherheitscheck (\x02 STX und \x03 ETX)
+        if (!rawContent.startsWith('\x02') || !rawContent.endsWith('\x03')) {
+            markError(block, "Formatierungsfehler (Steuerzeichen fehlen)");
+            return;
+        }
+
+        // Payload-Filterung
+        const payload = rawContent.substring(1, rawContent.length - 1).replace(/\s/g, "");
+        const ivHex = payload.substring(0, 24);
+        const cipherHex = payload.substring(24);
+
+        try {
+            const iv = hexToBuf(ivHex);
+            const cipherData = hexToBuf(cipherHex);
+            const key = await deriveKey(nextKeyString);
+
+            const decryptedBuf = await crypto.subtle.decrypt(
+                { name: 'AES-GCM', iv: iv },
+                key,
+                cipherData
+            );
+
+            const plaintext = new TextDecoder().decode(decryptedBuf);
+            
+            // DOM-Austausch unter Beibehaltung der Struktur
+            block.innerHTML = plaintext;
+            block.classList.remove('is-active', 'error');
+            block.classList.add('is-decrypted');
+
+            // HIER PASSIERT DIE FORTLAUFENDE SCHLÜSSEL-ÜBERGABE:
+            nextKeyString = plaintext; 
+            
+            // Nächsten Block in der Kette freischalten
+            currentActiveIndex++;
+            const nextBlock = document.getElementById(`block-${currentActiveIndex}`);
+            
+            if (nextBlock) {
+                nextBlock.classList.add('is-active');
+                updateStatus(`Block ${blockIndex + 1} gelöst. Nächster Block freigegeben!`, "var(--accent-cyan)");
+            } else {
+                updateStatus("System vollständig decodiert. Kette beendet.", "var(--accent-green)");
+            }
+
+        } catch (err) {
+            markError(block, `Kettenschluss fehlgeschlagen. Falscher Key.`);
+        }
+    }
+
+    function markError(element, message) {
+        element.classList.remove('is-active');
+        element.classList.add('error');
+        element.innerText = `[CRITICAL CODE CORRUPTION: ${message}]`;
+        updateStatus("Kette dauerhaft unterbrochen.", "var(--accent-red)");
+        currentActiveIndex = -1; // Blockiert weitere Klicks
+    }
+
+    function updateStatus(text, color) {
+        const badge = document.getElementById('deck-status');
+        badge.innerText = `Status: ${text}`;
+        badge.style.color = color;
+        badge.style.borderColor = color;
+    }
+
+    // --- CHIP-GENERATOR FÜR DEINE TEXTE ---
+    async function generateNewChain() {
+        const masterPassword = document.getElementById('master-pass').value;
+        const lines = document.getElementById('gen-input').value.split('\n').filter(l => l.trim() !== "");
+        let currentKeyString = masterPassword;
+        let htmlOutput = "";
+
+        for (let i = 0; i < lines.length; i++) {
+            const plaintext = lines[i];
+            const iv = crypto.getRandomValues(new Uint8Array(12));
+            const key = await deriveKey(currentKeyString);
+            
+            const encryptedBuf = await crypto.subtle.encrypt(
+                { name: 'AES-GCM', iv: iv },
+                key,
+                new TextEncoder().encode(plaintext)
+            );
+
+            const fullPayloadHex = bufToHex(iv) + bufToHex(encryptedBuf);
+            
+            let formattedHex = "";
+            for (let j = 0; j < fullPayloadHex.length; j += 60) {
+                formattedHex += "\n" + fullPayloadHex.substring(j, j + 60);
+            }
+
+            // Generiert direkt die korrekten Klick-IDs und Handler für deinen Quelltext
+            htmlOutput += `&lt;div class="lock-chain" id="block-${i}" onclick="triggerBlockDecryption(${i})"&gt;&#x02;${formattedHex}\n&#x03;&lt;/div&gt;\n\n`;
+            
+            currentKeyString = plaintext;
+        }
+
+        document.getElementById('gen-output').innerHTML = htmlOutput;
+    }
+</script>
+</body>
+</html>
@@ -0,0 +1,22 @@
+
+:subtitle: wie der jüngste der Gruppe seinen ersten Einsatz erlebt
+:author: dexta
+:email: dexta.de@gmail.com
+:revdate: 16. Juli 2026
+:revnumber: 0.01
+:lang: de
+
+// Dokumentinhalt beginnt hier
+
+== Wo ist das richtige Protokoll
+
+Immer wieder diese Protokolle, hatte ich da nicht gerade ein grosses Upgrade laufen lassen, warum waren die aktuellen fassungen nicht dabei. Da ein Treffer, nein doch nicht eine falsche revision, bis jetzt aber der beste Treffer. Speichern wir das erst einmal ab, es steht ja noch mehr auf dem Protokoll das zu erledigen ist. Die Bestellung der Ausrüstung sollte auch zeitnah erledigt werden, bis das im Lager zusammen gestellt ist braucht es ja auch wieder. Die Kollegen habe da aber auch immer die Ruhe weg, aber wenn sie einen Termin zusagen dann ist es auch da, komme was da wolle, sagt man. Wunderbar die Liste ging ohne beanstandungen durch, liefer Ort abgeglichen und einen Termin der deutlich vor dem Abflug liegt. Merkwürdig sollte nicht ein Teil der ausrüstung eine Spezialanfertiung sein, geplant war es schon länger evtl. doch schon auf Lager, wird schon passen alle Checkboxen auf GO.
+
+Alle Punkte auf dem Protokoll - main sheet 02772 flug 198438 - erledigt, doppelter abgleich, lint, checking syntax erldigt. Die letzten Vorbereitung waren reine Routine, wie im Training 1000 fach geübt, die aufgaben greifen in einander. Ein ablauf wie ein schweizer Uhrwerk, von aussen betrachtet ein wirrer haufen oder ein balett je nach verstäntniss der komplezität. Nach dem Start in die tiefen weiten des Weltraums gibt es für mich nicht allzuviel zu tun. Bleibe auch nur war bis die Navigatoren und Energie/Inginueren ihre arbeit erledigt haben um einen kurzen abgleich vor zu nehmen. Als neuer im Team sollte ich hier besonders sorgfälltig vorgehen, geplannt und in Listen gefasste Aufaben existieren schon. Und das abgleichen ist einer der Punkte, natürlich, etwas flüchtig unterwegs heute, oder akuter Energie mangel. Jab es war der Mangel an Nachschub. Ein punkt den es vor einer lange ruhephase noch zu checken gilt. Oh die anderen sind fertig, haben die ersten Bahnen fixieren können der Kurs steht und wir so schnell nicht mehr geändert. Ihre einzige längere Ruhephase sind wohl deshalb schnell im ab arbeiten der Protokolle, zu weilen werden blöcke als ganzen abgehakt. Noch bevor ich mich versah war die Ruhephase eingetretten, Energie check, Wecker daten eingereicht, ein rotes X und die gedanken sind weg.
+
+Verdammt habe ich das Weck Signal nicht reistriert, sind wir schon angekommen, wo sind die anderen? Mute, wer hat die Kommunikation auf pause gestellt, ach so ist die default einstellung. Und schon wird es wild auf der Leitung, wo die anderen sind ist nicht klar, aber das sie anwesend sind und in mitten eines stetigen treibens sind. Eine Nachricht das ich helfen könnte wenn nur jemand schreiben würde was zu mir möglich ist, wurde lange nicht beantwortet. Zu erst gab es Feedback vom alten: kein bedarf ; der ältere: auch schon da, halt dich bereit ; zu letzt vom Ingenure: deine zeit ist noch nicht gekommen, spare Energie. Nicht sehr hilfreich für den anfang, also die neuesten Updates laden irgendwo wird doch zu finden sein was der genaue status ist. Na klar es steht natürlich nicht ganz vorne was der letzte stand ist, bei 50% der Reise verlief alles nach Plan. Oh wow, da haben sie aber Daten aufgenommen, das muss eine sehr belebtes System gewesen sein, der Fortschrittsbalken scheint sich gerade rückwerts zu bewegen während die Daten in ungeahnter Geschwindikeit eintreffen. Und das ist der grund warum der Wecker immer etwas früher klingeln sollte, die News der Nacht müssen auch erst einmal verarbeitet werden. Wobei verarbeiten gerade eine doofe idee sein wird, die benötige Energie steht gerade nicht zur verfühgung. Eine Info die gerade einetroffen ist, der Energieverwalter meldet, zugriff auf die Daten zum langsamen Kanal wechseln, und in alles Systeme in den Hintergrund verschieben.
+
+Und da sind wir wieder, das mit dem Wecken braucht einer genaueren Analyse, gefühlt bin ich gerade auf dem Flur aufgewacht und werde vorran geschoben. Mein vertrauter Arbeitsbereich wird deutlicher, und schon sind alle Sinne auf die Aufgabe gerichtet, die trainierte Aufgabe, das was jetzt nicht mehr schief gehen kann. Die Mechanik greift ineinander, die grosse Masse der Konstruktion setzt sich in bewegung ,trotz dieser gigantischen Maschine läuft sie präziese in Position. Energie lädt die spulen auf, ein ohrenbetäubendes spektakel wenn es nur ein medium geben würde das diesen schall übertragen könnte. Anzeigen füllen sich, rote Bereiche kommen näher, gleichmässiger vortschritt alles wie in einem guten Trainingslauf. Was solls in diesem Theater ist er eh nur der Zuschauer, wenn es ihn jetzt zerschellt wird es ausserhalb seines einflusses sein, vor allem aber sehr schnell gehen. Angeblich so schnell das es nicht mehr rechtzeitig im Speicher ankommt bevor alles vorbei ist. Schwarz, schwarz ist gut, der abschuss ist gelückt, autopilot auf kurs, ab hier ist alles routine.
+
+So jetzt nur noch die Defaults mit der eigenden angepassten Config überschreiben, die Verbindung ist da die Daten sehen gut aus, starte die Übertraung. Erwartungsvoll erwarte ich jede sekunde eine positive Rückmeldung, eine grün posetive wie erwartet hätte was aber so langsam wäre irgendeine Antwort toll. Wenn es schon nicht klappen will dann doch bitte eine Ausagekräftige Fehlerbeschreibung, die es dann zu fixen gilt, wenn es denn was simples ist, etwas das die Situation ... GRÜN ... da war die bestätigung. Verbindung zu den Controlls steht, analyse daten füllen die Dashboard die dunkelheit ist verschwunden. Komisch keine Informationen der anderen drei aus meinem Team, verdammt die daten stehen in einem anderen Protokoll, ein Funkschatten in dieser Sitiuation ist vollkommen normal. Genauer steht es in dem Update das gerade nicht erreichbar ist. Vertrauen wir auf die Automatismen, die Konstuktion hinter mir entfaltet sich im Zielgebiet vollkommen automatisch. Was jetzt knifflig wird ist der Zeitpunkt die Energie zu übertragen damit meine Einheit ausreichend Power zum start hat. Starte ich den übertrag zu früh werden die Speicher durch den Boost am Ende überladen, starte ich zu spät dann werden die Speicher nicht ganz voll werden. 
+
@@ -0,0 +1,47 @@
+#!/usr/bin/bash
+BASEDIR=$(pwd)
+INPUT_DIR="$BASEDIR/input"
+OUTPUT_DIR="$BASEDIR/91_sonnensystem"
+TEMPLATES="$BASEDIR/templates"
+
+chown -R appuser:appgroup "$OUTPUT_DIR"
+
+function convert_adoc() {
+    if [ -f "$1" ]; then
+        echo "-> Konvertiere $1 zu HTML..."
+        asciidoctor -b html5 -a stylesheet=$TEMPLATES/retro-dark.css -a linkcss -a toc=left "$INPUT_DIR/$1" -o "$OUTPUT_DIR/$2"
+    else
+        echo "  [INFO] $1 nicht gefunden, überspringe..."
+    fi
+}
+
+
+echo '--- Baue README ---'
+convert_adoc README.adoc README.html
+
+echo '--- Baue Lore (Master-Dokument) ---'
+LORE_SRC="$INPUT_DIR/index.adoc"
+if [ -f "$INPUT_DIR/master.adoc" ]; then LORE_SRC="$INPUT_DIR/master.adoc"; fi
+
+if [ -f "$LORE_SRC" ]; then
+    echo "-> Generiere Lore-Dokument (HTML & Markdown) aus $LORE_SRC..."
+    asciidoctor -b html5 -d book -a stylesheet=$TEMPLATES/retro-dark.css -a linkcss -a toc=left "$LORE_SRC" -o "$OUTPUT_DIR/lore.html"
+    asciidoctor -b docbook -d book "$LORE_SRC" -o "$OUTPUT_DIR/temp_lore.xml"
+    pandoc -f docbook -t markdown_strict "$OUTPUT_DIR/temp_lore.xml" -o "$OUTPUT_DIR/lore.md"
+    rm "$OUTPUT_DIR/temp_lore.xml"
+else
+    echo "  [WARNUNG] Weder index.adoc noch master.adoc gefunden!"
+fi
+
+echo '--- Baue Fließtexte / Geschichten ---'
+if [ -f "$INPUT_DIR/darkCenter.adoc" ]; then
+    echo "-> Konvertiere darkCenter.adoc zu HTML..."
+    asciidoctor -b html5 -d book -a stylesheet=$TEMPLATES/retro-dark.css -a linkcss -a toc=left "$INPUT_DIR/darkCenter.adoc" -o "$OUTPUT_DIR/darkCenter.html"
+fi
+
+rm -rf ./export
+mkdir "$OUTPUT_DIR/css"
+cp "$TEMPLATES/retro-dark.css" "$OUTPUT_DIR/css/"
+cp "$TEMPLATES/index.html" "$OUTPUT_DIR/"
+sed -i 's/\/workspace\/templates/css/g' "$OUTPUT_DIR/darkCenter.html"
+chown -R appuser:appgroup "$OUTPUT_DIR"
@@ -0,0 +1,16 @@
+FROM debian:stable-slim
+
+RUN apt-get update && apt-get upgrade && apt-get -y install asciidoctor pandoc bash
+
+RUN groupadd --gid 1000 appgroup && \
+    useradd --uid 1000 --gid appgroup --shell /bin/bash --create-home appuser
+
+WORKDIR /workspace
+
+ADD ./90_builder/templates templates
+ADD ./90_builder/bookFold.sh ./
+
+RUN chown -R appuser:appgroup /workspace
+
+
+CMD ["/usr/bin/bash" "./bookFold.sh"]
@@ -0,0 +1,174 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>CORE // MASCHINEN-INSTANZEN_LOG</title>
+  <style>
+    :root {
+      --bg-color: #0d1117;
+      --text-color: #c9d1d9;
+      --link-color: #58a6ff;
+      --accent-color: #ff7b72;
+      --border-color: #30363d;
+      --code-bg: #161b22;
+      --font-main: 'Courier New', Courier, monospace;
+    }
+
+    body {
+      background-color: var(--bg-color);
+      color: var(--text-color);
+      font-family: var(--font-main);
+      max-width: 900px;
+      margin: 0 auto;
+      padding: 2rem;
+    }
+
+    header {
+      border-bottom: 2px solid var(--accent-color);
+      padding-bottom: 1rem;
+      margin-bottom: 2rem;
+    }
+
+    .terminal-title {
+      color: var(--accent-color);
+      font-size: 2em;
+      font-weight: normal;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+      margin: 0;
+    }
+
+    .system-status {
+      font-size: 0.9em;
+      color: #8b949e;
+      margin-top: 0.5rem;
+    }
+
+    .status-blink {
+      color: #7ee787;
+      animation: blink 1.5s infinite;
+    }
+
+    @keyframes blink {
+      0% { opacity: 1; }
+      50% { opacity: 0; }
+      100% { opacity: 1; }
+    }
+
+    .category-block {
+      border: 1px solid var(--border-color);
+      background-color: var(--code-bg);
+      padding: 1.5rem;
+      margin-bottom: 1.5rem;
+      border-radius: 4px;
+    }
+
+    .category-title {
+      color: var(--accent-color);
+      font-size: 1.2em;
+      text-transform: uppercase;
+      margin-top: 0;
+      margin-bottom: 1rem;
+      border-bottom: 1px solid var(--border-color);
+      padding-bottom: 0.3rem;
+    }
+
+    ul {
+      list-style: none;
+      padding: 0;
+      margin: 0;
+    }
+
+    li {
+      margin-bottom: 0.8rem;
+      padding-left: 1.5rem;
+      position: relative;
+    }
+
+    li::before {
+      content: ">>";
+      position: absolute;
+      left: 0;
+      color: var(--accent-color);
+    }
+
+    a {
+      color: var(--link-color);
+      text-decoration: none;
+      font-size: 1.1em;
+    }
+
+    a:hover {
+      text-decoration: underline;
+      color: #79c0ff;
+    }
+
+    .file-meta {
+      font-size: 0.85em;
+      color: #8b949e;
+      display: block;
+      margin-top: 0.2rem;
+    }
+
+    footer {
+      margin-top: 4rem;
+      border-top: 1px solid var(--border-color);
+      padding-top: 1rem;
+      font-size: 0.8em;
+      color: #8b949e;
+      text-align: center;
+    }
+  </style>
+</head>
+<body>
+
+  <header>
+    <h1 class="terminal-title">Maschinen-Instanzen // Datenarchiv</h1>
+    <div class="system-status">
+      STATUS: <span class="status-blink">ONLINE</span> | REPO: UBERSPACE/GITEA | NODE: ACER_SPIN5_CLIENT
+    </div>
+  </header>
+
+  <main>
+    <section class="category-block">
+      <h2 class="category-title">00 // System-Konfiguration</h2>
+      <ul>
+        <li>
+          <a href="README.html">README.html</a>
+          <span class="file-meta">System-Handbuch, Keymaps, Sync-Architektur &amp; Befehle</span>
+        </li>
+      </ul>
+    </section>
+
+    <section class="category-block">
+      <h2 class="category-title">01 // Datenspeicher (Lore-Bibel)</h2>
+      <ul>
+        <li>
+          <a href="lore.html">lore.html</a>
+          <span class="file-meta">Das vollständige Master-Dokument (Kompiliertes Buch-Format)</span>
+        </li>
+        <li>
+          <a href="lore.md">lore.md</a>
+          <span class="file-meta">Rohdaten-Export im Markdown-Format (LLM / Gitea kompatibel)</span>
+        </li>
+      </ul>
+    </section>
+
+    <section class="category-block">
+      <h2 class="category-title">02 // Chroniken &amp; Vektor-Flüge</h2>
+      <ul>
+        <li>
+          <a href="darkCenter.html">darkCenter.html</a>
+          <span class="file-meta">Fließtext / Kurzgeschichte (Kompiliert aus AsciiDoc)</span>
+        </li>
+      </ul>
+    </section>
+  </main>
+
+  <footer>
+    computerHistory $ terminal --session-closed (8 Threads // 8 GB RAM Ok)
+  </footer>
+
+</body>
+</html>
@@ -0,0 +1,69 @@
+:root {
+  --bg-color: #0d1117;
+  --text-color: #c9d1d9;
+  --link-color: #58a6ff;
+  --accent-color: #ff7b72;
+  --border-color: #30363d;
+  --code-bg: #161b22;
+  --font-main: 'Courier New', Courier, monospace;
+}
+
+body {
+  background-color: var(--bg-color);
+  color: var(--text-color);
+  font-family: var(--font-main);
+  line-height: 1.6;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 2rem;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  color: var(--accent-color);
+  border-bottom: 1px solid var(--border-color);
+  padding-bottom: 0.3em;
+  font-weight: normal;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+}
+
+h1 { font-size: 2.5em; border-bottom: 2px solid var(--accent-color); }
+h2 { font-size: 1.5em; }
+
+a { color: var(--link-color); text-decoration: none; }
+a:hover { text-decoration: underline; color: #79c0ff; }
+
+code, kbd, pre {
+  font-family: var(--font-main);
+  background-color: var(--code-bg);
+  color: #a5d6ff;
+  border-radius: 3px;
+}
+code { padding: 0.2em 0.4em; }
+pre { padding: 16px; overflow: auto; border: 1px solid var(--border-color); }
+
+blockquote {
+  border-left: 4px solid var(--accent-color);
+  color: #8b949e;
+  padding: 0 1em;
+  margin-left: 0;
+  font-style: italic;
+}
+
+table {
+  border-collapse: collapse;
+  width: 100%;
+  margin-bottom: 1rem;
+}
+th, td {
+  border: 1px solid var(--border-color);
+  padding: 8px 12px;
+}
+th { background-color: var(--code-bg); color: var(--accent-color); }
+
+hr {
+  height: 1px;
+  background-color: var(--border-color);
+  border: none;
+  margin: 2rem 0;
+}
@@ -1,9 +1,15 @@
 #!/bin/bash

 # Name des lokalen Docker-Images
-IMAGE_NAME="lore-builder"
+IMAGE_NAME="ian-lore-builder"
+# Input Ordner
+INP_DIR=$(pwd)
+# Build Ordner
+# BID_DIR="90_builder"
+# Build templares
+# TEMPLATES="$BID_DIR/templates"
 # Ausgabeordner
-OUT_DIR="export"
+OUT_DIR="$INP_DIR/91_sonnensystem"

 # Farben für Output
 GREEN='\033[0;32m'
@@ -12,318 +18,31 @@ NC='\033[0m' # No Color

 echo -e "${BLUE}=== Starte Master-Build-Prozess (Maschinen-Instanzen) ===${NC}"

-# 1. Output-Verzeichnis erstellen
+# 1. Output-Verzeichnis löschen und erstellen
+rm -rf "$OUT_DIR"
 mkdir -p "$OUT_DIR"
-echo -e "Output-Ordner '${GREEN}$OUT_DIR${NC}' steht bereit."
+echo -e "Output-Ordner '${GREEN}$OUT_DIR${NC}' bereinigt und bereit."

 # 2. Prüfen, ob das Docker-Image existiert, ansonsten on-the-fly bauen
 if [[ "$(docker images -q $IMAGE_NAME 2> /dev/null)" == "" ]]; then
    echo -e "${BLUE}Baue flüchtiges Docker-Image '$IMAGE_NAME' (Alpine, Asciidoctor, Pandoc)...${NC}"
-    docker build -t $IMAGE_NAME - <<EOF
-FROM alpine:latest
-RUN apk add --no-cache asciidoctor pandoc bash
-WORKDIR /workspace
-EOF
+    docker build -t $IMAGE_NAME -f ./90_builder/container/deb_Dockerfile .
 fi

 # 3. CSS Datei für Retro Space Dark Theme in den Export-Ordner generieren
-cat << 'EOF' > "$OUT_DIR/retro-dark.css"
-:root {
-  --bg-color: #0d1117;
-  --text-color: #c9d1d9;
-  --link-color: #58a6ff;
-  --accent-color: #ff7b72;
-  --border-color: #30363d;
-  --code-bg: #161b22;
-  --font-main: 'Courier New', Courier, monospace;
-}
-
-body {
-  background-color: var(--bg-color);
-  color: var(--text-color);
-  font-family: var(--font-main);
-  line-height: 1.6;
-  max-width: 900px;
-  margin: 0 auto;
-  padding: 2rem;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  color: var(--accent-color);
-  border-bottom: 1px solid var(--border-color);
-  padding-bottom: 0.3em;
-  font-weight: normal;
-  text-transform: uppercase;
-  letter-spacing: 1px;
-}
-
-h1 { font-size: 2.5em; border-bottom: 2px solid var(--accent-color); }
-h2 { font-size: 1.5em; }
-
-a { color: var(--link-color); text-decoration: none; }
-a:hover { text-decoration: underline; color: #79c0ff; }
-
-code, kbd, pre {
-  font-family: var(--font-main);
-  background-color: var(--code-bg);
-  color: #a5d6ff;
-  border-radius: 3px;
-}
-code { padding: 0.2em 0.4em; }
-pre { padding: 16px; overflow: auto; border: 1px solid var(--border-color); }
-
-blockquote {
-  border-left: 4px solid var(--accent-color);
-  color: #8b949e;
-  padding: 0 1em;
-  margin-left: 0;
-  font-style: italic;
-}
-
-table {
-  border-collapse: collapse;
-  width: 100%;
-  margin-bottom: 1rem;
-}
-th, td {
-  border: 1px solid var(--border-color);
-  padding: 8px 12px;
-}
-th { background-color: var(--code-bg); color: var(--accent-color); }
-
-hr {
-  height: 1px;
-  background-color: var(--border-color);
-  border: none;
-  margin: 2rem 0;
-}
-EOF
+# move to hard static $BID_OUT/templates/retro-dark.css

 echo -e "${BLUE}Starte Build-Container und generiere Dokumente...${NC}"

 # 4. Container starten und Build-Schritte im Container ausführen
-docker run --rm -v "$(pwd):/workspace" $IMAGE_NAME bash -c "
-    function convert_adoc() {
-        if [ -f \"\$1\" ]; then
-            echo \"-> Konvertiere \$1 zu HTML...\"
-            asciidoctor -b html5 -a stylesheet=retro-dark.css -a linkcss -a toc=left \"\$1\" -o \"$OUT_DIR/\$2\"
-        else
-            echo \"  [INFO] \$1 nicht gefunden, überspringe...\"
-        fi
-    }
-
-    echo '--- Baue README ---'
-    convert_adoc README.adoc README.html
-
-    echo '--- Baue Lore (Master-Dokument) ---'
-    LORE_SRC=\"index.adoc\"
-    if [ -f master.adoc ]; then LORE_SRC=\"master.adoc\"; fi
-
-    if [ -f \"\$LORE_SRC\" ]; then
-        echo \"-> Generiere Lore-Dokument (HTML & Markdown) aus \$LORE_SRC...\"
-        asciidoctor -b html5 -d book -a stylesheet=retro-dark.css -a linkcss -a toc=left \"\$LORE_SRC\" -o \"$OUT_DIR/lore.html\"
-        asciidoctor -b docbook -d book \"\$LORE_SRC\" -o \"$OUT_DIR/temp_lore.xml\"
-        pandoc -f docbook -t markdown_strict \"$OUT_DIR/temp_lore.xml\" -o \"$OUT_DIR/lore.md\"
-        rm \"$OUT_DIR/temp_lore.xml\"
-    else
-        echo \"  [WARNUNG] Weder index.adoc noch master.adoc gefunden!\"
-    fi
-
-    echo '--- Baue Fließtexte / Geschichten ---'
-    if [ -f darkCenter.adoc ]; then
-        echo \"-> Konvertiere darkCenter.adoc zu HTML...\"
-        asciidoctor -b html5 -d book -a stylesheet=retro-dark.css -a linkcss -a toc=left darkCenter.adoc -o \"$OUT_DIR/darkCenter.html\"
-    fi
-    
-    if [ -f masterOfTheWorld-sf.md ]; then
-        echo \"-> Konvertiere masterOfTheWorld-sf.md zu HTML...\"
-        pandoc masterOfTheWorld-sf.md -f markdown -t html -s -c retro-dark.css -o \"$OUT_DIR/masterOfTheWorld-sf.html\"
-    fi
-"
+# docker run --rm -v "$INP_DIR:/workspace" $IMAGE_NAME /workspace/bookFold.sh
+docker run --rm -v "$(pwd):/workspace/input" -v "$(pwd)/91_sonnensystem:/workspace/91_sonnensystem" $IMAGE_NAME 

 # 5. index.html vollautomatisch und direkt generieren
+# moved to $BID_OUT/templates/index.html
+
 echo -e "${BLUE}Generiere taktisches Dashboard ('$OUT_DIR/index.html')...${NC}"

-cat << 'EOF' > "$OUT_DIR/index.html"
-<!DOCTYPE html>
-<html lang="de">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>CORE // MASCHINEN-INSTANZEN_LOG</title>
-  <style>
-    :root {
-      --bg-color: #0d1117;
-      --text-color: #c9d1d9;
-      --link-color: #58a6ff;
-      --accent-color: #ff7b72;
-      --border-color: #30363d;
-      --code-bg: #161b22;
-      --font-main: 'Courier New', Courier, monospace;
-    }
-
-    body {
-      background-color: var(--bg-color);
-      color: var(--text-color);
-      font-family: var(--font-main);
-      max-width: 900px;
-      margin: 0 auto;
-      padding: 2rem;
-    }
-
-    header {
-      border-bottom: 2px solid var(--accent-color);
-      padding-bottom: 1rem;
-      margin-bottom: 2rem;
-    }
-
-    .terminal-title {
-      color: var(--accent-color);
-      font-size: 2em;
-      font-weight: normal;
-      text-transform: uppercase;
-      letter-spacing: 2px;
-      margin: 0;
-    }
-
-    .system-status {
-      font-size: 0.9em;
-      color: #8b949e;
-      margin-top: 0.5rem;
-    }
-
-    .status-blink {
-      color: #7ee787;
-      animation: blink 1.5s infinite;
-    }
-
-    @keyframes blink {
-      0% { opacity: 1; }
-      50% { opacity: 0; }
-      100% { opacity: 1; }
-    }
-
-    .category-block {
-      border: 1px solid var(--border-color);
-      background-color: var(--code-bg);
-      padding: 1.5rem;
-      margin-bottom: 1.5rem;
-      border-radius: 4px;
-    }
-
-    .category-title {
-      color: var(--accent-color);
-      font-size: 1.2em;
-      text-transform: uppercase;
-      margin-top: 0;
-      margin-bottom: 1rem;
-      border-bottom: 1px solid var(--border-color);
-      padding-bottom: 0.3rem;
-    }
-
-    ul {
-      list-style: none;
-      padding: 0;
-      margin: 0;
-    }
-
-    li {
-      margin-bottom: 0.8rem;
-      padding-left: 1.5rem;
-      position: relative;
-    }
-
-    li::before {
-      content: ">>";
-      position: absolute;
-      left: 0;
-      color: var(--accent-color);
-    }
-
-    a {
-      color: var(--link-color);
-      text-decoration: none;
-      font-size: 1.1em;
-    }
-
-    a:hover {
-      text-decoration: underline;
-      color: #79c0ff;
-    }
-
-    .file-meta {
-      font-size: 0.85em;
-      color: #8b949e;
-      display: block;
-      margin-top: 0.2rem;
-    }
-
-    footer {
-      margin-top: 4rem;
-      border-top: 1px solid var(--border-color);
-      padding-top: 1rem;
-      font-size: 0.8em;
-      color: #8b949e;
-      text-align: center;
-    }
-  </style>
-</head>
-<body>
-
-  <header>
-    <h1 class="terminal-title">Maschinen-Instanzen // Datenarchiv</h1>
-    <div class="system-status">
-      STATUS: <span class="status-blink">ONLINE</span> | REPO: UBERSPACE/GITEA | NODE: ACER_SPIN5_CLIENT
-    </div>
-  </header>
-
-  <main>
-    <section class="category-block">
-      <h2 class="category-title">00 // System-Konfiguration</h2>
-      <ul>
-        <li>
-          <a href="README.html">README.html</a>
-          <span class="file-meta">System-Handbuch, Keymaps, Sync-Architektur &amp; Befehle</span>
-        </li>
-      </ul>
-    </section>
-
-    <section class="category-block">
-      <h2 class="category-title">01 // Datenspeicher (Lore-Bibel)</h2>
-      <ul>
-        <li>
-          <a href="lore.html">lore.html</a>
-          <span class="file-meta">Das vollständige Master-Dokument (Kompiliertes Buch-Format)</span>
-        </li>
-        <li>
-          <a href="lore.md">lore.md</a>
-          <span class="file-meta">Rohdaten-Export im Markdown-Format (LLM / Gitea kompatibel)</span>
-        </li>
-      </ul>
-    </section>
-
-    <section class="category-block">
-      <h2 class="category-title">02 // Chroniken &amp; Vektor-Flüge</h2>
-      <ul>
-        <li>
-          <a href="darkCenter.html">darkCenter.html</a>
-          <span class="file-meta">Fließtext / Kurzgeschichte (Kompiliert aus AsciiDoc)</span>
-        </li>
-        <li>
-          <a href="masterOfTheWorld-sf.html">masterOfTheWorld-sf.html</a>
-          <span class="file-meta">Fließtext / Kurzgeschichte (Konvertiert aus Markdown)</span>
-        </li>
-      </ul>
-    </section>
-  </main>
-
-  <footer>
-    computerHistory $ terminal --session-closed (8 Threads // 8 GB RAM Ok)
-  </footer>
-
-</body>
-</html>
-EOF

 echo -e "${GREEN}=== Build erfolgreich! ===${NC}"
 echo "Alle Dokumente (inkl. Dashboard) liegen im Ordner './$OUT_DIR' bereit."
Author	SHA1	Message	Date
dextatc	cfa5985f44	close but not there yet	2026-07-20 19:44:35 +02:00
dextatc	a6abe939e8	another media expolre digital content snippet idear	2026-07-20 08:36:20 +02:00
mash	ad18d79c18	it build trash switch to bigpc	2026-07-19 13:25:41 +02:00
mash	ac15ba2130	start builder maker	2026-07-19 12:56:21 +02:00
mash	e9888acf7e	fix css in build	2026-07-19 12:37:36 +02:00
dexta.de	6a85879f66	ein absatz glaube ich	2026-07-17 22:14:29 +02:00
dextatc	b84985a970	for export in html and co adoc	2026-07-17 12:13:48 +02:00
dextatc	aa4b725813	bloat the doc	2026-07-17 12:10:02 +02:00
dextatc	a9283e32a2	markdown is king, find a way around it	2026-07-17 12:01:00 +02:00
dexta.de	310ea81d42	two block good night	2026-07-16 22:21:08 +02:00
dexta.de	c4c41c00ef	Merge branch 'prod' into sonnensystem	2026-07-16 20:36:36 +02:00
dexta.de	8afe00ebe7	young boy	2026-07-16 20:35:45 +02:00
dextatc	c9c80f3c52	meta: start game coperate ident	2026-07-16 19:42:44 +02:00