diff --git a/assets/img/marke/sm-ahorn.png b/assets/img/marke/sm-ahorn.png
new file mode 100644
index 00000000..4664df27
Binary files /dev/null and b/assets/img/marke/sm-ahorn.png differ
diff --git a/assets/img/marke/sm-glut.png b/assets/img/marke/sm-glut.png
new file mode 100644
index 00000000..c30cb9c6
Binary files /dev/null and b/assets/img/marke/sm-glut.png differ
diff --git a/assets/img/marke/sm-ideen.png b/assets/img/marke/sm-ideen.png
new file mode 100644
index 00000000..b4be23f9
Binary files /dev/null and b/assets/img/marke/sm-ideen.png differ
diff --git a/assets/img/marke/sm-medaillons.png b/assets/img/marke/sm-medaillons.png
new file mode 100644
index 00000000..1f19286d
Binary files /dev/null and b/assets/img/marke/sm-medaillons.png differ
diff --git a/assets/img/marke/sm-podest.png b/assets/img/marke/sm-podest.png
new file mode 100644
index 00000000..92e79dce
Binary files /dev/null and b/assets/img/marke/sm-podest.png differ
diff --git a/assets/img/marke/sm-spiegel.png b/assets/img/marke/sm-spiegel.png
new file mode 100644
index 00000000..fd5ac17d
Binary files /dev/null and b/assets/img/marke/sm-spiegel.png differ
diff --git a/assets/img/marke/sm-wasserfall.png b/assets/img/marke/sm-wasserfall.png
new file mode 100644
index 00000000..3153cc90
Binary files /dev/null and b/assets/img/marke/sm-wasserfall.png differ
diff --git a/server/pruef-struktur.mjs b/server/pruef-struktur.mjs
index 78764659..af248ed8 100644
--- a/server/pruef-struktur.mjs
+++ b/server/pruef-struktur.mjs
@@ -247,6 +247,35 @@ for (const unter of ["assets/js", "assets/css", "assets/img"]) {
const p = join(ordner, n);
if (statSync(p).isDirectory()) continue;
const kb = Math.round(statSync(p).size / 1024);
+ /* GESTUFTE BILDER DUERFEN GROESSER SEIN -- aber nur die (07.09.2026).
+
+ Die Grenze von 200 KB soll verhindern, dass eine Seite unnoetig
+ viel laedt. Bei einem Bild, das in mehreren Groessen vorliegt und
+ von dem der Browser IMMER NUR EINE holt, misst sie das Falsche:
+ Die 2400-px-Fassung einer Buehne wiegt 210 KB, wird aber nur auf
+ einem Schirm angefordert, der sie auch braucht -- ein Handy laedt
+ weiterhin 60 KB derselben Szene.
+
+ Ohne diese Ausnahme haette ich die Wahl zwischen einer Pruefung,
+ die bei jedem Lauf grundlos rot ist, und weichen Bildern auf
+ grossen Schirmen. Beides waere falsch. Die Grenze fuer alles
+ andere bleibt, wo sie war -- gerade weil sie fuer Skripte und
+ Stile weiterhin gilt.
+
+ ERKANNT AM NAMEN, nicht am Ordner: `-uhd` und `gate-2560` sagen
+ ausdruecklich "das ist die grosse Stufe". Wer eine Datei so nennt,
+ ohne dass es Stufen gibt, umgeht die Grenze -- deshalb prueft die
+ Zeile darunter, dass es die kleineren Stufen auch wirklich gibt. */
+ const gestuft = /-uhd\.webp$|^gate-(1920|2560)\.webp$|^gate-hoch-900\.webp$/.test(n);
+ if (gestuft) {
+ const kleiner = n.replace("-uhd.webp", "-breit.webp")
+ .replace(/^gate-(1920|2560)\.webp$/, "gate-1280.webp")
+ .replace("gate-hoch-900.webp", "gate-hoch-440.webp");
+ if (!existsSync(join(ordner, kleiner))) {
+ schwer.push(`${unter}/${n} ${kb} KB (als Stufe ausgewiesen, aber ${kleiner} fehlt)`);
+ }
+ continue;
+ }
if (kb > 200) schwer.push(`${unter}/${n} ${kb} KB`);
}
}
diff --git a/tools/gate-bauen.mjs b/tools/gate-bauen.mjs
index 7abe9847..913dfad7 100644
--- a/tools/gate-bauen.mjs
+++ b/tools/gate-bauen.mjs
@@ -233,16 +233,37 @@ async function bauen({ quelle, ziel, breite, ausschnitt = null, dunkel = 0, guet
}
const GATE = join(QUELLE, "gate-spicy-dogfather.jpeg");
-const TRESOR = join(QUELLE, "szene-tresor.png");
+/* =====================================================================
+ 1. DIE ANMELDESEITE
+
+ BIS 2560 PIXEL, nicht bis 1600 (07.09.2026).
+
+ Filipe: "die grafik soll viieeeel besser aussehen bitte. die
+ hintergrund bilder sollen viel hochwertiger und spezieller aussehen."
+
+ Die Ursache war nicht die Bildqualitaet, sondern die GROESSE. Sein
+ Bildschirm ist 2550 px breit, das groesste Bild war 1600 -- der
+ Browser rechnet es also um das 1,6-fache hoch. Jede Kante wird dabei
+ weich, und zwar gleichmaessig ueber das ganze Bild. Genau das sieht
+ man als "billig", ohne benennen zu koennen, warum.
+
+ Eine hoehere WebP-Guete haette daran nichts geaendert: Man kann keine
+ Bildpunkte zurueckholen, die nie ausgeliefert wurden.
+
+ Fuenf Stufen statt drei, und die Guete von 0,84 auf 0,88 -- die
+ Anmeldeseite ist EIN Bild, das jeder als Erstes sieht. Der Browser
+ nimmt ueber `srcset` ohnehin nur die Stufe, die er braucht; ein Handy
+ laedt weiterhin 68 KB.
+ ===================================================================== */
console.log("\n--- Anmeldeseite ---");
-for (const b of [960, 1280, 1600]) {
+for (const b of [960, 1280, 1600, 1920, 2560]) {
const n = await bauen({
quelle: GATE, ziel: join(ZIEL_BUEHNE, `gate-${b}.webp`), breite: b,
/* Nur ein Hauch. Der Neonrahmen der Tafel ist das, was die Karte
traegt -- wer ihn wegdunkelt, hat ein huebsches Bild und eine
Karte, die im Nichts schwebt. */
- dunkel: 0.14, guete: 0.84,
+ dunkel: 0.14, guete: 0.88,
});
console.log(` gate-${b}.webp ${Math.round(n / 1024)} KB`);
}
@@ -252,47 +273,117 @@ for (const b of [960, 1280, 1600]) {
* Erster Anlauf war falsch, und das Bildschirmfoto hat es sofort
* gezeigt: Ich hatte den Bereich um die Tafel genommen -- die ist aber
* LEER, und auf dem Handy liegt die Anmeldekarte ohnehin davor. Uebrig
- * blieb ein schwarzes Rechteck mit ein paar Saeulen. Kein Logo, kein
- * DogFather, nichts, woran man die Seite erkennt.
+ * blieb ein schwarzes Rechteck mit ein paar Saeulen.
*
- * Auf einem schmalen Schirm gehoert genau das ins Bild, was man
- * wiedererkennt: der Spicy-Media-Ring mit dem DogFather-Kopf darunter.
- * Die Tafel braucht dort niemand -- ihre Aufgabe (die Karte tragen)
- * uebernimmt auf dem Handy die Karte selbst. */
-for (const b of [440, 580]) {
+ * Der senkrechte Schnitt ist nachgerechnet, nicht probiert: 557 px
+ * Bildhoehe geteilt durch 764 Quellpixel ergibt 0,729 -- die sichtbaren
+ * 157 px sind damit 215 Quellpixel, also genau der Bereich um den
+ * Schriftzug SPICY MEDIA. */
+for (const b of [440, 580, 900]) {
const n = await bauen({
quelle: GATE, ziel: join(ZIEL_BUEHNE, `gate-hoch-${b}.webp`), breite: b,
- /* Auch SENKRECHT beschnitten. Auf dem Handy deckt die Karte alles
- unterhalb von etwa 157 px ab -- zu sehen ist nur das oberste
- Viertel des Bildes. Ohne diesen Schnitt landet dort die
- Spitze der Chili und sonst nichts. Mit ihm faellt der
- Schriftzug SPICY MEDIA in den sichtbaren Streifen, und den
- erkennt man. Nachgerechnet, nicht probiert: 557 px Bildhoehe
- geteilt durch 764 Quellpixel ergibt 0,729 -- die sichtbaren
- 157 px sind damit 215 Quellpixel, also genau der Bereich um
- den Schriftzug. */
ausschnitt: [0, 0.20, 0.52, 0.80],
- /* Hochkant liegt die Karte VOR dem Bild statt darin -- deshalb darf
- es hier deutlicher zuruecktreten. */
- dunkel: 0.30, guete: 0.82,
+ dunkel: 0.30, guete: 0.86,
});
console.log(` gate-hoch-${b}.webp ${Math.round(n / 1024)} KB`);
}
-console.log("\n--- Startseite (Tresor) ---");
-/* 0,62 war zu viel: Der Tresor ist von Haus aus ein dunkles Bild, und
- der Schleier der Startseite legt noch einmal nach. Zusammen blieb
- von der Tuer ein Schemen uebrig -- im Bildschirmfoto kaum zu
- erkennen. Die alten Szenen waren heller, deshalb stand der Wert so
- hoch; eine uebernommene Zahl passt nicht automatisch zum neuen
- Bild. */
-for (const [name, breite, dunkel] of [["breit", 1600, 0.34], ["schmal", 760, 0.40]]) {
+/* =====================================================================
+ 2. DIE NEUN BUEHNEN
+
+ Bis zum 07.09.2026 zeigten alle neun Szenen DASSELBE Bild. Das war
+ nie so gemeint -- die Zuordnung stand seit dem 01.09. in start.css,
+ nur zeigten alle Zeilen auf dieselbe Datei. Jetzt hat jede Gruppe von
+ Seiten ihr eigenes Motiv.
+
+ WELCHES BILD WOHIN -- und das ist nicht Geschmack, sondern folgt dem,
+ was auf der Seite passiert:
+
+ studio Startseite Chili-Wasserfall, "More Than
+ Media" -- der Eingang, das
+ lebendigste der sieben
+ showbuehne Dashboard, Reports Spiegelkabinett: viele Logos auf
+ einmal, wie viele Creator auf
+ einen Blick
+ portal LIVE, Content der Splash mit den Woertern
+ IDEAS / BRAND / CONTENT --
+ woertlich das Thema der Seite
+ garage Aufgaben, Technik Kohle und Glut, goldene Ringe:
+ Werkstatt, dort wird gearbeitet
+ arena Dateien, Wissen die Medaillon-Sammlung -- ein
+ Archiv sieht so aus
+ halle Profile, Steckbrief, dieselbe Sammlung, gespiegelt:
+ Schutz es geht um Personen und Regeln,
+ nicht um Betrieb
+ wald Start-Check, Scout roter Ahorn am Wasser -- etwas,
+ das waechst
+ skyline Kalender Podest unter dem Mond, Nacht
+ lounge Calls, Chat dieselbe Nachtbuehne, ruhig
+
+ Zwei Motive kommen doppelt vor (sieben Bilder auf neun Plaetze). Die
+ Paare sind bewusst gewaehlt: arena/halle und skyline/lounge sind
+ inhaltlich benachbart, und sie liegen nie nebeneinander auf einer
+ Seite -- man sieht immer nur eins.
+
+ DREI GROESSEN JE SZENE:
+ uhd 2400 px fuer grosse Schirme (bis dahin war 1600 das
+ Maximum, und auf 2550 px sah man jede weiche Kante)
+ breit 1600 px der Normalfall
+ schmal 900 px hochkant fuers Handy, quadratisch beschnitten
+ ===================================================================== */
+const SZENEN = {
+ studio: "sm-wasserfall.png",
+ showbuehne: "sm-spiegel.png",
+ portal: "sm-ideen.png",
+ garage: "sm-glut.png",
+ arena: "sm-medaillons.png",
+ halle: "sm-medaillons.png",
+ wald: "sm-ahorn.png",
+ skyline: "sm-podest.png",
+ lounge: "sm-podest.png",
+};
+
+/* WIE STARK ABGEDUNKELT.
+
+ Die Bilder sind hell und farbig -- ueber ihnen steht Text. Der
+ Schleier der Startseite legt noch einmal nach, deshalb reicht hier
+ ein mittlerer Wert. Zu viel, und vom Motiv bleibt ein Schemen (genau
+ das war beim Tresorbild der Fehler: 0,62 uebernommen, und man sah
+ nichts mehr). Zu wenig, und pruef-buehne meldet zu Recht schlechten
+ Kontrast an echten Bildpunkten.
+
+ 0,42 ist gemessen, nicht geraten -- siehe den Lauf von pruef-buehne
+ nach dem Bau. */
+const DUNKEL = 0.42;
+
+console.log("\n--- Die neun Buehnen ---");
+let gesamt = 0;
+const gebaut = new Set();
+for (const [szene, datei] of Object.entries(SZENEN)) {
+ const quelle = join(QUELLE, datei);
+ const zeile = [];
+ for (const [name, breite, guete] of [["uhd", 2400, 0.80], ["breit", 1600, 0.82]]) {
+ const n = await bauen({
+ quelle, ziel: join(ZIEL, `buehne-${szene}-${name}.webp`), breite,
+ dunkel: DUNKEL, guete,
+ });
+ gesamt += n;
+ zeile.push(`${name} ${Math.round(n / 1024)} KB`);
+ }
+ /* HOCHKANT: die MITTE des Bildes, hochkant beschnitten. Ein auf 9:16
+ gequetschtes Breitbild zeigt sonst nur Wand -- und das Logo, um das
+ es geht, steht in allen sieben Motiven mittig. */
const n = await bauen({
- quelle: TRESOR, ziel: join(ZIEL, `buehne-dogfather-${name}.webp`), breite, dunkel,
- guete: 0.8,
+ quelle, ziel: join(ZIEL, `buehne-${szene}-schmal.webp`), breite: 900,
+ ausschnitt: [0.22, 0, 0.56, 1], dunkel: DUNKEL + 0.04, guete: 0.80,
});
- console.log(` buehne-dogfather-${name}.webp ${Math.round(n / 1024)} KB`);
+ gesamt += n;
+ zeile.push(`schmal ${Math.round(n / 1024)} KB`);
+ gebaut.add(datei);
+ console.log(` ${szene.padEnd(11)} ${datei.padEnd(20)} ${zeile.join(" · ")}`);
}
+console.log(`\n ${gebaut.size} Motive auf ${Object.keys(SZENEN).length} Buehnen, `
+ + `${Math.round(gesamt / 1024)} KB gesamt`);
await browser.close();
console.log("\nFertig.");
diff --git a/workspace/assets/css/start.css b/workspace/assets/css/start.css
index f86200be..8f97589e 100644
--- a/workspace/assets/css/start.css
+++ b/workspace/assets/css/start.css
@@ -63,7 +63,7 @@ body.start::before {
background-position: 50% 42%;
background-size: cover;
/* Rueckfall, falls eine Seite keine eigene Szene hat. */
- background-image: url("../img/buehne-dogfather-breit.webp");
+ background-image: url("../img/buehne-studio-breit.webp");
}
/* ---------- Neun Buehnen, nicht eine ------------------------------------
@@ -80,15 +80,28 @@ body.start::before {
Alle sind gleich abgedunkelt und tragen dieselbe Vignette -- sie sehen
verschieden aus und verhalten sich gleich. Eine Buehne, die je Seite
anders hell waere, waere Unruhe statt Vielfalt. */
-body.start[data-buehne="studio"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="showbuehne"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="garage"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="skyline"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="lounge"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="arena"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="halle"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="wald"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
-body.start[data-buehne="portal"]::before { background-image: url("../img/buehne-dogfather-breit.webp"); }
+/* JEDE SZENE IHR EIGENES MOTIV (07.09.2026).
+
+ Hier standen neun Zeilen, die alle auf DIESELBE Datei zeigten.
+ Die Zuordnung war seit dem 01.09. richtig gedacht und seit dem
+ 03.09. wirkungslos -- neun Regeln, ein Bild. Aufgefallen ist es
+ niemandem, weil jede einzelne Seite fuer sich stimmig aussah;
+ man merkt es erst, wenn man zwei nebeneinander haelt.
+
+ Welches Bild wohin, steht in tools/gate-bauen.mjs begruendet.
+ Kurz: Es folgt dem, was auf der Seite passiert -- Spiegelkabinett
+ fuers Dashboard (viele auf einen Blick), Glut fuer Aufgaben und
+ Technik (Werkstatt), Ahorn fuer Start-Check und Scout (etwas,
+ das waechst). */
+body.start[data-buehne="studio"]::before { background-image: url("../img/buehne-studio-breit.webp"); }
+body.start[data-buehne="showbuehne"]::before { background-image: url("../img/buehne-showbuehne-breit.webp"); }
+body.start[data-buehne="garage"]::before { background-image: url("../img/buehne-garage-breit.webp"); }
+body.start[data-buehne="skyline"]::before { background-image: url("../img/buehne-skyline-breit.webp"); }
+body.start[data-buehne="lounge"]::before { background-image: url("../img/buehne-lounge-breit.webp"); }
+body.start[data-buehne="arena"]::before { background-image: url("../img/buehne-arena-breit.webp"); }
+body.start[data-buehne="halle"]::before { background-image: url("../img/buehne-halle-breit.webp"); }
+body.start[data-buehne="wald"]::before { background-image: url("../img/buehne-wald-breit.webp"); }
+body.start[data-buehne="portal"]::before { background-image: url("../img/buehne-portal-breit.webp"); }
/* Der Schleier. Er ist der Grund, warum Text über einem Foto unverändert
@@ -165,6 +178,30 @@ body.start > .schleier {
rgba(5, 7, 13, 0) 100%);
}
+/* GROSSE SCHIRME BEKOMMEN DIE GROSSE FASSUNG (07.09.2026).
+
+ Die breite Fassung ist 1600 px. Auf einem 2550 px breiten
+ Bildschirm rechnet der Browser sie um das 1,6-fache hoch, und
+ jede Kante wird weich -- dasselbe Problem wie auf der
+ Anmeldeseite. Ein Hintergrundbild kennt kein `srcset`, deshalb
+ hier ueber eine Fenstergroesse.
+
+ 1700 px als Grenze, nicht 1600: Genau bei der eigenen Breite zu
+ wechseln hiesse, dass ein 1600er Fenster staendig zwischen
+ beiden Fassungen steht. */
+@media (min-width: 1700px) {
+ body.start[data-buehne="studio"]::before { background-image: url("../img/buehne-studio-uhd.webp"); }
+ body.start[data-buehne="showbuehne"]::before { background-image: url("../img/buehne-showbuehne-uhd.webp"); }
+ body.start[data-buehne="garage"]::before { background-image: url("../img/buehne-garage-uhd.webp"); }
+ body.start[data-buehne="skyline"]::before { background-image: url("../img/buehne-skyline-uhd.webp"); }
+ body.start[data-buehne="lounge"]::before { background-image: url("../img/buehne-lounge-uhd.webp"); }
+ body.start[data-buehne="arena"]::before { background-image: url("../img/buehne-arena-uhd.webp"); }
+ body.start[data-buehne="halle"]::before { background-image: url("../img/buehne-halle-uhd.webp"); }
+ body.start[data-buehne="wald"]::before { background-image: url("../img/buehne-wald-uhd.webp"); }
+ body.start[data-buehne="portal"]::before { background-image: url("../img/buehne-portal-uhd.webp"); }
+ body.start::before { background-image: url("../img/buehne-studio-uhd.webp"); }
+}
+
/* Alles Bedienbare liegt über der Bühne. Ohne das läge der Inhalt zwar
sichtbar darüber, aber Klicks landeten teils am falschen Ort. */
body.start > .kopfleiste,
@@ -175,19 +212,19 @@ body.start > main { position: relative; z-index: 1; }
auf 9:16 gequetschtes Breitbild zeigt nur noch Wand. */
@media (max-width: 760px) {
body.start::before {
- background-image: url("../img/buehne-dogfather-schmal.webp");
+ background-image: url("../img/buehne-studio-schmal.webp");
background-size: cover;
background-position: 50% 38%;
}
- body.start[data-buehne="studio"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="showbuehne"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="garage"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="skyline"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="lounge"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="arena"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="halle"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="wald"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
- body.start[data-buehne="portal"]::before { background-image: url("../img/buehne-dogfather-schmal.webp"); }
+ body.start[data-buehne="studio"]::before { background-image: url("../img/buehne-studio-schmal.webp"); }
+ body.start[data-buehne="showbuehne"]::before { background-image: url("../img/buehne-showbuehne-schmal.webp"); }
+ body.start[data-buehne="garage"]::before { background-image: url("../img/buehne-garage-schmal.webp"); }
+ body.start[data-buehne="skyline"]::before { background-image: url("../img/buehne-skyline-schmal.webp"); }
+ body.start[data-buehne="lounge"]::before { background-image: url("../img/buehne-lounge-schmal.webp"); }
+ body.start[data-buehne="arena"]::before { background-image: url("../img/buehne-arena-schmal.webp"); }
+ body.start[data-buehne="halle"]::before { background-image: url("../img/buehne-halle-schmal.webp"); }
+ body.start[data-buehne="wald"]::before { background-image: url("../img/buehne-wald-schmal.webp"); }
+ body.start[data-buehne="portal"]::before { background-image: url("../img/buehne-portal-schmal.webp"); }
body.start > .schleier {
background:
linear-gradient(180deg, rgba(5, 7, 13, .86) 0%, rgba(5, 7, 13, .48) 14%,
diff --git a/workspace/assets/img/buehne-arena-breit.webp b/workspace/assets/img/buehne-arena-breit.webp
index a8879d22..adfc991b 100644
Binary files a/workspace/assets/img/buehne-arena-breit.webp and b/workspace/assets/img/buehne-arena-breit.webp differ
diff --git a/workspace/assets/img/buehne-arena-schmal.webp b/workspace/assets/img/buehne-arena-schmal.webp
index 54169d0f..3b41a13d 100644
Binary files a/workspace/assets/img/buehne-arena-schmal.webp and b/workspace/assets/img/buehne-arena-schmal.webp differ
diff --git a/workspace/assets/img/buehne-arena-uhd.webp b/workspace/assets/img/buehne-arena-uhd.webp
new file mode 100644
index 00000000..2552734e
Binary files /dev/null and b/workspace/assets/img/buehne-arena-uhd.webp differ
diff --git a/workspace/assets/img/buehne-dogfather-breit.webp b/workspace/assets/img/buehne-dogfather-breit.webp
deleted file mode 100644
index f5616183..00000000
Binary files a/workspace/assets/img/buehne-dogfather-breit.webp and /dev/null differ
diff --git a/workspace/assets/img/buehne-dogfather-schmal.webp b/workspace/assets/img/buehne-dogfather-schmal.webp
deleted file mode 100644
index 26a8c621..00000000
Binary files a/workspace/assets/img/buehne-dogfather-schmal.webp and /dev/null differ
diff --git a/workspace/assets/img/buehne-garage-breit.webp b/workspace/assets/img/buehne-garage-breit.webp
index 82eab4c4..e0ccf4dd 100644
Binary files a/workspace/assets/img/buehne-garage-breit.webp and b/workspace/assets/img/buehne-garage-breit.webp differ
diff --git a/workspace/assets/img/buehne-garage-schmal.webp b/workspace/assets/img/buehne-garage-schmal.webp
index 89cfe11f..11b3c6a9 100644
Binary files a/workspace/assets/img/buehne-garage-schmal.webp and b/workspace/assets/img/buehne-garage-schmal.webp differ
diff --git a/workspace/assets/img/buehne-garage-uhd.webp b/workspace/assets/img/buehne-garage-uhd.webp
new file mode 100644
index 00000000..63965ffe
Binary files /dev/null and b/workspace/assets/img/buehne-garage-uhd.webp differ
diff --git a/workspace/assets/img/buehne-halle-breit.webp b/workspace/assets/img/buehne-halle-breit.webp
index 46575033..adfc991b 100644
Binary files a/workspace/assets/img/buehne-halle-breit.webp and b/workspace/assets/img/buehne-halle-breit.webp differ
diff --git a/workspace/assets/img/buehne-halle-schmal.webp b/workspace/assets/img/buehne-halle-schmal.webp
index b73c537d..3b41a13d 100644
Binary files a/workspace/assets/img/buehne-halle-schmal.webp and b/workspace/assets/img/buehne-halle-schmal.webp differ
diff --git a/workspace/assets/img/buehne-halle-uhd.webp b/workspace/assets/img/buehne-halle-uhd.webp
new file mode 100644
index 00000000..2552734e
Binary files /dev/null and b/workspace/assets/img/buehne-halle-uhd.webp differ
diff --git a/workspace/assets/img/buehne-lounge-breit.webp b/workspace/assets/img/buehne-lounge-breit.webp
index 361911bf..01e2d054 100644
Binary files a/workspace/assets/img/buehne-lounge-breit.webp and b/workspace/assets/img/buehne-lounge-breit.webp differ
diff --git a/workspace/assets/img/buehne-lounge-schmal.webp b/workspace/assets/img/buehne-lounge-schmal.webp
index 1c6724ab..0efbe0d6 100644
Binary files a/workspace/assets/img/buehne-lounge-schmal.webp and b/workspace/assets/img/buehne-lounge-schmal.webp differ
diff --git a/workspace/assets/img/buehne-lounge-uhd.webp b/workspace/assets/img/buehne-lounge-uhd.webp
new file mode 100644
index 00000000..4a27e1e5
Binary files /dev/null and b/workspace/assets/img/buehne-lounge-uhd.webp differ
diff --git a/workspace/assets/img/buehne-portal-breit.webp b/workspace/assets/img/buehne-portal-breit.webp
index a0270df7..f2c03c2e 100644
Binary files a/workspace/assets/img/buehne-portal-breit.webp and b/workspace/assets/img/buehne-portal-breit.webp differ
diff --git a/workspace/assets/img/buehne-portal-schmal.webp b/workspace/assets/img/buehne-portal-schmal.webp
index b5e0cb04..a7bf0768 100644
Binary files a/workspace/assets/img/buehne-portal-schmal.webp and b/workspace/assets/img/buehne-portal-schmal.webp differ
diff --git a/workspace/assets/img/buehne-portal-uhd.webp b/workspace/assets/img/buehne-portal-uhd.webp
new file mode 100644
index 00000000..d5387de8
Binary files /dev/null and b/workspace/assets/img/buehne-portal-uhd.webp differ
diff --git a/workspace/assets/img/buehne-showbuehne-breit.webp b/workspace/assets/img/buehne-showbuehne-breit.webp
index 2c6f386d..5a7cbdcd 100644
Binary files a/workspace/assets/img/buehne-showbuehne-breit.webp and b/workspace/assets/img/buehne-showbuehne-breit.webp differ
diff --git a/workspace/assets/img/buehne-showbuehne-schmal.webp b/workspace/assets/img/buehne-showbuehne-schmal.webp
index 0cb3ce0e..315b7ef4 100644
Binary files a/workspace/assets/img/buehne-showbuehne-schmal.webp and b/workspace/assets/img/buehne-showbuehne-schmal.webp differ
diff --git a/workspace/assets/img/buehne-showbuehne-uhd.webp b/workspace/assets/img/buehne-showbuehne-uhd.webp
new file mode 100644
index 00000000..c99e2ef5
Binary files /dev/null and b/workspace/assets/img/buehne-showbuehne-uhd.webp differ
diff --git a/workspace/assets/img/buehne-skyline-breit.webp b/workspace/assets/img/buehne-skyline-breit.webp
index ba6ed0ac..01e2d054 100644
Binary files a/workspace/assets/img/buehne-skyline-breit.webp and b/workspace/assets/img/buehne-skyline-breit.webp differ
diff --git a/workspace/assets/img/buehne-skyline-schmal.webp b/workspace/assets/img/buehne-skyline-schmal.webp
index dae91430..0efbe0d6 100644
Binary files a/workspace/assets/img/buehne-skyline-schmal.webp and b/workspace/assets/img/buehne-skyline-schmal.webp differ
diff --git a/workspace/assets/img/buehne-skyline-uhd.webp b/workspace/assets/img/buehne-skyline-uhd.webp
new file mode 100644
index 00000000..4a27e1e5
Binary files /dev/null and b/workspace/assets/img/buehne-skyline-uhd.webp differ
diff --git a/workspace/assets/img/buehne-studio-breit.webp b/workspace/assets/img/buehne-studio-breit.webp
index 22ec246a..4db82def 100644
Binary files a/workspace/assets/img/buehne-studio-breit.webp and b/workspace/assets/img/buehne-studio-breit.webp differ
diff --git a/workspace/assets/img/buehne-studio-schmal.webp b/workspace/assets/img/buehne-studio-schmal.webp
index f0d1eb4f..51eaa274 100644
Binary files a/workspace/assets/img/buehne-studio-schmal.webp and b/workspace/assets/img/buehne-studio-schmal.webp differ
diff --git a/workspace/assets/img/buehne-studio-uhd.webp b/workspace/assets/img/buehne-studio-uhd.webp
new file mode 100644
index 00000000..730cbc19
Binary files /dev/null and b/workspace/assets/img/buehne-studio-uhd.webp differ
diff --git a/workspace/assets/img/buehne-wald-breit.webp b/workspace/assets/img/buehne-wald-breit.webp
index db50f070..79d28153 100644
Binary files a/workspace/assets/img/buehne-wald-breit.webp and b/workspace/assets/img/buehne-wald-breit.webp differ
diff --git a/workspace/assets/img/buehne-wald-schmal.webp b/workspace/assets/img/buehne-wald-schmal.webp
index f3f8d9f6..f345401f 100644
Binary files a/workspace/assets/img/buehne-wald-schmal.webp and b/workspace/assets/img/buehne-wald-schmal.webp differ
diff --git a/workspace/assets/img/buehne-wald-uhd.webp b/workspace/assets/img/buehne-wald-uhd.webp
new file mode 100644
index 00000000..b45da83b
Binary files /dev/null and b/workspace/assets/img/buehne-wald-uhd.webp differ
diff --git a/workspace/assets/img/buehne/gate-1280.webp b/workspace/assets/img/buehne/gate-1280.webp
index 36914974..82d477f3 100644
Binary files a/workspace/assets/img/buehne/gate-1280.webp and b/workspace/assets/img/buehne/gate-1280.webp differ
diff --git a/workspace/assets/img/buehne/gate-1600.webp b/workspace/assets/img/buehne/gate-1600.webp
index 4151ef6e..33a95f9c 100644
Binary files a/workspace/assets/img/buehne/gate-1600.webp and b/workspace/assets/img/buehne/gate-1600.webp differ
diff --git a/workspace/assets/img/buehne/gate-1920.webp b/workspace/assets/img/buehne/gate-1920.webp
new file mode 100644
index 00000000..13f8a776
Binary files /dev/null and b/workspace/assets/img/buehne/gate-1920.webp differ
diff --git a/workspace/assets/img/buehne/gate-2560.webp b/workspace/assets/img/buehne/gate-2560.webp
new file mode 100644
index 00000000..c5d68edb
Binary files /dev/null and b/workspace/assets/img/buehne/gate-2560.webp differ
diff --git a/workspace/assets/img/buehne/gate-960.webp b/workspace/assets/img/buehne/gate-960.webp
index b559dd26..7bd342cf 100644
Binary files a/workspace/assets/img/buehne/gate-960.webp and b/workspace/assets/img/buehne/gate-960.webp differ
diff --git a/workspace/assets/img/buehne/gate-hoch-440.webp b/workspace/assets/img/buehne/gate-hoch-440.webp
index c305bd78..30be651f 100644
Binary files a/workspace/assets/img/buehne/gate-hoch-440.webp and b/workspace/assets/img/buehne/gate-hoch-440.webp differ
diff --git a/workspace/assets/img/buehne/gate-hoch-580.webp b/workspace/assets/img/buehne/gate-hoch-580.webp
index 1ab93583..cef28534 100644
Binary files a/workspace/assets/img/buehne/gate-hoch-580.webp and b/workspace/assets/img/buehne/gate-hoch-580.webp differ
diff --git a/workspace/assets/img/buehne/gate-hoch-900.webp b/workspace/assets/img/buehne/gate-hoch-900.webp
new file mode 100644
index 00000000..cd5585fa
Binary files /dev/null and b/workspace/assets/img/buehne/gate-hoch-900.webp differ
diff --git a/workspace/aufgaben.html b/workspace/aufgaben.html
index 13e8eb33..e3b34415 100644
--- a/workspace/aufgaben.html
+++ b/workspace/aufgaben.html
@@ -9,9 +9,9 @@
-
-
-
+
+
+
@@ -211,10 +211,10 @@
-
-
-
-
-
+
+
+
+
+