feat(social): per-game friend request to disguised robots + lobby/stats/tile cosmetics

Functional: the in-game add-friend handshake aimed at an auto-match opponent who is
secretly a pooled robot now records the request per (game, seat) in a new
robot_friend_requests table -- never against the shared robot account -- mirroring the
robot_blocks pattern. The shared account stays out of friendships, the "requested" state
is pinned to the seat (not leaked across the player's other games), the robot ignores it,
and a background reaper drops the row 7 days after its game finishes. The outgoing-requests
list carries these per-game rows so the seat control stays disabled across reloads. No
withdraw UI, per owner decision.

Cosmetics:
- Lobby: an in-progress game tints the viewer's own score number green when leading or
  tied, red when trailing (reusing --ok/--danger); scores now render in seat-number order,
  matching the over-the-board scoreboard.
- Stats: the per-variant best move is laid out on two lines -- the variant label, then the
  score (right-aligned in its column) and the word tiles (left-aligned) below it.
- Dark theme: the played-tile background is a touch darker so a player-placed tile reads
  with more contrast (light theme unchanged).

Docs (ARCHITECTURE, FUNCTIONAL + _ru mirror, backend README, UI_DESIGN) updated in the
same change.

ui/src/lib/client.ts

@@ -22,6 +22,7 @@ import type {
   LinkResult,
   MatchResult,
   MoveResult,
+  OutgoingList,
   Profile,
   ProfileUpdate,
   PushEvent,
@@ -118,9 +119,12 @@ export interface GatewayClient {
   // --- friends ---
   friendsList(): Promise<AccountRef[]>;
   friendsIncoming(): Promise<AccountRef[]>;
-  /** Addressees the caller has already requested (pending or declined); cannot re-request. */
-  friendsOutgoing(): Promise<AccountRef[]>;
-  friendRequest(accountId: string): Promise<void>;
+  /** Addressees the caller has already requested (pending or declined; cannot re-request),
+   *  plus the per-game disguised-robot requests that keep the in-game 🤝 disabled by seat. */
+  friendsOutgoing(): Promise<OutgoingList>;
+  /** Send a friend request. A non-empty gameId marks an in-game request, so a disguised-robot
+   *  opponent is recorded as a per-game request rather than against the shared robot account. */
+  friendRequest(accountId: string, gameId?: string): Promise<void>;
   friendRespond(requesterId: string, accept: boolean): Promise<void>;
   friendCancel(accountId: string): Promise<void>;
   unfriend(accountId: string): Promise<void>;

ui/src/lib/codec.test.ts

@@ -256,7 +256,7 @@ describe('codec', () => {
     expect(gl.atGameLimit).toBe(true);
   });
 
-  it('decodes an OutgoingRequestList of account refs', () => {
+  it('decodes an OutgoingRequestList of account refs plus per-game robot requests', () => {
     const b = new Builder(128);
     const id = b.createString('o-1');
     const dn = b.createString('Pat');
@@ -264,11 +264,20 @@ describe('codec', () => {
     fb.AccountRef.addAccountId(b, id);
     fb.AccountRef.addDisplayName(b, dn);
     const ref = fb.AccountRef.endAccountRef(b);
-    const vec = fb.OutgoingRequestList.createRequestsVector(b, [ref]);
+    const reqVec = fb.OutgoingRequestList.createRequestsVector(b, [ref]);
+    const rid = b.createString('r-1');
+    const rdn = b.createString('Robbie');
+    const rgid = b.createString('g-1');
+    const robot = fb.RobotFriendRef.createRobotFriendRef(b, rid, rdn, rgid, 1);
+    const robVec = fb.OutgoingRequestList.createRobotsVector(b, [robot]);
     fb.OutgoingRequestList.startOutgoingRequestList(b);
-    fb.OutgoingRequestList.addRequests(b, vec);
+    fb.OutgoingRequestList.addRequests(b, reqVec);
+    fb.OutgoingRequestList.addRobots(b, robVec);
     b.finish(fb.OutgoingRequestList.endOutgoingRequestList(b));
-    expect(decodeOutgoingList(b.asUint8Array())).toEqual([{ accountId: 'o-1', displayName: 'Pat' }]);
+    expect(decodeOutgoingList(b.asUint8Array())).toEqual({
+      requests: [{ accountId: 'o-1', displayName: 'Pat' }],
+      robots: [{ id: 'r-1', displayName: 'Robbie', gameId: 'g-1', seat: 1 }],
+    });
   });
 
   it('encodes a TargetRequest', () => {

ui/src/lib/codec.ts

@@ -10,7 +10,9 @@ import type { PlacedTile } from './client';
 import type {
   AccountRef,
   BlockList,
+  OutgoingList,
   RobotBlockEntry,
+  RobotFriendRequestEntry,
   Banner,
   BannerCampaign,
   BestMove,
@@ -719,14 +721,25 @@ export function decodeIncomingList(buf: Uint8Array): AccountRef[] {
   return out;
 }
 
-export function decodeOutgoingList(buf: Uint8Array): AccountRef[] {
+export function decodeOutgoingList(buf: Uint8Array): OutgoingList {
   const l = fb.OutgoingRequestList.getRootAsOutgoingRequestList(new ByteBuffer(buf));
-  const out: AccountRef[] = [];
+  const requests: AccountRef[] = [];
   for (let i = 0; i < l.requestsLength(); i++) {
     const r = l.requests(i);
-    if (r) out.push(decodeAccountRef(r));
+    if (r) requests.push(decodeAccountRef(r));
   }
-  return out;
+  const robots: RobotFriendRequestEntry[] = [];
+  for (let i = 0; i < l.robotsLength(); i++) {
+    const r = l.robots(i);
+    if (r)
+      robots.push({
+        id: r.id() ?? '',
+        displayName: r.displayName() ?? '',
+        gameId: r.gameId() ?? '',
+        seat: r.seat(),
+      });
+  }
+  return { requests, robots };
 }
 
 export function decodeBlockList(buf: Uint8Array): BlockList {

ui/src/lib/lobbysort.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { gamePhase, groupGames, isMyTurn, shouldBlink } from './lobbysort';
+import { gamePhase, groupGames, isMyTurn, orderedSeats, scoreStanding, shouldBlink } from './lobbysort';
 import type { GameView, Seat } from './model';
 
 const ME = 'me';
@@ -118,6 +118,59 @@ describe('gamePhase', () => {
   });
 });
 
+describe('scoreStanding', () => {
+  const withScores = (status: GameView['status'], myScore: number, oppScore: number): GameView => ({
+    ...game('g', status, 0, 0),
+    seats: [
+      { ...seat(0, ME), score: myScore },
+      { ...seat(1, 'opp'), score: oppScore },
+    ],
+  });
+
+  it('greens a leading or tied active game, reds a losing one', () => {
+    expect(scoreStanding(withScores('active', 30, 10), ME)).toBe('win');
+    expect(scoreStanding(withScores('active', 10, 10), ME)).toBe('win'); // a tie counts as green
+    expect(scoreStanding(withScores('active', 5, 10), ME)).toBe('lose');
+  });
+
+  it('is null for any non-active game (open or finished)', () => {
+    expect(scoreStanding(withScores('finished', 30, 10), ME)).toBeNull();
+    expect(scoreStanding(withScores('open', 0, 0), ME)).toBeNull();
+  });
+
+  it('is null when the viewer is not seated or has no opponent', () => {
+    expect(scoreStanding(withScores('active', 30, 10), 'stranger')).toBeNull();
+    const solo: GameView = { ...game('g', 'active', 0, 0), seats: [{ ...seat(0, ME), score: 9 }] };
+    expect(scoreStanding(solo, ME)).toBeNull();
+  });
+
+  it('compares against the strongest opponent in a multiplayer game', () => {
+    const g3: GameView = {
+      ...game('g', 'active', 0, 0),
+      players: 3,
+      seats: [
+        { ...seat(0, ME), score: 40 },
+        { ...seat(1, 'a'), score: 35 },
+        { ...seat(2, 'b'), score: 50 }, // b is ahead -> losing
+      ],
+    };
+    expect(scoreStanding(g3, ME)).toBe('lose');
+  });
+});
+
+describe('orderedSeats', () => {
+  it('returns seats in seat-number order without mutating the source', () => {
+    const g: GameView = {
+      ...game('g', 'active', 0, 0),
+      seats: [seat(2, 'c'), seat(0, ME), seat(1, 'b')],
+    };
+    const src = g.seats;
+    expect(orderedSeats(g).map((s) => s.seat)).toEqual([0, 1, 2]);
+    expect(g.seats).toBe(src); // the source array is left untouched
+    expect(g.seats.map((s) => s.seat)).toEqual([2, 0, 1]);
+  });
+});
+
 describe('shouldBlink', () => {
   it('blinks on a transition into mine or finished', () => {
     expect(shouldBlink('theirs', 'mine')).toBe(true);

ui/src/lib/lobbysort.ts

@@ -12,6 +12,29 @@ export function isMyTurn(game: GameView, myId: string): boolean {
   return (game.status === 'active' || game.status === 'open') && !!me && game.toMove === me.seat;
 }
 
+/**
+ * scoreStanding colours the viewer's own score on an in-progress game: 'win' when leading or
+ * tied (green), 'lose' when trailing (red). It is null for any game that is not active (open or
+ * finished — finished games show the result emoji instead) or where myId is not seated against
+ * an opponent, so the lobby leaves those numbers in the muted default.
+ */
+export function scoreStanding(game: GameView, myId: string): 'win' | 'lose' | null {
+  if (game.status !== 'active') return null;
+  const me = game.seats.find((s) => s.accountId === myId);
+  if (!me) return null;
+  const others = game.seats.filter((s) => s.accountId && s.accountId !== myId).map((s) => s.score);
+  if (!others.length) return null;
+  return me.score >= Math.max(...others) ? 'win' : 'lose';
+}
+
+/**
+ * orderedSeats returns a game's seats in seat-number order (matching the over-the-board
+ * scoreboard), without mutating the source array.
+ */
+export function orderedSeats(game: GameView): GameView['seats'] {
+  return [...game.seats].sort((a, b) => a.seat - b.seat);
+}
+
 /** LobbyPhase is a game's lobby bucket — which of the three card sections it currently sits in. */
 export type LobbyPhase = 'mine' | 'theirs' | 'finished';
 

ui/src/lib/mock/client.ts

@@ -29,6 +29,7 @@ import type {
   LinkResult,
   MatchResult,
   MoveResult,
+  OutgoingList,
   Profile,
   ProfileUpdate,
   PushEvent,
@@ -527,10 +528,11 @@ export class MockGateway implements GatewayClient {
   async friendsIncoming(): Promise<AccountRef[]> {
     return this.incoming.map((f) => ({ ...f }));
   }
-  async friendsOutgoing(): Promise<AccountRef[]> {
-    return this.outgoing.map((f) => ({ ...f }));
+  async friendsOutgoing(): Promise<OutgoingList> {
+    // The mock models human outgoing requests only (no disguised robots); robots stays empty.
+    return { requests: this.outgoing.map((f) => ({ ...f })), robots: [] };
   }
-  async friendRequest(accountId: string): Promise<void> {
+  async friendRequest(accountId: string, _gameId?: string): Promise<void> {
     // The real backend requires a shared game; the mock records the outgoing request so
     // the game's "add to friends" item reads as sent across reloads.
     if (!this.outgoing.some((o) => o.accountId === accountId)) {

ui/src/lib/model.ts

@@ -225,6 +225,23 @@ export interface BlockList {
   robots: RobotBlockEntry[];
 }
 
+// RobotFriendRequestEntry is one per-game friend request to a disguised-robot opponent: a
+// per-game record (not a real account) carrying the game name the player saw and the
+// game/seat it was sent in, so the in-game card can re-mark that seat as already requested.
+export interface RobotFriendRequestEntry {
+  id: string;
+  displayName: string;
+  gameId: string;
+  seat: number;
+}
+
+// OutgoingList is the caller's outgoing friend requests: human addressees already requested
+// (pending or declined) plus the per-game disguised-robot requests.
+export interface OutgoingList {
+  requests: AccountRef[];
+  robots: RobotFriendRequestEntry[];
+}
+
 /** A freshly issued one-time friend code (the plaintext is returned once). */
 export interface FriendCode {
   code: string;

ui/src/lib/transport.ts

@@ -165,8 +165,8 @@ export function createTransport(baseUrl: string): GatewayClient {
     async friendsOutgoing() {
       return codec.decodeOutgoingList(await exec('friends.outgoing', codec.empty()));
     },
-    async friendRequest(accountId) {
-      await exec('friends.request', codec.encodeTarget(accountId));
+    async friendRequest(accountId, gameId) {
+      await exec('friends.request', codec.encodeTarget(accountId, gameId));
     },
     async friendRespond(requesterId, accept) {
       await exec('friends.respond', codec.encodeFriendRespond(requesterId, accept));