feat(settings): a Pet page for the mascot

Settings -> Pet (/settings/pet, PetSettings.tsx): show/hide, speech
bubbles, size with a live preview, and the pet grid - Sagi, featured
codex-pets.net pets (downloaded on first pick), your own (deletable) -
with image upload and .codex-pet.zip import. The Sagi block leaves
General; the mascot menu's Pet settings opens the page. PetMenu and the
page share components/Sagi/usePets.ts.

client/src/pages/__tests__/__snapshots__/screens.snapshot.test.tsx.snap

@@ -7678,89 +7678,6 @@ exports[`screen snapshots > Settings 1`] = `
         </div>
       </div>
     </section>
-    <section
-      class="scroll-mt-24"
-      id="sagi"
-    >
-      <h3
-        class="text-sm font-medium text-fg-secondary flex items-center gap-2 mb-1"
-      >
-        <span
-          aria-hidden="true"
-          class="text-base leading-none"
-        >
-          🦸
-        </span>
-        Sagi companion
-      </h3>
-      <p
-        class="text-xs text-fg-muted mb-4"
-      >
-        A floating mascot that reacts to your live sessions.
-      </p>
-      <div
-        class="card p-5"
-      >
-        <div
-          class="flex items-center gap-3"
-        >
-          <div
-            class="w-10 h-10 rounded-xl flex items-center justify-center transition-colors bg-blue-600/10 border border-blue-600/20"
-          >
-            <span
-              aria-hidden="true"
-              class="text-lg leading-none"
-            >
-              🦸
-            </span>
-          </div>
-          <div
-            class="min-w-0 flex-1"
-          >
-            <div
-              class="flex justify-between gap-4 border-b border-border/60 last:border-b-0 py-3 items-center"
-            >
-              <div
-                class="min-w-0"
-              >
-                <p
-                  class="text-sm text-fg-secondary"
-                >
-                  Show Sagi
-                </p>
-                <p
-                  class="mt-0.5 text-xs text-fg-muted"
-                >
-                  Display the corner companion across the dashboard (⌘B to open)
-                </p>
-              </div>
-              <div
-                class="shrink-0"
-              >
-                <button
-                  aria-checked="true"
-                  aria-label="Show Sagi"
-                  class="relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/40 disabled:cursor-not-allowed disabled:opacity-50 bg-accent"
-                  role="switch"
-                  type="button"
-                >
-                  <span
-                    aria-hidden="true"
-                    class="inline-block h-4 w-4 rounded-full bg-white shadow transition-transform translate-x-[18px]"
-                  />
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-        <p
-          class="mt-3 text-xs text-fg-muted"
-          data-testid="sagi-pet-hint"
-        >
-          Right-click the mascot to choose its pet — Sagi, a featured or imported Codex pet, or your own image — and its size.
-        </p>
-      </div>
-    </section>
     <section
       class="scroll-mt-24"
       id="data"