From 2df603b32bef8d37194220d570d9fa1c7025ff900bab43109f44118a35ee389d Mon Sep 17 00:00:00 2001
From: jhkaktus <dev@serverjonas.de>
Date: Sun, 11 Oct 2026 00:30:51 +0200
Subject: [PATCH] style+docs: consistent pre-screen styling and first-start UX
 docs
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Setup screen shares the unlock panel look; README gains an "Erster
Start (UX)" section explaining first visit vs returning visit behaviour.

🤖 Generated with Codebuff
Co-Authored-By: Codebuff <noreply@codebuff.com>
---
 README.md                | 10 ++++++++++
 backend/static/style.css | 11 +++++++----
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index c0900cb..744cf63 100644
--- a/README.md
+++ b/README.md
@@ -8,6 +8,16 @@ Alle Datensätze werden **im Browser** verschlüsselt
 Der Server sieht ausschließlich Chiffretext – auch bei vollständiger
 Serverkompromittierung bleiben die Inhalte ohne Passphrase vertraulich.
 
+## Erster Start (UX)
+
+- **Beim ersten Besuch** (Datenbank leer): Die App zeigt "Willkommen" und
+  fragt zweimal nach einer neuen Passphrase (mindestens 8 Zeichen).
+  Diese schützt ab sofort alle Datensätze – es gibt keine Zurücksetzung.
+- **Bei weiteren Besuchen**: Die App bittet einmal um die bekannte
+  Passphrase ("Entsperren").
+- Der Server speichert niemals die Passphrase selbst, nur verschlüsselte
+  Datensätze.
+
 ## Starten (HTTP; TLS über Reverse Proxy)
 
 ```bash
diff --git a/backend/static/style.css b/backend/static/style.css
index ef6c9c8..35d7334 100644
--- a/backend/static/style.css
+++ b/backend/static/style.css
@@ -34,7 +34,7 @@ h1 { margin: 0 0 0.25rem; font-size: 1.6rem; }
 }
 #flash.error { color: var(--danger); }
 
-#unlock {
+#unlock, #setup {
   max-width: 420px;
   margin: 3rem auto;
   background: var(--panel);
@@ -43,10 +43,13 @@ h1 { margin: 0 0 0.25rem; font-size: 1.6rem; }
   padding: 1.5rem;
 }
 
-#unlock label { display: block; margin-bottom: 0.5rem; }
-#unlock input {
+#unlock h2, #setup h2 { margin: 0 0 0.5rem; font-size: 1.15rem; }
+.intro { color: var(--muted); font-size: 0.9rem; margin: 0 0 1rem; }
+
+#unlock label, #setup label { display: block; margin-bottom: 0.75rem; }
+#unlock input, #setup input {
   width: 100%;
-  margin-bottom: 1rem;
+  margin-top: 0.25rem;
 }
 .hint { color: var(--muted); font-size: 0.85rem; margin-top: 1rem; }