fix(a11y): finish the Notice conversion in the appraise form (#137)

* fix(a11y): finish the Notice conversion in the appraise form

The last `&&`-gated Notice in the app, and the one PR #131 missed: a grep for
the pattern across server pages found six, but this one is in a client
component and reads `{state && !state.ok && <Notice/>}` rather than
`{message && <Notice/>}`.

It is the worst instance rather than an afterthought. `useActionState` keeps
this component mounted across a rejection — that is the whole reason it exists
(see the docblock) — so the surrounding tree never moves and the `&&` inserted
a fresh role="alert" node carrying its own text into an otherwise stable
document. In the server-page cases a document-less re-render at least changed
several things at once; here the region's birth IS the only change, which is
precisely the announcement AT handles least reliably.

The visible behaviour is unchanged. The comment's argument — that `state ===
null` covers both "hasn't submitted yet" and "still pending", neither of which
is a rejection worth announcing — is preserved exactly by moving the condition
into the children. Empty children render the reserved `.notice-slot`, which is
positioned out of flow, so the form-stack row gap does not open up.

Cost to a user: an operator on a screen reader who pastes a malformed loot list
into the appraise form is not reliably told the submit was rejected. The form
stays where it is and the paste survives, so nothing else on screen reports it
either.

Gates: node-version, typecheck, lint, format:check, build, npm test
(76 files / 1085 tests) all pass. docker build and test:e2e not run.

* fix(a11y): drop the seal's alt text, which repeated the heading below it (#138)

The login seal carried alt="<brand> emblem" two lines above
<h1>{brand.name}</h1>. Every other decorative image in the app already uses
alt="" — account/page.tsx:473, account/page.tsx:681, and, most directly,
ui.tsx:117, which is the same brand mark rendered immediately before the
wordmark that spells the brand out in text. /login was the one exception.

Cost to a user: a screen-reader visitor to the only page an unauthenticated
person can reach hears the brand name, then the brand name again, before
reaching the motto, the scope disclosure, or the sign-in control. The emblem
communicates nothing the h1 does not, which is the case alt="" exists for.

The EVE SSO mark below keeps its alt: that image is the control's label, not
decoration, and nothing else names it.

The eslint-disable-next-line for @next/next/no-img-element now sits directly
above the <img> again — the new comment goes above it, not between. Inserting
it between broke the directive's adjacency and reintroduced the warning #123
cleared; lint is quoted below to show it is clean.

Gates: node-version, typecheck, lint (0 warnings), format:check, build,
npm test (76 files / 1085 tests) all pass. docker build and test:e2e not run.

Author: guarzo

src/app/login/page.tsx

@@ -75,6 +75,12 @@ export default async function LoginPage({
   return (
     <main className="launch">
       <div className="launch__panel">
+        {/* Empty alt, like the same mark in `SiteHeader` (ui.tsx:117) and every
+            other decorative image in the app: the `<h1>` directly below already
+            carries `brand.name`, so `"<name> emblem"` made a screen reader read
+            the brand twice before reaching anything actionable — on the one
+            page an unauthenticated visitor can get to. The emblem adds nothing
+            the heading does not already say, which is what `alt=""` is for. */}
         {/* eslint-disable-next-line @next/next/no-img-element -- what next/image
             would add here is a re-encode at its default quality 75, and
             PRODUCT.md principle 5 asks for this artwork at "full quality" or not
@@ -88,7 +94,7 @@ export default async function LoginPage({
         <img
           className="launch__seal"
           src={brand.sealUrl}
-          alt={`${brand.name} emblem`}
+          alt=""
           width={180}
           height={180}
         />

src/app/payouts/[id]/appraise-form.tsx

@@ -131,12 +131,20 @@ export function AppraiseForm({
   const form = (
     <form action={formAction} className="form-stack">
       <RuleHead as="h3">Appraise a loot paste</RuleHead>
-      {/* Only rendered once a submit has actually failed — `state === null`
-          covers both "hasn't submitted yet" and "still pending", and neither
-          of those is a rejection worth announcing. */}
-      {state && !state.ok && (
-        <Notice tone="bad">{lookupErrorMessage(OPERATION_ERRORS, state.code)}</Notice>
-      )}
+      {/* Mounted unconditionally, with the condition moved into the children:
+          the text still appears only once a submit has actually failed —
+          `state === null` covers both "hasn't submitted yet" and "still
+          pending", and neither of those is a rejection worth announcing — but
+          the live region now exists before the message does. `useActionState`
+          keeps this component mounted across the rejection, so the `&&` form
+          inserted a fresh `role="alert"` node with its text already inside it
+          into an otherwise stable tree: exactly the shape `Notice`'s docblock
+          (ui.tsx:255-270) calls out as the one that defeats the region it just
+          asked for. Empty children render the reserved `.notice-slot`, which is
+          out of flow and draws nothing, so the form's spacing is unchanged. */}
+      <Notice tone="bad">
+        {state && !state.ok ? lookupErrorMessage(OPERATION_ERRORS, state.code) : null}
+      </Notice>
       <label className="form-stack__field">
         {/* Same hint as the composer's Loot field
             (`../new/new-operation-form.tsx`), which takes the same paste