feat(feedback): in-app user feedback with admin review and account roles

User-facing Feedback screen (Settings -> Info, registered accounts only): a
message (<=1024 runes) plus one optional attachment, an anti-spam gate (one
unreviewed message at a time), and the operator's inline reply with a
Settings/Info badge. Server-rendered admin console section (/_gm/feedback):
unread/read/archived queue with per-user search, detail with read/reply/
archive/delete/delete-all, safe attachment serving (nosniff, images inline via
<img>, others download-only). Introduces account_roles, the first per-account
role table; feedback_banned blocks only feedback submission, granted/revoked
from /users and the delete-with-block action.

- migration 00004_feedback (feedback_messages + account_roles) + jetgen
- backend internal/feedback (store+service), internal/account/roles.go
- wire: FlatBuffers feedback.submit/get/unread; gateway guest gate (Op.NonGuest,
  is_guest via session resolve) -> guest_forbidden before any backend call
- reply push reuses NotificationEvent with a new admin_reply sub-kind
- UI: /feedback route + screen, attachment picker, badge, channel detection, i18n
- tests: feedback unit (Go+UI), gateway guest-gate, inttest lifecycle, e2e
- docs: PLAN stage 19, ARCHITECTURE s15, FUNCTIONAL(+ru), TESTING, READMEs

ui/src/screens/About.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { t } from '../lib/i18n/index.svelte';
   import { app } from '../lib/app.svelte';
+  import { navigate } from '../lib/router.svelte';
   import { aboutContent } from '../lib/aboutContent';
 
   // The auto-match move clock (mirrors backend game.DefaultTurnTimeout = 24h).
@@ -31,6 +32,10 @@
   </section>
 
   <p class="muted">{t('about.version', { v: version })}</p>
+
+  {#if !(app.profile?.isGuest ?? true)}
+    <button class="btn feedback" onclick={() => navigate('/feedback')}>{t('feedback.title')}</button>
+  {/if}
 </div>
 
 <style>

ui/src/screens/Feedback.svelte

@@ -0,0 +1,189 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import Screen from '../components/Screen.svelte';
+  import { t } from '../lib/i18n/index.svelte';
+  import { app, handleError } from '../lib/app.svelte';
+  import { gateway } from '../lib/gateway';
+  import { connection } from '../lib/connection.svelte';
+  import { clientChannel } from '../lib/channel';
+  import { attachmentError, MAX_BODY } from '../lib/feedback';
+  import type { FeedbackState } from '../lib/model';
+
+  // The feedback screen: a message (+ optional single attachment) the player sends to
+  // the operators, plus the operator's last reply. The form is disabled while a
+  // previous message is under review or the account is banned from feedback.
+  let view = $state<FeedbackState | null>(null);
+  let body = $state('');
+  let file = $state<File | null>(null);
+  let fileError = $state(false);
+  let sending = $state(false);
+  let sent = $state(false);
+  let fileInput: HTMLInputElement;
+
+  const enabled = $derived(view?.canSend ?? false);
+  const reason = $derived(view?.blockedReason ?? '');
+  const canSend = $derived(enabled && body.trim().length > 0 && !sending && connection.online);
+
+  onMount(() => void load());
+
+  async function load() {
+    try {
+      view = await gateway.feedbackGet();
+      // Fetching the screen delivers (reads) any pending reply: clear the badge.
+      app.feedbackReplyUnread = false;
+    } catch (e) {
+      handleError(e);
+    }
+  }
+
+  function pickFile(e: Event) {
+    const input = e.currentTarget as HTMLInputElement;
+    const f = input.files?.[0] ?? null;
+    if (!f) return;
+    if (attachmentError(f.name, f.size) !== '') {
+      fileError = true;
+      file = null;
+      input.value = '';
+      return;
+    }
+    fileError = false;
+    file = f;
+  }
+
+  function removeFile() {
+    file = null;
+    fileError = false;
+    if (fileInput) fileInput.value = '';
+  }
+
+  async function send() {
+    if (!canSend) return;
+    sending = true;
+    try {
+      let bytes: Uint8Array | null = null;
+      let name = '';
+      if (file) {
+        bytes = new Uint8Array(await file.arrayBuffer());
+        name = file.name;
+      }
+      await gateway.feedbackSubmit(body.trim(), bytes, name, clientChannel());
+      body = '';
+      removeFile();
+      sent = true;
+      // The message is now under review: block resending until the operator handles it.
+      view = { canSend: false, blockedReason: 'pending', reply: view?.reply ?? null };
+    } catch (e) {
+      handleError(e);
+    } finally {
+      sending = false;
+    }
+  }
+</script>
+
+<Screen title={t('feedback.title')} back="/about">
+  <div class="page">
+    <textarea
+      bind:value={body}
+      maxlength={MAX_BODY}
+      rows="6"
+      placeholder={t('feedback.placeholder')}
+      disabled={!enabled}
+    ></textarea>
+
+    <div class="row">
+      <input bind:this={fileInput} type="file" class="hidden" onchange={pickFile} />
+      {#if file}
+        <span class="fname">{file.name}</span>
+        <button type="button" class="ghost" onclick={removeFile}>{t('feedback.removeFile')}</button>
+      {:else}
+        <button type="button" class="ghost" onclick={() => fileInput.click()} disabled={!enabled}>
+          {t('feedback.attach')}
+        </button>
+      {/if}
+      <button type="button" class="btn" onclick={send} disabled={!canSend}>{t('feedback.send')}</button>
+    </div>
+
+    {#if fileError}<p class="err">{t('feedback.fileRejected')}</p>{/if}
+
+    {#if sent}
+      <p class="ok">{t('feedback.sent')}</p>
+    {:else if reason === 'pending'}
+      <p class="muted">{t('feedback.waiting')}</p>
+    {:else if reason === 'banned'}
+      <p class="muted">{t('feedback.banned')}</p>
+    {/if}
+
+    {#if view?.reply}
+      <section class="reply">
+        <h2>{t('feedback.replyTitle')}</h2>
+        <p class="replybody">{view.reply.body}</p>
+      </section>
+    {/if}
+  </div>
+</Screen>
+
+<style>
+  .page {
+    padding: var(--pad);
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+  textarea {
+    width: 100%;
+    box-sizing: border-box;
+    resize: vertical;
+    min-height: 7rem;
+    font: inherit;
+  }
+  .row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-wrap: wrap;
+  }
+  .fname {
+    flex: 1 1 auto;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: var(--text-muted);
+    font-size: 0.9rem;
+  }
+  .row .btn {
+    margin-left: auto;
+  }
+  .hidden {
+    display: none;
+  }
+  .err {
+    color: var(--danger);
+    margin: 0;
+  }
+  .ok {
+    color: var(--accent);
+    margin: 0;
+  }
+  .muted {
+    color: var(--text-muted);
+    margin: 0;
+  }
+  .reply {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    border-top: 1px solid var(--surface-2);
+    padding-top: 10px;
+  }
+  .reply h2 {
+    font-size: 1.05rem;
+    margin: 0;
+    color: var(--text-muted);
+  }
+  .replybody {
+    margin: 0;
+    white-space: pre-wrap;
+    word-break: break-word;
+  }
+</style>

ui/src/screens/Lobby.svelte

@@ -2,7 +2,7 @@
   import { onMount } from 'svelte';
   import Screen from '../components/Screen.svelte';
   import TabBar from '../components/TabBar.svelte';
-  import { app, handleError } from '../lib/app.svelte';
+  import { app, handleError, refreshFeedbackBadge } from '../lib/app.svelte';
   import { connection } from '../lib/connection.svelte';
   import { gateway } from '../lib/gateway';
   import { navigate } from '../lib/router.svelte';
@@ -18,15 +18,19 @@
   let incoming = $state<AccountRef[]>([]);
 
   const guest = $derived(app.profile?.isGuest ?? true);
+  // The lobby ⚙️ badge is the shared count: incoming friend requests plus an awaiting
+  // operator feedback reply (the Settings → Info badge folds in here).
+  const settingsBadge = $derived(app.notifications + (app.feedbackReplyUnread ? 1 : 0));
 
   async function load() {
     try {
       games = (await gateway.gamesList()).games;
       if (!guest) {
         [invitations, incoming] = await Promise.all([gateway.invitationsList(), gateway.friendsIncoming()]);
-        // The ⚙️ badge counts only what lives behind it (incoming friend requests);
+        // The ⚙️ badge counts incoming friend requests plus an awaiting feedback reply;
         // invitations surface in their own lobby section above.
         app.notifications = incoming.length;
+        void refreshFeedbackBadge();
       }
       setLobby({ games, invitations, incoming });
       // Warm the cache for the ongoing games so opening one from the lobby is instant. The list
@@ -234,7 +238,7 @@
         <span class="sq">📊</span><span class="lbl">{t('lobby.stats')}</span>
       </button>
       <button class="tab" onclick={() => navigate('/settings')}>
-        <span class="sq">⚙️{#if app.notifications > 0}<span class="badge">{app.notifications}</span>{/if}</span>
+        <span class="sq">⚙️{#if settingsBadge > 0}<span class="badge">{settingsBadge}</span>{/if}</span>
         <span class="lbl">{t('lobby.settings')}</span>
       </button>
     </TabBar>

ui/src/screens/SettingsHub.svelte

@@ -57,7 +57,7 @@
         </button>
       {/if}
       <button class="tab" class:active={tab === 'about'} onclick={() => (tab = 'about')}>
-        <span class="sq" aria-hidden="true">ℹ️</span><span class="lbl">{t('about.tab')}</span>
+        <span class="sq" aria-hidden="true">ℹ️{#if app.feedbackReplyUnread}<span class="badge">1</span>{/if}</span><span class="lbl">{t('about.tab')}</span>
       </button>
     </TabBar>
   {/snippet}