Rechtstexte, FinalFlux-Überarbeitung, neue Login-Optik, Konto-Löschung-Fix, BTTF-Farbrelaunch

- Rechtsseiten: Impressum-Platzhalter + echte Nutzungsbedingungen/AGB,
  Datenschutz (DSGVO) und Richtlinien; LegalController/ImpressumController,
  Footer app-weit verlinkt, Seiten als permitAll freigegeben.
- FinalFlux: 28 Themen / ~742 Fragen überarbeitet (plausible Distraktoren statt
  Dummy-Antworten, echte Erklärungen) + echte Lehrtexte je Seite;
  Netzwerktopologien mit Inline-SVG-Diagrammen (Stern/Bus/Ring/Mesh/Baum).
- Login/Registrierung als kombiniertes Dual-Panel (Slide-Overlay + Neon-Hover-
  Button), ausgelagert nach auth.css; Register-Duplikat -> /?registerError.
- Konto löschen repariert: @Transactional + Löschen von Spielständen,
  Achievements und Profilbild-Datei (DSGVO Art. 17). Impressum-Zurück-Link
  login-abhängig.
- App-weiter Farb-Relaunch auf "Back to the Future"-Palette: Feuer-Amber primär
  + Flux-Blau sekundär, warmer Glow; Dark/Light bleiben. Spiele-Feedback ohne
  Grün: richtig = Blau + Haken, falsch = Rot + Kreuz (neue Tokens
  --success/--danger/--secondary). Legacy-Cyan in style.css auf Variablen.

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

src/main/resources/static/css/auth.css

@@ -0,0 +1,128 @@
+/* Auth (Login/Signup) – kombiniertes Dual-Panel mit Neon-Buttons.
+   Bewusst als statische CSS-Datei: enthält @property mit '<angle>',
+   was im Thymeleaf-Inline-Style als HTML-Tag fehlinterpretiert würde. */
+
+/* Rotierender Winkel für den Conic-Gradient-Glow (Bild 1) */
+@property --mf-ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
+
+.auth-stage { width:100%; display:flex; flex-direction:column; align-items:center; gap:1.4rem; }
+
+/* ---- Dual-Panel-Container (Bild 2) ---- */
+.auth-container {
+    position:relative; width:100%; max-width:840px; min-height:560px;
+    background:var(--surface); border:1px solid var(--border-accent);
+    border-radius:22px; box-shadow:0 0 44px var(--glow-w); overflow:hidden;
+}
+.form-box {
+    position:absolute; top:0; height:100%; width:50%;
+    display:flex; align-items:center; justify-content:center;
+    padding:2.4rem 2.6rem; transition:transform .65s ease-in-out, opacity .65s ease-in-out;
+}
+.form-box .inner { width:100%; max-width:320px; }
+.form-box.login  { left:0; z-index:2; }
+.form-box.signup { left:0; opacity:0; z-index:1; }
+
+.auth-container.active .form-box.login  { transform:translateX(100%); opacity:0; z-index:1; }
+.auth-container.active .form-box.signup { transform:translateX(100%); opacity:1; z-index:5; }
+
+/* ---- Überschiebendes Gradient-Overlay ---- */
+.overlay-container {
+    position:absolute; top:0; left:50%; width:50%; height:100%;
+    overflow:hidden; z-index:100; transition:transform .65s ease-in-out;
+    box-shadow: -1px 0 0 var(--border-accent), -26px 0 55px -30px var(--glow-s);
+}
+.auth-container.active .overlay-container { transform:translateX(-100%); }
+.overlay {
+    position:relative; left:-100%; width:200%; height:100%; transform:translateX(0);
+    transition:transform .65s ease-in-out;
+    background:
+        radial-gradient(540px 380px at 70% 22%, var(--glow-s), transparent 60%),
+        radial-gradient(420px 300px at 20% 90%, var(--glow-w), transparent 65%),
+        linear-gradient(150deg, var(--surface-2), var(--surface));
+}
+.auth-container.active .overlay { transform:translateX(50%); }
+.overlay-panel {
+    position:absolute; top:0; height:100%; width:50%;
+    display:flex; flex-direction:column; align-items:center; justify-content:center;
+    text-align:center; padding:0 2.4rem; color:var(--text);
+    transition:transform .65s ease-in-out;
+}
+.overlay-left  { transform:translateX(-18%); }
+.auth-container.active .overlay-left  { transform:translateX(0); }
+.overlay-right { right:0; transform:translateX(0); }
+.auth-container.active .overlay-right { transform:translateX(18%); }
+
+.overlay-panel .o-emblem {
+    width:56px; height:56px; background:var(--accent); margin-bottom:1rem;
+    -webkit-mask:url("/img/mindflux-emblem.png") center/contain no-repeat;
+            mask:url("/img/mindflux-emblem.png") center/contain no-repeat;
+    filter:drop-shadow(0 0 12px var(--glow-s));
+}
+.overlay-panel h3 { color:var(--heading); font-size:1.5rem; font-weight:800; margin-bottom:.6rem; letter-spacing:.01em; text-shadow:0 0 18px var(--glow-w); }
+.overlay-panel p  { color:var(--text); font-size:.9rem; line-height:1.65; margin-bottom:1.6rem; max-width:280px; }
+
+/* ---- Formularkopf ---- */
+.auth-head { text-align:center; margin-bottom:1.4rem; }
+.auth-head .mark {
+    width:52px; height:52px; margin:0 auto .55rem; background:var(--accent);
+    -webkit-mask:url("/img/mindflux-emblem.png") center/contain no-repeat;
+            mask:url("/img/mindflux-emblem.png") center/contain no-repeat;
+    filter:drop-shadow(0 0 12px var(--glow-s));
+}
+.auth-head b { display:block; color:var(--accent); font-weight:800; letter-spacing:.16em; font-size:1.05rem; text-shadow:0 0 14px var(--glow-s); }
+.auth-head h2 { color:var(--heading); font-size:1.35rem; font-weight:800; margin-top:.5rem; }
+.auth-head .sub { color:var(--muted); font-size:.82rem; margin-top:.2rem; }
+
+.mf-alert { padding:.6rem .8rem; border-radius:10px; font-size:.82rem; margin-bottom:.9rem; text-align:center; }
+.mf-alert.err { color:var(--danger); border:1px solid var(--danger); background:rgba(255,95,107,.08); }
+.mf-alert.ok  { color:var(--accent); border:1px solid var(--border-accent); background:var(--surface-2); }
+
+/* ---- Neon-Button mit Hover-Expand + rotierendem Conic-Glow (Bild 1) ---- */
+.neon-btn {
+    position:relative; z-index:0; width:100%; margin-top:.4rem;
+    display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
+    padding:.85rem 1.3rem; border:0; border-radius:999px; cursor:pointer;
+    font-weight:800; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase;
+    color:var(--accent-ink); background:var(--accent); box-shadow:0 0 18px var(--glow-s);
+    transition:transform .3s ease, letter-spacing .3s ease, box-shadow .3s ease;
+}
+.neon-btn::before {
+    content:""; position:absolute; inset:-3px; border-radius:inherit; z-index:-1;
+    background:conic-gradient(from var(--mf-ang),
+        var(--accent), var(--accent-2), var(--accent), var(--accent-2), var(--accent));
+    filter:blur(9px); opacity:0; transition:opacity .35s ease;
+    animation:mf-spin 4s linear infinite;
+}
+.neon-btn:hover { transform:translateY(-2px); letter-spacing:.16em; box-shadow:0 0 28px var(--glow-s); }
+.neon-btn:hover::before { opacity:.9; }
+.neon-btn:focus-visible { outline:2px solid var(--accent-2); outline-offset:3px; }
+.neon-btn .lock { font-size:.95em; }
+@keyframes mf-spin { to { --mf-ang:360deg; } }
+
+/* Outline-Variante für die Overlay-Buttons (auf Gradient) */
+.ghost-btn {
+    display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
+    padding:.75rem 1.8rem; border-radius:999px; cursor:pointer; font-weight:800;
+    font-size:.8rem; letter-spacing:.1em; text-transform:uppercase;
+    background:transparent; color:var(--accent); border:2px solid var(--border-accent);
+    box-shadow:0 0 16px var(--glow-w);
+    transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
+}
+.ghost-btn:hover { transform:translateY(-2px); background:var(--surface-2); box-shadow:0 0 22px var(--glow-s); }
+
+.mobile-switch { display:none; text-align:center; margin-top:1.2rem; color:var(--muted); font-size:.84rem; }
+.mobile-switch a { color:var(--accent); font-weight:700; text-decoration:none; cursor:pointer; }
+
+/* ---- Responsiv: gestapelt, ohne Overlay ---- */
+@media (max-width:760px) {
+    .auth-container { max-width:420px; min-height:auto; }
+    .overlay-container { display:none; }
+    .form-box {
+        position:relative; width:100%; padding:2rem 1.6rem;
+        transform:none !important; opacity:1 !important; transition:none;
+    }
+    .form-box.signup { display:none; }
+    .auth-container.active .form-box.login  { display:none; }
+    .auth-container.active .form-box.signup { display:flex; }
+    .mobile-switch { display:block; }
+}