Harden app security controls from audit

wwwroot/data/i18n/faq/de.md

@@ -13,7 +13,7 @@ Dein Anzeigename ist erforderlich ‒ er erscheint neben all deinen Vorschlägen
 
 ### Brauche ich Admin-Rechte?
 
-Wenn du einen **Admin-Schlüssel** erhalten hast, gib ihn bei der Registrierung ein. Ist der Schlüssel ungültig, wird die Anfrage abgelehnt. Admin-Rechte können später nicht hinzugefügt werden. Um Admin zu werden, musst du dich mit dem korrekten Schlüssel neu registrieren.
+Wenn du einen **Admin-Schlüssel** erhalten hast, gib ihn bei der Registrierung ein. Ist der Schlüssel ungültig, wird die Anfrage abgelehnt. Die Admin-Schlüssel-Registrierung ist nur verfügbar, bis das erste Admin-Konto erstellt wurde. Admin-Rechte können später nicht über die öffentliche Registrierung hinzugefügt werden.
 
 ## Phasen im Überblick
 
@@ -52,7 +52,7 @@ Wenn du eine Screenshot-URL angibst, muss sie:
  - Direkt erreichbar sein (keine Weiterleitungen)
  - Innerhalb von ~3 Sekunden laden
  - Unter **5 MB**groß sein
- - Nicht auf lokale oder private Hosts verweisen
+ - Nicht auf lokale, private oder reservierte Hosts verweisen
 
 Screenshots sind optional.
 
@@ -189,9 +189,14 @@ Bis dahin zeigt die Navigation in der Vorschlagsphase einen Hinweis statt eines
 
 Registriere dich erneut mit dem korrekten Schlüssel vom Host ‒ oder lasse das Feld leer, um ein normales Konto zu erstellen.
 
+### „Zu viele Anfragen. Bitte versuche es in Kürze erneut."
+
+Auth- und Admin-sensitive Routen sind gegen Brute-Force-Angriffe rate-limitiert.
+Warte kurz und versuche es dann erneut.
+
 ## Daten & Datenschutz
 
 -   Vorschläge, Stimmen und Phasenstatus werden in einer gemeinsamen **SQLite-Datenbank** gespeichert.
--   Passwörtwer werden mit einer SHA256 Verschlüsselung gespeichert.
+-   Passwörter werden als gesalzene PBKDF2-SHA256-Hashes gespeichert (nicht im Klartext).
 -   Beim Abmelden wird dein Authentifizierungs-Cookie gelöscht und die Eingaben in Login/Registrierung werden zurückgesetzt.
 -   Wenn ein Admin dein Spielerkonto löscht, werden auch deine Vorschläge und Stimmen entfernt.

wwwroot/data/i18n/faq/en.md

@@ -14,7 +14,7 @@ Your display name is required ‒ it appears next to all of your suggestions and
 ### Do I need admin privileges?
 
 If you've been given an **admin key**, enter it during registration. If the key is invalid, the request is rejected.
-Admin access cannot be added later. To become an admin, you must re-register with the correct key.
+Admin-key bootstrap is only available until the first admin account exists. Admin access cannot be added later. To become an admin afterward, an existing admin must create/manage access outside the public registration flow.
 
 ## Phases at a Glance
 
@@ -54,7 +54,7 @@ If you include a screenshot URL, it must:
   - Be directly accessible (no redirects)
   - Load within ~3 seconds
   - Be under **5 MB**
-  - Not point to local or private hosts
+  - Not point to local, private, or reserved hosts
 
 Screenshots are optional.
 
@@ -193,9 +193,14 @@ Until then, the Suggest navigation shows a hint instead of a Next button, and sw
 
 Register again using the correct key from the host ‒ or leave it blank to create a regular account.
 
+### "Too many requests. Please try again shortly."
+
+Auth and admin-sensitive routes are rate-limited to reduce brute-force attempts.
+Wait briefly, then retry.
+
 ## Data & Privacy
 
 -   Suggestions, votes, and phase states are stored in a shared **SQLite database**.
--   Passwords are stored with a SHA256 encryption.
+-   Passwords are stored as salted PBKDF2-SHA256 hashes (not plaintext).
 -   Logging out clears your authentication cookie and resets login/register form inputs.
 -   If an admin deletes your player account, your suggestions and votes are removed as well.

wwwroot/js/admin-ui.js

@@ -1,7 +1,7 @@
 import { t } from "./i18n.js";
 import { state } from "./state.js";
 import { $ } from "./dom.js";
-import { buildLinkOptionLabel, escapeHtml, truncate } from "./ui-utils.js";
+import { buildLinkOptionLabel, truncate } from "./ui-utils.js";
 
 function displayPlayerStatus(player) {
     if (!player) return "";
@@ -16,14 +16,24 @@ function displayPlayerStatus(player) {
 }
 
 function buildStatusSelect(player) {
-    const statusText = displayPlayerStatus(player);
     const canMoveToSuggest = player.phase === "Vote";
-    return `
-        <select class="chip admin-status-select" data-set-player-phase="${player.playerId}" aria-label="${t("admin.playerStatus")}">
-          <option value="" selected>${statusText}</option>
-          <option value="Suggest" ${canMoveToSuggest ? "" : "disabled"}>${t("admin.statusMoveToSuggest")}</option>
-        </select>
-    `;
+    const select = document.createElement("select");
+    select.className = "chip admin-status-select";
+    select.dataset.setPlayerPhase = player.playerId;
+    select.setAttribute("aria-label", t("admin.playerStatus"));
+
+    const current = document.createElement("option");
+    current.value = "";
+    current.selected = true;
+    current.textContent = displayPlayerStatus(player);
+
+    const suggest = document.createElement("option");
+    suggest.value = "Suggest";
+    suggest.disabled = !canMoveToSuggest;
+    suggest.textContent = t("admin.statusMoveToSuggest");
+
+    select.append(current, suggest);
+    return select;
 }
 
 export function renderAdminVoteStatus() {
@@ -36,17 +46,49 @@ export function renderAdminVoteStatus() {
     table.innerHTML = "";
     state.adminVoteStatus.voters.forEach((v) => {
         const tr = document.createElement("tr");
-        const gamesTooltip = escapeHtml((v.suggestionTitles || []).join(", "));
-        const nameText = escapeHtml(truncate(v.name, 28));
-        const userText = escapeHtml(truncate(v.username, 24));
-        tr.innerHTML = `
-        <td title="${escapeHtml(v.name)}">${nameText}</td>
-        <td class="muted small" title="${escapeHtml(v.username)}">${userText}</td>
-        <td>${buildStatusSelect(v)}</td>
-        <td title="${gamesTooltip}">${v.suggestionCount ?? 0}</td>
-        <td><button class="chip" data-grant-joker="${v.playerId}" type="button">${v.hasJoker ? "🎟" : t("admin.grantJokerChip")}</button></td>
-        <td><button class="chip danger-chip" data-delete-player="${v.playerId}" data-name="${v.name}" type="button">✕</button></td>
-      `;
+        const gamesTooltip = (v.suggestionTitles || []).join(", ");
+
+        const nameCell = document.createElement("td");
+        nameCell.title = v.name ?? "";
+        nameCell.textContent = truncate(v.name, 28);
+
+        const usernameCell = document.createElement("td");
+        usernameCell.className = "muted small";
+        usernameCell.title = v.username ?? "";
+        usernameCell.textContent = truncate(v.username, 24);
+
+        const statusCell = document.createElement("td");
+        statusCell.appendChild(buildStatusSelect(v));
+
+        const countCell = document.createElement("td");
+        countCell.title = gamesTooltip;
+        countCell.textContent = String(v.suggestionCount ?? 0);
+
+        const jokerCell = document.createElement("td");
+        const jokerButton = document.createElement("button");
+        jokerButton.className = "chip";
+        jokerButton.dataset.grantJoker = v.playerId;
+        jokerButton.type = "button";
+        jokerButton.textContent = v.hasJoker ? "🎟" : t("admin.grantJokerChip");
+        jokerCell.appendChild(jokerButton);
+
+        const deleteCell = document.createElement("td");
+        const deleteButton = document.createElement("button");
+        deleteButton.className = "chip danger-chip";
+        deleteButton.dataset.deletePlayer = v.playerId;
+        deleteButton.dataset.name = v.name ?? "";
+        deleteButton.type = "button";
+        deleteButton.textContent = "✕";
+        deleteCell.appendChild(deleteButton);
+
+        tr.append(
+            nameCell,
+            usernameCell,
+            statusCell,
+            countCell,
+            jokerCell,
+            deleteCell,
+        );
         table.appendChild(tr);
     });
 

wwwroot/js/modals-ui.js

@@ -1,18 +1,28 @@
 import { t } from "./i18n.js";
 import { toast } from "./dom.js";
-import { escapeHtml } from "./ui-utils.js";
 
 export function openLightbox(url, title) {
     const overlay = document.createElement("div");
     overlay.className = "lightbox";
-    const safeTitle = escapeHtml(title || "");
-    overlay.innerHTML = `
-    <div class="lightbox-content">
-      <button class="lightbox-close" aria-label="${t("lightbox.close")}">✕</button>
-      <img src="${url}" alt="${safeTitle}" />
-      <p>${safeTitle}</p>
-    </div>
-  `;
+
+    const content = document.createElement("div");
+    content.className = "lightbox-content";
+
+    const closeBtn = document.createElement("button");
+    closeBtn.className = "lightbox-close";
+    closeBtn.setAttribute("aria-label", t("lightbox.close"));
+    closeBtn.type = "button";
+    closeBtn.textContent = "✕";
+
+    const image = document.createElement("img");
+    image.src = url ?? "";
+    image.alt = title ?? "";
+
+    const caption = document.createElement("p");
+    caption.textContent = title ?? "";
+
+    content.append(closeBtn, image, caption);
+    overlay.appendChild(content);
     overlay.addEventListener("click", (e) => {
         if (
             e.target.classList.contains("lightbox") ||
@@ -38,15 +48,28 @@ export function openConfirmModal({
     overlay.className = "edit-modal";
     const panel = document.createElement("div");
     panel.className = "edit-panel";
-    panel.innerHTML = `
-      <div class="edit-header">
-        <h3>${title}</h3>
-        <button class="lightbox-close" aria-label="${t("modal.close")}">x</button>
-      </div>
-      <div class="edit-body">
-        <p>${body}</p>
-      </div>
-    `;
+
+    const header = document.createElement("div");
+    header.className = "edit-header";
+
+    const heading = document.createElement("h3");
+    heading.textContent = title ?? "";
+
+    const closeBtn = document.createElement("button");
+    closeBtn.className = "lightbox-close";
+    closeBtn.setAttribute("aria-label", t("modal.close"));
+    closeBtn.type = "button";
+    closeBtn.textContent = "x";
+
+    header.append(heading, closeBtn);
+
+    const bodyWrap = document.createElement("div");
+    bodyWrap.className = "edit-body";
+    const bodyText = document.createElement("p");
+    bodyText.textContent = body ?? "";
+    bodyWrap.appendChild(bodyText);
+    panel.append(header, bodyWrap);
+
     const close = () => overlay.remove();
     const actions = document.createElement("div");
     actions.className = "stack horizontal confirm-actions";
@@ -63,7 +86,7 @@ export function openConfirmModal({
         actions.append(cancelBtn);
         cancelBtn.addEventListener("click", close);
     }
-    const bodyContainer = panel.querySelector(".edit-body");
+    const bodyContainer = bodyWrap;
     let passwordInput = null;
     if (requirePassword && bodyContainer) {
         const field = document.createElement("label");