feat(ui): map canvas follows light/dark theme; fix invisible gear control

The map view now selects a DARK_THEME or LIGHT_THEME palette from the
resolved app theme and threads it through every primitive builder, so
the canvas, planets, ship groups, cargo routes, battle/bombing markers,
fog, reach + selection rings, pending-Send tracks, and the pick overlay
all switch with the rest of the chrome. A theme flip remounts the
renderer preserving the camera — Pixi bakes the background at init and
every primitive bakes its colour at build, so a live re-tint is not
possible on the same instance.

This also fixes the reported bug: the gear-popover trigger and the
loading overlay hardcoded a dark navy background, so in light theme the
gear was invisible (dark icon on dark chip) until hover flipped it to a
white chip. Both now use the --color-surface-overlay token and read
correctly in both themes.

The light palette mirrors the dark one role-for-role, darkened /
saturated for contrast on a light background while keeping the incoming,
battle, and bombing accents vivid. The values are a first pass meant to
be refined during the F8 manual-QA loop.

Removes the now-dead "Phase 35" references from the code and lifts the
map-recoloring prohibition from the design-system / renderer docs; the
battle scene stays a fixed-palette data-viz surface.

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

ui/frontend/src/map/reach-circles.ts

@@ -11,9 +11,8 @@
 // clears the map in one turn therefore shows a single ring; a slow ship
 // shows all three.
 
-import type { CirclePrim } from "./world";
+import { DARK_THEME, type CirclePrim, type Theme } from "./world";
 
-export const REACH_CIRCLE_COLOR = 0x6d8cff;
 /** High-bit prefix so reach-circle ids never collide with planet
  * numbers, cargo-route lines, or battle/bombing markers. */
 export const REACH_CIRCLE_ID_PREFIX = 0xb0000000;
@@ -47,7 +46,8 @@ export function reachBound(
  * centred on `origin`, with radii speedPerTurn × {1, 2, 3}. A ring for
  * turn `t` is included only when the previous ring still fits inside the
  * map's reach bound, so the count shrinks as the per-turn speed grows.
- * Returns an empty list when the speed is non-positive.
+ * Returns an empty list when the speed is non-positive. `theme`
+ * supplies the ring colour and defaults to `DARK_THEME`.
  */
 export function computeReachCircles(
 	origin: { x: number; y: number },
@@ -55,6 +55,7 @@ export function computeReachCircles(
 	mapWidth: number,
 	mapHeight: number,
 	mode: "torus" | "no-wrap",
+	theme: Theme = DARK_THEME,
 ): CirclePrim[] {
 	if (speedPerTurn <= 0) return [];
 	const bound = reachBound(origin, mapWidth, mapHeight, mode);
@@ -71,7 +72,7 @@ export function computeReachCircles(
 			y: origin.y,
 			radius: speedPerTurn * turn,
 			style: {
-				strokeColor: REACH_CIRCLE_COLOR,
+				strokeColor: theme.reachCircle,
 				strokeAlpha: 0.55 - (turn - 1) * 0.12,
 				strokeWidthPx: 0.5,
 			},