diff --git a/public/data/web_atlas.json b/public/data/web_atlas.json
index e5206d2..a0a3150 100644
--- a/public/data/web_atlas.json
+++ b/public/data/web_atlas.json
@@ -3871,10 +3871,93 @@
         ]
       ]
     },
-    "generator4": {
+    "cooler7": {
       "frame": {
         "x": 1226,
         "y": 920,
+        "w": 180,
+        "h": 156
+      },
+      "rotated": false,
+      "trimmed": false,
+      "spriteSourceSize": {
+        "x": 0,
+        "y": 0,
+        "w": 180,
+        "h": 156
+      },
+      "sourceSize": {
+        "w": 180,
+        "h": 156
+      },
+      "anchor": {
+        "x": 0.5,
+        "y": 0.49029721881422206
+      },
+      "pixelsToUnits": 100.0,
+      "hitAreas": [
+        [
+          79.0,
+          10.5,
+          79.0,
+          -16.5,
+          65.0,
+          -29.5,
+          55.0,
+          -32.5,
+          42.0,
+          -28.5,
+          41.0,
+          -57.5,
+          38.0,
+          -63.5,
+          19.0,
+          -76.5,
+          7.0,
+          -76.5,
+          1.0,
+          -75.5,
+          -37.0,
+          -51.5,
+          -45.0,
+          -41.5,
+          -44.0,
+          -12.5,
+          -63.0,
+          -8.5,
+          -73.0,
+          -2.5,
+          -77.0,
+          0.5,
+          -83.0,
+          15.5,
+          -83.0,
+          41.5,
+          -80.0,
+          44.5,
+          -72.0,
+          51.5,
+          -52.0,
+          49.5,
+          -48.0,
+          63.5,
+          -37.0,
+          71.5,
+          -16.0,
+          71.5,
+          4.0,
+          68.5,
+          65.0,
+          32.5,
+          70.0,
+          27.5
+        ]
+      ]
+    },
+    "generator4": {
+      "frame": {
+        "x": 1408,
+        "y": 920,
         "w": 172,
         "h": 154
       },
@@ -3956,7 +4039,7 @@
     },
     "generator3": {
       "frame": {
-        "x": 1400,
+        "x": 1582,
         "y": 920,
         "w": 158,
         "h": 150
@@ -4035,7 +4118,7 @@
     },
     "black_hole_reactor": {
       "frame": {
-        "x": 1560,
+        "x": 1742,
         "y": 920,
         "w": 192,
         "h": 147
@@ -4356,81 +4439,6 @@
         ]
       ]
     },
-    "cooler7": {
-      "frame": {
-        "x": 1754,
-        "y": 920,
-        "w": 181,
-        "h": 143
-      },
-      "rotated": false,
-      "trimmed": false,
-      "spriteSourceSize": {
-        "x": 0,
-        "y": 0,
-        "w": 181,
-        "h": 143
-      },
-      "sourceSize": {
-        "w": 181,
-        "h": 143
-      },
-      "anchor": {
-        "x": 0.5,
-        "y": 0.5
-      },
-      "pixelsToUnits": 100.0,
-      "hitAreas": [
-        [
-          76.5,
-          -9.5,
-          71.5,
-          -14.5,
-          64.5,
-          -19.5,
-          55.5,
-          -18.5,
-          51.5,
-          -39.5,
-          29.5,
-          -55.5,
-          -1.5,
-          -71.5,
-          -10.5,
-          -71.5,
-          -47.5,
-          -50.5,
-          -55.5,
-          -40.5,
-          -60.5,
-          -6.5,
-          -70.5,
-          -0.5,
-          -79.5,
-          9.5,
-          -79.5,
-          32.5,
-          -67.5,
-          42.5,
-          -43.5,
-          44.5,
-          -37.5,
-          57.5,
-          -25.5,
-          65.5,
-          -5.5,
-          65.5,
-          -0.5,
-          64.5,
-          9.5,
-          60.5,
-          65.5,
-          30.5,
-          76.5,
-          17.5
-        ]
-      ]
-    },
     "cooler8": {
       "frame": {
         "x": 2,
@@ -4451,58 +4459,58 @@
         "h": 143
       },
       "anchor": {
-        "x": 0.5,
+        "x": 0.5000739022397732,
         "y": 0.5
       },
       "pixelsToUnits": 100.0,
       "hitAreas": [
         [
-          76.5,
-          -9.5,
-          71.5,
-          -14.5,
-          64.5,
-          -19.5,
-          55.5,
-          -18.5,
-          51.5,
-          -39.5,
-          29.5,
+          73.5,
+          15.5,
+          73.5,
+          -21.5,
+          68.5,
+          -29.5,
+          65.5,
+          -31.5,
+          25.5,
           -55.5,
-          -1.5,
+          -3.5,
           -71.5,
-          -10.5,
+          -11.5,
           -71.5,
-          -47.5,
-          -50.5,
-          -55.5,
-          -40.5,
-          -60.5,
-          -6.5,
-          -70.5,
-          -0.5,
+          -23.5,
+          -65.5,
+          -53.5,
+          -46.5,
+          -65.5,
+          -9.5,
+          -76.5,
+          -3.5,
           -79.5,
-          9.5,
+          1.5,
+          -81.5,
+          16.5,
+          -81.5,
+          41.5,
           -79.5,
-          32.5,
-          -67.5,
-          42.5,
-          -43.5,
-          44.5,
-          -37.5,
-          57.5,
-          -25.5,
-          65.5,
-          -5.5,
-          65.5,
-          -0.5,
-          64.5,
-          9.5,
-          60.5,
-          65.5,
-          30.5,
-          76.5,
-          17.5
+          45.5,
+          -72.5,
+          47.5,
+          -44.5,
+          40.5,
+          -44.5,
+          62.5,
+          -40.5,
+          67.5,
+          -33.5,
+          67.5,
+          -24.5,
+          62.5,
+          0.5,
+          61.5,
+          62.5,
+          27.5
         ]
       ]
     },
diff --git a/public/data/web_atlas.webp b/public/data/web_atlas.webp
index 945c741..4f521df 100644
Binary files a/public/data/web_atlas.webp and b/public/data/web_atlas.webp differ
diff --git a/public/icons/anomaly_buff_cooling_pool.webp b/public/icons/anomaly_buff_cooling_pool.webp
new file mode 100644
index 0000000..f7ad70c
Binary files /dev/null and b/public/icons/anomaly_buff_cooling_pool.webp differ
diff --git a/public/icons/anomaly_buff_crowded.webp b/public/icons/anomaly_buff_crowded.webp
new file mode 100644
index 0000000..4838522
Binary files /dev/null and b/public/icons/anomaly_buff_crowded.webp differ
diff --git a/public/icons/anomaly_buff_isolated.webp b/public/icons/anomaly_buff_isolated.webp
new file mode 100644
index 0000000..ff16c93
Binary files /dev/null and b/public/icons/anomaly_buff_isolated.webp differ
diff --git a/public/icons/anomaly_buff_waterside.webp b/public/icons/anomaly_buff_waterside.webp
new file mode 100644
index 0000000..f96e8be
Binary files /dev/null and b/public/icons/anomaly_buff_waterside.webp differ
diff --git a/public/icons/cooler7.webp b/public/icons/cooler7.webp
index 2f5dfc8..02a55eb 100644
Binary files a/public/icons/cooler7.webp and b/public/icons/cooler7.webp differ
diff --git a/public/icons/cooler8.webp b/public/icons/cooler8.webp
index 808e7b9..45d6ea2 100644
Binary files a/public/icons/cooler8.webp and b/public/icons/cooler8.webp differ
diff --git a/public/icons/status_gauge.webp b/public/icons/status_gauge.webp
new file mode 100644
index 0000000..11db4a1
Binary files /dev/null and b/public/icons/status_gauge.webp differ
diff --git a/public/icons/status_idle.webp b/public/icons/status_idle.webp
new file mode 100644
index 0000000..08b4a3a
Binary files /dev/null and b/public/icons/status_idle.webp differ
diff --git a/public/icons/status_offline.webp b/public/icons/status_offline.webp
new file mode 100644
index 0000000..1ba550d
Binary files /dev/null and b/public/icons/status_offline.webp differ
diff --git a/public/icons/status_overheated.webp b/public/icons/status_overheated.webp
new file mode 100644
index 0000000..ce48c8e
Binary files /dev/null and b/public/icons/status_overheated.webp differ
diff --git a/src/lib/components/canvas/PixiCanvas.svelte b/src/lib/components/canvas/PixiCanvas.svelte
index 2953613..ac9f5f7 100755
--- a/src/lib/components/canvas/PixiCanvas.svelte
+++ b/src/lib/components/canvas/PixiCanvas.svelte
@@ -7,7 +7,15 @@
     uiState,
     viewportState,
   } from "../../state";
-  import { createPlacement } from "../../data/placements";
+  import {
+    createPlacement,
+    gameStatuses,
+    placementFillPercent,
+  } from "../../data/placements";
+  import { BUILDINGS, findBuilding } from "@reactor2/solver";
+  import { ratedPlacements, ratingShifts } from "../../simulation/simulator";
+  import { anomalyIconFor, STATE_ICON } from "../../data/boardIcons";
+  import type { BuildingOverlay } from "../../pixi/gridPainter";
   import { onMount, onDestroy, untrack } from "svelte";
   import { Application, Container, Rectangle } from "pixi.js";
   import { loadAtlas } from "../../pixi/atlas";
@@ -839,6 +847,55 @@
     recenterGrid();
   });
 
+  /*
+   * What each visible building wears beyond its sprite and pad, aligned with
+   * `visiblePlacements`.
+   *
+   * The badge figure is a fraction of what the scorer rated the building for on
+   * this board — the readout's ceiling, so a badge reading 70% and the card's
+   * `600 / 852` are one measurement — and only computed while the setting is
+   * on. The anomaly icon shows where the scorer rated the building off its
+   * plain tier, so it marks exactly the buildings an anomaly moved. Both rate
+   * the whole board in one pass, since a rule can rate a tile by what its
+   * neighbours are, and both take the rules from `layoutState` exactly as the
+   * readout does.
+   */
+  let buildingOverlays = $derived.by((): BuildingOverlay[] => {
+    const placements = uiState.visiblePlacements;
+    const grid = layoutState.grid;
+    const prestige = layoutState.placementPrestige;
+    const anomaly = layoutState.placementAnomaly;
+    // Rated unconditionally: the state icons need the ceilings as much as the
+    // gauges do — a generator is only "wasting heat" at full capacity.
+    const rated = ratedPlacements(
+      grid,
+      BUILDINGS,
+      placements,
+      prestige,
+      anomaly,
+    );
+    const states = gameStatuses(
+      placements,
+      rated,
+      anomaly.rule === "shared_cooling",
+    );
+    const showFill = uiState.fillBadges;
+    const shifts =
+      anomaly.rule === "baseline"
+        ? null
+        : ratingShifts(grid, BUILDINGS, placements, prestige, anomaly);
+    return placements.map((p, i) => {
+      const r = rated[i];
+      const role = findBuilding(p.buildingId)?.type;
+      return {
+        fill: showFill && r ? placementFillPercent(p, r) : null,
+        stateIcon: STATE_ICON[states[i]],
+        anomalyIcon:
+          shifts && role ? anomalyIconFor(anomaly, shifts[i], role) : null,
+      };
+    });
+  });
+
   $effect(() => {
     const curW = layoutState.width;
     const curH = layoutState.height;
@@ -848,6 +905,7 @@
     // inspector reads the same getter — so the card can never describe a
     // building that is not the one being drawn.
     const activePlacements = uiState.visiblePlacements;
+    const overlays = buildingOverlays;
 
     // Ghosts only while restore mode is on — see `editorState.restoreMode`.
     const ghosts = editorState.restoreMode
@@ -875,7 +933,13 @@
        * correctness depend on an accidental re-run. Both edges are plain
        * variables and the paint is spelled out.
        */
-      gridRenderer.updateState(currentGrid, curW, curH, activePlacements);
+      gridRenderer.updateState(
+        currentGrid,
+        curW,
+        curH,
+        activePlacements,
+        overlays,
+      );
       gridRenderer.setGhosts(ghosts);
     }
   });
diff --git a/src/lib/components/modals/SettingsModal.svelte b/src/lib/components/modals/SettingsModal.svelte
index 0a22825..eb80bcd 100755
--- a/src/lib/components/modals/SettingsModal.svelte
+++ b/src/lib/components/modals/SettingsModal.svelte
@@ -1,6 +1,12 @@
 <script lang="ts">
   import { uiState } from "../../state";
-  import { ChartColumn, ImageDown, Sparkles, Vibrate } from "lucide-svelte";
+  import {
+    ChartColumn,
+    Gauge,
+    ImageDown,
+    Sparkles,
+    Vibrate,
+  } from "lucide-svelte";
   import type { ImageScale } from "../../types/ui";
   import { EXPORT_MAX_SIDE_PX } from "../../pixi/boardExport";
   import ModalShell from "./ModalShell.svelte";
@@ -50,6 +56,12 @@
         : "Placing and clearing buildings stay silent.",
   );
 
+  let fillBadgesHint = $derived(
+    uiState.fillBadges
+      ? "Each building shows how hard it is working, as in the game."
+      : "Building figures stay in the readout; tap a building to see them.",
+  );
+
   /*
    * Says what is collected rather than what the switch is called: "analytics"
    * alone invites the reader to assume the worst. The first branch does the
@@ -114,6 +126,25 @@
         </button>
       </div>
 
+      <div class="setting">
+        <span class="icon"><Gauge size={16} /></span>
+
+        <span class="text">
+          <span class="name" id="setting-fill-badges">Building gauges</span>
+          <span class="hint">{fillBadgesHint}</span>
+        </span>
+
+        <button
+          class="switch"
+          role="switch"
+          aria-checked={uiState.fillBadges}
+          aria-labelledby="setting-fill-badges"
+          onclick={() => uiState.setFillBadges(!uiState.fillBadges)}
+        >
+          <span class="track"><span class="knob"></span></span>
+        </button>
+      </div>
+
       <!-- Affirmative, though stored as the negative: every switch in this
            list is lit when the thing it names is happening. -->
       <div class="setting">
diff --git a/src/lib/data/boardIcons.test.ts b/src/lib/data/boardIcons.test.ts
new file mode 100644
index 0000000..2fc114a
--- /dev/null
+++ b/src/lib/data/boardIcons.test.ts
@@ -0,0 +1,46 @@
+import { describe, expect, it } from "vitest";
+import { getAnomaly } from "@reactor2/solver";
+import { anomalyIconFor, STATE_ICON } from "./boardIcons";
+
+describe("anomalyIconFor", () => {
+  const SINGULARITY = getAnomaly("singularity_isolation");
+  const TIDAL = getAnomaly("tidal_ascendancy");
+  const CRYO = getAnomaly("cryo_nexus");
+
+  it("shows nothing where the scorer moved nothing", () => {
+    expect(anomalyIconFor(SINGULARITY, null, "generator")).toBeNull();
+    expect(anomalyIconFor(getAnomaly(undefined), "up", "reactor")).toBeNull();
+  });
+
+  it("has both of the game's Singularity icons", () => {
+    expect(anomalyIconFor(SINGULARITY, "up", "generator")).toBe(
+      "anomaly_buff_isolated",
+    );
+    expect(anomalyIconFor(SINGULARITY, "down", "generator")).toBe(
+      "anomaly_buff_crowded",
+    );
+  });
+
+  it("marks a waterside building under Tidal, and a cooler under Cryo", () => {
+    expect(anomalyIconFor(TIDAL, "up", "reactor")).toBe(
+      "anomaly_buff_waterside",
+    );
+    expect(anomalyIconFor(CRYO, "down", "cooler")).toBe(
+      "anomaly_buff_cooling_pool",
+    );
+    expect(anomalyIconFor(CRYO, "down", "generator")).toBeNull();
+  });
+});
+
+describe("STATE_ICON", () => {
+  it("marks every state that needs the player, and nothing that is fine", () => {
+    expect(STATE_ICON).toEqual({
+      offline: "status_offline",
+      idle: "status_idle",
+      overheated: "status_overheated",
+      wasting_heat: "status_gauge",
+      stable: null,
+      online: null,
+    });
+  });
+});
diff --git a/src/lib/data/boardIcons.ts b/src/lib/data/boardIcons.ts
new file mode 100644
index 0000000..b45603d
--- /dev/null
+++ b/src/lib/data/boardIcons.ts
@@ -0,0 +1,78 @@
+import type { AnomalyDefinition, BuildingType } from "@reactor2/solver";
+import type { RatingShift } from "../simulation/simulator";
+import type { GameStatus } from "./placements";
+
+/**
+ * The per-building icons the game draws on the board, by the name of the file
+ * each ships as (`icons/<name>.webp`). Both families are read straight out of
+ * the game: the state icons are `SpritesDB`'s per-state sprites, and the
+ * anomaly icons are the sprites each anomaly hands its `anomalyIconRenderer`.
+ */
+export const BOARD_ICONS = [
+  "status_offline",
+  "status_idle",
+  "status_overheated",
+  "status_gauge",
+  "anomaly_buff_isolated",
+  "anomaly_buff_crowded",
+  "anomaly_buff_waterside",
+  "anomaly_buff_cooling_pool",
+] as const;
+
+export type BoardIcon = (typeof BOARD_ICONS)[number];
+
+/**
+ * The icon over a building, by the game's state for it, or null over one that
+ * is simply working.
+ *
+ * `SpritesDB`'s sprites, chosen by what each state asks of the player: the red
+ * triangle (NotWorking) for a building with nothing to work with beside it,
+ * zzz (Idle) for one whose partners do not need it, the warning thermometer
+ * (Overheated) for a power source shut down by its waste, and the gauge for a
+ * generator that cannot take what its reactors offer — the prefab's own
+ * `ICON_wastingheatStatus` child, which is the same `status_gauge` sprite the
+ * fill badge carries, not `SpritesDB`'s WastingHeat thermometer. The game's Stable and Online sprites are left off the board on
+ * purpose — it draws nothing over a building that is fine, and nor does this.
+ */
+export const STATE_ICON: Record<GameStatus, BoardIcon | null> = {
+  offline: "status_offline",
+  idle: "status_idle",
+  overheated: "status_overheated",
+  wasting_heat: "status_gauge",
+  stable: null,
+  online: null,
+};
+
+/**
+ * The anomaly icon at a building's foot, or null for none.
+ *
+ * `shift` is whether the scorer rated this building above or below its plain
+ * tier (`ratingShifts`), which is what decides *whether* an icon shows; the
+ * rule only decides *which*. Keyed on the rule rather than the anomaly id
+ * because each rule's art is the same across its variants — the pre-nerf Tidal
+ * wears the same wave as the live one.
+ *
+ * - **Role isolation** (Singularity) has both directions: the game's
+ *   `boostedIcon` for a generator standing alone, `downgradedIcon` for one
+ *   touching another.
+ * - **Terrain affinity** (Tidal) only ever raises a waterside building.
+ * - **Shared cooling** (Cryo Nexus) scales every cooler, and the game marks
+ *   each one with its cooler icon whichever way the scale points.
+ */
+export function anomalyIconFor(
+  anomaly: AnomalyDefinition,
+  shift: RatingShift | null,
+  role: BuildingType,
+): BoardIcon | null {
+  if (shift === null) return null;
+  switch (anomaly.rule) {
+    case "role_isolation":
+      return shift === "up" ? "anomaly_buff_isolated" : "anomaly_buff_crowded";
+    case "terrain_affinity":
+      return shift === "up" ? "anomaly_buff_waterside" : null;
+    case "shared_cooling":
+      return role === "cooler" ? "anomaly_buff_cooling_pool" : null;
+    case "baseline":
+      return null;
+  }
+}
diff --git a/src/lib/data/placements.test.ts b/src/lib/data/placements.test.ts
new file mode 100644
index 0000000..3a1219a
--- /dev/null
+++ b/src/lib/data/placements.test.ts
@@ -0,0 +1,116 @@
+import { describe, expect, it } from "vitest";
+import type { EffectiveBuilding } from "@reactor2/solver";
+import {
+  gameStatuses,
+  placementFillPercent,
+  unscoredPlacement,
+} from "./placements";
+
+function rated(
+  type: EffectiveBuilding["type"],
+  effectiveValue: number,
+  energy = 0,
+): EffectiveBuilding {
+  return { id: "x", type, effectiveValue, energy, waste: 0, baseValue: 0 };
+}
+
+describe("placementFillPercent", () => {
+  it("gauges a generator by the heat it takes in — the game's 600 / 852", () => {
+    const p = { ...unscoredPlacement("g", 0, 0, 0), heatConsumed: 600 };
+    expect(placementFillPercent(p, rated("generator", 852))).toBe(70);
+  });
+
+  it("gauges each other role by its own figure", () => {
+    const base = unscoredPlacement("b", 0, 0, 0);
+    expect(
+      placementFillPercent(
+        { ...base, coolingProvided: 152 },
+        rated("cooler", 760),
+      ),
+    ).toBe(20);
+    expect(
+      placementFillPercent(
+        { ...base, heatProduced: 300 },
+        rated("reactor", 300),
+      ),
+    ).toBe(100);
+    expect(
+      placementFillPercent(
+        { ...base, powerGenerated: 5 },
+        rated("direct_producer", 99, 10),
+      ),
+    ).toBe(50);
+  });
+
+  it("reads 0 against no ceiling, and never past 100", () => {
+    const base = unscoredPlacement("b", 0, 0, 0);
+    expect(placementFillPercent(base, rated("cooler", 0))).toBe(0);
+    expect(
+      placementFillPercent(
+        { ...base, heatProduced: 301 },
+        rated("reactor", 300),
+      ),
+    ).toBe(100);
+  });
+});
+
+describe("gameStatuses", () => {
+  type Row = Parameters<typeof gameStatuses>[0][number];
+  const at = (
+    id: string,
+    x: number,
+    y: number,
+    figures: Partial<Row> = {},
+  ): Row => ({ ...unscoredPlacement(id, x, y, 0), ...figures });
+
+  const REACTOR = rated("reactor", 300);
+  const GEN = rated("generator", 852, 636);
+  const COOLER = rated("cooler", 760);
+
+  it("calls a generator with no heat source beside it offline", () => {
+    expect(gameStatuses([at("g", 0, 0)], [GEN])).toEqual(["offline"]);
+  });
+
+  it("calls an unused building with a partner beside it idle", () => {
+    // A reactor diagonal to a generator that takes nothing from it: in reach,
+    // not needed.
+    expect(
+      gameStatuses([at("r", 0, 0), at("g", 1, 1)], [REACTOR, GEN]),
+    ).toEqual(["idle", "idle"]);
+  });
+
+  it("calls a power source its cooling does not cover overheated", () => {
+    const g = at("g", 1, 0, { heatConsumed: 600, wasteHeatGenerated: 150 });
+    expect(gameStatuses([at("r", 0, 0), g], [REACTOR, GEN])[1]).toBe(
+      "overheated",
+    );
+  });
+
+  it("calls a full generator beside a reactor with heat left wasting heat", () => {
+    const covered = { wasteHeatGenerated: 216, coolingReceived: 216 };
+    const full = at("g", 1, 0, {
+      heatConsumed: 852,
+      powerGenerated: 636,
+      ...covered,
+    });
+    const leftover = at("r", 0, 0, { heatProduced: 200 });
+    expect(gameStatuses([leftover, full], [REACTOR, GEN])[1]).toBe(
+      "wasting_heat",
+    );
+
+    const spent = at("r", 0, 0, { heatProduced: 300 });
+    expect(gameStatuses([spent, full], [REACTOR, GEN])[1]).toBe("stable");
+
+    // 91% used is under the game's tenth: still Stable. 89% is over it.
+    const mostly = at("r", 0, 0, { heatProduced: 273 });
+    expect(gameStatuses([mostly, full], [REACTOR, GEN])[1]).toBe("stable");
+    const short = at("r", 0, 0, { heatProduced: 267 });
+    expect(gameStatuses([short, full], [REACTOR, GEN])[1]).toBe("wasting_heat");
+  });
+
+  it("lets a Cryo cooler serve a power source anywhere on the board", () => {
+    const rows = [at("c", 0, 0), at("g", 5, 5)];
+    expect(gameStatuses(rows, [COOLER, GEN], false)[0]).toBe("offline");
+    expect(gameStatuses(rows, [COOLER, GEN], true)[0]).toBe("idle");
+  });
+});
diff --git a/src/lib/data/placements.ts b/src/lib/data/placements.ts
index b8a7ac6..739b8ce 100755
--- a/src/lib/data/placements.ts
+++ b/src/lib/data/placements.ts
@@ -1,4 +1,5 @@
 import type { PlacedBuilding } from "../types";
+import type { EffectiveBuilding } from "@reactor2/solver";
 import { findBuilding, levelValue } from "@reactor2/solver";
 import { wasteIsCovered } from "@reactor2/solver";
 
@@ -177,3 +178,168 @@ export function placementStatus(p: PlacedBuilding): PlacementStatus {
   }
   return "active";
 }
+
+/**
+ * How hard a scored building is working, as a whole percentage of what its
+ * tile rated it for — the gauge the game prints over every building.
+ *
+ * One figure per role, and it is the one the game fills: the heat a reactor
+ * sends out, the heat a generator takes in (600 of 852 reads 70%), the cooling
+ * a cooler gives, the energy a direct producer makes. A generator is gauged by
+ * its *input* rather than its energy so a starved one still says how much heat
+ * is reaching it — its pad already says that none of it is turning into power.
+ *
+ * `rated` must come from the scorer (`ratedPlacements`), not the roster: the
+ * figure is only a fraction of the ceiling it was measured against.
+ */
+export function placementFillPercent(
+  p: PlacedBuilding,
+  rated: EffectiveBuilding,
+): number {
+  let used: number;
+  let max: number;
+  switch (rated.type) {
+    case "cooler":
+      used = p.coolingProvided;
+      max = rated.effectiveValue;
+      break;
+    case "reactor":
+      used = p.heatProduced;
+      max = rated.effectiveValue;
+      break;
+    case "generator":
+      used = p.heatConsumed;
+      max = rated.effectiveValue;
+      break;
+    case "direct_producer":
+      used = p.powerGenerated;
+      max = rated.energy;
+      break;
+  }
+  if (!(max > 0)) return 0;
+  return Math.max(0, Math.min(100, Math.round((used / max) * 100)));
+}
+
+/**
+ * What the game would call a placed building's state — the finer reading its
+ * status panel and board icons use, where `PlacementStatus` is the three-way
+ * one the pads and the readout's counts speak.
+ *
+ * Every case is the game's own term, defined by its own description text:
+ *
+ * - `offline` — nothing it can work with is adjacent. "Place a Generator on an
+ *   adjacent tile to power it up." A generator with no heat source beside it,
+ *   a reactor with no generator, a cooler with no power source.
+ * - `idle` — partners are adjacent but nothing flows, so it is not needed:
+ *   "Generators are nearby but don't need heat. They may be saturated."
+ * - `overheated` — a power source whose waste the cooling does not cover, and
+ *   which has shut down. (`starved`, in `PlacementStatus`.)
+ * - `wasting_heat` — a generator "running at full capacity, but nearby heat
+ *   producers are generating more heat than it can handle". The game only
+ *   says so once a reactor beside it leaves more than `WASTING_UNUSED_SHARE`
+ *   of its heat unsent: a reactor at 91% does not trip it.
+ * - `stable` / `online` — working: `stable` for a power source, `online` for
+ *   a reactor or cooler, as the game words it.
+ */
+export type GameStatus =
+  "offline" | "idle" | "overheated" | "wasting_heat" | "stable" | "online";
+
+/** Within this fraction of a ceiling counts as at it — float noise, not slack. */
+const AT_CAPACITY = 1e-6;
+
+/**
+ * How much of an adjacent reactor's heat has to go unsent before the game
+ * calls a full generator "wasting heat" — more than a tenth. Below that it
+ * still reads Stable, so a reactor at 91% use beside a full generator shows
+ * nothing.
+ */
+const WASTING_UNUSED_SHARE = 0.1;
+
+/**
+ * The game's state for each placement, aligned with `placements`.
+ *
+ * `rated` is `ratedPlacements` over the same rows — a generator is only at full
+ * capacity, and a reactor only has heat left over, against what its tile rated
+ * it for. `sharedCooling` is the Cryo Nexus pool, under which a cooler serves
+ * every power source on the board rather than its neighbours, so being offline
+ * is a question about the board and not about the tiles around it.
+ *
+ * Adjacency is the game's: the eight tiles around, corners included.
+ */
+export function gameStatuses(
+  placements: readonly PlacedBuilding[],
+  rated: readonly (EffectiveBuilding | null)[],
+  sharedCooling = false,
+): GameStatus[] {
+  const at = new Map<string, number>();
+  placements.forEach((p, i) => at.set(`${p.x},${p.y}`, i));
+  const roleOf = (i: number) =>
+    rated[i]?.type ?? findBuilding(placements[i].buildingId)?.type;
+
+  function neighbours(p: PlacedBuilding): number[] {
+    const out: number[] = [];
+    for (let dy = -1; dy <= 1; dy++)
+      for (let dx = -1; dx <= 1; dx++) {
+        if (dx === 0 && dy === 0) continue;
+        const j = at.get(`${p.x + dx},${p.y + dy}`);
+        if (j !== undefined) out.push(j);
+      }
+    return out;
+  }
+
+  const isPowerSource = (i: number) => {
+    const r = roleOf(i);
+    return r === "generator" || r === "direct_producer";
+  };
+  const anyPowerSource = placements.some((_, i) => isPowerSource(i));
+
+  /** Whether anything this building can work with is in reach. */
+  function hasPartner(i: number): boolean {
+    const near = neighbours(placements[i]);
+    switch (roleOf(i)) {
+      case "generator":
+        return near.some((j) => roleOf(j) === "reactor");
+      case "reactor":
+        return near.some((j) => roleOf(j) === "generator");
+      case "cooler":
+        return sharedCooling ? anyPowerSource : near.some(isPowerSource);
+      default:
+        return false;
+    }
+  }
+
+  /** A full generator beside a reactor leaving over a tenth of its heat. */
+  function isWastingHeat(i: number): boolean {
+    const max = rated[i];
+    if (!max || max.type !== "generator" || !(max.effectiveValue > 0)) {
+      return false;
+    }
+    const full =
+      placements[i].heatConsumed >= max.effectiveValue * (1 - AT_CAPACITY);
+    if (!full) return false;
+    return neighbours(placements[i]).some((j) => {
+      const r = rated[j];
+      return (
+        r?.type === "reactor" &&
+        placements[j].heatProduced <
+          r.effectiveValue * (1 - WASTING_UNUSED_SHARE)
+      );
+    });
+  }
+
+  return placements.map((p, i) => {
+    switch (placementStatus(p)) {
+      case "starved":
+        return "overheated";
+      case "idle":
+        return hasPartner(i) ? "idle" : "offline";
+      case "active": {
+        const role = roleOf(i);
+        if (role === "generator" || role === "direct_producer") {
+          return isWastingHeat(i) ? "wasting_heat" : "stable";
+        }
+        return "online";
+      }
+    }
+  });
+}
diff --git a/src/lib/pixi/CLAUDE.md b/src/lib/pixi/CLAUDE.md
index fe7c5cf..7181eb2 100644
--- a/src/lib/pixi/CLAUDE.md
+++ b/src/lib/pixi/CLAUDE.md
@@ -37,6 +37,41 @@ path to the first frame.
 `indicator_idle`, and `STATUS_FRAME` in `gridPainter.ts` maps a
 `PlacementStatus` onto the last three.
 
+**Each building can wear three overlays, all in the game's own art**, drawn in
+the badge layer above the props so a taller neighbour in front cannot hide
+them. They are the game's `BuildingVisual` children, read out of its prefab:
+
+- **The state icon**: `SpritesDB`'s per-state sprite for the game's reading of
+  the building, `gameStatuses` in `data/placements.ts` — red triangle when
+  nothing it can work with is adjacent (_offline_: a generator with no heat
+  source beside it), zzz when partners are adjacent but do not need it
+  (_idle_), the warning thermometer for a power source shut down by its waste
+  (_overheated_), the gauge (the prefab's `ICON_wastingheatStatus`) for a full generator beside a
+  reactor leaving over a tenth of its heat (_wasting heat_), nothing over a building that is
+  fine. Each definition is the game's own description text, quoted there. This
+  is finer than `PlacementStatus`, which the pads, the pulse and the readout's
+  counts keep using — `STATE_ICON` in `data/boardIcons.ts` maps it to art.
+- **The anomaly icon** (`anomalyIconRenderer`) at the building's foot: whatever
+  the timeline's anomaly hands it — Singularity's boosted / downgraded icons,
+  Tidal's wave, Cryo's cooler icon. _Whether_ it shows is `ratingShifts` in the
+  simulator: the scorer rated the building off its plain tier. So the icon can
+  only appear where the figures it explains changed; `anomalyIconFor` only
+  picks _which_.
+- **The fill badge** (`pixi/statusBadge.ts`), switchable in Settings
+  (`uiState.fillBadges`): the game's `status_gauge` dial and "70%" on a
+  see-through pill. The figure is `placementFillPercent`, a fraction of what the
+  _scorer_ rated the building for (`ratedPlacements`), so it agrees with the
+  readout's `used / total`. Tinted with the status colours rather than the
+  game's one red, per the colour law; one shared `BitmapText` font, because a
+  `Text` per badge is a texture per badge.
+
+`PixiCanvas` computes all of it (`buildingOverlays`) and hands it to
+`updateState`; the painter does no scoring. The icons are loose files in
+`public/icons/` loaded with the atlas (`BOARD_ICONS`), written by the extractor's
+`CUSTOM_ICON_MAPPING` like every other badge — so a re-extract keeps them.
+Positions come from the prefab's transforms, converted at
+`PIXELS_PER_WORLD_UNIT` and enlarged by `ICON_SCALE`; see the comment there.
+
 **A building that is not working breathes.** The pad says _what_ is wrong in
 colour; the pulse says _that_ something is, and motion is what the eye finds
 without being told where to look. `STATUS_PULSE` and the raised-cosine
diff --git a/src/lib/pixi/atlas.ts b/src/lib/pixi/atlas.ts
index d5a0db4..a715d62 100755
--- a/src/lib/pixi/atlas.ts
+++ b/src/lib/pixi/atlas.ts
@@ -2,6 +2,7 @@ import { Assets, Texture, Spritesheet, Sprite } from "pixi.js";
 import { PIXELS_PER_WORLD_UNIT } from "../utils/isoMath";
 import { asset } from "../utils/assetUrl";
 import type { TileType } from "../types";
+import { BOARD_ICONS, type BoardIcon } from "../data/boardIcons";
 
 /** Which atlas frame draws the prop sitting on each obstacle tile. */
 export const TILE_IMAGE_MAP: Partial<Record<TileType, string>> = {
@@ -33,6 +34,16 @@ export const GROUND_TILING_FRAMES = {
 let spritesheet: Spritesheet | null = null;
 const textureCache: Record<string, Texture> = {};
 
+/**
+ * The per-building status icons, loaded beside the sheet.
+ *
+ * Loose files rather than atlas frames because the sheet is packed by the
+ * external extractor and these are UI badges off the game's icon sheets, which
+ * it ships to `public/icons/` like every other badge. Fetched as part of the
+ * same load so a board never draws a frame with a building's state missing.
+ */
+const iconTextures: Partial<Record<BoardIcon, Texture>> = {};
+
 /** The atlas description, and through `meta.image` the sheet beside it. */
 const ATLAS_JSON = "data/web_atlas.json";
 
@@ -100,7 +111,14 @@ async function fetchAtlas(): Promise<void> {
   const texture: Texture = await Assets.load(imagePath);
 
   spritesheet = new Spritesheet(texture, atlasData);
-  await spritesheet.parse();
+  await Promise.all([
+    spritesheet.parse(),
+    ...BOARD_ICONS.map(async (name) => {
+      iconTextures[name] = await Assets.load<Texture>(
+        asset(`icons/${name}.webp`),
+      );
+    }),
+  ]);
 
   Object.values(FRAME_KEYS).forEach((frameName) => {
     if (spritesheet?.textures[frameName]) {
@@ -158,3 +176,21 @@ export function createScaledSprite(
 
   return sprite;
 }
+
+/**
+ * A board icon, centred on its own origin and scaled so its longer side is
+ * `sizePx` world pixels — the state thermometers are tall and narrow, and
+ * sized by width they came out twice the height of the round icons beside
+ * them. Null until the load that fetches it has landed.
+ */
+export function createIconSprite(
+  name: BoardIcon,
+  sizePx: number,
+): Sprite | null {
+  const texture = iconTextures[name];
+  if (!texture) return null;
+  const sprite = new Sprite(texture);
+  sprite.anchor.set(0.5);
+  sprite.scale.set(sizePx / Math.max(texture.width, texture.height));
+  return sprite;
+}
diff --git a/src/lib/pixi/gridPainter.ts b/src/lib/pixi/gridPainter.ts
index 6a39d1e..c4f8c67 100755
--- a/src/lib/pixi/gridPainter.ts
+++ b/src/lib/pixi/gridPainter.ts
@@ -20,6 +20,50 @@ import {
 } from "./atlas";
 import { placementStatus, type PlacementStatus } from "../data/placements";
 import { pulseAlpha, STATUS_PULSE, type Pulse } from "./statusPulse";
+import { createStatusBadge } from "./statusBadge";
+import { createIconSprite } from "./atlas";
+import type { BoardIcon } from "../data/boardIcons";
+
+/**
+ * Where a badge sits over its building, in world pixels from the tile's
+ * centre: on the front of the building, low enough that it does not cover the
+ * roof of the one behind — where the game puts its own.
+ */
+const BADGE_OFFSET_Y = -TILE_HEIGHT * 0.55;
+
+/**
+ * Where the game's two building icons sit, and how wide, in world pixels from
+ * the tile's centre.
+ *
+ * Taken from the building prefab: `anomalyIcon` at (0, -0.073) and the
+ * not-working icon at (0.19, 0.118) under the building's visual root, at
+ * scales 0.12 and 0.15 of 128px / 102px art authored at 100px per unit. That
+ * puts the anomaly icon at the building's foot — the tile's front corner on
+ * screen — and the state icon up and to the right of its body. Converted at
+ * `PIXELS_PER_WORLD_UNIT`. `ICON_SCALE` is the knob for sizing them all at
+ * once; at 1 they are the size the prefab authors.
+ */
+const ICON_SCALE = 1.0;
+const ANOMALY_ICON = { x: 0, y: TILE_HEIGHT * 0.18, width: 31 * ICON_SCALE };
+const STATE_ICON_POS = {
+  x: TILE_WIDTH * 0.24,
+  y: -TILE_HEIGHT * 0.3,
+  width: 31 * ICON_SCALE,
+};
+
+/**
+ * What the painter draws over one building beyond its sprite and pad: the fill
+ * badge's figure, the anomaly icon at its foot and the state icon beside it.
+ * All are worked out by the caller — they come off the scorer and the board
+ * around the building, and neither is the renderer's job.
+ */
+export interface BuildingOverlay {
+  /** The badge's figure, or null for no badge. */
+  fill: number | null;
+  anomalyIcon: BoardIcon | null;
+  /** The game's state icon (`STATE_ICON`), or null over a working building. */
+  stateIcon: BoardIcon | null;
+}
 
 /**
  * The selection accent, as Pixi wants it.
@@ -91,6 +135,11 @@ interface TileStateCache {
    * frame key would have left the second with nothing to key on.
    */
   status: PlacementStatus | null;
+  /** The badge's figure, or null for no badge. */
+  fill: number | null;
+  anomalyIcon: BoardIcon | null;
+  /** The game's state icon (`STATE_ICON`), or null over a working building. */
+  stateIcon: BoardIcon | null;
 }
 
 function isIslandTile(tile?: Tile): boolean {
@@ -161,12 +210,14 @@ export class GridRenderer {
   private gridLinesContainer: Container;
   private propsContainer: Container;
   private ghostContainer: Container;
+  private badgeContainer: Container;
 
   private hoverHighlight: Graphics;
 
   private islandTileNodes: (Container | null)[][] = [];
   private gridTileNodes: (Container | null)[][] = [];
   private propTileNodes: (Container | null)[][] = [];
+  private badgeTileNodes: (Container | null)[][] = [];
 
   private stateCache: (TileStateCache | null)[][] = [];
 
@@ -220,11 +271,24 @@ export class GridRenderer {
     this.ghostContainer.sortableChildren = true;
     this.ghostContainer.eventMode = "none";
 
+    /*
+     * 5. Layer for building overlays: status icons and fill badges.
+     *
+     * Above the props rather than inside each tile's prop node: a badge is
+     * wider than its tile, and in a prop node the building in front would
+     * draw over the badge of the one behind. Depth-sorted among themselves so
+     * that, where two do overlap, the nearer one wins as it does in the game.
+     */
+    this.badgeContainer = new Container();
+    this.badgeContainer.sortableChildren = true;
+    this.badgeContainer.eventMode = "none";
+
     // Insertion order is draw order: ground, then the interactive grid,
-    // then props, then ghosts on top of everything.
+    // then props, then badges, then ghosts on top of everything.
     this.gridContainer.addChild(this.islandContainer);
     this.gridContainer.addChild(this.gridLinesContainer);
     this.gridContainer.addChild(this.propsContainer);
+    this.gridContainer.addChild(this.badgeContainer);
     this.gridContainer.addChild(this.ghostContainer);
 
     // Hover Highlight Overlay
@@ -248,6 +312,7 @@ export class GridRenderer {
     this.gridLinesContainer.destroy({ children: true });
     this.propsContainer.destroy({ children: true });
     this.ghostContainer.destroy({ children: true });
+    this.badgeContainer.destroy({ children: true });
   }
 
   public clear(): void {
@@ -267,11 +332,13 @@ export class GridRenderer {
     clearContainer(this.gridLinesContainer);
     clearContainer(this.propsContainer);
     clearContainer(this.ghostContainer);
+    clearContainer(this.badgeContainer);
     this.ghostKey = "";
 
     this.islandTileNodes = [];
     this.gridTileNodes = [];
     this.propTileNodes = [];
+    this.badgeTileNodes = [];
     this.stateCache = [];
     this.pulsing.clear();
   }
@@ -288,6 +355,7 @@ export class GridRenderer {
     this.islandTileNodes = Array.from({ length: gridHeight }, () => []);
     this.gridTileNodes = Array.from({ length: gridHeight }, () => []);
     this.propTileNodes = Array.from({ length: gridHeight }, () => []);
+    this.badgeTileNodes = Array.from({ length: gridHeight }, () => []);
     this.stateCache = Array.from({ length: gridHeight }, () =>
       Array(gridWidth).fill(null),
     );
@@ -329,6 +397,14 @@ export class GridRenderer {
         propNode.eventMode = "none";
         this.propTileNodes[y][x] = propNode;
         this.propsContainer.addChild(propNode);
+
+        // --- LAYER 5: Badge Container Node ---
+        const badgeNode = new Container();
+        badgeNode.position.set(isoPos.x, isoPos.y);
+        badgeNode.zIndex = depth;
+        badgeNode.eventMode = "none";
+        this.badgeTileNodes[y][x] = badgeNode;
+        this.badgeContainer.addChild(badgeNode);
       }
     }
 
@@ -336,18 +412,28 @@ export class GridRenderer {
     this.updateState(grid, gridWidth, gridHeight);
   }
 
-  /** Updates only changed layers per cell using state diffing */
+  /**
+   * Updates only changed layers per cell using state diffing.
+   *
+   * `overlays` is aligned with `placements` — each one's badge figure and
+   * anomaly icon (see `BuildingOverlay`) — or omitted for neither.
+   */
   public updateState(
     grid: Tile[][],
     gridWidth: number,
     gridHeight: number,
-    placements: PlacedBuilding[] = [],
+    placements: readonly PlacedBuilding[] = [],
+    overlays?: readonly BuildingOverlay[],
   ): void {
     // Map "x,y" coordinates to the placement itself for O(1) lookups — the
     // status pad needs its scored figures, not just which building it is.
     const placementMap = new Map<string, PlacedBuilding>();
-    for (const p of placements) {
+    const overlayMap = new Map<string, BuildingOverlay>();
+    for (let i = 0; i < placements.length; i++) {
+      const p = placements[i];
       placementMap.set(`${p.x},${p.y}`, p);
+      const overlay = overlays?.[i];
+      if (overlay) overlayMap.set(`${p.x},${p.y}`, overlay);
     }
 
     for (let y = 0; y < gridHeight; y++) {
@@ -365,6 +451,13 @@ export class GridRenderer {
           propFrameKey: TILE_IMAGE_MAP[tile.type] || null,
           buildingFrameKey: placed?.buildingId ?? null,
           status: placed ? placementStatus(placed) : null,
+          fill: placed ? (overlayMap.get(`${x},${y}`)?.fill ?? null) : null,
+          anomalyIcon: placed
+            ? (overlayMap.get(`${x},${y}`)?.anomalyIcon ?? null)
+            : null,
+          stateIcon: placed
+            ? (overlayMap.get(`${x},${y}`)?.stateIcon ?? null)
+            : null,
         };
 
         const prevState = this.stateCache[y][x];
@@ -376,7 +469,10 @@ export class GridRenderer {
           prevState.waterFrameKey === nextState.waterFrameKey &&
           prevState.propFrameKey === nextState.propFrameKey &&
           prevState.buildingFrameKey === nextState.buildingFrameKey &&
-          prevState.status === nextState.status
+          prevState.status === nextState.status &&
+          prevState.fill === nextState.fill &&
+          prevState.anomalyIcon === nextState.anomalyIcon &&
+          prevState.stateIcon === nextState.stateIcon
         ) {
           continue;
         }
@@ -389,14 +485,16 @@ export class GridRenderer {
     this.islandContainer.sortChildren();
     this.gridLinesContainer.sortChildren();
     this.propsContainer.sortChildren();
+    this.badgeContainer.sortChildren();
   }
 
   private renderTileVisuals(x: number, y: number, state: TileStateCache): void {
     const islandNode = this.islandTileNodes[y]?.[x];
     const gridNode = this.gridTileNodes[y]?.[x];
     const propNode = this.propTileNodes[y]?.[x];
+    const badgeNode = this.badgeTileNodes[y]?.[x];
 
-    if (!islandNode || !gridNode || !propNode) return;
+    if (!islandNode || !gridNode || !propNode || !badgeNode) return;
 
     const clearNode = (node: Container) => {
       while (node.children.length > 0) {
@@ -414,6 +512,7 @@ export class GridRenderer {
     clearNode(islandNode);
     clearNode(gridNode);
     clearNode(propNode);
+    clearNode(badgeNode);
 
     // 1. ISLAND & WATER LAYER
     if (state.islandFrameKey) {
@@ -512,6 +611,34 @@ export class GridRenderer {
         }
       }
     }
+
+    /*
+     * 4. OVERLAYS — the game's two building icons and the fill badge, in the
+     * top layer so a taller neighbour in front cannot hide them. Drawn in the
+     * order the eye reads them: the anomaly icon at the foot, then the state
+     * icon, then the badge across the front, which may overlap both.
+     */
+    if (state.buildingFrameKey && state.status) {
+      if (state.anomalyIcon) {
+        const icon = createIconSprite(state.anomalyIcon, ANOMALY_ICON.width);
+        if (icon) {
+          icon.position.set(ANOMALY_ICON.x, ANOMALY_ICON.y);
+          badgeNode.addChild(icon);
+        }
+      }
+      if (state.stateIcon) {
+        const icon = createIconSprite(state.stateIcon, STATE_ICON_POS.width);
+        if (icon) {
+          icon.position.set(STATE_ICON_POS.x, STATE_ICON_POS.y);
+          badgeNode.addChild(icon);
+        }
+      }
+      if (state.fill !== null) {
+        const badge = createStatusBadge(state.fill, state.status);
+        badge.position.set(0, BADGE_OFFSET_Y);
+        badgeNode.addChild(badge);
+      }
+    }
   }
 
   /**
diff --git a/src/lib/pixi/statusBadge.ts b/src/lib/pixi/statusBadge.ts
new file mode 100644
index 0000000..dc111c1
--- /dev/null
+++ b/src/lib/pixi/statusBadge.ts
@@ -0,0 +1,101 @@
+import { BitmapFont, BitmapText, Container, Graphics } from "pixi.js";
+import type { PlacementStatus } from "../data/placements";
+import { createIconSprite } from "./atlas";
+
+/**
+ * The gauge the game prints over every building: a dark pill holding its dial
+ * icon (`status_gauge`, the game's own sprite) and how hard the building is
+ * working ("70%").
+ *
+ * The pill is see-through, as the game's is, so it reads as a label floating
+ * over the board rather than a slab covering the building behind it.
+ *
+ * The figure is tinted with the board's reserved status colours rather than the
+ * game's one red, so the badge and the pad beneath it are one reading — see the
+ * colour law in `src/CLAUDE.md`. These are `--status-ok`, `--status-idle` and
+ * `--danger` from `app.css`, repeated as Pixi literals for the same reason
+ * `ACCENT` is in `gridPainter.ts`: Pixi cannot read a custom property.
+ */
+const STATUS_TINT: Record<PlacementStatus, number> = {
+  active: 0x4ade80,
+  idle: 0xfacc15,
+  starved: 0xff4757,
+};
+
+const PILL_FILL = 0x16213a;
+const PILL_ALPHA = 0.55;
+const PILL_HEIGHT = 21;
+const PILL_PAD_X = 6;
+/** The gauge icon's width; its art is 108 x 76. */
+const GAUGE_WIDTH = 18;
+const GAUGE_GAP = 3;
+const FONT_SIZE = 15;
+
+/**
+ * One bitmap font for every badge on the board, installed on first use.
+ *
+ * `BitmapText` rather than `Text`: a `Text` rasterises a texture of its own,
+ * and a large island carries a few hundred badges. The glyphs are drawn white
+ * and each badge tints them, so the three statuses share one sheet. Installed
+ * at 3x because the board zooms well past 1:1 and a 1x sheet goes soft there.
+ */
+const FONT_NAME = "status-badge";
+let fontInstalled = false;
+
+function ensureFont(): void {
+  if (fontInstalled) return;
+  BitmapFont.install({
+    name: FONT_NAME,
+    style: {
+      fontFamily: ["Segoe UI", "Tahoma", "Geneva", "Verdana", "sans-serif"],
+      fontSize: FONT_SIZE,
+      fontWeight: "bold",
+      fill: 0xffffff,
+    },
+    chars: "0123456789%",
+    resolution: 3,
+  });
+  fontInstalled = true;
+}
+
+/**
+ * Builds one badge, centred on its own origin. The caller positions it over the
+ * building and owns its lifetime.
+ */
+export function createStatusBadge(
+  percent: number,
+  status: PlacementStatus,
+): Container {
+  ensureFont();
+  const tint = STATUS_TINT[status];
+
+  const label = new BitmapText({
+    text: `${percent}%`,
+    style: { fontFamily: FONT_NAME, fontSize: FONT_SIZE },
+  });
+  label.tint = tint;
+
+  const contentWidth = GAUGE_WIDTH + GAUGE_GAP + label.width;
+  const width = contentWidth + PILL_PAD_X * 2;
+  const left = -width / 2;
+
+  const pill = new Graphics()
+    .roundRect(left, -PILL_HEIGHT / 2, width, PILL_HEIGHT, PILL_HEIGHT / 2)
+    .fill({ color: PILL_FILL, alpha: PILL_ALPHA })
+    .stroke({ width: 1, color: 0x000000, alpha: 0.25 });
+
+  const gauge = createIconSprite("status_gauge", GAUGE_WIDTH);
+  gauge?.position.set(left + PILL_PAD_X + GAUGE_WIDTH / 2, 0);
+
+  label.position.set(
+    left + PILL_PAD_X + GAUGE_WIDTH + GAUGE_GAP,
+    -label.height / 2,
+  );
+
+  const badge = new Container();
+  badge.eventMode = "none";
+  badge.addChild(pill);
+  if (gauge) badge.addChild(gauge);
+  badge.addChild(label);
+  return badge;
+}
diff --git a/src/lib/simulation/simulator.test.ts b/src/lib/simulation/simulator.test.ts
index 688efd9..e7c1393 100755
--- a/src/lib/simulation/simulator.test.ts
+++ b/src/lib/simulation/simulator.test.ts
@@ -23,7 +23,11 @@
  *   is a finer partition than the island.
  */
 import { describe, it, expect } from "vitest";
-import { ratedPlacementAt, simulatePlacedBuildings } from "./simulator";
+import {
+  ratedPlacementAt,
+  ratingShifts,
+  simulatePlacedBuildings,
+} from "./simulator";
 import {
   getAnomaly,
   type RoleIsolationAnomaly,
@@ -615,3 +619,68 @@ describe("a rated ceiling is what the row beside it was measured against", () =>
     ).toBeNull();
   });
 });
+
+describe("a rating shift marks exactly the buildings the rules moved", () => {
+  const TIDAL = getAnomaly("tidal_ascendancy") as TerrainAffinityAnomaly;
+  const CRYO = getAnomaly("cryo_nexus");
+  const SINGULARITY = getAnomaly("singularity_isolation");
+
+  /** Rock round the edge, so only the tiles touching `water` are waterside. */
+  function walledGrid(w: number, h: number, water: [number, number][] = []) {
+    const grid = grassGrid(w, h);
+    for (const row of grid)
+      for (const t of row)
+        if (t.x === 0 || t.y === 0 || t.x === w - 1 || t.y === h - 1)
+          t.type = "rock";
+    for (const [x, y] of water) grid[y][x].type = "water";
+    return grid;
+  }
+
+  const shiftsOf = (grid: Tile[][], spec: Spec, anomaly: AnomalyDefinition) =>
+    ratingShifts(grid, DEFS, place(spec), undefined, anomaly);
+
+  it("leaves every building alone under the base rules", () => {
+    const spec: Spec = [
+      [1, 1, "reactor", VALUES.reactor],
+      [2, 1, "generator", VALUES.generator],
+      [3, 1, "cooler", VALUES.cooler],
+    ];
+    expect(shiftsOf(walledGrid(6, 3), spec, getAnomaly(undefined))).toEqual([
+      null,
+      null,
+      null,
+    ]);
+  });
+
+  it("raises a waterside building under Tidal, and only that one", () => {
+    // Water at (1,1); the reactor beside it is waterside, the far one is not.
+    const grid = walledGrid(8, 3, [[1, 1]]);
+    const spec: Spec = [
+      [2, 1, "reactor", VALUES.reactor],
+      [6, 1, "reactor", VALUES.reactor],
+    ];
+    expect(TIDAL.multiplier).toBeGreaterThan(1);
+    expect(shiftsOf(grid, spec, TIDAL)).toEqual(["up", null]);
+  });
+
+  it("raises a lone generator and lowers two that touch, under Singularity", () => {
+    const spec: Spec = [
+      [1, 1, "generator", VALUES.generator],
+      [5, 1, "generator", VALUES.generator],
+      [6, 1, "generator", VALUES.generator],
+    ];
+    expect(shiftsOf(walledGrid(9, 3), spec, SINGULARITY)).toEqual([
+      "up",
+      "down",
+      "down",
+    ]);
+  });
+
+  it("moves every cooler under Cryo Nexus, and nothing else", () => {
+    const spec: Spec = [
+      [1, 1, "reactor", VALUES.reactor],
+      [2, 1, "cooler", VALUES.cooler],
+    ];
+    expect(shiftsOf(walledGrid(5, 3), spec, CRYO)).toEqual([null, "down"]);
+  });
+});
diff --git a/src/lib/simulation/simulator.ts b/src/lib/simulation/simulator.ts
index 3781430..5cf6a77 100755
--- a/src/lib/simulation/simulator.ts
+++ b/src/lib/simulation/simulator.ts
@@ -128,8 +128,6 @@ interface BoardLayout {
   placement: Placement;
   /** Tile index -> the row that placement came from, or -1. */
   rowOf: Int32Array;
-  /** `(x, y)` -> tile index, for the placements that landed on one. */
-  tileOf: (x: number, y: number) => number | undefined;
 }
 
 /**
@@ -171,11 +169,7 @@ function layoutFor(
     rowOf[t] = i;
   }
 
-  return {
-    placement,
-    rowOf,
-    tileOf: (x, y) => tileAt.get(y * stride + x),
-  };
+  return { placement, rowOf };
 }
 
 /**
@@ -263,26 +257,113 @@ export function ratedPlacementAt(
   prestige?: PrestigeScales,
   anomaly: AnomalyDefinition = getAnomaly(undefined),
 ): EffectiveBuilding | null {
+  const rated = ratedPlacements(
+    grid,
+    buildings,
+    placedBuildings,
+    prestige,
+    anomaly,
+  );
+  // The later of two placements on one tile is the one that stands — the same
+  // tie-break `layoutFor` applies.
+  for (let i = placedBuildings.length - 1; i >= 0; i--) {
+    const p = placedBuildings[i];
+    if (p.x === x && p.y === y) return rated[i];
+  }
+  return null;
+}
+
+/**
+ * `ratedPlacementAt` for every building at once: what each row of
+ * `placedBuildings` was rated for, in the same order, or null where nothing
+ * buildable stands.
+ *
+ * The canvas needs every ceiling on the board each time it changes — the status
+ * badges are a fill against it — and asking tile by tile would lay the board
+ * out and score it once per building. This lays it out once, and resolves a
+ * role isolation with the one `simulateIsland` call it costs, which is the
+ * single reading of the rules `ratedPlacementAt` itself now goes through.
+ */
+export function ratedPlacements(
+  grid: Tile[][],
+  buildings: readonly BuildingDefinition[],
+  placedBuildings: readonly PlacedBuilding[],
+  prestige?: PrestigeScales,
+  anomaly: AnomalyDefinition = getAnomaly(undefined),
+): (EffectiveBuilding | null)[] {
+  const out: (EffectiveBuilding | null)[] = new Array(
+    placedBuildings.length,
+  ).fill(null);
   if (!grid?.length || !grid[0]?.length || placedBuildings.length === 0) {
-    return null;
+    return out;
   }
 
   const ctx = contextFor(grid, anomaly);
-  if (ctx.n === 0) return null;
+  if (ctx.n === 0) return out;
 
-  const { placement, tileOf } = layoutFor(
+  const { placement, rowOf } = layoutFor(
     ctx,
     buildings,
     placedBuildings,
     prestige,
   );
-  const t = tileOf(x, y);
-  if (t === undefined) return null;
+  if (ctx.isolation !== null) simulateIsland(placement, ctx, true);
 
-  const rated = placement[t];
-  if (rated === null) return null;
-  if (ctx.isolation === null) return rated;
+  for (let t = 0; t < ctx.n; t++) {
+    const i = rowOf[t];
+    const rated = placement[t];
+    if (i < 0 || rated === null) continue;
+    out[i] = ctx.isolation === null ? rated : (ctx.ratedLayout[t] ?? rated);
+  }
+  return out;
+}
+
+/** Which way the board's rules moved a building off its plain tier. */
+export type RatingShift = "up" | "down";
 
-  simulateIsland(placement, ctx, true);
-  return ctx.ratedLayout[t] ?? rated;
+/**
+ * For each row of `placedBuildings`, whether the tile it stands on rates it
+ * above or below its plain tier — the question the game answers with the
+ * anomaly icon at a building's foot — or null where nothing moved it.
+ *
+ * Read off the scorer rather than off the anomaly's rule, so the icon can only
+ * appear where the figures it explains actually changed: a waterside bonus, an
+ * isolated or crowded generator, a pooled cooler's scale. Research is in both
+ * sides of the comparison and so cancels; what is left is the tile and the
+ * board around it.
+ *
+ * Compared on the building's headline figure — energy for a direct producer,
+ * whose `effectiveValue` is not what it is rated by, and `effectiveValue` for
+ * every other role — with a relative tolerance, so float noise in a scale that
+ * comes out at exactly 1 never paints an icon.
+ */
+export function ratingShifts(
+  grid: Tile[][],
+  buildings: readonly BuildingDefinition[],
+  placedBuildings: readonly PlacedBuilding[],
+  prestige?: PrestigeScales,
+  anomaly: AnomalyDefinition = getAnomaly(undefined),
+): (RatingShift | null)[] {
+  const rated = ratedPlacements(
+    grid,
+    buildings,
+    placedBuildings,
+    prestige,
+    anomaly,
+  );
+  return placedBuildings.map((pb, i) => {
+    const r = rated[i];
+    if (r === null) return null;
+    const def = buildings.find((b) => b.id === pb.buildingId);
+    if (!def) return null;
+    const plain = tierAtValue(def, pb.baseValue, prestige);
+    const figure = (b: EffectiveBuilding) =>
+      b.type === "direct_producer" ? b.energy : b.effectiveValue;
+    const was = figure(plain);
+    const now = figure(r);
+    if (!(was > 0)) return null;
+    const ratio = now / was;
+    if (Math.abs(ratio - 1) < 1e-9) return null;
+    return ratio > 1 ? "up" : "down";
+  });
 }
diff --git a/src/lib/state/ui.svelte.ts b/src/lib/state/ui.svelte.ts
index 8c4ab59..78035de 100755
--- a/src/lib/state/ui.svelte.ts
+++ b/src/lib/state/ui.svelte.ts
@@ -286,6 +286,25 @@ class UIState {
     uiStorage.savePrefs({ haptics: on });
   }
 
+  /**
+   * Whether each building wears the game's fill gauge ("70%") on the board.
+   *
+   * A switch because it is the one overlay that can crowd a large island at
+   * the fitted zoom; the state and anomaly icons stay regardless, since they
+   * are the board's only mark of *why* a building is in the state it is.
+   */
+  #fillBadges = $state<boolean>(uiStorage.loadPrefs().fillBadges);
+
+  get fillBadges(): boolean {
+    return this.#fillBadges;
+  }
+
+  setFillBadges(on: boolean) {
+    if (this.#fillBadges === on) return;
+    this.#fillBadges = on;
+    uiStorage.savePrefs({ fillBadges: on });
+  }
+
   /**
    * Whether usage collection is off, or `null` for "follow the browser".
    *
diff --git a/src/lib/storage/storage.ts b/src/lib/storage/storage.ts
index 70542e5..1f4c7ab 100755
--- a/src/lib/storage/storage.ts
+++ b/src/lib/storage/storage.ts
@@ -72,6 +72,12 @@ export interface UiPrefs {
    * novelty costs.
    */
   haptics: boolean;
+  /**
+   * Whether every building wears its fill badge ("70%") — see
+   * `uiState.fillBadges`. On by default: it is the game's own gauge, and the
+   * one place the board says how hard each building is working without a tap.
+   */
+  fillBadges: boolean;
   /**
    * Whether usage collection is switched **off** — see
    * `uiState.analyticsDisabled`. The negative, because gtag's own switch is
@@ -91,6 +97,7 @@ const DEFAULT_UI_PREFS: UiPrefs = {
   statsCardCollapsed: false,
   solveMode: DEFAULT_SOLVE_MODE,
   haptics: true,
+  fillBadges: true,
   imageScale: 1,
 };