frontend: Vollbild-Umschalter links neben den Sprachen

Neuer Icon-Toggle in der Kopfzeile (links vom Sprachumschalter). Aktiv
entfernt er linken/rechten Rand und die 1200px-Maximalbreite von Kopf,
Panel-Bereich und Fußzeile, sodass die Panels die ganze Fensterbreite
nutzen. Tooltip in allen sieben Sprachen.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/index.html

@@ -33,6 +33,21 @@
   }
   header{max-width:1200px;width:100%;margin:0 auto 16px;flex:0 0 auto}
   .header-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
+  .header-tools{display:flex;align-items:center;gap:12px}
+  .fsbtn{
+    display:inline-flex;align-items:center;justify-content:center;
+    width:30px;height:29px;padding:0;cursor:pointer;
+    border:1px solid rgba(36,52,71,.2);border-radius:8px;
+    background:var(--card);color:var(--muted);
+  }
+  .fsbtn svg{display:block}
+  .fsbtn:hover{border-color:var(--or);color:var(--or)}
+  .fsbtn.active{background:var(--or);color:#fff;border-color:var(--or)}
+  /* Vollbild: Panels nutzen die ganze Fensterbreite (kein linker/rechter Rand). */
+  body.fullscreen{padding-left:0;padding-right:0}
+  body.fullscreen header,
+  body.fullscreen .app,
+  body.fullscreen .site-footer{max-width:none}
   h1{font-size:1.25rem;font-weight:600;letter-spacing:-.01em}
   header p{margin-top:4px;color:var(--muted);font-size:.9rem}
   .langsel{
@@ -465,6 +480,10 @@
       </svg>
       <span data-i18n-title="brandTooltip" title="„Werkbaum“ bedeutet so viel wie ‚Werk-Baum‘ — der Baum des Projektstrukturplans (WBS).">Werk<span style="color:var(--or)">baum</span></span>
     </h1>
+    <div class="header-tools">
+    <button type="button" id="fsToggle" class="fsbtn" aria-pressed="false" data-i18n-title="fullscreenTooltip" data-i18n-aria="fullscreenTooltip" title="Vollbild – Panels nutzen die ganze Fensterbreite" aria-label="Vollbild – Panels nutzen die ganze Fensterbreite">
+      <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3H5a2 2 0 0 0-2 2v3M16 3h3a2 2 0 0 1 2 2v3M8 21H5a2 2 0 0 1-2-2v-3M16 21h3a2 2 0 0 0 2-2v-3"/></svg>
+    </button>
     <div class="langsel" role="radiogroup" aria-label="Sprache / Language">
       <button type="button" data-lang="de" title="Deutsch">DE</button>
       <button type="button" data-lang="en" title="English">EN</button>
@@ -475,6 +494,7 @@
       <button type="button" class="lang-extra" data-lang="hi" title="हिन्दी">HI</button>
       <button type="button" id="langMore" class="langmore" aria-expanded="false" data-i18n-title="langMore" data-i18n-aria="langMore" title="weitere Sprachen" aria-label="weitere Sprachen">…</button>
     </div>
+    </div>
   </div>
   <p data-i18n="subtitle">Werkbaum – Ein Text-basierter WBS/Projektstrukturplan/Feature-Tree Diagramm-Editor.</p>
 </header>
@@ -924,6 +944,7 @@ document.getElementById('copyDiagram').addEventListener('click', async () => {
 const I18N = {
   de: {
     subtitle:"Werkbaum – Ein Text-basierter WBS/Projektstrukturplan/Feature-Tree Diagramm-Editor.",
+    fullscreenTooltip:"Vollbild – Panels nutzen die ganze Fensterbreite",
     brandTooltip:"„Werkbaum“ bedeutet so viel wie ‚Werk-Baum‘ — der Baum des Projektstrukturplans (WBS).",
     editorTitle:"Struktur (Text)", diagramTitle:"Diagramm",
     copy:"kopieren", copyDone:"kopiert ✓", copyTooltip:"Text in die Zwischenablage kopieren",
@@ -950,6 +971,7 @@ const I18N = {
   },
   en: {
     subtitle:"Werkbaum – A text-based WBS / work breakdown structure / feature-tree diagram editor.",
+    fullscreenTooltip:"Full screen – panels use the full window width",
     brandTooltip:"“Werkbaum” means roughly ‘work tree’ — the tree of the work breakdown structure (WBS).",
     editorTitle:"Structure (text)", diagramTitle:"Diagram",
     copy:"copy", copyDone:"copied ✓", copyTooltip:"Copy text to clipboard",
@@ -976,6 +998,7 @@ const I18N = {
   },
   es: {
     subtitle:"Werkbaum – Un editor de diagramas basado en texto para EDT / estructura de desglose del trabajo / árbol de características.",
+    fullscreenTooltip:"Pantalla completa – los paneles usan todo el ancho de la ventana",
     brandTooltip:"«Werkbaum» significa algo así como ‘árbol de trabajo’ — el árbol de la estructura de desglose del trabajo (EDT).",
     editorTitle:"Estructura (texto)", diagramTitle:"Diagrama",
     copy:"copiar", copyDone:"copiado ✓", copyTooltip:"Copiar el texto al portapapeles",
@@ -1002,6 +1025,7 @@ const I18N = {
   },
   fr: {
     subtitle:"Werkbaum – Un éditeur de diagrammes basé sur le texte pour WBS / organigramme des tâches / arbre de fonctionnalités.",
+    fullscreenTooltip:"Plein écran – les panneaux occupent toute la largeur de la fenêtre",
     brandTooltip:"« Werkbaum » signifie à peu près « arbre de travail » — l’arbre de l’organigramme des tâches (WBS).",
     editorTitle:"Structure (texte)", diagramTitle:"Diagramme",
     copy:"copier", copyDone:"copié ✓", copyTooltip:"Copier le texte dans le presse-papiers",
@@ -1028,6 +1052,7 @@ const I18N = {
   },
   pl: {
     subtitle:"Werkbaum – Edytor diagramów oparty na tekście: WBS / struktura podziału pracy / drzewo funkcji.",
+    fullscreenTooltip:"Pełny ekran – panele wykorzystują całą szerokość okna",
     brandTooltip:"„Werkbaum” znaczy mniej więcej ‚drzewo pracy’ — drzewo struktury podziału pracy (WBS).",
     editorTitle:"Struktura (tekst)", diagramTitle:"Diagram",
     copy:"kopiuj", copyDone:"skopiowano ✓", copyTooltip:"Kopiuj tekst do schowka",
@@ -1054,6 +1079,7 @@ const I18N = {
   },
   ru: {
     subtitle:"Werkbaum – текстовый редактор диаграмм: СДР / структура декомпозиции работ / дерево функций.",
+    fullscreenTooltip:"Полный экран – панели занимают всю ширину окна",
     brandTooltip:"«Werkbaum» примерно означает ‚дерево работ’ — дерево структуры декомпозиции работ (СДР).",
     editorTitle:"Структура (текст)", diagramTitle:"Диаграмма",
     copy:"копировать", copyDone:"скопировано ✓", copyTooltip:"Скопировать текст в буфер обмена",
@@ -1080,6 +1106,7 @@ const I18N = {
   },
   hi: {
     subtitle:"Werkbaum – टेक्स्ट-आधारित आरेख संपादक: WBS / कार्य विभाजन संरचना / फ़ीचर-ट्री।",
+    fullscreenTooltip:"पूर्ण स्क्रीन – पैनल पूरी विंडो चौड़ाई का उपयोग करते हैं",
     brandTooltip:"„Werkbaum“ का अर्थ लगभग ‚कार्य-वृक्ष‘ है — कार्य विभाजन संरचना (WBS) का वृक्ष।",
     editorTitle:"संरचना (टेक्स्ट)", diagramTitle:"आरेख",
     copy:"कॉपी करें", copyDone:"कॉपी हो गया ✓", copyTooltip:"टेक्स्ट को क्लिपबोर्ड पर कॉपी करें",
@@ -1160,6 +1187,14 @@ document.querySelectorAll('.langsel button[data-lang]').forEach(b => {
   b.addEventListener('click', () => applyLang(b.dataset.lang));
 });
 
+/* ---------- Vollbild: Panels über die ganze Fensterbreite ---------- */
+const fsBtn = document.getElementById('fsToggle');
+fsBtn.addEventListener('click', () => {
+  const on = document.body.classList.toggle('fullscreen');
+  fsBtn.classList.toggle('active', on);
+  fsBtn.setAttribute('aria-pressed', String(on));
+});
+
 applySplit();   /* Startzustand: normal, markiert die normal-Buttons aktiv */
 src.value = INITIAL;
 let startLang = 'de';