Port the Pokégear, phone calls and Mom's bank

POKéGEAR in the start menu runs the clock, Town Map and phone cards with
the original joypad rules. Calls to Elm and Mom run their callee scripts,
with the out-of-area and out-of-hours cases and HangUp's corrected timing.
Mom saves a quarter of trainer prizes once asked, talking to her at home
opens BankOfMom (GET, SAVE, CHANGE and the DST checks) with its digit
amount box, and MomTriesToBuySomething buys items and dolls with her
savings. Saves gain Mom's money, her next item and its trigger balance.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/game/rendering/town-map.ts

@@ -3,12 +3,19 @@ import { OVERWORLD, SYMBOLS } from "../rom/profile";
 import { decompress } from "../rom/lz";
 import { drawTile } from "./pixels";
 
-/** The ROM's Town Map, used by wall maps and the bedroom poster. */
-export function drawTownMap(canvas: HTMLCanvasElement, world: GameWorld) {
+/** The ROM's Town Map, used by wall maps, the bedroom poster and the
+ * Pokégear's map card, which chooses the region and marks the landmark
+ * under its cursor. */
+export function drawTownMap(
+  canvas: HTMLCanvasElement,
+  world: GameWorld,
+  card?: { kanto: boolean; player: number; cursor: number; name: string },
+) {
   const { assets } = world,
     r = assets.reader;
-  const landmark = world.map.landmark;
-  const map = landmark >= 47 ? OVERWORLD.KantoMap : OVERWORLD.JohtoMap;
+  const landmark = card?.player ?? world.map.landmark;
+  const kanto = card?.kanto ?? landmark >= 47;
+  const map = kanto ? OVERWORLD.KantoMap : OVERWORLD.JohtoMap;
   const graphics = decompress(r, OVERWORLD.TownMapGFX, 0x1000);
   const palette =
     world.avatar === "kris"
@@ -37,8 +44,24 @@ export function drawTownMap(canvas: HTMLCanvasElement, world: GameWorld) {
   }
   context.putImageData(image, 0, 0);
   // Landmark coordinates are the same ones TownMapPlayerIcon uses.
-  const p = SYMBOLS.landmarks + landmark * 4;
+  const at = (index: number) => {
+    const p = SYMBOLS.landmarks + index * 4;
+    return { x: r.byte(p) - 8, y: r.byte(p + 1) - 16 };
+  };
+  const player = at(landmark);
   context.fillStyle = "#b32628";
-  context.fillRect(r.byte(p) - 10, r.byte(p + 1) - 18, 4, 4);
-  canvas.setAttribute("aria-label", `Town Map: ${world.map.location}`);
+  context.fillRect(player.x - 2, player.y - 2, 4, 4);
+  if (card) {
+    // The Pokégear's arrow cursor, drawn as a frame around the landmark.
+    const cursor = at(card.cursor);
+    context.strokeStyle = "#2366a5";
+    context.lineWidth = 2;
+    context.strokeRect(cursor.x - 5, cursor.y - 5, 10, 10);
+  }
+  canvas.setAttribute(
+    "aria-label",
+    card
+      ? `Town Map: ${card.name}${card.cursor === card.player ? ", you are here" : ""}`
+      : `Town Map: ${world.map.location}`,
+  );
 }