From b6fab4100c66591ec0e8619dfd58e86bbff49ef9 Mon Sep 17 00:00:00 2001
From: Mat4m0 <matthias@lupinum.com>
Date: Sat, 12 Sep 2026 20:53:01 +0200
Subject: [PATCH] feat(hud): compose native skill labels and timers without
 flicker

---
 .../components/SkillLabelsSettings.test.ts    |   2 +
 .../src/components/SkillLabelsSettings.vue    |   6 +-
 docs/effect-timers.md                         |  38 +
 docs/skill-cooldowns.md                       |  32 +-
 docs/wasm-host.md                             |  11 +-
 internal/research/native-ui-coverage.md       | 825 ++++++++++++++++++
 scripts/enhancements-visual.ts                |  43 +-
 scripts/skill-cooldown-visual.ts              | 132 +--
 src/main/certification/client-module.ts       |   1 +
 .../certification/enhancement-build-model.ts  |   6 +
 .../certification/enhancement-transform.ts    |   7 +-
 .../local-client-verification-boundary.ts     |   8 +
 .../local-client-verification-contract.ts     |   9 +
 .../certification/local-client-verifier.ts    |  10 +
 .../certification/native-hud-transform.ts     | 344 ++++++++
 src/main/certification/semantic-proof.ts      |   2 +-
 src/main/client-runtime.ts                    |   4 +
 src/main/renderer-client-sessions.ts          |   1 +
 .../certified-companion-tools-installation.ts |  14 +-
 src/renderer/effect-timer-overlay-consumer.ts |  16 +-
 src/renderer/effect-timer-overlay.ts          |  51 --
 .../effective-enhancement-capabilities.ts     |   1 +
 src/renderer/gw-native.d.ts                   |   1 +
 src/renderer/native-hud-layer.ts              | 217 +++++
 .../skill-cooldown-overlay-consumer.ts        |  19 +-
 src/renderer/skill-cooldown-overlay.ts        |  75 --
 src/renderer/skill-cooldown-view.ts           |  92 --
 src/renderer/skill-key-artwork.ts             |  76 ++
 src/renderer/skill-key-binding-view.ts        | 199 -----
 src/renderer/skill-key-overlay-consumer.ts    |  29 +-
 src/renderer/skill-key-overlay.ts             | 145 ---
 src/renderer/skill-overlays-installation.ts   |  18 +-
 src/shared/contracts.ts                       |   1 +
 src/shared/enhancement-contracts.ts           |  13 +-
 src/shared/native-hud.ts                      |  12 +
 .../client-chain-qualification.test.ts        |  12 +
 .../core-rebuild-recert.test.ts               |   1 +
 .../native-hud-certification.test.ts          |  44 +
 tests/client-artifact/native-hud.test.ts      | 228 +++++
 .../template-save-recert.test.ts              |   5 +-
 tests/fixtures/enhancement-transform.ts       |  10 +
 tests/helpers/packaged-enhancement-fixture.ts |   4 +
 .../effect-timers-are-display-only.test.ts    |   2 +-
 .../skill-cooldowns-are-display-only.test.ts  |   3 +-
 tests/unit/active-client.test.ts              |   1 +
 tests/unit/client-certification.test.ts       |   1 +
 tests/unit/client-module.test.ts              |   4 +
 .../client-recertification-evidence.test.ts   |  27 +-
 ...effective-enhancement-capabilities.test.ts |   3 +
 tests/unit/enhancement-client-chain.test.ts   |   2 +
 .../enhancement-command-transform.test.ts     |   1 +
 .../unit/enhancement-skill-transform.test.ts  |   1 +
 tests/unit/enhancement-transform.test.ts      |   3 +
 ...ts-are-derived-from-their-registry.test.ts |  18 +-
 tests/unit/feature-contracts.test.ts          |   3 +-
 tests/unit/local-client-verifier.test.ts      |   2 +
 tests/unit/native-hud.test.ts                 | 199 +++++
 tests/unit/renderer-client-sessions.test.ts   |   1 +
 tests/unit/skill-cooldown-overlay.test.ts     | 220 -----
 tests/unit/skill-key-overlay.test.ts          | 346 --------
 .../unit/skill-overlays-installation.test.ts  |  12 +
 61 files changed, 2337 insertions(+), 1276 deletions(-)
 create mode 100644 internal/research/native-ui-coverage.md
 create mode 100644 src/main/certification/native-hud-transform.ts
 delete mode 100644 src/renderer/effect-timer-overlay.ts
 create mode 100644 src/renderer/native-hud-layer.ts
 delete mode 100644 src/renderer/skill-cooldown-overlay.ts
 delete mode 100644 src/renderer/skill-cooldown-view.ts
 create mode 100644 src/renderer/skill-key-artwork.ts
 delete mode 100644 src/renderer/skill-key-binding-view.ts
 delete mode 100644 src/renderer/skill-key-overlay.ts
 create mode 100644 src/shared/native-hud.ts
 create mode 100644 tests/client-artifact/native-hud-certification.test.ts
 create mode 100644 tests/client-artifact/native-hud.test.ts
 create mode 100644 tests/unit/native-hud.test.ts
 delete mode 100644 tests/unit/skill-cooldown-overlay.test.ts
 delete mode 100644 tests/unit/skill-key-overlay.test.ts

diff --git a/apps/launcher/src/components/SkillLabelsSettings.test.ts b/apps/launcher/src/components/SkillLabelsSettings.test.ts
index b21d8c7b..bb3d8ee9 100644
--- a/apps/launcher/src/components/SkillLabelsSettings.test.ts
+++ b/apps/launcher/src/components/SkillLabelsSettings.test.ts
@@ -8,6 +8,8 @@ describe("skill label customization", () => {
   it("captures physical keyboard labels without changing other slots", async () => {
     const save = vi.fn<(patch: LauncherSettingsPatch) => Promise<void>>(async () => undefined);
     const wrapper = mount(SkillLabelsSettings, { props: { bindings: EMPTY_SKILL_KEY_BINDINGS, save } });
+    expect(wrapper.text()).toContain("Skill 1 · 1 (default)");
+    expect(wrapper.text()).toContain("Skill 8 · 8 (default)");
     await wrapper.get('[aria-label="Set skill 3 label"]').trigger("click");
     await wrapper.get('[aria-label="Skill label capture"]').trigger("keydown", { code: "KeyG", key: "g", ctrlKey: true });
     await flushPromises();
diff --git a/apps/launcher/src/components/SkillLabelsSettings.vue b/apps/launcher/src/components/SkillLabelsSettings.vue
index cba4925c..bf32b4d0 100644
--- a/apps/launcher/src/components/SkillLabelsSettings.vue
+++ b/apps/launcher/src/components/SkillLabelsSettings.vue
@@ -40,11 +40,11 @@ async function capture(input: SkillKeyInput, event: KeyboardEvent | MouseEvent |
 
 <template>
   <div class="skill-label-settings">
-    <p>These labels do not change Guild Wars key bindings. Match the controls you use in the game.</p>
+    <p>These labels do not change Guild Wars key bindings. Unset slots use 1–8. Set custom labels to match your game controls.</p>
     <div v-for="(binding, index) in bindings" :key="index" class="skill-label-row">
-      <span>Skill {{ index + 1 }} · {{ binding ? skillKeyPresentation(binding).accessibleLabel : 'No label' }}</span>
+      <span>Skill {{ index + 1 }} · {{ binding ? skillKeyPresentation(binding).accessibleLabel : `${index + 1} (default)` }}</span>
       <button class="secondary" :aria-label="`Set skill ${index + 1} label`" @click="start(index)">Set label</button>
-      <button class="text-link" :disabled="!binding" :aria-label="`Clear skill ${index + 1} label`" @click="clear(index)">Clear</button>
+      <button class="text-link" :disabled="!binding" :aria-label="`Reset skill ${index + 1} label`" @click="clear(index)">Use default</button>
     </div>
     <template v-if="slot !== null">
       <div ref="target" tabindex="0" class="capture-target" aria-label="Skill label capture"
diff --git a/docs/effect-timers.md b/docs/effect-timers.md
index 5c799be4..96f6deb3 100644
--- a/docs/effect-timers.md
+++ b/docs/effect-timers.md
@@ -107,3 +107,41 @@ Automated evidence covers native countdown corrections, clock wrap, identity
 changes, notification rejection, snapshot validation, dragging, cancellation,
 locking, saved offsets, and launcher controls. A Developer Build still needs
 live QA for real drink types, map travel, visual alignment, and input feel.
+
+## Native drawing
+
+Skill shortcuts, skill cooldowns, and effect timers share the detached atlas in
+[`native-hud-layer.ts`](../src/renderer/native-hud-layer.ts). Timer changes update
+small glyph meshes. Cached digits and all three urgency colors avoid repeated
+pixel uploads. Digits share fixed-width cells with centered glyphs so changing
+numbers does not shift their alignment. Effect labels retain their resource slots when another effect
+expires. Effect numbers sit inside the lower-right artwork with a proportional
+inset. The bottom duration bar and icon border remain clear.
+
+[`native-hud-transform.ts`](../src/main/certification/native-hud-transform.ts)
+attaches those meshes after each native icon's last visible descendant, in the
+final clipped draw category. Each skill icon has one draw and one mesh containing
+its keycap triangles followed by its cooldown triangles. Separate native draw
+objects must not represent these overlapping parts: collection order alone
+does not guarantee their downstream order. The stock icon and veil draw before
+the composition. Later native panels and tooltips cover it. The transform
+checks exact native functions, the Effects parent hash, and the child identity.
+Skill labels attach to the visible bitmap child of each logical skill slot.
+The draw captures the native UI projection and ancestor opacity directly; it
+does not require the logical container to own a reusable bitmap. Geometry and
+timer changes reuse the retained draw. New and recreated meshes receive their
+geometry on the first draw, even when the icon bounds have not changed. A timer
+does not wait for its next digit change to appear. For a matched icon, the
+collector reports
+empty intermediate slots on the final descendant so the native cache reaches
+the label category.
+Other frames keep their original stopping point. Skill Key Labels replaces all
+eight keycaps: custom bindings where configured, otherwise 1–8. The exact native
+hotkey child is omitted while its replacement is active and restored when the
+feature withdraws. Keycaps match the original 17-unit visible artwork within
+each 56-unit skill icon. The stock 24-unit tile has seven transparent units above
+and left. Their size and corner inset follow the interface scale without
+fixed pixel limits. Long chords shrink only when needed to fit the icon.
+The game's key bindings and icon artwork stay unchanged.
+Native icon destruction, disabling the feature, and graphics reset release the
+owned resources. Missing native drawing support produces no browser fallback.
diff --git a/docs/skill-cooldowns.md b/docs/skill-cooldowns.md
index fd628f44..0fce5561 100644
--- a/docs/skill-cooldowns.md
+++ b/docs/skill-cooldowns.md
@@ -84,21 +84,28 @@ joins the two complete eight-slot records.
 Text updates are bounded by the formatter's visible output. Above three seconds
 the view changes only when the upward-rounded whole second changes. Below three
 seconds it changes only when the upward-rounded tenth changes. Ready skills
-have no label. The complete overlay hides when either source is unavailable,
+have no label. The native labels hide when either source is unavailable,
 stale, malformed, loading, or denied by the existing Tools/PvE policy.
 
 ## Presentation and remaining acceptance
 
-The HUD and Settings preview share
-[`skill-cooldown-view.ts`](../src/renderer/skill-cooldown-view.ts), including
-the extracted `Guild Wars Original Display` font, outline, shadow, optical
-offset, scale, formatter, and color tokens. The one canonical setting accepts
-red, cream, gold, blue, or an exact six-digit custom RGB value.
+The native HUD uses a cached glyph atlas in
+[`native-hud-layer.ts`](../src/renderer/native-hud-layer.ts), the extracted
+`Guild Wars Original Display` font, and the existing formatter and color setting.
+Digits use equal-width cells and centered visible glyph bounds. Changing a digit
+preserves its cell position even when the original font has different widths or
+bearings. Decimal and long labels use smaller scales. The canonical color
+setting accepts red, cream, gold, blue, or an exact six-digit custom RGB value.
 
-[`skill-cooldown-visual.ts`](../scripts/skill-cooldown-visual.ts) creates the
-required duration/color/size/key-coexistence matrix at 1x, 1.5x, and 2x. It can
-place the view over a real native skill crop and writes reference, rendered,
-and difference images. This remains a calibration aid, not live acceptance.
+The atlas allocates on first use. It stays cached across brief idle periods so a
+new cooldown does not need another pixel upload. Repacking for changed artwork
+republishes current geometry and withdraws removed labels.
+
+[`skill-cooldown-visual.ts`](../scripts/skill-cooldown-visual.ts) replays the actual
+native atlas and ordered quads for its duration/color/size/key-coexistence matrix
+at 1x, 1.5x, and 2x. It can place the drawing over a real native skill crop and
+writes reference, rendered, and difference images. It verifies artwork and
+geometry; native GPU ordering and live acceptance remain separate checks.
 
 Live acceptance requires both closed diagnostics and visual confirmation. The
 session must record first observations for skill geometry and cooldowns;
@@ -106,3 +113,8 @@ Settings must show both live states as working; and a recharging skill must show
 the expected number over the correct native slot. Signed bottom-left frame
 coordinates are valid when a slot intersects the viewport, even when one edge
 is negative. Synthetic output alone cannot close this item.
+
+The skill labels and shortcut badges attach to the certified SkillBar's native
+child icons. Their shared drawing lifetime and resource rules are documented
+under [Native drawing](effect-timers.md#native-drawing). There is no positioned
+browser HUD drawing path.
diff --git a/docs/wasm-host.md b/docs/wasm-host.md
index 90174b47..a066f8c0 100644
--- a/docs/wasm-host.md
+++ b/docs/wasm-host.md
@@ -222,12 +222,21 @@ After that restart, these choices update during the session:
 - **Target distance and range** controls the shipped Test readout and its target
   observation.
 - **Skill Key Labels** controls renderer-owned labels over the certified
-  skill-slot rectangles. Saved bindings remain when the tool is off. The
+  skill-slot rectangles. All eight use the same keycap style: custom labels where
+  set, otherwise 1–8. Original keycaps return when the tool is off. Saved
+  bindings remain. The
   companion publishes geometry, not bindings, and the renderer never turns a
   label into game input.
 - **Skill Cooldowns** controls the display of observed recharge numbers. Its
   saved colour remains when the tool is off.
 
+Native skill and effect drawing has a separate `nativeHudRendering` capability.
+The local verifier checks its exact draw owners, traversal, and resource functions.
+The transform rechecks those owners before it installs native HUD hooks. Core
+and observation-only profiles preserve the original UI collection and destruction.
+A changed drawing owner disables HUD presentation while leaving separately proved
+skill, effect, and icon observations available to other consumers.
+
 Disabled optional observers stop their domain reads. Core cursor observation
 stays active. A small map-policy projection reads GWToolbox++'s PvP map flag
 but keeps Guild Halls as an explicit gwonmac exception. PvP outposts close Tools
diff --git a/internal/research/native-ui-coverage.md b/internal/research/native-ui-coverage.md
new file mode 100644
index 00000000..c9219b78
--- /dev/null
+++ b/internal/research/native-ui-coverage.md
@@ -0,0 +1,825 @@
+# Native UI coverage investigation
+
+## Current review status — 12 September 2026
+
+Matthias accepted the native maps, terrain coverage, skill shortcuts, cooldowns,
+and effect durations in the development client, ending with “all working!”.
+That acceptance covers the previously tested build. The release review has since
+added independent native HUD certification, bounded large-map marker fallback,
+lazy atlas allocation, atlas-repack withdrawal, and failure-safe cleanup.
+The obsolete tooltip probe and browser drawing paths have been removed.
+
+The branch now includes main's existing Alcohol Timer. Its native observation
+stays independent of HUD rendering. The proposed interactive native alcohol icon
+is a separate future feature and is not implemented here.
+
+### Release-review findings
+
+- Native HUD insertion previously ran for observation-only and Core profiles.
+  A separate exact-body proof now authorizes drawing. Refusal preserves raw
+  observers, Core, other Tools, and the existing Alcohol Timer.
+- A cached map tile could exceed the individual-marker budget while its scale
+  also excluded clusters. Large tiles now keep bounded clustered guidance.
+- Atlas repacking could leave a removed label sampling another sprite. An atlas
+  generation now invalidates live labels without losing withdrawal ownership.
+- Inactive HUDs allocated and uploaded an atlas. They now allocate on first use,
+  reuse digit/color sprites, and retain one bounded atlas through short gaps.
+- Renderer uploads misread signed wasm32 allocation results above 2 GiB.
+  HUD, terrain, map, and range uploaders now normalize addresses before copying
+  and releasing their buffers. Tests use actual high-address WASM memory.
+- Failed native cleanup could leave listeners or other resources behind.
+  Installation rollback and disposal drain owned resources even after failures.
+- Playwright's default output directory cleared unrelated local evidence and
+  the disposable development profile during this review. Each suite now owns
+  a separate output directory. The canonical game files and regular profile
+  were outside that directory. Deleted historical captures are unavailable.
+
+The branch includes main commit `0515bdc2`. Capability order preserves Alcohol
+Observation at bit 18 and appends Native HUD Rendering at bit 19. Derived output
+uses enhancement ABI 67, Cartography ABI 39, and semantic verifier ABI 8.
+
+Final source verification passes: 1,712 unit tests, 182 policy tests, 196 Tools UI
+tests, and 81 launcher UI tests, plus types, lint, and documentation links.
+Integration (111), release checks (30), and Tools end-to-end tests (42) pass.
+The full Electron run found two obsolete map-control selectors and one
+focus-sensitive pointer-lock failure. The corrected map checks and isolated
+pointer-lock rerun pass (four tests). Packaged launcher and Tools smoke tests
+also pass. Both Playwright suites preserved an independent evidence sentinel.
+The actual-client artifact suite exits successfully; the retained previous-WASM
+comparison is skipped because no previous artifact was supplied. High-memory
+HUD bytecode tests also pass.
+
+Native drawing fixtures execute
+the emitted WASM; offline visual replay uses the production atlas and ordered
+quads. These checks do not replace acceptance of the final signed release.
+
+This review checkpoint precedes stack publication. Earlier sections below are
+historical evidence and do not describe current open defects.
+
+## Historical stage 4 checkpoint
+
+**Stage 4: native map migration visually accepted; performance and veil fixes under verification.**
+Matthias accepted the corrected Compass terrain, motion and native UI coverage,
+including after restarting his Mac. He then accepted the first native Mission
+and World Map drawing visually, but reported high performance cost and a missing
+dark outside terrain veil. Those reports remain open until the rebuilt version
+is tested live. The earlier stage ledgers below retain their historical scope.
+
+The current implementation removes permanent grid lines and explored-area tint,
+preserves remaining marker styles, and draws map artwork through native owners.
+The initial live counters showed hundreds of texture uploads. Investigation
+found that every exploration read advanced a sequence used as a content cache
+key, repainting unchanged data. The optimized version compares actual bits,
+caches overscanned map artwork through pan/zoom, isolates hover into a small
+texture, and skips unchanged native Compass mesh writes. Native camera movement
+is not throttled. Terrain and map graphics also use the existing native bitmap
+material recipe (14205) rather than the Compass ring recipe, to preserve the
+dark outside veil. Ranges retain their previously accepted material.
+
+Focused tests cover unchanged exploration, cached pan/zoom, independent hover,
+native bitmap input ownership, matrix restoration, stale/context-reset refusal,
+and resource cleanup. Final gate and live measurements are recorded below when
+available; counters do not themselves certify gameplay feel or visual quality.
+
+**Stage 2 verdict: native composition demonstrated for one local ring; migration remains on hold.**
+Matthias confirmed native panel and tooltip coverage. The ring is visibly off-center,
+and resize, UI-scale, full lifecycle and production performance remain unproved.
+The experiment is local and uncommitted. See the separate Stage 2 ledger below.
+
+**Stage 1 verdict: on hold.** The bounded probe found a live native item-tooltip frame
+and plausible bounds/order. It did **not** establish effective pixel coverage,
+inherited clipping, or synchronization with browser presentation. The first
+acceptance gate therefore remains open. No occlusion mask or native insertion
+was added. This is an uncommitted local research experiment, not merge-ready
+capability or current product behavior.
+
+Started 12 September 2026 at 11:07:52 UTC; hard stop 12:07:52 UTC (60 minutes).
+Normal development research; no commit, push, PR, release, or subagent.
+Investigation and review concluded at 11:52:05 UTC, about 44 minutes elapsed.
+The retained result stops at native discovery; no incomplete coverage claim was
+used to expand into panel support or rendering changes.
+
+## Question and gate
+
+Can the current WASM identify a weapon/item tooltip covering the Compass with
+correct visibility, bounds, clipping, timing, and relative native draw order?
+A presentation experiment must first establish those facts independently of
+mouse position, item payload presence, frame-table position, and screenshots.
+Close, loading, stale, reset, malformed, and ambiguous observations must withdraw
+the dependent enhancement; accepted uncovered regions must remain visible.
+
+Opening/closing, overlap/non-overlap, movement, resize/UI scale, and input must
+then be checked in the real isolated client. Only after this first boundary
+succeeds should a second movable panel and second enhancement be implemented.
+Synthetic geometry cannot establish native discovery. Automated observations
+cannot award Matthias's gameplay acceptance.
+
+## Identity and containment
+
+- Worktree: `../gwonmac-native-ui-coverage`; branch `research/native-ui-coverage`.
+- Refreshed `origin/main`: `70a51d6bbbdbd408bfc337e737d69d88c52fdf7a`.
+- Primary checkout remained clean on `fix/native-font-symbol-decoding`; unrelated
+  worktrees and sessions were not changed.
+- GWCA reference: `e1bc30323bac1194fa4766e1ecbc695fe2e3ca7e`.
+- GWToolbox++ reference: `baaaf0de574b02008baa57a574625a99009cd5ac`.
+- Official cached WASM SHA-256:
+  `1eb07332632e2fca8aabf5baa14fa1a1e6a2a59ec7134dfb8f6231d924c9fd7b`.
+  Doctor reported verified artifacts, supported client, buildId `514880306`.
+- Local, ignored evidence: `test-results/native-ui-coverage/`. It includes private
+  live screenshots and is not suitable for redistribution.
+
+Matthias closed his prior session and signed in normally in the isolated app.
+As requested, only the existing game artifacts, chunks, and boot-chunk manifest
+were copied with APFS copy-on-write into the disposable profile. No credentials
+or player settings were copied. Doctor found all 16,175 chunks present,
+4,239,980,544 bytes, and cached-live readiness. Chunk completeness is presence
+checking, not a fresh content hash of every chunk. The launch required the
+cached client; no second game download was needed.
+
+The successful app process was PID 90172, exact worktree Electron executable,
+with profile `/private/var/folders/cw/90shxw3964q2rcs_j_nvt_cc0000gn/T/gwonmac-native-ui.vRpbLf`
+and ephemeral debugger port 55023. CUA attached only after process/path/profile
+verification. Named scalar diagnostics were sampled through that debugger;
+there was no runtime memory/pointer access or generic UI-call bridge.
+
+## Round 1: payload presence is not visible coverage
+
+**Hypothesis:** Historical GWCA's `FrTip` / `CMsg::Validate(id)` anchors could
+identify a current-WASM tooltip lifecycle. Toolbox's `TooltipInfo` gives callback,
+flags and payload; it does not give screen bounds. These were semantic leads,
+not a transplanted native implementation.
+
+**Evidence:** A bounded assertion/string scan located the current `FrTip.cpp`
+functions. Exact-body replay in
+the lifecycle test (retired research fixture)
+retains real bodies 6201, 6202, 6203 and 6208 and replaces only enumerated peers:
+
+- 6201 selects an active tooltip and finds root child ID -1 through 6560/6565.
+- 6202 refuses disabled/null callbacks, dispatches cancellable message 85, then
+  creates root child -1 with the supplied flags OR 32 through 6650.
+- 6203 measures/positions it through 6462/6470. This queues positioning; it does
+  not itself prove final screen geometry.
+- 6208 destroys the child but leaves the active-tooltip pointer set. The replay
+  explicitly observes that stale pointer after clear.
+
+**Result:** Active payload alone is rejected as visibility authority. Exact
+hashes, signatures, controlled peer calls, suppression, repeated selection,
+positioning, close and reopening are executable evidence. The replay does not
+execute a real native frame manager or prove live coverage.
+
+## Round 2: a bounded live discovery probe
+
+The local observer (retired research fixture) adds
+one internal call at the end of exact native FrCache render body 6594. It adds
+13 scalar globals and no callable exports, imports, or renderer memory access.
+The existing isolated Cartography verifier verifies the resulting derived
+output. The official artifact is unchanged. A changed checked body skips this
+research observer while retaining the preceding Cartography output.
+
+Its exact-build facts are:
+
+- Frame array/count `0x5a3b1c` / `0x5a3b24`, frame size 456, ID at +188.
+- Root relation at `0x5a3b58`; frame relation +296 and child ID +300.
+- Unique root child -1 is the FrTip candidate; Compass label hash is 3268554015.
+- Cache array/count `0x5a3be0` / `0x5a3be8`; frame word zero is the native cache
+  grouping/order key, not its frame ID or table position.
+- Bounds at +268/+272/+276/+280 use the existing frame geometry convention.
+  Fields +260/+264 retain the existing `viewportWidth/Height` names, but the
+  clipping investigation below shows why these alone cannot certify general
+  ancestor clipping or a global viewport for arbitrary frames.
+
+The observer bounds both collections at 16,384; checks frame identity against
+its table slot; requires distinct Compass and tooltip cache membership; rejects
+hidden/destroyed/disabled candidates and ambiguous identities. It publishes a
+sequence and the existing area epoch. Those are diagnostics, **not** proof that
+the native cache, area epoch, and browser paint are one atomic presentation.
+`aboveCompass` means a larger native cache key; it does not promise pixel cover.
+
+The emitted-bytecode fixture (retired research fixture)
+checks bounds, ordering refusal, absence, duplicate membership, stale identity,
+state refusal and memory limits, including an actual 4 GiB memory. It runs the
+real generated observer against controlled memory, not the game.
+
+### Live measurements
+
+The earlier compiled probe ran in the logged-in isolated client. Screenshots
+were used only to compare results, never to discover or drive coverage.
+
+| Observation | Native result | Boundary established |
+| --- | --- | --- |
+| Item tooltip over Compass, 47 samples, 11:37:41–53 UTC | Frame 339, tooltip order 49, Compass frame 53/order 5, generation 1 | Named root-child candidate present above Compass in native cache |
+| Same tooltip's bounds | left 1196.9092, bottom 463.7102, right 1347.2728, top 539.9829 | Projects to the visible rectangle of the **Istani Raiment** item tooltip |
+| Inventory restored, 11 samples, 11:40:09–12 | Frame 0, aboveCompass 0 | Visible tooltip closure withdraws candidate identity |
+| Item tooltip away from Compass, 19 samples, 11:45:10–15 | Frame 435/order 52; left 880.9999, right 1031.3635; Compass left 1102 | Presence/order is independent of actual geometric overlap |
+| User resized/rearranged native windows | Viewport changed from roughly 1396×838 to 1347×620; nine refusal samples during the interval | Candidate can refuse during changing UI; does not prove visual synchronization |
+
+The capture label `equipped-weapon` was an intended interaction label; the actual
+visible tooltip was armor, not a verified weapon-set tooltip. Other transient
+candidate frames appeared during user movement, but their contents were not
+individually verified. Weapon-specific behavior remains untested.
+
+Matthias also placed inventory and Party Formation over the Compass. Rings
+visibly painted above both panels. This confirms the broader symptom, **not**
+coverage discovery for either panel. The agent's temporary inventory movement
+was restored; Matthias's Party Formation placement was preserved.
+
+The live prototype retained old geometry after an absent/invalid observation.
+Its identity/status correctly withdrew, but this was a misleading diagnostic.
+The final source clears those values, fixes duplicate-membership counting and
+checks the end of exact 4 GiB memory. Those final safeguards passed offline
+checks; the active game was not restarted to claim a final-code live pass.
+
+### Reproducible module identities
+
+| Stage | SHA-256 |
+| --- | --- |
+| Live pre-Cartography module | `88cbdc0a15238ea5e01c83c4c63cb6e07d27195beea7f4d72c2ac35fb951c1f3` |
+| Live Cartography output | `4ada9e1c747be1e064a8144cf4c8fcd470a9cc6db4a82a5b6b1fe232399649f2` |
+| Live final module, after double-click repair | `8e963bef08a8de6a28185e06571075099a0aff236ab22d4bc74065646e3d4a0b` |
+| Final source applied directly to official input in fixture | `1a727c49c23429422bfcd43301c9e4f74b84c7c9eb40f8a5c8d70b60fa77f828` |
+| Final source on live pre-Cartography input, offline | `3e9cd7c6d941294d8efdb23e1487171ad7a64ef2b94288b69841d90a79fdd076` |
+
+Research transform ABI is 32. These are local experiment identities, not
+published certification profiles. Body hashes for each guarded function live
+in the observer/test, rather than a second copied table here.
+
+## Round 3: why neither rendering route is accepted
+
+The [range layer](../../src/renderer/cartography-spike/compass-range-layer.ts)
+is a pointer-transparent 2D canvas at CSS z-index 10, clipped only to the native
+Compass circle. CSS order cannot interleave it with UI already composited into
+the single game canvas.
+
+**Bounded coverage mask:** Discovery is promising, but a screen rectangle is
+not effective native coverage. FrCache 6585 forms command batches; 6594 renders
+those batches, invokes message 53 callbacks and changes native clipping.
+6448 reads frame-relative clipping edges (+252 through +264), applies UI-scale
+rounding, and 6450 chooses a parent clip or a full viewport from position flags.
+Neither the observer's rectangle nor its cache-membership test observes that
+full executed clip state. The post-cache sequence is also not tied to the
+browser overlay's actual paint. A stale read must withdraw the dependent rings,
+not merely the diagnostic object; no such consumer has been claimed here.
+
+Even a correct rectangular cutout would be a **conservative approximation**.
+It removes rings through rounded corners, transparent margins, and translucent
+backgrounds where native composition would retain some contribution. It cannot
+be described as exact alpha composition. No mask was added before this gate.
+
+**Native insertion after the owning surface:** The existing Compass certificate
+identifies render function 14240, its call to map renderer 14179 at offset 608,
+and their exact body hashes in
+[the certificate](../../src/main/certification/cartography-transform-internals.ts).
+The named Compass frame's constructor 15750 is not that draw boundary. An
+“after map function” hook is not automatically after the corresponding GPU
+commands: FrCache gathers and batches UI rendering. The inspected 6585/6594
+chain has no accepted per-Compass submission marker that preserves the remaining
+UI's order, clipping and state. No arbitrary draw ordinal, program/shader ID,
+world-space renderer or queue-splitting experiment was promoted as a solution.
+
+**Next unanswered question:** Can one exact native cache-command boundary bind
+the identified tooltip's effective clip and Compass ordering to the same host
+presentation? Establish that before a bounded cutout test. For native alpha
+composition, separately certify an insertion after the owning surface's actual
+submitted UI commands and before subsequent native UI. Neither is disproved;
+neither is established by this experiment. No second panel/enhancement was added.
+
+## Commands, failures and verification
+
+From this worktree, with `GW_CLIENT_WASM` naming the retained official artifact:
+
+```sh
+pnpm install --frozen-lockfile
+python3 tools/wasmscan.py "$GW_CLIENT_WASM" FrTip.cpp FrCache.cpp
+node --import ./scripts/ts-hook.mjs --test \
+  tests/client-artifact/pathing-spike-transform.test.ts \
+  tests/client-artifact/native-tooltip-lifecycle.test.ts \
+  tests/client-artifact/native-tooltip-probe.test.ts
+pnpm run check
+pnpm build
+GW_BACKGROUND_LAUNCH=0 GW_REQUIRE_CACHED_CLIENT=1 pnpm exec electron "$PWD" \
+  --user-data-dir="$native_ui_profile" --remote-debugging-port=0
+```
+
+`native_ui_profile` must name the retained disposable profile; the exact value
+is in local `profile-path.txt`. Do not launch a duplicate into an active profile.
+The build above produced the **earlier live probe**, not the final safeguards.
+The final artifact tests passed 3/3. Final `pnpm run check` passed: type checking,
+lint, links, unit/policy tests, Tools and launcher tests. No release, packaged,
+performance or broad end-to-end suite was claimed.
+
+Failures retained for avoiding repeat work:
+
+- First evidence was incorrectly stored under `build/`; the build cleans that
+  directory. Initial scanner/check logs were lost. Evidence moved to ignored
+  `test-results/`; exact-body dumps and final checks were regenerated.
+- An extra slash and `/var` versus `/private/var` made `GW_EXPECT_USER_DATA`
+  disagree with Electron's canonical profile. The first launcher remained at
+  preparation. It did not establish a successful startup.
+- A profile-path rewrite accidentally truncated its input before reading, so a
+  retry used the worktree root as profile. It exited without gameplay/login.
+  Only the generated profile files were moved into ignored `accidental-profile/`;
+  the worktree was checked for unintended remaining files. Correct launch
+  omitted that unnecessary environment assertion and verified the real process.
+- Initial checks caught BufferSource typing, import-type style, a `prefer-const`
+  error and missing two-line source headers; fixed before the passing gate.
+- `wasmscan.py --help` is unsupported and treated `--help` as an input filename.
+  The documented positional interface and its Python decoder were used instead.
+- CUA rejected a stale element index and later an action after user UI changes;
+  fresh state was read before retry. No inference from an attempted action was
+  counted as a completed test.
+- Show Launcher initially failed through stale CUA menu state. Resetting only
+  the automation connection and selecting the fresh menu item succeeded;
+  `gw://app/launcher/index.html` showed ready state and the open account's Show
+  button. The game process and login stayed alive.
+
+Not tested: final source in a restarted client; a controlled loading/area-change
+cycle; explicit UI-scale changes; inherited clip variants; frame-perfect
+open/close synchronization; alpha-correct masking; new-layer input pass-through;
+weapon-set tooltips; performance cost; any coverage for Party Formation or
+inventory itself. Existing sessions were preserved after the owned test.
+
+## Time ledger
+
+- 11:07:52 UTC: start, scope/instructions and isolated base preparation.
+- By 11:21:30: bounded native investigation and lifecycle/probe work underway.
+- 11:32:49: successful isolated process checked; user reported logged in.
+- 11:34:37–11:37:53: native candidate sampling and real item-tooltip overlap.
+- 11:40:12: tooltip closure measured; inventory movement restored.
+- 11:43:49–11:43:56: final launcher portion of the passing repository gate.
+- 11:45:10–11:45:15: non-overlapping item-tooltip observation.
+- 11:52:05: final diff/evidence review complete; real launcher visibly open with
+  the game session preserved. Repository gate, focused tests, links and whitespace
+  checks passed. No verification-only process remains running apart from the
+  intentionally retained isolated app.
+
+## Stage 2: native Compass submission experiment
+
+Additional authorization: 30 minutes, starting 12:02:52 UTC on 12 September 2026;
+active investigation hard stop 12:32:52 UTC. Prior evidence remains discovery
+only. Objective: one identifiable ring in the native Compass content path,
+covered and alpha-blended by later native UI. No panel masks, queue splitting,
+world-space work, subagents, publication, or automatic time extension.
+
+At entry, PID 90172 still belongs to this worktree and its retained disposable
+profile. Existing game files and dependencies are reused. Necessary owned-app
+rebuild/relaunch is authorized; credentials will not be copied.
+
+
+### Stage 2 implementation and semantic boundary
+
+The exact-build transform appends one magenta ring to the existing Compass Canvas
+vertex/index allocation in native function 14137. It preserves the existing
+geometry prefix, handle, material, retained transform, clipping and submission.
+The Canvas owner attaches its draw object through 14126 → 6827 → 6491, slot 4.
+FrCache 6585 retains the batch; 6594 reaches GrDev 2956, whose records execute
+through 2852. This is native buffer ownership, not a draw ordinal, shader ID,
+post-return GL injection, queue split, replay, or panel rectangle mask.
+
+The ring adds 96 vertices and 288 indices (96 triangles) to that native mesh.
+Original allocation calls run once each. The existing [0,256] geometry bound
+also becomes active when only the ring is present. Native methods still own
+buffer unlock, resource lifetime, render state and submission. This code does
+not itself call WebGL, bind a framebuffer, change blend/scissor state, or expose
+native pointers. No measured draw-call or GPU-cost claim follows from that fact.
+
+Eleven exact body hashes guard the native owners, allocation/unlock functions,
+and submission path. They are listed in `src/main/certification/native-ring-probe.ts`.
+The wrappers refuse vertex counts above 60000. Two fixed scalar globals expose
+only enable state and update count. The renderer provides an explicit local
+ON/OFF button; it starts OFF, resets on graphics-context reset, and disposes its
+listener and presentation isolation. There is no general renderer drawing API.
+
+ON temporarily hides the existing external Compass circles through a local
+style. OFF removes that style and restores the existing circles. No persisted
+range setting is changed. This experiment does not replace the product renderer.
+
+### Stage 2 artifact identity
+
+All live Stage 2 screenshots under `test-results/native-ui-coverage/stage2/`
+belong to this exact chain:
+
+- Official: `1eb07332632e2fca8aabf5baa14fa1a1e6a2a59ec7134dfb8f6231d924c9fd7b`.
+- Pre-Cartography: `88cbdc0a15238ea5e01c83c4c63cb6e07d27195beea7f4d72c2ac35fb951c1f3`.
+- Cartography ABI 33: `e97970337e5776fa74eb65ba9e1ebcdfb115ee6ea5b4655546254ab09e647e75`.
+- Final double-click derivative: `53acbfe6d25ec0958be651e4135d5eca4ec7bd3171652cbaccf2fb687d4ccfe8`.
+
+`module-hashes.json` records these values. `source-artifact-match.log` independently
+regenerates Cartography from the live predecessor and confirms byte identity.
+The official artifact remains unchanged. The prior process had exited before
+relaunch; the owned app now runs as PID 2574 from this worktree, using the same
+disposable profile and existing cached game files. Matthias pressed Play and
+signed in normally. No saved credentials were copied. The launcher briefly
+showed download status; this record does not claim zero network requests.
+
+### Stage 2 live evidence and user acceptance
+
+- `live-native-ring.png`: native ring visible, native terrain, markers and border
+  remain visible. The ring is inside the Compass content. This does not prove
+  every marker/ring pixel intersection or clipping at the outer border.
+- `party-overlap.png`: Party Formation covers the left/bottom ring and attenuates
+  it through translucent background; uncovered top/right arcs remain bright.
+- `inventory-overlap.png`: Inventory covers most of the ring while its right
+  arc remains visible outside the panel. Native content remains visible through
+  translucent regions. Both panels were moved and restored through native UI.
+- Two automated item-hover attempts did not show a tooltip. Their filenames
+  (`tooltip-overlap.png`, `tooltip-hover-attempt.png`) do not establish tooltip
+  coverage. They are retained as failed controls.
+- Matthias then reported: “it works too, tooltip overlays are fine too”.
+  `user-tooltip-confirmation.png` captures the real Paragon's Crest tooltip
+  covering the top-right ring, while the right arc remains visible below it.
+- `ring-off-restored-external.png` shows the native ring absent and the four
+  previous external range circles restored. `ring-on-again.png` shows the native
+  ring returning, with external circles isolated again.
+- Closed diagnostic samples in `live-samples.jsonl` record ring enable/update
+  values and native Compass/tooltip geometry. These are not frame-time samples.
+
+Matthias also reported: “its good and working but its not centered”. That accepts
+the tested coverage while identifying a visible defect. It is not full gameplay,
+input-feel, resize, UI-scale, lifecycle, or production acceptance.
+
+### Alignment defect and remaining gates
+
+The ring is centered at fixed Canvas coordinates (128,128). The observed native
+Compass frame is 245 logical units wide; its midpoint is 122.5. Screenshots show
+an approximately five-pixel right/up offset. The width mismatch is a plausible
+explanation, not a verified transform correction. No screenshot-tuned offset was
+added. Correct native center/radius mapping, resizing and UI-scale behavior need
+a rebuilt exact module and a fresh live check. The current preview remains
+intentionally recognizable as an uncentered diagnostic ring.
+
+This run did not force graphics-context loss, change maps, exercise long-lived
+resource recreation, resize the Compass, change UI scale, or measure GPU/CPU
+frame cost. Source cleanup and offline allocation tests cannot establish those
+live properties. Native panel drag and button operation establish only the input
+boundaries executed. The native line atlas/material constrains this geometry;
+other overlay styles and native textures have not been established.
+
+For Cartography and walkable terrain, reuse of native composition is promising
+but remains an inference. A small triangle mesh could follow this owner, subject
+to coordinate, clipping, ordering, resource and cost verification. Dense terrain
+could require many more vertices or a native texture owner, which this run has
+not proved. The current Compass owner does not establish a Mission Map or World
+Map owner. Map knowledge, reachability and layer policy remain separate from the
+drawing mechanism. Do not migrate all overlays from this single-ring result.
+
+### Stage 2 verification and ledger
+
+- 12:02:52 UTC: additional 30-minute authorization begins.
+- Native Canvas/FrDraw/FrCache/GrDev path inspected using existing local artifacts.
+- First emitted fixture failed because fixture type encoding used strings;
+  corrected to Wasm numeric value types. No live artifact used that broken fixture.
+- Four focused client-artifact tests pass: ring geometry/prefix preservation,
+  tooltip probe, tooltip lifecycle, and combined Cartography transform.
+  See `fixture.log`. The ring test executes emitted wrappers against controlled
+  allocators, checks all vertices/indices, default OFF and oversized refusal.
+- `pnpm run check` passed; final run exit 0, see `check-final.log`.
+- Full build passed, then the final renderer owner build passed after adding
+  temporary external-circle isolation. See `build-final.log`, `renderer-final.log`.
+- Rebuilt owned app launched; Matthias signed in. Native panel comparisons,
+  user-confirmed real tooltip, and OFF/ON controls completed on the hashed module.
+- No benchmark, new dependency, subagent, extra task, commit or publication.
+
+**Recommendation:** retain this as an exact-build proof of native composition.
+Next, correct native coordinates and complete ring lifecycle/resize/cost checks.
+Only then test one small walkable-terrain layer. Production migration is on hold.
+
+Stage 2 investigation and handoff concluded at 12:30:55 UTC on 12 September 2026,
+within the additional 30-minute cap. The launcher is visibly open with one
+account still open and Show available. Native ring is OFF; external range
+circles and pre-comparison panel positions are restored. The owned game session
+is preserved. Final source/artifact identity, Markdown links and whitespace
+checks passed. The centering defect remains unfixed; no further implementation
+or investigation is claimed under this timebox.
+
+## Stage 3: centering, lifecycle and a small terrain control
+
+Matthias explicitly authorized a new sequence after the completed Stage 2:
+correct centering, verify resizing and cleanup, then try a small walkable-terrain
+layer. Migrate the relevant renderer and remove its old drawing path only after
+that layer passes. This authorization has no new time cap. It does not authorize
+publication or a migration of every map surface.
+
+### Centering and resize evidence
+
+Native Canvas body 14137 projects vertices using the retained rectangle at
+owner offsets 172–184. Bodies 14132 and 14147 independently use that rectangle
+for inverse projection and hit testing. The ring now uses half the current
+width and height, with radii proportional to those dimensions. The native
+retained transform continues to own the origin. No host width cache or
+screenshot-tuned offset was added. Bounds grow when the native rectangle grows.
+
+The fixture executes the emitted allocation wrappers. It checks 256, 245 and
+384 unit rectangles, a nonsquare rectangle with a nonzero origin, malformed
+dimensions, original geometry preservation, and OFF behavior.
+
+The live centering build uses Cartography ABI 34:
+
+- Pre-Cartography: `88cbdc0a15238ea5e01c83c4c63cb6e07d27195beea7f4d72c2ac35fb951c1f3`.
+- Cartography: `29dc105dbd3f71206626460248faca3a821e45165b3778b64632111e75decc01`.
+- Final derivative: `ae4c833c29044cf98b70c4b9a87a085f47df98febd44bd63d1fd0be16f6e6e0e`.
+
+The existing isolated profile and game cache were reused. Matthias signed in
+normally. Ignored evidence lives under `test-results/native-ui-coverage/stage3/`:
+
+- `centered-ring.png`: the corrected ring is centered in the Compass.
+- `large-interface-centered.png`: the setting was **Extra Large**, despite the
+  filename. The native Compass and ring remain aligned.
+- `window-zoom-centered.png`: alignment after enlarging the game window.
+- `live-samples.jsonl`: named scalar diagnostics for those boundaries.
+
+Normal interface size, DPI scaling ON, and the original game-window size were
+restored. Native interface scale changes reflowed some panel positions. Full
+layout restoration remains to be checked. Automated Compass handle drags did
+not establish a size change. Matthias was asked to resize it once; that check
+is pending. UI-scale and window resizing do not substitute for this boundary.
+These are automated observations, not Matthias's graphics acceptance.
+
+### Resource ownership
+
+The ring adds no texture, material, buffer, or draw-object owner. It appends to
+the native Canvas buffers, retaining the original allocation and release path.
+A focused fixture replays unchanged native destructor 14116 against controlled
+release peers. It releases the Canvas buffer and draw handles once each.
+The current exact-build guard also checks this destructor.
+
+Renderer fixtures prove OFF, graphics-reset handling, listener removal,
+detached-button refusal, and removal of the external-circle isolation style.
+They do not prove live GPU context recovery or long-duration resource behavior.
+No forced context loss or production performance measurement is claimed.
+
+### Bounded terrain control prepared for the next live check
+
+ABI 35 adds an explicit OFF-by-default terrain button. Its input is the accepted
+Cartography walkability raster, world anchor and area identity. It selects an
+8 × 8 patch near the player and publishes only two bitset words and fixed scalar
+coordinates. There are no public native pointers, generic calls, or writes.
+
+The native Canvas update captures its own current camera coordinates and
+direction. The patch uses that same native projection and retained material.
+It adds at most 256 vertices and 384 indices to the existing buffer. It creates
+no texture or extra retained resource. Stale area identities, invalid dimensions,
+and invalid camera directions withdraw the patch. Complete cells outside the
+bounded Compass circle have zero alpha. The control temporarily isolates the
+old Compass mask while ON; OFF and teardown restore it without changing settings.
+
+Offline fixtures check raster bit identity, map-to-world orientation, camera
+projection, original geometry preservation, simultaneous ring/terrain indices,
+stale-area rejection, and reset/disposal. These do not establish live atlas
+sampling, panel coverage, style parity, or graphics cost.
+
+This patch is a placement and ownership control. It is not the existing inverse
+veil with its soft boundary. Static inspection found native texture creation
+and copy ownership, but did not prove a reusable pixel-upload path. Several
+candidate functions proved to be color adjustment or sampling instead. A full
+raster migration must preserve the current style and avoid unbounded mesh size
+or texture creation on every camera update. Native Canvas projection and the
+existing host projection also use different scale constants; parity needs an
+explicit comparison. No renderer cutover or old-path removal is claimed yet.
+
+## Stage 4 verification checkpoint
+
+The optimized ABI 38 build passes `pnpm run check` (1,698 unit tests, 182 policy
+checks, 196 Tools UI tests and 81 launcher tests) and `pnpm build`. The emitted
+native ownership fixtures pass for both Compass surfaces and all four map
+surfaces, including separate Mission/World inspection layers. Final focused
+checks cover content cache identity, local inspection, copied pixel ownership,
+unchanged-camera reuse and reset/disposal. Saved map styles and existing game
+chunks are reused from the persistent isolated profile under ignored
+`test-results/native-ui-coverage/profile`.
+
+The ABI 37 game had exited cleanly before the optimized app was launched.
+ABI 38 launcher startup was verified at `gw://app/launcher/index.html`. Live
+performance and outside-veil acceptance remain pending sign-in. No before/after
+FPS improvement is claimed from offline cache assertions.
+
+## Stage 5 — native skill and effect HUD migration (2026-09-12)
+
+Migrated skill-key badges, skill cooldown labels, and controlled-player effect
+labels together. The existing certified geometry, recharge, effect observations,
+formatters, policy and settings remain the data owners. Removed the three
+positioned browser HUD renderers. Settings previews remain browser components;
+no launcher or game panel layout was rearranged.
+
+The private native HUD transform extends the Enhancement output independently
+of Cartography. Exact native function guards refuse unsupported clients. It
+collects per-icon retained meshes in FrDraw slot 9, after the frame's stock
+drawing, using the stock clipped category. The SkillBar captured identity and
+Effects parent hash constrain attachment. Source draws must have exactly one
+mesh. Native viewport/origin changes renew the retained viewport; unchanged
+geometry and countdown updates reuse the draw. Native destruction releases the
+owned resources, and duplicate matching owners cannot steal a queued label.
+
+One detached 1024-square BGRA atlas holds the key plates and cached numeric
+characters. All effect urgency colors are prepainted. Text changes publish only
+normalized glyph quads. Effect expiry preserves the remaining resource slots.
+There is no browser HUD fallback. Native missing-owner cases display nothing.
+
+The controlled native fixture executes the emitted WASM against resource peers.
+It checks final-category attachment, native coordinates, resize, ancestor alpha,
+atlas reuse, input refusal and idempotent cleanup. Renderer fixtures check all
+three joins, upward timer formatting, stale withdrawal, cached urgency changes,
+and no duplicate publications. `pnpm run check`, the focused native fixture,
+`pnpm build`, and `git diff --check` passed. Enhancement ABI is 59.
+
+The rebuilt isolated launcher reuses the retained profile and existing chunk
+symlink. Its `gw://app/launcher/index.html` handoff is the live entry point. Live
+visual acceptance, tooltip coverage and timed native HUD counters are pending
+Matthias signing in. No gameplay or graphics acceptance is claimed by the
+controlled fixtures. No commit, publication or canonical artifact change occurred.
+
+### Stage 5 live refusal and attachment correction
+
+Matthias reported that none of the migrated HUDs appeared. The ABI 59 live
+counters showed four atlas uploads, zero mesh updates and zero created draws.
+The enabled settings included all three HUDs and a custom shortcut on skill 8.
+The synthetic fixture had incorrectly supplied a reusable stock draw on the
+logical skill slot.
+
+Exact initializer 14063 places the visible bitmap at child 2 of each logical
+skill slot. ABI 60 targets that bitmap child and captures the native UI matrices
+with 6446/1563, following the native 6488 recipe. It creates its own single-mesh
+draw, removing the source-bitmap assumption. The fixture now has a logical slot
+and bitmap child with no retained stock draw. It refuses attachment to the
+logical container and verifies the independent bitmap drawing path. Added
+bounded published/matched/collection counters for the live attachment boundary.
+
+The corrected fixture, type checking and build passed. The isolated client was
+restarted with the same game files and profile. The live corrected drawing check
+is pending sign-in; no successful graphics claim is based on the fixture.
+
+### Stage 5 native cache traversal correction
+
+ABI 60 still published labels without attaching any. Bounded live inspection
+confirmed skill 8's bitmap child was visible in the native render list, under
+the published SkillBar. Its stock draw vector contained six layer slots.
+
+The exact 6585 cache builder stops collecting ordinary frames when 6492 first
+returns zero. Thus a wrapper that only adds slot 9 never sees these icons.
+The earlier direct collector fixture skipped that caller behavior.
+
+The expanded fixture executes the unchanged 6585 cache builder and original
+6492 collector with a six-slot stock bitmap. It reproduced the failure: only
+the stock bitmap reached the compiled output. ABI 61 reports intermediate
+empty slots only for a matching published HUD owner, allowing the native loop
+to reach slot 9. Other owners and disabled labels retain stock termination.
+The exact cache-builder hash is now guarded too.
+
+The regression passes for cooldowns, skill 8 shortcuts and Effects labels,
+preserving stock output and verifying hide/re-enable, resize and cleanup.
+Live verification of ABI 61 remains pending; fixtures do not establish visual
+acceptance.
+
+### Stage 5 child artwork ordering (2026-09-12)
+
+ABI 61 produced live HUD drawings. Matthias then reported dim cooldown numbers,
+poor shortcut readability, and missing Effects numbers. A bounded live capture
+showed a published Effects timer of 13 seconds for child 1582 under Effects
+frame 42. The native icon had a bitmap and two further descendants, which drew
+after the logical icon and covered the timer.
+
+ABI 62 uses the exact cache loop's next visible frame to draw labels after each
+icon's final visible descendant. The lookup follows at most 16 ancestors; it
+does not scan the frame table or upload pixels per frame. The retained draw
+still belongs to the icon, with its geometry, projection and destruction.
+The fixture executes stock cache traversal with an icon, child veil and later
+panel: stock artwork, veil, label, then panel. It covers all three HUD channels.
+
+Shortcut plates use a darker background, heavier outlined text, a larger legible
+size and a one-pixel bottom-right inset. Transparent sprite padding no longer
+lifts the plate above that corner. Matthias supplied the intended corner
+placement. Live verification of this revised ordering and appearance is pending.
+
+### Stock keycap reference
+
+Matthias supplied Minimalus's Unaltered texture directory. Inspection found the
+original numeric/F-key atlas `GW.EXE_0x0FB3CF3B.dds` (also present with the
+`Gw_T_0XFB3CF3B.dds` filename). Its glyphs are baked into small plates; it has no
+Mac modifier chords. The downloaded files remain local references.
+
+`skill-key-artwork.ts` recreates the silver upper-left bevel, dark olive face
+and outlined light glyphs across a variable-width plate. The local game's
+extracted display font supplies letters; system glyphs supply Mac modifiers.
+The visual matrix uses that same painter, including a 51-pixel skill icon with
+Shift+Command+X. It keeps the one-pixel bottom/right inset at 1x, 1.5x and 2x.
+The obsolete separate DOM keycap artwork was removed from production sources.
+No dumped game texture or derived font is committed.
+
+### All eight keycaps
+
+Matthias requested consistent styling across all eight slots and no duplicate
+stock labels. ABI 63 keeps saved custom bindings and uses 1–8 for unset slots.
+Settings identifies these defaults without saving synthetic bindings.
+
+Exact initializer 13162 identifies the stock keycap as bitmap child 6 with
+callback 3359/13124/13125. This is distinct from child 11's icon artwork. The
+collector omits only that keycap's drawing when its matching replacement is
+published under the captured player SkillBar. It leaves native frame/resource
+ownership and game controls intact. Disabling or withdrawing labels restores
+the original keycap at the next invalidated native cache build.
+
+The native fixture verifies suppression only for active key labels, preservation
+for cooldown/effect-only drawing, and automatic restoration when disabled.
+The renderer test verifies all eight defaults plus a retained Shift+Command+X
+customization. The expanded native fixtures, `pnpm run check`, `pnpm build`, and
+`git diff --check` passed. Stock-style keycap calibration ran at 1x, 1.5x
+and 2x using the local game font, including a 51-pixel chord example.
+The isolated ABI 63 launcher is open for live acceptance with the retained
+profile and game chunks. No commit or publication occurred.
+
+
+### First-draw latency, ordering and scale (ABI 64)
+
+Matthias reported delayed cooldowns and effect timers, fixed-size shortcut
+plates, and cooldowns covered by the replacement keys. The bounded live scalar
+capture observed resource creation followed by the first mesh update 987 ms
+later. Its optional semantic-state getter was unavailable; the timing evidence
+comes only from the named native counters.
+
+Releasing a label cleared its native handles but retained cached icon bounds.
+On recreation at the same icon, the bounds check skipped populating the new
+mesh. Its next digit change finally filled it. Every new HUD draw now populates
+its mesh immediately. The fixture detects the old defect separately for keys,
+cooldowns and effects; it fails with that initialization removed. It also
+checks cooldown/key coexistence with the cooldown published first. Native draw
+order is icon/veil, keycap, cooldown, then later panels.
+
+Read-only native geometry checks at Small and Large both found a 24-unit stock
+key frame within a 56-unit icon. The locally supplied original digit atlas has
+seven transparent pixels above and left in each 24-pixel tile, leaving 17
+visible pixels. The shared artwork layout uses that visible proportion and a
+scaled corner inset, without CSS-pixel minimums or maximums. The user's Large
+interface size was restored after inspection. No game data or bindings changed.
+
+The seven focused native/renderer checks and `pnpm run check` passed. The final
+build and Markdown-link check passed. The keycap visual matrix uses the same
+layout and painter at 1x, 1.5x and 2x. ABI 64 is running in the retained isolated
+profile for the remaining live first-appearance and readability check.
+
+
+### Countdown glyph alignment and shortcut spacing
+
+Matthias supplied a 107-frame, 4.727-second crop. Every frame was extracted and
+inspected in contact sheets. Value changes occur at frames 18 (0.807 s), 41
+(1.847 s), 63 (2.847 s), and 87 (3.847 s). The icon frame stays fixed. Native
+text layout used each proportional digit's advance width and a width-dependent
+optical offset. The original font also gives digits different ink bearings.
+
+The atlas now centers each digit's ink in an equal-width cell. The native
+countdown centers the cell run at a fixed icon anchor. Effect digits use the
+same rule. Quads remain identical throughout single-digit changes, and digit
+changes still do not upload pixels. An offline replay exercised the real atlas
+and publication code with the original font across 10 through 1 and decimals.
+
+Shortcut text now measures visible glyph bounds. A single gap separates each
+modifier and the main key; the old fixed modifier cells plus main-key padding
+are removed. Shift+Command+C has equal 1.52-CSS-pixel ink gaps at a 64-pixel icon.
+The plate height and the original-style single-key minimum width are preserved.
+Focused renderer tests, the repository gate, and the shortcut visual matrix
+passed. No native transform or client ABI changed in this adjustment.
+
+The build and link checks passed. The updated development game was reopened
+with the same profile and data. A bounded activation of Anthem of Flame showed
+the cooldown and effect timer, and the shortcut used the tighter spacing.
+This screenshot observation is not a claim of Matthias's final visual acceptance.
+
+
+### Correction: overlapping skill layers must be one native draw (ABI 65)
+
+Matthias identified that the remaining flicker alternates the cooldown below
+and above its shortcut, including while a digit stays unchanged. The previous
+glyph-only diagnosis was incomplete. The fixture checked native collection
+order, but the implementation still submitted two independently sortable draw
+objects. It did not prove their final relative order.
+
+The renderer now joins keycap and cooldown quads by icon identity before
+publication. One skill record owns one mesh and draw: keycap triangles first,
+then cooldown triangles. There is no second draw object for the native renderer
+to reorder against it. Expiry removes only the timer's triangles when a keycap
+remains. Disabling shortcuts preserves the timer and restores the stock keycap.
+A validated flag controls only that stock-key suppression. Different icon
+generations are never combined. Effect icons keep their own single draws.
+The fixed record pool now contains eight skill compositions and 64 effects.
+The byte protocol changed directly with ABI 65; no legacy drawing path remains.
+
+
+Effect duration placement now reserves the bottom 16% of the icon for the
+native duration strip and border. Labels sit inside the artwork with a scaled
+right inset. The same glyph publication clips to that content boundary.
+
+
+ABI 65 verification checkpoint: seven focused native/renderer tests,
+`pnpm run check` (1,689 unit, 182 policy, 196 Tools and 81 launcher tests),
+`pnpm build`, and whitespace checks pass. The real atlas replay places key
+triangles before cooldown triangles and checks effect-label clearance at icon
+sizes 24, 32, 48, 64 and 96. This is an offline drawing check, not live acceptance.
+
+The rebuilt isolated client runs with the retained profile and game files.
+Live HUD counters confirm attachment. The first attempted cooldown capture
+coincided with user window changes; the next captured the open map instead.
+Neither is evidence that the reported flicker passed. Live confirmation of the
+combined draw and effect inset remains pending. No publication occurred.
+
+
+Matthias subsequently confirmed “all working!” for the running ABI 65 build.
+This closes the reported live cooldown/shortcut flicker and effect-placement
+check. Earlier failed captures above retain their limited scope.
diff --git a/scripts/enhancements-visual.ts b/scripts/enhancements-visual.ts
index e847caed..78482864 100644
--- a/scripts/enhancements-visual.ts
+++ b/scripts/enhancements-visual.ts
@@ -78,13 +78,31 @@ try {
     const moduleUrl = (source: string) =>
       `data:text/javascript;base64,${Buffer.from(source).toString("base64")}`;
     const bindingsUrl = moduleUrl(await compile("shared/skill-key-bindings.ts"));
-    const appearanceUrl = moduleUrl(await compile("renderer/appearance.ts"));
-    const bindingViewUrl = moduleUrl((await compile("renderer/skill-key-binding-view.ts"))
-      .replace("../shared/skill-key-bindings.js", bindingsUrl)
-      .replace("./appearance.js", appearanceUrl));
-    const compiled = (await compile("renderer/skill-key-overlay.ts"))
-      .replace("../shared/skill-key-bindings.js", bindingsUrl)
-      .replace("./skill-key-binding-view.js", bindingViewUrl);
+    const artworkUrl = moduleUrl((await compile("renderer/skill-key-artwork.ts"))
+      .replace("../shared/skill-key-bindings.js", bindingsUrl));
+    const compiled = `import { paintSkillKeyPlate, skillKeyPlateLayout } from "${artworkUrl}";
+      function createSkillKeyOverlay(parent) {
+        return { update(state) {
+          for (const slot of state.slots) {
+            if (!slot.binding) continue;
+            const host = document.createElement("span");
+            host.style.cssText = "position:absolute;left:" + slot.x + "px;top:" + slot.y + "px;width:" + slot.width + "px;height:" + slot.height + "px";
+            parent.append(host);
+            const canvas = document.createElement("canvas");
+            canvas.width = 300; canvas.height = 64;
+            const ctx = canvas.getContext("2d");
+            const width = paintSkillKeyPlate(ctx, slot.binding);
+            const art = ctx.getImageData(0, 0, width, 64);
+            canvas.width = width; ctx.putImageData(art, 0, 0);
+            const layout = skillKeyPlateLayout(slot.width, slot.height, width);
+            canvas.className = "skill-key-plate";
+            canvas.dataset.referenceDigit = String(slot.binding.input.kind === "keyboard" && slot.binding.input.code === "Digit7");
+            canvas.style.cssText = "width:" + layout.width + "px;height:" + layout.height + "px;position:absolute;right:" + layout.inset + "px;bottom:" + layout.inset + "px";
+            host.append(canvas);
+          }
+        }};
+      }`;
+    await page.evaluate((family) => document.fonts.load(`48px "${family}"`), fontFamily);
     await page.addScriptTag({
       type: "module",
       content: `${compiled}\nglobalThis.__createSkillKeyOverlay = createSkillKeyOverlay;`,
@@ -136,6 +154,12 @@ try {
           { x: 274, y: 340, width: 140, height: 140, binding: bindings[9] },
         ],
       });
+      const smallSlot = document.createElement("div");
+      smallSlot.className = "skill";
+      smallSlot.style.cssText = "position:absolute;left:470px;top:400px;width:51px;height:51px";
+      document.body.append(smallSlot);
+      create(document.body).update({status: "ready", slots: [{x:470, y:400, width:51, height:51,
+        binding:{input:{kind:"keyboard",code:"KeyX"},modifiers:modifiers(false,false,true,true)}}]});
       document.body.dataset.ready = "true";
     });
     } else {
@@ -166,10 +190,7 @@ try {
       differingPixelRatio: number;
     }> | null = null;
     if (fixture === "skill-keys" && reference !== null) {
-      const plates = page.locator(".skill-key-plate");
-      const visible = await plates.evaluateAll((nodes) => nodes.flatMap((node, index) =>
-        node.getClientRects().length === 0 ? [] : [index]));
-      const digit = plates.nth(visible.at(-1) ?? -1);
+      const digit = page.locator('.skill-key-plate[data-reference-digit="true"]');
       const custom = path.join(outputDir, `skill-keys-${scale}x-custom-7.png`);
       const customPng = await digit.screenshot({ path: custom });
       const measured = await page.evaluate(async ({ native, rendered, renderScale }) => {
diff --git a/scripts/skill-cooldown-visual.ts b/scripts/skill-cooldown-visual.ts
index 9b3871b1..f08c96ce 100644
--- a/scripts/skill-cooldown-visual.ts
+++ b/scripts/skill-cooldown-visual.ts
@@ -1,5 +1,5 @@
 /**
- * Deterministic, headless visual matrix for the shared cooldown view.
+ * Replays the production native HUD atlas and ordered quads into an offline matrix.
  * This is not a live-game acceptance test; pass a native crop as --reference
  * to compare the real background at 1x, 1.5x, and 2x.
  */
@@ -26,15 +26,20 @@ const compile = async (relative: string) => ts.transpileModule(
 ).outputText;
 const moduleUrl = (source: string) =>
   `data:text/javascript;base64,${Buffer.from(source).toString("base64")}`;
-const appearanceUrl = moduleUrl(await compile("renderer/appearance.ts"));
+// The fixture supplies the extracted font locally; it has no gw:// app host.
+const appearanceUrl = moduleUrl(`export async function ensureGuildWarsFont() {
+  await document.fonts.load('48px "Guild Wars Original Display"');
+}`);
 const cooldownModelUrl = moduleUrl(await compile("shared/skill-cooldowns.ts"));
 const bindingModelUrl = moduleUrl(await compile("shared/skill-key-bindings.ts"));
-const cooldownView = (await compile("renderer/skill-cooldown-view.ts"))
-  .replace("../shared/skill-cooldowns.js", cooldownModelUrl)
-  .replace("./appearance.js", appearanceUrl);
-const bindingView = (await compile("renderer/skill-key-binding-view.ts"))
+const artworkUrl = moduleUrl((await compile("renderer/skill-key-artwork.ts"))
+  .replace("../shared/skill-key-bindings.js", bindingModelUrl));
+const hudContractUrl = moduleUrl(await compile("shared/native-hud.ts"));
+const hudUrl = moduleUrl((await compile("renderer/native-hud-layer.ts"))
+  .replace("../shared/native-hud.js", hudContractUrl)
   .replace("../shared/skill-key-bindings.js", bindingModelUrl)
-  .replace("./appearance.js", appearanceUrl);
+  .replace("./skill-key-artwork.js", artworkUrl)
+  .replace("./appearance.js", appearanceUrl));
 
 const browser = await chromium.launch();
 try {
@@ -60,26 +65,71 @@ try {
       .fixture small { color: #b8b3a5; font-variant-numeric: tabular-nums; }
       .slot.small { width: 40px; height: 40px; }
       .slot.large { width: 140px; height: 140px; }
-      .settings-skill-cooldown-preview-key { --skill-key-edge: 23px; position: absolute; right: 2px; bottom: 2px; max-width: calc(100% - 4px); }
+      .native-hud-preview { position: absolute; inset: 0; width: 100%; height: 100%; }
+      body[data-reference] .native-hud-preview { visibility: hidden; }
       #sizes { display: flex; align-items: end; gap: 18px; margin-top: 26px; }
     </style></head><body><h1>Skill cooldown visual matrix · ${scale}×</h1><div id="matrix" class="matrix"></div><div id="sizes"></div></body></html>`);
-    const referenceOutput = path.join(outputDir, `skill-cooldowns-${scale}x-reference.png`);
-    await page.screenshot({ path: referenceOutput });
-    await page.addScriptTag({
-      type: "module",
-      content: `${cooldownView}\nglobalThis.__cooldownView = createSkillCooldownView;`,
-    });
-    await page.addScriptTag({
-      type: "module",
-      content: `${bindingView}\nglobalThis.__bindingView = createSkillKeyBindingView;`,
-    });
-    const measurements = await page.evaluate(() => {
-      const createCooldown = (globalThis as unknown as {
-        __cooldownView(parent: HTMLElement): { element: HTMLElement; update(ms: number, color: unknown): void };
-      }).__cooldownView;
-      const createBinding = (globalThis as unknown as {
-        __bindingView(parent: HTMLElement): { element: HTMLElement; update(binding: unknown): void };
-      }).__bindingView;
+    await page.addScriptTag({type: "module", content: `
+      import {createNativeHudLayer} from "${hudUrl}";
+      import {formatSkillCooldown, skillCooldownCssColor} from "${cooldownModelUrl}";
+      import {NATIVE_HUD_HEADER, NATIVE_HUD_ATLAS_SIZE} from "${hudContractUrl}";
+      globalThis.__nativeHudFixture = {createNativeHudLayer, formatSkillCooldown, skillCooldownCssColor,
+        header: NATIVE_HUD_HEADER, size: NATIVE_HUD_ATLAS_SIZE};
+    `});
+    const measurements = await page.evaluate(async (scale) => {
+      const {createNativeHudLayer, formatSkillCooldown, skillCooldownCssColor, header, size} =
+        (globalThis as unknown as {__nativeHudFixture: {
+          createNativeHudLayer: typeof import("../src/renderer/native-hud-layer.js").createNativeHudLayer;
+          formatSkillCooldown: typeof import("../src/shared/skill-cooldowns.js").formatSkillCooldown;
+          skillCooldownCssColor: typeof import("../src/shared/skill-cooldowns.js").skillCooldownCssColor;
+          header: number; size: number;
+        }}).__nativeHudFixture;
+      await document.fonts.load('48px "Guild Wars Original Display"');
+      const memory = new WebAssembly.Memory({initial: 80});
+      const atlas = document.createElement("canvas"); atlas.width = size; atlas.height = size;
+      const atlasContext = atlas.getContext("2d")!;
+      let quads: number[][] = [];
+      const layer = createNativeHudLayer({memory, malloc: () => 1024, free() {},
+        gwonmac_hud_reset() { quads = []; },
+        gwonmac_hud_atlas(region: number) {
+          const bytes = new Uint8Array(memory.buffer, region + 8, size * size * 4);
+          const rgba = new Uint8ClampedArray(bytes.length);
+          for (let n = 0; n < bytes.length; n += 4) {
+            rgba[n] = bytes[n + 2]!; rgba[n + 1] = bytes[n + 1]!;
+            rgba[n + 2] = bytes[n]!; rgba[n + 3] = bytes[n + 3]!;
+          }
+          atlasContext.putImageData(new ImageData(rgba, size, size), 0, 0); return 1;
+        },
+        gwonmac_hud_label(region: number) {
+          const view = new DataView(memory.buffer, region);
+          if (view.getUint32(8, true) !== 0) throw new Error("Unexpected native fixture slot");
+          quads = Array.from({length: view.getUint32(20, true)}, (_, n) =>
+            Array.from({length: 8}, (_, field) => view.getFloat32(header + n * 32 + field * 4, true)));
+          return 1;
+        },
+      }, document);
+      await Promise.resolve(); await Promise.resolve();
+      const paint = (slot: HTMLElement, remainingMs: number,
+        color: Parameters<typeof skillCooldownCssColor>[0], chord = false) => {
+        const width = slot.clientWidth, height = slot.clientHeight;
+        const item = {parent: 1, child: 0, width, height};
+        layer.update("keys", [{...item, binding: {input: {kind: "keyboard", code: chord ? "F12" : "Digit7"},
+          modifiers: {control: chord, option: chord, shift: chord, command: chord}}}]);
+        const text = formatSkillCooldown(remainingMs);
+        layer.update("cooldowns", [text === null ? null : {...item, text, color: skillCooldownCssColor(color)}]);
+        const canvas = document.createElement("canvas"); canvas.className = "native-hud-preview";
+        canvas.width = Math.round(width * scale); canvas.height = Math.round(height * scale);
+        const context = canvas.getContext("2d")!;
+        // Replay the production mesh order: the keycap is first, then glyphs.
+        // This verifies atlas pixels and geometry, not the game's GPU ordering.
+        for (const q of quads) {
+          const [x, y, w, h, u, v, right, bottom] = q as [number, number, number, number, number, number, number, number];
+          if (w > 0 && h > 0) context.drawImage(atlas, u * size, v * size, (right - u) * size, (bottom - v) * size,
+            x * canvas.width, y * canvas.height, w * canvas.width, h * canvas.height);
+        }
+        slot.append(canvas);
+        return {slot: height, quadCount: quads.length, label: text, keycap: chord ? "⌃⌥⇧⌘F12" : "7"};
+      };
       const matrix = document.getElementById("matrix")!;
       const values = [32_000, 14_000, 9_000, 3_000, 2_900, 400, 0];
       const colors = [
@@ -104,26 +154,7 @@ try {
           caption.textContent = remainingMs === 0 ? "ready" : `${remainingMs} ms`;
           fixture.append(slot, caption);
           matrix.append(fixture);
-          const view = createCooldown(slot);
-          view.element.style.setProperty("--skill-cooldown-slot-height", "82px");
-          view.update(remainingMs, color);
-          if (name === "Red" && index === 4) {
-            const key = createBinding(slot);
-            key.element.classList.add("settings-skill-cooldown-preview-key");
-            key.update({
-              input: { kind: "keyboard", code: "F12" },
-              modifiers: { control: true, option: true, shift: true, command: true },
-            });
-          }
-          const rect = view.element.getBoundingClientRect();
-          const glyph = view.element.firstElementChild?.getBoundingClientRect();
-          measured.push({
-            name,
-            remainingMs,
-            slot: rect.height,
-            glyphWidth: glyph?.width ?? null,
-            glyphHeight: glyph?.height ?? null,
-          });
+          measured.push({name, remainingMs, ...paint(slot, remainingMs, color, name === "Red" && index === 4)});
         });
       }
       const sizes = document.getElementById("sizes")!;
@@ -131,13 +162,16 @@ try {
         const slot = document.createElement("span");
         slot.className = `slot ${className}`;
         sizes.append(slot);
-        const view = createCooldown(slot);
-        view.element.style.setProperty("--skill-cooldown-slot-height", `${edge}px`);
-        view.update(2_900, { kind: "preset", preset: "red" });
+        measured.push({name: className, remainingMs: 2900, edge, ...paint(slot, 2900, {kind: "preset", preset: "red"})});
       }
+      layer.dispose();
       return measured;
-    });
+    }, scale);
     await page.evaluate(() => document.fonts.ready);
+    const referenceOutput = path.join(outputDir, `skill-cooldowns-${scale}x-reference.png`);
+    await page.evaluate(() => { document.body.dataset.reference = "true"; });
+    await page.screenshot({path: referenceOutput});
+    await page.evaluate(() => { delete document.body.dataset.reference; });
     const renderedOutput = path.join(outputDir, `skill-cooldowns-${scale}x-rendered.png`);
     const rendered = await page.screenshot({ path: renderedOutput });
     const referencePng = await readFile(referenceOutput);
diff --git a/src/main/certification/client-module.ts b/src/main/certification/client-module.ts
index 285ff161..fb85fad3 100644
--- a/src/main/certification/client-module.ts
+++ b/src/main/certification/client-module.ts
@@ -229,6 +229,7 @@ function enhancementCache(
     skillSlotGeometry: capabilities.skillSlotGeometry,
     skillCooldownObservation: capabilities.skillCooldownObservation,
     playerEffectObservation: capabilities.playerEffectObservation,
+    nativeHudRendering: capabilities.nativeHudRendering,
     playRegionObservation: capabilities.playRegionObservation,
     preGameControls: capabilities.preGameControls,
     characterSwitchAction: capabilities.characterSwitchAction,
diff --git a/src/main/certification/enhancement-build-model.ts b/src/main/certification/enhancement-build-model.ts
index b1d6774d..13708ee0 100644
--- a/src/main/certification/enhancement-build-model.ts
+++ b/src/main/certification/enhancement-build-model.ts
@@ -12,6 +12,7 @@
  * what the kernel reads and invalidates every `outputSha256` in the table, so
  * the two must be edited together or not at all.
  */
+import type { NATIVE_HUD_RENDERING_PROOF } from "./native-hud-transform.js";
 import {
   enhancementCapabilitiesForProfile,
   enhancementCapabilitiesCover,
@@ -201,6 +202,8 @@ export function enhancementConfigWords(
 }
 
 export interface KnownEnhancementBuild {
+  /** Exact native icon draw ownership; independent of observation facts. */
+  nativeHudRendering?: typeof NATIVE_HUD_RENDERING_PROOF;
   sha256: string;
   outputSha256: EnhancementOutputHashes;
   programId: number;
@@ -656,6 +659,7 @@ export function supportedEnhancementCapabilities(
       && build.playerEffectObservation !== undefined,
     effectIconGeometry: build.effectIconGeometry !== undefined,
     alcoholObservation: build.alcoholObservation !== undefined && build.effectIconGeometry !== undefined,
+    nativeHudRendering: build.nativeHudRendering !== undefined,
     whisperChat: playRegionObservation && gameThread && build.uiDispatcher !== undefined
       && build.chatFiltering !== undefined && build.whisperChat !== undefined,
     resignAction: playRegionObservation && gameThread && build.resignAction !== undefined,
@@ -760,6 +764,8 @@ export function hasValidEnhancementProfileHashes(
   if (build.skillSlotGeometry !== undefined && build.skillSlotGeometry.labelAddress === 0) {
     return false;
   }
+  if (build.nativeHudRendering !== undefined
+    && build.skillSlotGeometry === undefined && build.effectIconGeometry === undefined) return false;
   const actual = Object.entries(build.outputSha256);
   if (actual.length === 0) return false;
   const supported = supportedEnhancementCapabilities(build);
diff --git a/src/main/certification/enhancement-transform.ts b/src/main/certification/enhancement-transform.ts
index 4bcdae59..dac6ce44 100644
--- a/src/main/certification/enhancement-transform.ts
+++ b/src/main/certification/enhancement-transform.ts
@@ -15,6 +15,7 @@
  * so no capability selection may inherit another's ordering.
  *
  */
+import { appendNativeHud } from "./native-hud-transform.js";
 import { createHash } from "node:crypto";
 import {
   enhancementCapabilityProfile,
@@ -948,11 +949,15 @@ function assembleEnhancementTransform(
     if (section.id === 10) return { id: section.id, body: encodeCode(nextBodies) };
     return section;
   });
-  const output = concat(
+  const enhanced = concat(
     WASM_HEADER,
     ...rewritten.map(encodeSection),
     encodeSection(buildEnhancementManifestSection(build, capabilities)),
   );
+  // Core and observation-only profiles must not install optional HUD hooks.
+  const output = capabilities.nativeHudRendering
+    ? appendNativeHud(enhanced, skillBarFrameGlobalIndex)
+    : enhanced;
   if (!WebAssembly.validate(output)) {
     try {
       new WebAssembly.Module(output);
diff --git a/src/main/certification/local-client-verification-boundary.ts b/src/main/certification/local-client-verification-boundary.ts
index 89a7cf24..fd29836c 100644
--- a/src/main/certification/local-client-verification-boundary.ts
+++ b/src/main/certification/local-client-verification-boundary.ts
@@ -3,6 +3,7 @@
  * It rejects stale, malformed, and cross-input proof messages.
  */
 import { isAlcoholObservationProof } from "./enhancement-alcohol-proof.js";
+import { NATIVE_HUD_RENDERING_PROOF } from "./native-hud-transform.js";
 import { RESIGN_NATIVE_SENDER } from "./enhancement-resign-proof.js";
 import { isDeepStrictEqual } from "node:util";
 import { isDigest } from "../../shared/digest.js";
@@ -182,6 +183,7 @@ function featureFailuresFromVerdicts(
     "playerEffectObservation",
     verdicts.playerEffectObservation,
   );
+  const nativeHudRendering = refusalForFeature("nativeHudRendering", verdicts.nativeHudRendering);
   const effectIconGeometry = refusalForFeature(
     "effectIconGeometry",
     verdicts.effectIconGeometry,
@@ -204,6 +206,7 @@ function featureFailuresFromVerdicts(
     || playerEffectObservation === null
     || effectIconGeometry === null
     || alcoholObservation === null
+    || nativeHudRendering === null
     || whisperChat === null
     || resignAction === null
   ) return null;
@@ -224,6 +227,7 @@ function featureFailuresFromVerdicts(
     ...(quickItemMove ? { quickItemMove } : {}),
     ...(playerEffectObservation ? { playerEffectObservation } : {}),
     ...(effectIconGeometry ? { effectIconGeometry } : {}),
+    ...(nativeHudRendering ? { nativeHudRendering } : {}),
     ...(whisperChat ? { whisperChat } : {}),
     ...(alcoholObservation ? { alcoholObservation } : {}),
     ...(resignAction ? { resignAction } : {}),
@@ -733,6 +737,10 @@ function isAutomaticSemanticBuild(
   const hasPreGameControls = build.preGameControls !== undefined;
   const hasPlayerEffects = build.playerEffectObservation !== undefined;
   const hasEffectIcons = build.effectIconGeometry !== undefined;
+  if (build.nativeHudRendering !== undefined && (
+    (!hasSkillSlotGeometry && !hasEffectIcons)
+    || !isDeepStrictEqual(build.nativeHudRendering, NATIVE_HUD_RENDERING_PROOF)
+  )) return false;
   if (!hasCursor && !hasPlayRegion && !hasObservation && !hasTarget
     && !hasTravel && !hasXunlai && !hasAliases && !hasChatFiltering
     && !hasParty && !hasTeam && !hasSkillSlotGeometry
diff --git a/src/main/certification/local-client-verification-contract.ts b/src/main/certification/local-client-verification-contract.ts
index 031bf74a..47f95b4a 100644
--- a/src/main/certification/local-client-verification-contract.ts
+++ b/src/main/certification/local-client-verification-contract.ts
@@ -123,6 +123,7 @@ export const LOCAL_FEATURE_INVARIANTS = Object.freeze({
     "player-effects.collection-layout",
     "player-effects.precise-timer",
   ] as const),
+  nativeHudRendering: Object.freeze([...SHARED_FEATURE_INVARIANTS, "native-hud.draw-ownership"] as const),
   effectIconGeometry: Object.freeze([
     ...SHARED_FEATURE_INVARIANTS,
     "effect-icons.frame-constructor",
@@ -244,6 +245,8 @@ export interface LocalFeatureCertificateMap {
       | "playRegionObservation" | "observationBase"
       | "uiDispatcher" | "playerEffectObservation"
     >;
+  readonly nativeHudRendering: Readonly<{ core: EnhancementProofCore }>
+    & RequiredBuildFact<"nativeHudRendering">;
   readonly effectIconGeometry: Readonly<{ core: EnhancementProofCore }>
     & RequiredBuildFact<
       "playRegionObservation" | "playerEffectObservation" | "effectIconGeometry"
@@ -518,6 +521,8 @@ export function localFeatureVerdictsForBuild(
         playerEffectObservation: build.playerEffectObservation,
       })
     : null;
+  const nativeHudRendering = effective?.nativeHudRendering && core !== null && build?.nativeHudRendering !== undefined
+    ? Object.freeze({ core, nativeHudRendering: build.nativeHudRendering }) : null;
   const effectIconGeometry = effective?.effectIconGeometry && core !== null
       && build?.playRegionObservation !== undefined
       && build.playerEffectObservation !== undefined
@@ -647,6 +652,10 @@ export function localFeatureVerdictsForBuild(
       failures.playerEffectObservation,
       "player-effects.collection-layout",
     ),
+    nativeHudRendering: featureVerdict<"nativeHudRendering">(
+      inputSha256, requested.nativeHudRendering, nativeHudRendering, failures.nativeHudRendering,
+      "native-hud.draw-ownership",
+    ),
     effectIconGeometry: featureVerdict<"effectIconGeometry">(
       inputSha256,
       requested.effectIconGeometry,
diff --git a/src/main/certification/local-client-verifier.ts b/src/main/certification/local-client-verifier.ts
index 4a038331..185cad7e 100644
--- a/src/main/certification/local-client-verifier.ts
+++ b/src/main/certification/local-client-verifier.ts
@@ -17,6 +17,7 @@
  * the process boundary. Profile state is never consulted.
  */
 import { deriveAlcoholObservation } from "./enhancement-alcohol-proof.js";
+import { NATIVE_HUD_RENDERING_PROOF, provesNativeHudRendering } from "./native-hud-transform.js";
 import { deriveWhisperChat } from "./enhancement-whisper-proof.js";
 import { deriveResignAction } from "./enhancement-resign-proof.js";
 import { createHash } from "node:crypto";
@@ -199,6 +200,8 @@ function failuresForRequested(
     ...(requested.playerEffectObservation
       ? { playerEffectObservation: changedFeature("playerEffectObservation", invariant) }
       : {}),
+    ...(requested.nativeHudRendering
+      ? { nativeHudRendering: changedFeature("nativeHudRendering", invariant) } : {}),
     ...(requested.effectIconGeometry
       ? { effectIconGeometry: changedFeature("effectIconGeometry", invariant) }
       : {}),
@@ -720,6 +723,9 @@ function deriveEnhancementBuild(
   const alcoholObservation = requestedCapabilities.alcoholObservation && includeEffectIcons
     ? deriveAlcoholObservation(context.moduleView(), locatedLocal!.uiDispatcher!.functionIndex) : null;
   const includeAlcohol = alcoholObservation !== null;
+  const includeNativeHud = requestedCapabilities.nativeHudRendering
+    && (skillbar.includeGeometry || includeEffectIcons)
+    && provesNativeHudRendering(context);
   const playerEffectCounts = includePlayerEffects || playerEffects !== null
     ? []
     : playerEffectCandidateCounts(context.moduleView());
@@ -740,6 +746,8 @@ function deriveEnhancementBuild(
     ...failures,
     ...(requestedCapabilities.alcoholObservation && !includeAlcohol
       ? { alcoholObservation: changedFeature("alcoholObservation", "alcohol.post-process-producer") } : {}),
+    ...(requestedCapabilities.nativeHudRendering && !includeNativeHud
+      ? { nativeHudRendering: changedFeature("nativeHudRendering", "native-hud.draw-ownership") } : {}),
     ...(requestedCapabilities.whisperChat && !includeWhispers
       ? { whisperChat: changedFeature("whisperChat", "whisper.native-chat-path") } : {}),
     ...(requestedCapabilities.resignAction && !includeResign
@@ -936,6 +944,7 @@ function deriveEnhancementBuild(
     ...(includePlayerEffects ? { playerEffectObservation: playerEffects! } : {}),
     ...(includeEffectIcons ? { effectIconGeometry: effectIcons! } : {}),
     ...(includeAlcohol ? { alcoholObservation } : {}),
+    ...(includeNativeHud ? { nativeHudRendering: NATIVE_HUD_RENDERING_PROOF } : {}),
     ...skillbarBuild.beforeTeam,
     ...(includeTeam ? { teamApply: locatedLocal!.teamApply! } : {}),
     ...skillbarBuild.afterTeam,
@@ -958,6 +967,7 @@ function deriveEnhancementBuild(
     playerEffectObservation: includePlayerEffects,
     effectIconGeometry: includeEffectIcons,
     alcoholObservation: includeAlcohol,
+    nativeHudRendering: includeNativeHud,
     resignAction: includeResign,
     whisperChat: includeWhispers,
   });
diff --git a/src/main/certification/native-hud-transform.ts b/src/main/certification/native-hud-transform.ts
new file mode 100644
index 00000000..3c15898e
--- /dev/null
+++ b/src/main/certification/native-hud-transform.ts
@@ -0,0 +1,344 @@
+/**
+ * Attaches bounded skill and effect labels to native icon draw batches. The
+ * original UI owns clipping and order; retained meshes avoid per-frame uploads.
+ */
+import { concat, encodeCode, encodeIndexVector, encodeSection, parseCode, parseExports,
+  parseIndexVector, sectionById, sleb, splitSections, uleb, vectorPayload, WASM_HEADER } from "../core/wasm-binary.js";
+import { encodeName } from "./cartography-transform-internals.js";
+import { functionBodySha256, wasmEvidence } from "./wasm-evidence.js";
+import { NATIVE_HUD_MAGIC, NATIVE_HUD_ATLAS_SIZE, NATIVE_HUD_LABELS, NATIVE_HUD_QUADS,
+  NATIVE_HUD_HEADER, NATIVE_HUD_KEYCAP, NATIVE_HUD_SKILLS } from "../../shared/native-hud.js";
+
+const CHECKED = [
+  [13162, "8ab5e3b4ad9aadcd7e51245322cabda16c3c1882254c90284961c3068ceaa4e1"],
+  [13125, "21369b96acf8fd04e0c4e50c23b45028425e3b56a73c7161f9fc150061737f55"],
+  [6584, "7c47c6284394a67b717010e709f60ed59bbf8707af023c3780b9e8f59ed0de43"],
+  [6450, "098f5fa1ea2dc1e2a877db032dd20e423ee2ce86d33ff57974390ee04e0d2771"],
+  [6598, "91f5cf516b125fd6181e4e003e4b6d7acc841c37052438bf9d213ff71e27bf87"],
+  [6585, "3aee7481e1f32029de64d17a77323e41d5855d72b9cfc9f16081c184092ed579"],
+  [14063, "fcb416a75de2054ce9f3b1fe2224a76e0bbd4bb0e426097d6e14ffa6e7011268"],
+  [1554, "6a1b82f3d27e1077795392f733b2acd6b34f8be321dbc7ed65a7af8c07e80ac5"],
+  [1572, "e34024b6fb2fc72d0c598285a60f3f204fa8cfb865d7fffaad2fd7c1fa7061c3"],
+  [6446, "6884ee6ff0dc70791dfd9b591ced34ee462cab445c27d20967abdbd196e87213"],
+  [6447, "1100a0920546b1e2b692658952b696a0de6efc01ae7ffb28c3ec27f5d2d3f23b"],
+  [1563, "af1d5ab4f32141617c6be2b747144161eedcff5c5ed5e276d220ec2f28f495e5"],
+  [6488, "386a60a3578c3650aeaa6b6ee7fdc840e4b8cc6b791d242ca20e31b7652bfc85"],
+  [
+    6492,
+    "fa27fbb7e7dc27b59a962adab6142cdc494c230ed5fef602411ccbca7b08f217"
+  ],
+  [
+    6490,
+    "30d0f1d66769f1393c111cd0534200e03d36b408ec3be7ab1572550aba8c785c"
+  ],
+  [
+    6593,
+    "7c2c5556e6546a9059f7f3c654c1d214ae7bf06ce4fabeefbadc2b8d6691f153"
+  ],
+  [
+    5595,
+    "2d9c21a01d2ea73b47cba5da45fd09648fc01c49d0bd3e7957a2b8f4952a778a"
+  ],
+  [
+    1569,
+    "46b25139552a8d66a0b519d735755346f9be5d37ab2d1e9b02bca1d79bee20fc"
+  ],
+  [
+    1579,
+    "c46a846084eb5292db3d41d901724d9e2330cf1bb9f7fb1dec371fa642e4cc48"
+  ],
+  [
+    1559,
+    "d047b1ee5ed993986e60def91a371b46aef13ef04e6e83d2c72827d98376d24a"
+  ],
+  [
+    1444,
+    "88b977ad123c93c1926a67efe32721398cafb0f86fa2b3f5a57f3bd1493fb842"
+  ],
+  [
+    1445,
+    "a883926f470e716e59f62bec0b03adc8721112e78e859477bcab028de2ab311b"
+  ],
+  [
+    1446,
+    "3cfe5e2ff85ca8c472ad41c7a3ce4db7eb66c4dcb86b6fdfc69530067fecb650"
+  ],
+  [
+    1448,
+    "79c87cd0bab2c93f9718d557a7bd552ee2c37a70ec7f6d0f82224aa8c45e438d"
+  ],
+  [
+    1449,
+    "3e750376bbc2a51393c0ba169355550ba48a1b7fdea3fff8e1d0b1b5be2d6581"
+  ],
+  [
+    2249,
+    "149d95966e67f554da12f46c064ee366a9d531b167842e6ea0a201ca730b474e"
+  ],
+  [
+    3137,
+    "3f4d7e18ad91c20147e2053ee1e42f8eb60c97937fefba142d37c93f2d672e36"
+  ],
+  [
+    748,
+    "150d8921520d98fbfa28dc4faf5e2fe488a65c69832b13d7dcf489b2f07d7b60"
+  ],
+  [
+    1333,
+    "8799e3b4032b03c0c01c88236d3283d17c362ce3b300edf58bce919395fba064"
+  ],
+  [
+    1334,
+    "d0061147c7a6987af15a15663703b726f9bbc015fb5f3e6fa44b28df41dc1905"
+  ],
+  [
+    1357,
+    "ac2e8c49bb67981447c9f66c39b364f90c292c86efa3fe98456743608453f4f5"
+  ],
+  [
+    264,
+    "0265ff024218606f270c9dcca6166d3a5d4bc28809071377662ab1ce0f13e562"
+  ]
+] as const;
+/** Exact native draw owners and resource operations bound by local verification. */
+export const NATIVE_HUD_RENDERING_PROOF = Object.freeze({ functionBodies: CHECKED });
+
+export function provesNativeHudRendering(evidence: NonNullable<ReturnType<typeof wasmEvidence>>): boolean {
+  const module = evidence.moduleView();
+  return CHECKED.every(([index, hash]) => index >= module.functionImportCount
+    && index < module.functionTypeIndices.length
+    && functionBodySha256(module, index) === hash)
+    && ["malloc", "free"].every((name) => module.exports.some((entry) => entry.kind === 0 && entry.name === name));
+}
+
+const op = (...v: number[]) => Uint8Array.of(...v);
+const i = (v: number) => concat(op(0x41), sleb(v));
+const l = (v: number) => concat(op(0x20), uleb(v));
+const s = (v: number) => concat(op(0x21), uleb(v));
+const call = (v: number) => concat(op(0x10), uleb(v));
+const f = (v: number) => { const b = new Uint8Array(5); b[0] = 0x43; new DataView(b.buffer).setFloat32(1, v, true); return b; };
+const load = (v: number, float = false) => concat(op(float ? 0x2a : 0x28, 2), uleb(v));
+const save = (v: number, float = false) => concat(op(float ? 0x38 : 0x36, 2), uleb(v));
+const add = (a: Uint8Array, b: number) => concat(a, i(b), op(0x6a));
+const stack = (n: number, bytes: number) => concat(op(0x23, 0), i(bytes), op(0x6b), s(n), l(n), op(0x24, 0));
+const unstack = (n: number, bytes: number) => concat(l(n), i(bytes), op(0x6a, 0x24, 0));
+// Private records: owner, mesh, draw, parent ID, child ID, quad count, keycap flag, 8 quads.
+const STRIDE = 316;
+
+export function appendNativeHud(input: Uint8Array, skillBarGlobal: number): Uint8Array {
+  const evidence = wasmEvidence(input); if (!evidence) throw new Error("invalid native HUD input");
+  const module = evidence.moduleView();
+  if (!provesNativeHudRendering(evidence)) throw new Error("native HUD rendering proof changed");
+  const sections = splitSections(input);
+  const globals = vectorPayload(sectionById(sections, 6));
+  const signatures = vectorPayload(sectionById(sections, 1));
+  const exports = vectorPayload(sectionById(sections, 7));
+  const names = parseExports(sectionById(sections, 7));
+  const malloc = names.find((entry) => entry.name === "malloc")?.index;
+  const free = names.find((entry) => entry.name === "free")?.index;
+  if (malloc === undefined || free === undefined) throw new Error("native HUD allocators missing");
+  const bodies = parseCode(sectionById(sections, 10));
+  const types = parseIndexVector(sectionById(sections, 3));
+  const base = globals.count;
+  const g = (n: number) => concat(op(0x23), uleb(base + n));
+  const put = (n: number) => concat(op(0x24), uleb(base + n));
+  const increment = (n: number) => concat(g(n), i(1), op(0x6a), put(n));
+  // Globals: records, material, uploads, updates, created, destroyed, collections, matched, published, next visible frame.
+  const first = module.functionImportCount + bodies.length;
+  const originalCollect = first, originalDestroy = first + 1, releaseIndex = first + 2;
+  const hideStockKeyIndex = first + 9;
+  const resetIndex = first + 3, meshIndex = first + 4, collectIndex = first + 5;
+  const destroyIndex = first + 6, atlasIndex = first + 7, labelIndex = first + 8;
+  const each = (n: number, body: Uint8Array) => concat(g(0), op(0x04, 0x40), i(0), s(n), op(0x03, 0x40),
+    body, l(n), i(1), op(0x6a), s(n), l(n), i(NATIVE_HUD_LABELS), op(0x49, 0x0d, 0, 0x0b, 0x0b));
+  const record = (n: number) => concat(g(0), l(n), i(STRIDE), op(0x6c, 0x6a));
+  const release = concat(op(0), l(0), load(8), op(0x04, 0x40), call(6593),
+    l(0), load(8), call(748), l(0), load(4), call(748), increment(5), op(0x0b),
+    ...[0, 4, 8].map((at) => concat(l(0), i(0), save(at))), op(0x0b));
+  const reset = concat(op(1, 1, 0x7f), each(0, concat(record(0), call(releaseIndex))),
+    g(0), op(0x04, 0x40), g(0), call(free), i(0), put(0), op(0x0b),
+    g(1), op(0x04, 0x40), g(1), call(748), i(0), put(1), op(0x0b, 0x0b));
+  // Native bitmap vertices are UI coordinates relative to the frame's origin.
+  // Native UI projection is captured independently; our model is identity like 6118.
+  const vertex: Uint8Array[] = [];
+  for (let v = 0; v < 4; v++) {
+    const right = v === 1 || v === 2, bottom = v >= 2;
+    vertex.push(
+      l(3), l(1), load(268, true), l(1), load(236, true), op(0x93),
+      l(4), load(0, true), ...(right ? [l(4), load(8, true), op(0x92)] : []), l(7), op(0x94, 0x92), save(v * 24, true),
+      l(3), l(1), load(280, true), l(1), load(240, true), op(0x93),
+      l(4), load(4, true), ...(bottom ? [l(4), load(12, true), op(0x92)] : []), l(8), op(0x94, 0x93), save(v * 24 + 4, true),
+      l(3), f(0), save(v * 24 + 8, true), l(3), i(-1), save(v * 24 + 12),
+      l(3), l(4), load(right ? 24 : 16, true), save(v * 24 + 16, true),
+      l(3), l(4), load(bottom ? 28 : 20, true), save(v * 24 + 20, true));
+  }
+  const mesh = concat(op(2, 6, 0x7f, 2, 0x7d), // record0; frame1, scratch2, vertices3, quad4, indices5, n6; width7,height8
+    l(0), load(8), op(0x45, 0x04, 0x40, 0x0f, 0x0b), l(0), load(0), s(1),
+    l(1), load(276, true), l(1), load(268, true), op(0x93), s(7),
+    l(1), load(280, true), l(1), load(272, true), op(0x93), s(8),
+    l(0), load(4), l(0), load(20), i(4), op(0x6c), call(1446), s(3),
+    l(0), load(4), l(0), load(20), i(6), op(0x6c), call(1445), s(5),
+    l(0), load(20), op(0x04, 0x40), i(0), s(6), add(l(0), NATIVE_HUD_HEADER), s(4), op(0x03, 0x40), ...vertex,
+    ...[0, 2, 1, 0, 3, 2].map((v, at) => concat(l(5), l(6), i(4), op(0x6c), i(v), op(0x6a, 0x3b, 1), uleb(at * 2))),
+    add(l(3), 96), s(3), add(l(5), 12), s(5), add(l(4), 32), s(4), add(l(6), 1), s(6),
+    l(6), l(0), load(20), op(0x49, 0x0d, 0, 0x0b, 0x0b),
+    stack(2, 32), ...[0, 4, 8].map((at) => concat(l(2), f(-32768), save(at, true))),
+    ...[12, 16, 20].map((at) => concat(l(2), f(32768), save(at, true))),
+    l(0), load(4), l(2), add(l(2), 12), call(1449), l(0), load(4), call(1448),
+    ...([268, 272, 276, 280, 236, 240, 260, 264] as const).map((at, n) => concat(l(0), l(1), load(at, true), save(284 + n * 4, true))),
+    increment(3), unstack(2, 32), op(0x0b));
+  // 13162 creates the stock hotkey at child 6 of the bitmap. Suppress only
+  // that exact player's keycap while its replacement is published. The frame,
+  // game binding and original drawing resources remain owned by the game.
+  const hideStockKey = concat(op(1, 4, 0x7f), op(0x02, 0x40),
+    g(0), op(0x45), g(1), op(0x45, 0x72, 0x0d, 0),
+    add(l(0), -4), s(1), l(1), load(184), i(6), op(0x47, 0x0d, 0),
+    l(1), load(296), s(2), l(2), op(0x45, 0x0d, 0), add(l(2), -296), s(2),
+    l(2), load(184), i(2), op(0x47, 0x0d, 0),
+    l(2), load(296), s(3), l(3), op(0x45, 0x0d, 0), add(l(3), -296), s(3),
+    l(3), load(184), i(8), op(0x4f, 0x0d, 0),
+    l(3), load(296), s(4), l(4), op(0x45, 0x0d, 0), add(l(4), -296), load(188),
+    ...(skillBarGlobal ? [op(0x23), uleb(skillBarGlobal)] : [i(-1)]), op(0x47, 0x0d, 0),
+    l(3), load(184), s(4),
+    record(4), load(12), ...(skillBarGlobal ? [op(0x23), uleb(skillBarGlobal)] : [i(-1)]), op(0x46),
+    record(4), load(16), l(3), load(184), op(0x46, 0x71), record(4), load(20), i(0), op(0x4b, 0x71), record(4), load(24), i(NATIVE_HUD_KEYCAP), op(0x71, 0x71, 0x0f, 0x0b),
+    i(0), op(0x0b));
+  // Slot 9 is the native final outer-clip category for this frame. The original
+  // collector runs first; no native list is overwritten or given duplicate refs.
+  // 6585 stops at the first absent stock slot. A matched HUD owner must report
+  // its intervening empty slots so the cache reaches our final category.
+  const collect = concat(op(2, 9, 0x7f, 1, 0x7d), // args0..2; result3,n4,r5,frame6,relation7,depth8,source9,scratch10,tmp11,alpha12
+    l(0), call(hideStockKeyIndex), op(0x04, 0x7f), i(0), op(0x05), l(0), l(1), l(2), call(originalCollect), op(0x0b), s(3),
+    l(1), i(9), op(0x4b), l(1), i(9), op(0x47), l(3), op(0x71, 0x72), g(1), op(0x45, 0x72), g(0), op(0x45, 0x72, 0x04, 0x40), l(3), op(0x0f, 0x0b),
+    increment(6), l(0), i(4), op(0x6b), s(6),
+    each(4, concat(record(4), s(5), op(0x02, 0x40),
+      l(5), load(20), op(0x45, 0x0d, 0),
+      // Locate this icon through the collected frame's ancestors. Its final
+      // visible descendant must draw first, including recharge/effect veils.
+      l(0), i(4), op(0x6b), s(6), i(0), s(8), op(0x02, 0x40, 0x03, 0x40),
+        l(6), op(0x45, 0x0d, 1),
+        l(4), i(NATIVE_HUD_SKILLS), op(0x49, 0x04, 0x7f),
+          l(6), load(184), i(2), op(0x46), l(6), load(296), i(0), op(0x47, 0x71, 0x04, 0x7f),
+            l(6), load(296), i(296), op(0x6b), load(184), l(5), load(16), op(0x46),
+          op(0x05), i(0), op(0x0b),
+        op(0x05), l(5), load(16), l(6), load(184), op(0x46, 0x0b, 0x0d, 1),
+        l(6), load(296), s(7), i(0), s(6), l(7), op(0x04, 0x40), l(7), i(296), op(0x6b), s(6), op(0x0b),
+        add(l(8), 1), s(8), l(8), i(16), op(0x49, 0x0d, 0), i(0), s(6), op(0x0b, 0x0b),
+      l(6), op(0x45, 0x0d, 0),
+      // Match the validated parent, then verify the native parent identity too.
+      l(6), load(296), s(7), i(0), s(8), op(0x02, 0x40, 0x03, 0x40),
+        l(7), op(0x45, 0x0d, 1), l(7), i(296), op(0x6b), load(188), l(5), load(12), op(0x46, 0x0d, 1),
+        l(7), load(0), s(7), add(l(8), 1), s(8), l(8), i(16), op(0x49, 0x0d, 0), i(0), s(7), op(0x0b, 0x0b),
+      l(7), op(0x45, 0x0d, 0),
+      l(4), i(NATIVE_HUD_SKILLS), op(0x49, 0x04, 0x40),
+        l(5), load(12), ...(skillBarGlobal ? [op(0x23), uleb(skillBarGlobal)] : [i(-1)]), op(0x47, 0x0d, 1),
+      op(0x05), l(7), load(12), i(1726357791), op(0x47, 0x0d, 1, 0x0b),
+      // Defer while the next visible native frame still belongs to this icon.
+      // The exact cache call site supplies the next frame; no per-frame scan.
+      g(9), s(9), i(0), s(8), i(0), s(11), op(0x02, 0x40, 0x03, 0x40),
+        l(9), op(0x45, 0x0d, 1),
+        l(9), l(6), op(0x46, 0x04, 0x40), i(1), s(11), op(0x0c, 2, 0x0b),
+        l(9), load(296), s(7), i(0), s(9), l(7), op(0x04, 0x40), l(7), i(296), op(0x6b), s(9), op(0x0b),
+        add(l(8), 1), s(8), l(8), i(16), op(0x49, 0x0d, 0, 0x0b, 0x0b), l(11), op(0x0d, 0),
+      l(5), load(0), i(0), op(0x47), l(5), load(0), l(6), op(0x47, 0x71, 0x0d, 0),
+      l(1), i(9), op(0x49, 0x04, 0x40), i(1), op(0x0f, 0x0b),
+      increment(7),
+      // Logical skill/effect icon frames need not own a retained bitmap draw.
+      // Build our own draw and capture the same native UI matrices as 6488.
+      l(5), load(8), op(0x45, 0x04, 0x40),
+        l(5), l(6), save(0), l(5), i(265), i(0), call(1444), save(4),
+        stack(10, 176), l(10), l(5), load(4), save(160), l(10), g(1), save(164),
+        l(5), i(1), add(l(10), 160), add(l(10), 164), i(0), i(0), call(1554), save(8),
+        l(5), load(8), i(6), call(1572), unstack(10, 176), increment(4),
+        // A recreated mesh is empty even when this icon's cached bounds still
+        // match. Populate it now instead of waiting for the next timer digit.
+        l(5), call(meshIndex),
+      op(0x0b),
+      stack(10, 160),
+      ...[0, 1, 2].map((matrix) => concat(add(l(10), matrix * 52), i(matrix), call(1333), i(52), call(264))),
+      add(l(6), 208), call(6446), l(5), load(8), call(1563),
+      i(2), call(1357), l(5), load(8), i(0), call(1579),
+      ...[0, 1, 2].map((matrix) => concat(i(matrix), add(l(10), matrix * 52), call(1334))),
+      unstack(10, 160),
+      ...([268, 272, 276, 280, 236, 240, 260, 264] as const).flatMap((at, n) => [l(5), load(284 + n * 4, true), l(6), load(at, true), op(0x5c), ...(n ? [op(0x72)] : [])]),
+      op(0x04, 0x40), l(5), call(meshIndex), op(0x0b),
+      f(1), s(12), l(6), s(7), i(0), s(8), op(0x03, 0x40),
+        l(12), l(7), load(48, true), op(0x94), s(12), l(7), load(296), s(7),
+        l(7), op(0x04, 0x40), l(7), i(296), op(0x6b), s(7), op(0x0b),
+        add(l(8), 1), s(8), l(7), i(0), op(0x47), l(8), i(16), op(0x49, 0x71, 0x0d, 0, 0x0b),
+      l(5), load(8), l(12), f(255), op(0x94, 0xa8), call(1559),
+      l(2), l(2), load(8), i(1), op(0x6a), l(2), load(8), call(5595),
+      l(2), load(0), l(2), load(8), i(4), op(0x6c, 0x6a), l(5), load(8), save(0),
+      l(2), l(2), load(8), i(1), op(0x6a), save(8), i(1), s(3), op(0x0b))),
+    l(3), op(0x0b));
+  const destroy = concat(op(1, 1, 0x7f), each(1, concat(record(1), load(0), add(l(0), -4), op(0x46, 0x04, 0x40), record(1), call(releaseIndex), op(0x0b))),
+    l(0), call(originalDestroy), op(0x0b));
+  const validMemory = (bytes: Uint8Array) => concat(l(0), i(0), op(0x4b), l(0), i(3), op(0x71, 0x45, 0x71),
+    l(0), op(0xad), bytes, op(0xad, 0x7c), op(0x3f, 0, 0xad, 0x42), sleb(65536), op(0x7e, 0x58, 0x71));
+  const atlasBytes = 8 + NATIVE_HUD_ATLAS_SIZE ** 2 * 4;
+  const atlas = concat(op(1, 4, 0x7f), validMemory(i(atlasBytes)), l(1), i(atlasBytes), op(0x46, 0x71, 0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+    l(0), load(0), i(NATIVE_HUD_MAGIC), op(0x47), l(0), load(4), i(NATIVE_HUD_ATLAS_SIZE), op(0x47, 0x72, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+    stack(2, 48), l(2), add(l(0), 8), save(0), l(2), i(NATIVE_HUD_ATLAS_SIZE), save(8), l(2), i(NATIVE_HUD_ATLAS_SIZE), save(12),
+    l(2), i(0), add(l(2), 8), i(1), i(112), call(2249), s(3),
+    l(2), l(3), save(16), l(2), i(7), save(20), l(2), i(482), save(24),
+    i(1), add(l(2), 16), add(l(2), 20), add(l(2), 24), i(0), i(0), i(33555424), i(11), call(3137), s(4),
+    each(5, concat(record(5), load(8), op(0x04, 0x40), record(5), load(8), i(0), l(4), call(1569), op(0x0b))),
+    g(1), op(0x04, 0x40), g(1), call(748), op(0x0b), l(4), put(1), l(3), call(748), increment(2),
+    unstack(2, 48), i(1), op(0x0b));
+  const label = concat(op(1, 4, 0x7f), validMemory(i(NATIVE_HUD_HEADER)), l(1), i(NATIVE_HUD_HEADER), op(0x4f, 0x71, 0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+    l(0), load(8), s(2), l(0), load(20), s(3),
+    l(0), load(0), i(NATIVE_HUD_MAGIC), op(0x46), l(0), load(4), l(1), op(0x46, 0x71),
+    l(2), i(NATIVE_HUD_LABELS), op(0x49, 0x71), l(3), i(NATIVE_HUD_QUADS), op(0x4d, 0x71),
+    l(1), l(3), i(32), op(0x6c), i(NATIVE_HUD_HEADER), op(0x6a, 0x46, 0x71), validMemory(l(1)), op(0x71, 0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+    // Only player skill records can suppress a stock keycap. The flag is
+    // metadata; key and timer triangles share this record's single draw.
+    l(0), load(24), i(NATIVE_HUD_KEYCAP), op(0x4b),
+    l(2), i(NATIVE_HUD_SKILLS), op(0x4f), l(0), load(24), i(0), op(0x47, 0x71, 0x72),
+    op(0x04, 0x40), i(0), op(0x0f, 0x0b),
+    // All coordinates and UVs are normalized, finite, and inside this icon/atlas.
+    i(NATIVE_HUD_HEADER), s(4), op(0x02, 0x40, 0x03, 0x40), l(4), l(1), op(0x4f, 0x0d, 1),
+      l(0), l(4), op(0x6a), load(0, true), f(0), op(0x60), l(0), l(4), op(0x6a), load(0, true), f(1), op(0x5f, 0x71, 0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+      add(l(4), 4), s(4), op(0x0c, 0, 0x0b, 0x0b),
+    // Component bounds alone permit a quad to spill into a neighboring icon.
+    // Validate complete extents and ordered UVs; zero-area clipping is valid.
+    i(NATIVE_HUD_HEADER), s(4), op(0x02, 0x40, 0x03, 0x40), l(4), l(1), op(0x4f, 0x0d, 1),
+      l(0), l(4), op(0x6a), load(0, true), l(0), l(4), op(0x6a), load(8, true), op(0x92), f(1), op(0x5f),
+      l(0), l(4), op(0x6a), load(4, true), l(0), l(4), op(0x6a), load(12, true), op(0x92), f(1), op(0x5f, 0x71),
+      l(0), l(4), op(0x6a), load(24, true), l(0), l(4), op(0x6a), load(16, true), op(0x60, 0x71),
+      l(0), l(4), op(0x6a), load(28, true), l(0), l(4), op(0x6a), load(20, true), op(0x60, 0x71),
+      op(0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b), add(l(4), 32), s(4), op(0x0c, 0, 0x0b, 0x0b),
+    g(0), op(0x45, 0x04, 0x40), i(STRIDE * NATIVE_HUD_LABELS), call(malloc), put(0), g(0), op(0x45, 0x04, 0x40), i(0), op(0x0f, 0x0b),
+      i(0), s(4), op(0x03, 0x40), g(0), l(4), op(0x6a), i(0), save(0), add(l(4), 4), s(4), l(4), i(STRIDE * NATIVE_HUD_LABELS), op(0x49, 0x0d, 0, 0x0b, 0x0b),
+    increment(8), record(2), s(5),
+    l(5), load(12), l(0), load(12), op(0x47), l(5), load(16), l(0), load(16), op(0x47, 0x72, 0x04, 0x40), l(5), call(releaseIndex), op(0x0b),
+    l(5), load(24), l(0), load(24), op(0x47, 0x04, 0x40), call(6593), op(0x0b),
+    add(l(5), 12), add(l(0), 12), l(1), i(12), op(0x6b), call(264),
+    l(3), op(0x45, 0x04, 0x40), l(5), call(releaseIndex), op(0x05),
+      l(5), load(8), op(0x04, 0x40), l(5), call(meshIndex), op(0x05), call(6593), op(0x0b, 0x0b), i(1), op(0x0b));
+  // 6585 owns visible frame order. Pass its next frame privately to the
+  // collector so labels finish an icon subtree before later panels/tooltips.
+  const cacheBody = bodies[6585 - module.functionImportCount]!;
+  const cacheSite = evidence.decodeFunctions([]).find((row) => row.functionIndex === 6585)?.callSites.get(6492);
+  if (cacheSite?.length !== 1) throw new Error("native HUD collection site changed");
+  const site = cacheSite[0]!;
+  bodies[6585 - module.functionImportCount] = concat(cacheBody.slice(0, site.offset),
+    add(l(2), 4), l(3), op(0x49, 0x04, 0x7f), l(2), load(4), op(0x05), i(0), op(0x0b), put(9),
+    cacheBody.slice(site.offset));
+  const extraBodies = [bodies[6492 - module.functionImportCount]!, bodies[6490 - module.functionImportCount]!, release, reset, mesh, collect, destroy, atlas, label, hideStockKey];
+  bodies[6492 - module.functionImportCount] = concat(op(0), l(0), l(1), l(2), call(collectIndex), op(0x0b));
+  bodies[6490 - module.functionImportCount] = concat(op(0), l(0), call(destroyIndex), op(0x0b));
+  const extraTypes = [op(0x60, 1, 0x7f, 0), op(0x60, 0, 0), op(0x60, 2, 0x7f, 0x7f, 1, 0x7f)];
+  const functionTypes = [module.functionTypeIndices[6492]!, module.functionTypeIndices[6490]!, signatures.count,
+    signatures.count + 1, signatures.count, module.functionTypeIndices[6492]!, module.functionTypeIndices[6490]!, signatures.count + 2, signatures.count + 2, module.functionTypeIndices[6490]!];
+  const extraExports = [["reset", resetIndex], ["atlas", atlasIndex], ["label", labelIndex]].map(([name, index]) => concat(encodeName(`gwonmac_hud_${name}`), op(0), uleb(Number(index))));
+  for (const [index, name] of ["records", "material", "uploads", "updates", "created", "destroyed", "collections", "matched", "published"].entries()) {
+    if (index >= 2) extraExports.push(concat(encodeName(`gwonmac_hud_${name}`), op(3), uleb(base + index)));
+  }
+  return concat(WASM_HEADER, ...sections.map((section) => encodeSection({id: section.id,
+    body: section.id === 1 ? concat(uleb(signatures.count + extraTypes.length), signatures.entries, ...extraTypes)
+      : section.id === 3 ? encodeIndexVector([...types, ...functionTypes])
+      : section.id === 6 ? concat(uleb(globals.count + 10), globals.entries, ...Array.from({length: 10}, () => concat(op(0x7f, 1), i(0), op(0x0b))))
+      : section.id === 7 ? concat(uleb(exports.count + extraExports.length), exports.entries, ...extraExports)
+      : section.id === 10 ? encodeCode([...bodies, ...extraBodies]) : section.body,
+  })));
+}
diff --git a/src/main/certification/semantic-proof.ts b/src/main/certification/semantic-proof.ts
index b3e1a9e4..4d4181fb 100644
--- a/src/main/certification/semantic-proof.ts
+++ b/src/main/certification/semantic-proof.ts
@@ -9,7 +9,7 @@
  */
 import { createHash } from "node:crypto";
 
-export const SEMANTIC_VERIFIER_ABI = 7;
+export const SEMANTIC_VERIFIER_ABI = 8;
 
 export type ProofRefusal = Readonly<{
   inputSha256: string;
diff --git a/src/main/client-runtime.ts b/src/main/client-runtime.ts
index caec0540..06810840 100644
--- a/src/main/client-runtime.ts
+++ b/src/main/client-runtime.ts
@@ -481,6 +481,10 @@ export class ClientRuntime {
           requested.resignAction, effective.resignAction, supported.resignAction, preparationFailed,
         ),
         alcoholObservation: optionalFeatureStatus(requested.alcoholObservation, effective.alcoholObservation, supported.alcoholObservation, preparationFailed),
+        nativeHudRendering: optionalFeatureStatus(
+          requested.nativeHudRendering, effective.nativeHudRendering,
+          supported.nativeHudRendering, preparationFailed,
+        ),
         effectIconGeometry: optionalFeatureStatus(
           requested.effectIconGeometry,
           effective.effectIconGeometry,
diff --git a/src/main/renderer-client-sessions.ts b/src/main/renderer-client-sessions.ts
index 0d023f4f..02d7e42e 100644
--- a/src/main/renderer-client-sessions.ts
+++ b/src/main/renderer-client-sessions.ts
@@ -50,6 +50,7 @@ function projectCompatibility(
       playerEffectObservation: status("playerEffectObservation"),
       effectIconGeometry: status("effectIconGeometry"),
       alcoholObservation: status("alcoholObservation"),
+      nativeHudRendering: status("nativeHudRendering"),
       resignAction: status("resignAction"),
       whisperChat: status("whisperChat"),
       playRegionObservation: status("playRegionObservation"),
diff --git a/src/renderer/certified-companion-tools-installation.ts b/src/renderer/certified-companion-tools-installation.ts
index 3de7a551..a16c42db 100644
--- a/src/renderer/certified-companion-tools-installation.ts
+++ b/src/renderer/certified-companion-tools-installation.ts
@@ -4,6 +4,7 @@
  */
 import { createAlcoholObservationInstallation, readCompanionAlcohol } from "./companion-alcohol-snapshot.js";
 import { createAlcoholTimerOverlay } from "./alcohol-timer-overlay.js";
+import { createNativeHudLayer } from "./native-hud-layer.js";
 import { createEliteMapInstallation } from "./elite-map-installation.js";
 import { COMPANION_ABI, COMPANION_DISPATCH_KINDS, COMPANION_FEATURE_BITS } from "../shared/companion-abi.js";
 import {
@@ -350,9 +351,11 @@ function activateTools(input: ToolsInput): CompanionExtensionSession {
   const alcoholRequested = () => capabilities.alcoholObservation && snapshot().settings.gwonmacTools && snapshot().settings.alcoholTimerEnabled;
   const playerEffectsActive = () => capabilities.playerEffectObservation
     && (program === "effect-observer"
-      || ((policy().effectTimers || (alcoholRequested() && policy().alcoholTimer)) && capabilities.effectIconGeometry));
+      || (((capabilities.nativeHudRendering && policy().effectTimers)
+        || (alcoholRequested() && policy().alcoholTimer)) && capabilities.effectIconGeometry));
   const effectIconsActive = () => capabilities.effectIconGeometry
-    && (program === "effect-observer" || policy().effectTimers || (alcoholRequested() && policy().alcoholTimer));
+    && (program === "effect-observer" || (capabilities.nativeHudRendering && policy().effectTimers)
+      || (alcoholRequested() && policy().alcoholTimer));
   const playRegion = () => snapshot().playRegion;
   let companionState: CompanionSnapshot | null = null;
   let party: ToolboxObservation | null = null;
@@ -403,6 +406,7 @@ function activateTools(input: ToolsInput): CompanionExtensionSession {
     if (!observingFriends) return;
     friendFeed.update(readCompanionFriends(memory.buffer, activeFriendPointer));
   };
+  const hud = capabilities.nativeHudRendering ? createNativeHudLayer(input.mapExports, document) : null;
   const disposePresentation = () => runCleanupSteps(
     "Companion Tools presentation cleanup failed",
     [
@@ -416,6 +420,7 @@ function activateTools(input: ToolsInput): CompanionExtensionSession {
       () => { unsubscribeEffectIcons?.(); unsubscribeEffectIcons = null; },
       () => { effectOverlay?.dispose(); effectOverlay = null; },
       () => { unsubscribeAlcohol?.(); unsubscribeAlcoholGeometry?.(); alcoholOverlay?.dispose(); alcoholOverlay = null; },
+      () => hud?.dispose(),
       () => { resign?.dispose(); },
       () => { whispers.setEnabled(false); unsubscribeWhispers(); whisperSurface?.dispose(); whisperSurface = null; whisperSession.dispose(); },
       () => { configureTrade?.(0); },
@@ -448,7 +453,7 @@ function activateTools(input: ToolsInput): CompanionExtensionSession {
     }
   };
 
-  prepare(() => skills.mount(document.body, snapshot().settings));
+  prepare(() => { if (hud) skills.mount(document.body, snapshot().settings, hud); });
   const quickItemMoveControls = input.quickItemMove;
   if (quickItemMoveControls !== null && activeQuickItemMovePointer !== 0) {
     quickItemMoveInstallation = prepare(() => installQuickItemMove({
@@ -468,7 +473,8 @@ function activateTools(input: ToolsInput): CompanionExtensionSession {
       unsubscribeAlcohol = alcohol.subscribe(alcoholOverlay.setAlcohol);
       unsubscribeAlcoholGeometry = effectIcons.subscribe(alcoholOverlay.setGeometry);
     }
-    effectOverlay = createEffectTimerOverlayConsumer(document.body, canvas);
+    if (!hud) return;
+    effectOverlay = createEffectTimerOverlayConsumer(document.body, canvas, hud);
     unsubscribeEffects = playerEffects.subscribe(effectOverlay.setEffects);
     unsubscribeEffectIcons = effectIcons.subscribe(effectOverlay.setGeometry);
   });
diff --git a/src/renderer/effect-timer-overlay-consumer.ts b/src/renderer/effect-timer-overlay-consumer.ts
index ee96fb05..4f25adaf 100644
--- a/src/renderer/effect-timer-overlay-consumer.ts
+++ b/src/renderer/effect-timer-overlay-consumer.ts
@@ -7,7 +7,8 @@ import type {
   CompanionPlayerEffectState,
 } from "./companion-effect-snapshot.js";
 import { formatEffectTimer, remainingEffectMs } from "./companion-effect-snapshot.js";
-import { createEffectTimerOverlay, type EffectTimerLabel } from "./effect-timer-overlay.js";
+import type { NativeHudLayer } from "./native-hud-layer.js";
+export type EffectTimerLabel = Readonly<{skillId: number; x: number; y: number; width: number; height: number; text: string; urgency: "normal" | "soon" | "urgent"}>;
 
 export function projectEffectTimerLabels(
   effects: CompanionPlayerEffectState,
@@ -56,20 +57,23 @@ export function projectEffectTimerLabels(
 export function createEffectTimerOverlayConsumer(
   parent: HTMLElement,
   canvas: HTMLCanvasElement,
+  overlay: NativeHudLayer,
 ) {
-  const overlay = createEffectTimerOverlay(parent);
   let effects: CompanionPlayerEffectState = Object.freeze({ status: "waiting", reason: "memory" });
   let geometry: CompanionEffectIconState = Object.freeze({ status: "waiting", reason: "memory" });
   let enabled = false;
-  const render = () => overlay.update(enabled
-    ? projectEffectTimerLabels(effects, geometry, canvas)
-    : null);
+  const render = () => {
+    const labels = enabled ? projectEffectTimerLabels(effects, geometry, canvas) : null;
+    overlay.update("effects", labels?.map((label) => ({parent: geometry.status === "ready" ? geometry.frameId : 0,
+      child: label.skillId + 4, width: label.width, height: label.height, text: label.text,
+      color: {normal: "#eadcc2", soon: "#e5ad52", urgent: "#c86c65"}[label.urgency]})) ?? []);
+  };
   const view = parent.ownerDocument.defaultView;
   view?.addEventListener("resize", render);
   return Object.freeze({
     setEffects(next: CompanionPlayerEffectState) { effects = next; render(); },
     setGeometry(next: CompanionEffectIconState) { geometry = next; render(); },
     setEnabled(next: boolean) { if (enabled !== next) { enabled = next; render(); } },
-    dispose() { view?.removeEventListener("resize", render); overlay.dispose(); },
+    dispose() { view?.removeEventListener("resize", render); overlay.update("effects", []); },
   });
 }
diff --git a/src/renderer/effect-timer-overlay.ts b/src/renderer/effect-timer-overlay.ts
deleted file mode 100644
index be89f898..00000000
--- a/src/renderer/effect-timer-overlay.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-/**
- * Owns pointer-transparent duration labels positioned over stock Effects icons.
- * It receives only validated CSS-space rectangles and never handles input.
- */
-export type EffectTimerLabel = Readonly<{
-  skillId: number;
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  text: string;
-  urgency: "normal" | "soon" | "urgent";
-}>;
-
-const ROOT_STYLE = "position:fixed;inset:0;z-index:2;display:none;overflow:hidden;pointer-events:none;user-select:none";
-const LABEL_STYLE = "position:absolute;display:flex;align-items:flex-end;justify-content:flex-end;box-sizing:border-box;padding:0 3px 2px 0;font-family:system-ui,sans-serif;font-weight:700;line-height:1;text-shadow:0 1px 2px #000,1px 0 1px #000,-1px 0 1px #000;pointer-events:none";
-
-export function createEffectTimerOverlay(parent: HTMLElement) {
-  const root = parent.ownerDocument.createElement("div");
-  root.id = "effect-timer-overlay";
-  root.setAttribute("aria-hidden", "true");
-  root.style.cssText = ROOT_STYLE;
-  parent.append(root);
-  let signature = "";
-
-  return Object.freeze({
-    update(labels: readonly EffectTimerLabel[] | null) {
-      const next = labels === null ? "" : labels.map((label) =>
-        `${label.skillId}:${label.x},${label.y},${label.width},${label.height}:${label.text}:${label.urgency}`
-      ).join(";");
-      if (next === signature) return;
-      signature = next;
-      root.replaceChildren();
-      if (labels === null || labels.length === 0) {
-        root.style.display = "none";
-        return;
-      }
-      for (const label of labels) {
-        const element = parent.ownerDocument.createElement("span");
-        element.textContent = label.text;
-        element.style.cssText = `${LABEL_STYLE};left:${label.x}px;top:${label.y}px;width:${label.width}px;height:${label.height}px;font-size:${Math.max(11, Math.min(18, label.height * 0.38))}px;color:${
-          label.urgency === "urgent" ? "#c86c65" : label.urgency === "soon" ? "#e5ad52" : "#eadcc2"
-        }`;
-        root.append(element);
-      }
-      root.style.display = "block";
-    },
-    get state() { return Object.freeze({ visible: root.style.display === "block", signature }); },
-    dispose() { root.remove(); },
-  });
-}
diff --git a/src/renderer/effective-enhancement-capabilities.ts b/src/renderer/effective-enhancement-capabilities.ts
index 6de16207..39c4e2c9 100644
--- a/src/renderer/effective-enhancement-capabilities.ts
+++ b/src/renderer/effective-enhancement-capabilities.ts
@@ -12,6 +12,7 @@ export function effectiveCapabilities(
   if (!features) return null;
   return Object.freeze({
     nativeCursor: features.nativeCursor.status === "available",
+    nativeHudRendering: features.nativeHudRendering.status === "available",
     targetObservation: features.targetObservation.status === "available",
     partyObservation: features.partyObservation.status === "available",
     teamApply: features.teamApply.status === "available",
diff --git a/src/renderer/gw-native.d.ts b/src/renderer/gw-native.d.ts
index 53dd896a..bee65033 100644
--- a/src/renderer/gw-native.d.ts
+++ b/src/renderer/gw-native.d.ts
@@ -276,6 +276,7 @@ declare global {
   }
 
   interface Window {
+    gwNativeHudStats?: () => Readonly<{available: boolean; [key: string]: boolean | number | null}>;
     gwNativeMapGraphicsStats?: () => Readonly<Record<"mission" | "world" | "mission_hover" | "world_hover" | "ranges",
       Readonly<{area: number; uploads: number; draws: number; created: number; destroyed: number}> | null>>;
     readonly gwNative: RendererGwNativeApi;
diff --git a/src/renderer/native-hud-layer.ts b/src/renderer/native-hud-layer.ts
new file mode 100644
index 00000000..142236c6
--- /dev/null
+++ b/src/renderer/native-hud-layer.ts
@@ -0,0 +1,217 @@
+/**
+ * Owns the shared detached HUD atlas. Countdown changes publish bounded glyph
+ * quads; only font, badge, or color changes upload pixels to the native client.
+ */
+import { NATIVE_HUD_ATLAS_SIZE as SIZE, NATIVE_HUD_HEADER, NATIVE_HUD_MAGIC, NATIVE_HUD_QUADS, NATIVE_HUD_KEYCAP, NATIVE_HUD_SKILLS, NATIVE_HUD_LABELS,
+  type NativeHudQuad } from "../shared/native-hud.js";
+import { type SkillKeyBinding } from "../shared/skill-key-bindings.js";
+import { paintSkillKeyPlate, skillKeyPlateLayout } from "./skill-key-artwork.js";
+import { ensureGuildWarsFont } from "./appearance.js";
+
+export type NativeHudItem = Readonly<{
+  parent: number; child: number; width: number; height: number;
+  text?: string; color?: string; binding?: SkillKeyBinding;
+}>;
+export type NativeHudChannel = "keys" | "cooldowns" | "effects";
+export type NativeHudLayer = Readonly<{
+  update(channel: NativeHudChannel, items: readonly (NativeHudItem | null)[]): void;
+  dispose(): void;
+}>;
+type Sprite = Readonly<{ x: number; y: number; width: number; height: number; advance: number }>;
+const FONT = '"Guild Wars Original Display", "Guild Wars Original", "QTFrizQuad", Palatino, Georgia, serif';
+const CHANNELS = {cooldowns: {count: 8}, keys: {count: 8}, effects: {count: 64}} as const;
+
+
+export function createNativeHudLayer(exports: WebAssembly.Exports, document: Document): NativeHudLayer {
+  const memory = exports.memory, malloc = exports.malloc, free = exports.free;
+  const upload = exports.gwonmac_hud_atlas, publish = exports.gwonmac_hud_label, reset = exports.gwonmac_hud_reset;
+  const available = memory instanceof WebAssembly.Memory && typeof malloc === "function" && typeof free === "function"
+    && typeof upload === "function" && typeof publish === "function" && typeof reset === "function";
+  let canvas: HTMLCanvasElement | null = null;
+  let ctx: CanvasRenderingContext2D | null = null;
+  const items = new Map<NativeHudChannel, readonly (NativeHudItem | null)[]>();
+  const signatures = new Map<number, string>();
+  const sprites = new Map<string, Sprite>();
+  let atlasGeneration = 0, disposed = false, fontReady = false;
+  let nextX = 2, nextY = 2, rowHeight = 0;
+  const write = (bytes: number, operation: (region: number, view: DataView) => boolean) => {
+    if (!available) return false;
+    // wasm32 exposes allocations above 2 GiB as signed i32 values.
+    const region = Number(malloc(bytes)) >>> 0;
+    if (!region) return false;
+    try { return operation(region, new DataView(memory.buffer, region, bytes)); } finally { free(region); }
+  };
+  const sprite = (key: string, width: number, height: number, paint: () => number) => {
+    if (!ctx) return;
+    if (nextX + width + 2 > SIZE) { nextX = 2; nextY += rowHeight + 2; rowHeight = 0; }
+    if (nextY + height + 2 > SIZE) throw new Error("Native HUD atlas capacity exceeded");
+    ctx.save(); ctx.translate(nextX, nextY); const advance = paint(); ctx.restore();
+    sprites.set(key, {x: nextX, y: nextY, width, height, advance}); nextX += width + 2; rowHeight = Math.max(rowHeight, height);
+  };
+  const style = (channel: NativeHudChannel, item: NativeHudItem) => `${channel === "effects" ? "effect" : "cooldown"}:${item.color ?? "#eadcc2"}`;
+  const rebuild = () => {
+    if (!canvas) {
+      canvas = document.createElement("canvas"); canvas.width = SIZE; canvas.height = SIZE;
+      ctx = canvas.getContext("2d", {willReadFrequently: true});
+    }
+    const context = ctx;
+    if (!context) return false;
+    sprites.clear(); nextX = 2; nextY = 2; rowHeight = 0; context.clearRect(0, 0, SIZE, SIZE);
+    const styles = new Map<string, {effect: boolean; color: string}>();
+    for (const color of ["#eadcc2", "#e5ad52", "#c86c65"]) styles.set(`effect:${color}`, {effect: true, color});
+    for (const [channel, entries] of items) for (const item of entries) {
+      if (!item) continue;
+      if (item.binding) {
+        const key = `key:${JSON.stringify(item.binding)}`;
+        if (!sprites.has(key)) sprite(key, 300, 68, () => paintSkillKeyPlate(context, item.binding!));
+      } else styles.set(style(channel, item), {effect: channel === "effects", color: item.color ?? "#eadcc2"});
+    }
+    for (const [key, {effect, color}] of styles) {
+      context.font = effect ? "700 48px system-ui, sans-serif" : `48px ${FONT}`;
+      context.textBaseline = "alphabetic"; context.textAlign = "left";
+      // The original font has proportional digits. Give every digit one fixed
+      // cell and center its visible ink, so neither bearings nor a narrow 1
+      // move the countdown when its value changes.
+      const digitAdvance = Math.ceil(Math.max(...Array.from("0123456789", character => context.measureText(character).width)));
+      for (const character of "0123456789.m") {
+        sprite(`${key}:${character}`, 64, 80, () => {
+          const metrics = context.measureText(character);
+          const digit = character >= "0" && character <= "9";
+          const advance = digit ? digitAdvance : metrics.width;
+          const left = metrics.actualBoundingBoxLeft ?? 0;
+          const right = metrics.actualBoundingBoxRight ?? metrics.width;
+          const x = 8 + (advance - left - right) / 2 + left;
+          const y = digit ? 40 + ((metrics.actualBoundingBoxAscent ?? 33) - (metrics.actualBoundingBoxDescent ?? 0)) / 2 : 57;
+          context.lineJoin = "round"; context.lineWidth = effect ? 5 : 4.8;
+          context.strokeStyle = "#120d0a"; context.fillStyle = color;
+          context.shadowColor = "rgba(0,0,0,.88)"; context.shadowBlur = 2; context.shadowOffsetY = 2;
+          context.strokeText(character, x, y); context.fillText(character, x, y);
+          return advance;
+        });
+      }
+    }
+    const rgba = context.getImageData(0, 0, SIZE, SIZE).data;
+    return write(8 + rgba.length, (region, view) => {
+      view.setUint32(0, NATIVE_HUD_MAGIC, true); view.setUint32(4, SIZE, true);
+      const bytes = new Uint8Array(view.buffer, region + 8, rgba.length);
+      for (let at = 0; at < rgba.length; at += 4) { bytes[at] = rgba[at + 2]!; bytes[at + 1] = rgba[at + 1]!; bytes[at + 2] = rgba[at]!; bytes[at + 3] = rgba[at + 3]!; }
+      return typeof upload === "function" && upload(region, 8 + rgba.length) === 1;
+    });
+  };
+  const quad = (entry: Sprite, x: number, y: number, width: number, height: number, bottomLimit = 1): NativeHudQuad => {
+    // Clip pixels and UVs together to keep all drawing inside the owning icon.
+    const left = Math.max(0, x), top = Math.max(0, y), right = Math.min(1, x + width), bottom = Math.min(bottomLimit, y + height);
+    return {x: left, y: top, width: Math.max(0, right - left), height: Math.max(0, bottom - top),
+      u: (entry.x + (left - x) / width * entry.width) / SIZE,
+      v: (entry.y + (top - y) / height * entry.height) / SIZE,
+      right: (entry.x + (right - x) / width * entry.width) / SIZE,
+      bottom: (entry.y + (bottom - y) / height * entry.height) / SIZE};
+  };
+  const quads = (channel: NativeHudChannel, item: NativeHudItem): readonly NativeHudQuad[] => {
+    if (![item.width, item.height].every((value) => Number.isFinite(value) && value > 0 && value <= 32768)) return [];
+    if (item.binding) {
+      const entry = sprites.get(`key:${JSON.stringify(item.binding)}`); if (!entry) return [];
+      const layout = skillKeyPlateLayout(item.width, item.height, entry.advance);
+      const cropped = {...entry, width: entry.advance, height: 64};
+      const width = layout.width / item.width, height = layout.height / item.height;
+      return [quad(cropped, 1 - layout.inset / item.width - width, 1 - layout.inset / item.height - height, width, height)];
+    }
+    const text = item.text ?? ""; if (!text || text.length > NATIVE_HUD_QUADS - (channel === "cooldowns" ? 1 : 0)) return [];
+    const entries = Array.from(text, (char) => sprites.get(`${style(channel, item)}:${char}`));
+    if (entries.some((entry) => !entry)) return [];
+    const glyphs = entries.filter((entry): entry is Sprite => entry !== undefined);
+    const effect = channel === "effects";
+    const fontSize = effect ? Math.min(18, Math.max(11, item.height * .38))
+      : item.height * (text.length >= 4 ? .40 : text.includes(".") ? .48 : .56);
+    let scale = fontSize / 48;
+    const advance = glyphs.reduce((sum, entry) => sum + entry.advance, 0);
+    scale = Math.min(scale, item.width * (effect ? .84 : .82) / advance);
+    let x = effect ? item.width * .92 - advance * scale : (item.width - advance * scale) / 2;
+    // Effects reserve the lower strip for the native duration bar and border.
+    // Keep the number inside the artwork, including its outline and shadow.
+    const y = effect ? item.height * .80 - 60 * scale : item.height / 2 - 40 * scale;
+    return glyphs.map((entry) => {
+      const result = quad(entry, (x - 8 * scale) / item.width, y / item.height, entry.width * scale / item.width, entry.height * scale / item.height, effect ? .84 : 1);
+      x += entry.advance * scale; return result;
+    });
+  };
+  const render = () => {
+    if (disposed || !available || !fontReady) return;
+    // Allocate only on first use. Retain the bounded atlas through short gaps
+    // so each new cooldown does not allocate and upload another texture.
+    if (atlasGeneration === 0 && ![...items.values()].some(entries => entries.some(Boolean))) return;
+    const missing = [...items].some(([channel, entries]) => entries.some((item) => item &&
+      !sprites.has(item.binding ? `key:${JSON.stringify(item.binding)}` : `${style(channel, item)}:0`)));
+    if (atlasGeneration === 0 || missing) {
+      if (!rebuild()) { reset(); atlasGeneration = 0; signatures.clear(); return; }
+      atlasGeneration++;
+      // Repacking moves UVs. Invalidate live labels while keeping their old
+      // signatures until withdrawn; clearing the map would lose removed slots.
+    }
+    // One native draw per icon makes the keycap/cooldown order inseparable.
+    // Independent native draw objects can be reordered downstream of collection.
+    for (let index = 0; index < NATIVE_HUD_LABELS; index++) {
+      const skill = index < NATIVE_HUD_SKILLS;
+      const key = skill ? items.get("keys")?.[index] : null;
+      const timer = skill ? items.get("cooldowns")?.[index] : items.get("effects")?.[index - NATIVE_HUD_SKILLS];
+      const item = key ?? timer;
+      // Never combine observations from different native icon generations.
+      const matchingTimer = timer && item && timer.parent === item.parent && timer.child === item.child ? timer : null;
+      const signature = item ? JSON.stringify([atlasGeneration, key, matchingTimer]) : "";
+      if ((signatures.get(index) ?? "") === signature) continue;
+      const keyQuads = key ? quads("keys", key) : [];
+      const timerQuads = matchingTimer && item ? quads(skill ? "cooldowns" : "effects",
+        {...matchingTimer, width: item.width, height: item.height}) : [];
+      const vertices = [...keyQuads, ...timerQuads];
+      const flags = keyQuads.length ? NATIVE_HUD_KEYCAP : 0;
+      const bytes = NATIVE_HUD_HEADER + vertices.length * 32;
+      if (write(bytes, (region, view) => {
+        [NATIVE_HUD_MAGIC, bytes, index, item?.parent ?? 0, item?.child ?? 0, vertices.length, flags].forEach((value, at) => view.setUint32(at * 4, value, true));
+        vertices.forEach((q, at) => [q.x, q.y, q.width, q.height, q.u, q.v, q.right, q.bottom].forEach((v, field) => view.setFloat32(NATIVE_HUD_HEADER + at * 32 + field * 4, v, true)));
+        return typeof publish === "function" && publish(region, bytes) === 1;
+      })) signatures.set(index, signature);
+    }
+
+  };
+  const resetContext = () => { if (typeof reset === "function") reset(); atlasGeneration = 0; signatures.clear(); render(); };
+  const view = document.defaultView;
+  view?.addEventListener("gw:graphics-context-reset", resetContext);
+  const stats = () => ({available, ...Object.fromEntries(["uploads", "updates", "created", "destroyed", "collections", "matched", "published"].map((name) => {
+    const value = exports[`gwonmac_hud_${name}`]; return [name, value instanceof WebAssembly.Global ? Number(value.value) : null];
+  }))});
+  if (view) view.gwNativeHudStats = stats;
+  void ensureGuildWarsFont().then(() => { fontReady = true; render(); });
+  return Object.freeze({
+    update(channel, next) {
+      if (disposed) return;
+      const bounded = next.slice(0, CHANNELS[channel].count);
+      if (channel === "effects") {
+        // Expiring one effect must not move every remaining label to a new
+        // native resource slot. Preserve slots by the native icon identity.
+        const previous = items.get(channel) ?? [];
+        const stable: (NativeHudItem | null)[] = Array.from({length: 64}, () => null);
+        const additions: NativeHudItem[] = [];
+        for (const item of bounded) {
+          if (!item) continue;
+          const index = previous.findIndex((old) => old?.parent === item.parent && old.child === item.child);
+          if (index >= 0) stable[index] = item; else additions.push(item);
+        }
+        for (const item of additions) { const index = stable.indexOf(null); if (index >= 0) stable[index] = item; }
+        items.set(channel, stable);
+      } else items.set(channel, bounded);
+      render();
+    },
+    dispose() {
+      if (disposed) return;
+      disposed = true;
+      try { if (typeof reset === "function") reset(); }
+      finally {
+        view?.removeEventListener("gw:graphics-context-reset", resetContext);
+        if (view?.gwNativeHudStats === stats) delete view.gwNativeHudStats;
+        items.clear(); sprites.clear(); signatures.clear();
+        if (canvas) { canvas.width = 0; canvas.height = 0; }
+        canvas = null; ctx = null;
+      }
+    },
+  });
+}
diff --git a/src/renderer/skill-cooldown-overlay-consumer.ts b/src/renderer/skill-cooldown-overlay-consumer.ts
index 2773d530..02d0fc33 100644
--- a/src/renderer/skill-cooldown-overlay-consumer.ts
+++ b/src/renderer/skill-cooldown-overlay-consumer.ts
@@ -12,14 +12,14 @@ import type {
   CompanionSkillCooldownState,
   CompanionSkillSlotState,
 } from "./companion-skill-snapshot.js";
-import { createSkillCooldownOverlay, type SkillCooldownSlot } from "./skill-cooldown-overlay.js";
+import type { NativeHudLayer, NativeHudItem } from "./native-hud-layer.js";
 import { projectSkillSlots } from "./skill-slot-projection.js";
 
 export function createSkillCooldownOverlayConsumer(
   parent: HTMLElement,
   canvas: HTMLCanvasElement,
+  overlay: NativeHudLayer,
 ) {
-  const overlay = createSkillCooldownOverlay(parent);
   let geometry: CompanionSkillSlotState = Object.freeze({ status: "waiting", reason: "memory" });
   let cooldowns: CompanionSkillCooldownState = Object.freeze({ status: "waiting", reason: "memory" });
   let color: SkillCooldownColor = DEFAULT_SKILL_COOLDOWN_COLOR;
@@ -33,7 +33,7 @@ export function createSkillCooldownOverlayConsumer(
   }
   let visibleCooldowns = cooldownSignature(cooldowns);
 
-  function projection(): readonly SkillCooldownSlot[] | null {
+  function projection(): readonly (NativeHudItem | null)[] | null {
     if (
       !enabled
       || geometry.status !== "ready"
@@ -43,19 +43,18 @@ export function createSkillCooldownOverlayConsumer(
     ) return null;
     const projected = projectSkillSlots(geometry, canvas);
     if (projected === null) return null;
-    const slots: SkillCooldownSlot[] = [];
+    const slots: (NativeHudItem | null)[] = [];
     for (let index = 0; index < 8; index += 1) {
       const rect = projected[index]!;
       const timestamp = cooldowns.rechargeTimestamps[index]!;
       const remainingMs = timestamp === 0 ? 0 : (timestamp - cooldowns.gameTimer) >>> 0;
-      slots.push(Object.freeze({
-        ...rect,
-        remainingMs,
-      }));
+      const text = formatSkillCooldown(remainingMs);
+      slots.push(text === null ? null : {parent: geometry.frameId, child: index,
+        width: rect.width, height: rect.height, text, color: skillCooldownCssColor(color)});
     }
     return Object.freeze(slots);
   }
-  function render() { overlay.update(projection(), color); }
+  function render() { overlay.update("cooldowns", projection() ?? []); }
   const view = parent.ownerDocument.defaultView;
   view?.addEventListener("resize", render);
 
@@ -80,7 +79,7 @@ export function createSkillCooldownOverlayConsumer(
     },
     dispose() {
       view?.removeEventListener("resize", render);
-      overlay.dispose();
+      overlay.update("cooldowns", []);
     },
   });
 }
diff --git a/src/renderer/skill-cooldown-overlay.ts b/src/renderer/skill-cooldown-overlay.ts
deleted file mode 100644
index e6751c35..00000000
--- a/src/renderer/skill-cooldown-overlay.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/**
- * Pointer-transparent eight-slot cooldown presentation.
- * This owner writes the DOM only when visible labels or slot geometry change.
- */
-import type { SkillCooldownColor } from "../shared/skill-cooldowns.js";
-import { formatSkillCooldown } from "../shared/skill-cooldowns.js";
-import { createSkillCooldownView } from "./skill-cooldown-view.js";
-
-export type SkillCooldownSlot = Readonly<{
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  remainingMs: number;
-}>;
-
-const ROOT_STYLE = "position:fixed;inset:0;z-index:2;display:none;overflow:hidden;pointer-events:none;user-select:none";
-const SLOT_STYLE = "position:absolute;pointer-events:none;overflow:hidden";
-
-function validSlot(value: SkillCooldownSlot): boolean {
-  return [value.x, value.y, value.width, value.height, value.remainingMs].every(Number.isFinite)
-    && Math.abs(value.x) <= 32_768
-    && Math.abs(value.y) <= 32_768
-    && value.width > 0
-    && value.width <= 2_048
-    && value.height > 0
-    && value.height <= 2_048
-    && Number.isSafeInteger(value.remainingMs)
-    && value.remainingMs >= 0;
-}
-
-export function createSkillCooldownOverlay(parent: HTMLElement) {
-  const document = parent.ownerDocument;
-  const root = document.createElement("div");
-  root.id = "skill-cooldown-overlay";
-  root.setAttribute("aria-hidden", "true");
-  root.style.cssText = ROOT_STYLE;
-  const views = Array.from({ length: 8 }, () => {
-    const slot = document.createElement("span");
-    slot.style.cssText = SLOT_STYLE;
-    root.append(slot);
-    return { slot, countdown: createSkillCooldownView(slot) };
-  });
-  parent.append(root);
-  let signature = "";
-  return Object.freeze({
-    update(slots: readonly SkillCooldownSlot[] | null, color: SkillCooldownColor) {
-      if (slots !== null && (slots.length !== 8 || slots.some((slot) => !validSlot(slot)))) {
-        slots = null;
-      }
-      const next = slots === null ? "" : `${slots.map((slot) =>
-        `${slot.x},${slot.y},${slot.width},${slot.height},${formatSkillCooldown(slot.remainingMs) ?? ""}`
-      ).join(";")}|${JSON.stringify(color)}`;
-      if (next === signature) return;
-      signature = next;
-      if (slots === null) {
-        root.style.display = "none";
-        return;
-      }
-      slots.forEach((value, index) => {
-        const view = views[index]!;
-        view.slot.style.cssText = `${SLOT_STYLE};left:${value.x}px;top:${value.y}px;width:${value.width}px;height:${value.height}px`;
-        view.countdown.element.style.setProperty("--skill-cooldown-slot-height", `${value.height}px`);
-        view.countdown.update(value.remainingMs, color);
-      });
-      root.style.display = slots.some((slot) => formatSkillCooldown(slot.remainingMs) !== null)
-        ? "block"
-        : "none";
-    },
-    get state() {
-      return Object.freeze({ visible: root.style.display === "block", signature });
-    },
-    dispose() { root.remove(); },
-  });
-}
diff --git a/src/renderer/skill-cooldown-view.ts b/src/renderer/skill-cooldown-view.ts
deleted file mode 100644
index 1f85c139..00000000
--- a/src/renderer/skill-cooldown-view.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-/**
- * Shared native-style cooldown text used by the HUD and Settings preview.
- * Font, outline, optical position, scaling, and color stay identical in both.
- */
-import {
-  formatSkillCooldown,
-  skillCooldownCssColor,
-  type SkillCooldownColor,
-} from "../shared/skill-cooldowns.js";
-import { ensureGuildWarsFont } from "./appearance.js";
-
-const STYLE_ID = "skill-cooldown-styles";
-const STYLE = `
-.skill-cooldown-label {
-  --skill-cooldown-slot-height: 64px;
-  --skill-cooldown-optical-x: -2%;
-  --skill-cooldown-optical-y: -4%;
-  --skill-cooldown-outline: #120d0a;
-  --skill-cooldown-shadow: rgb(0 0 0 / 88%);
-  display: flex;
-  position: absolute;
-  inset: 0;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
-  color: var(--skill-cooldown-color);
-  font-family: "Guild Wars Original Display", "Guild Wars Original", "QTFrizQuad", Palatino, Georgia, serif;
-  font-size: calc(var(--skill-cooldown-slot-height) * .56);
-  font-weight: 400;
-  font-variant-numeric: tabular-nums;
-  line-height: .9;
-  letter-spacing: -.025em;
-  pointer-events: none;
-  user-select: none;
-  -webkit-font-smoothing: antialiased;
-}
-.skill-cooldown-label[hidden] { display: none; }
-.skill-cooldown-glyph {
-  display: block;
-  max-width: 82%;
-  overflow: hidden;
-  transform: translate(var(--skill-cooldown-optical-x), var(--skill-cooldown-optical-y));
-  -webkit-text-stroke: max(1px, calc(var(--skill-cooldown-slot-height) * .028)) var(--skill-cooldown-outline);
-  paint-order: stroke fill;
-  text-shadow:
-    0 2px 2px var(--skill-cooldown-shadow),
-    1px 0 1px var(--skill-cooldown-shadow),
-    -1px 0 1px var(--skill-cooldown-shadow),
-    0 -1px 1px var(--skill-cooldown-shadow);
-  white-space: nowrap;
-}
-.skill-cooldown-label[data-decimal="true"] { font-size: calc(var(--skill-cooldown-slot-height) * .48); }
-.skill-cooldown-label[data-long="true"] { font-size: calc(var(--skill-cooldown-slot-height) * .40); }
-`;
-
-function ensureStyles(document: Document): void {
-  if (document.getElementById(STYLE_ID)) return;
-  const style = document.createElement("style");
-  style.id = STYLE_ID;
-  style.textContent = STYLE;
-  document.head.append(style);
-}
-
-export function createSkillCooldownView(parent: HTMLElement) {
-  const document = parent.ownerDocument;
-  ensureStyles(document);
-  void ensureGuildWarsFont();
-  const element = document.createElement("span");
-  element.className = "skill-cooldown-label";
-  element.setAttribute("aria-hidden", "true");
-  const glyph = document.createElement("span");
-  glyph.className = "skill-cooldown-glyph";
-  element.append(glyph);
-  parent.append(element);
-  let signature = "";
-  return Object.freeze({
-    element,
-    update(remainingMs: number, color: SkillCooldownColor) {
-      const label = formatSkillCooldown(remainingMs);
-      const cssColor = skillCooldownCssColor(color);
-      const next = label === null ? "" : `${label}|${cssColor}`;
-      if (signature === next) return;
-      signature = next;
-      element.hidden = label === null;
-      if (label === null) return;
-      glyph.textContent = label;
-      element.style.setProperty("--skill-cooldown-color", cssColor);
-      element.dataset.decimal = String(label.includes("."));
-      element.dataset.long = String(label.length >= 4);
-    },
-  });
-}
diff --git a/src/renderer/skill-key-artwork.ts b/src/renderer/skill-key-artwork.ts
new file mode 100644
index 00000000..5fe27d98
--- /dev/null
+++ b/src/renderer/skill-key-artwork.ts
@@ -0,0 +1,76 @@
+/**
+ * Owns keycap artwork shared by the native HUD and its visual calibration.
+ * Extends the original game's bevel for player-authored modifier combinations.
+ */
+import { skillKeyPresentation, type SkillKeyBinding } from "../shared/skill-key-bindings.js";
+const FONT = '"Guild Wars Original Display", "Guild Wars Original", "QTFrizQuad", Palatino, Georgia, serif';
+
+/** Stock digit tiles are 24 units with seven transparent units above/left.
+ * Match their 17-unit visible plate inside the 56-unit native skill icon. */
+export function skillKeyPlateLayout(iconWidth: number, iconHeight: number, artworkWidth: number) {
+  const unit = Math.min(iconWidth, iconHeight) / 56;
+  const inset = unit;
+  const scale = Math.min(17 * unit / 64, (iconWidth - 2 * inset) / artworkWidth);
+  return {width: artworkWidth * scale, height: 64 * scale, inset};
+}
+
+/** Extend the stock keycap bevel across a complete keyboard or mouse binding. */
+export function paintSkillKeyPlate(ctx: CanvasRenderingContext2D, binding: SkillKeyBinding): number {
+  const presentation = skillKeyPresentation(binding);
+  const edge = 64, compact = presentation.modifiers.length >= 3;
+  const main = presentation.main;
+  const fontSize = main.kind === "text" ? main.label.length > 2 ? 29 : main.label.length > 1 ? 37 : 49 : 49;
+  ctx.textAlign = "left"; ctx.textBaseline = "alphabetic";
+  const measure = (label: string, font: string) => {
+    ctx.font = font;
+    const metrics = ctx.measureText(label);
+    const left = metrics.actualBoundingBoxLeft ?? 0;
+    const right = metrics.actualBoundingBoxRight ?? metrics.width;
+    return {label, font, left, width: left + right,
+      baseline: 34 + ((metrics.actualBoundingBoxAscent ?? 33) - (metrics.actualBoundingBoxDescent ?? 0)) / 2};
+  };
+  const modifiers = presentation.modifiers.map(label => measure(label, `600 ${compact ? 31 : 36}px system-ui, sans-serif`));
+  const mainText = main.kind === "text" ? measure(main.label, `700 ${fontSize}px ${FONT}`) : null;
+  const gap = 5, padding = 10;
+  const modifierWidth = modifiers.reduce((sum, part) => sum + part.width + gap, 0);
+  const mainWidth = mainText?.width ?? (main.kind === "wheel" ? 50 : 42);
+  const contentWidth = modifierWidth + mainWidth;
+  const width = Math.ceil(Math.max(62, padding * 2 + contentWidth));
+  // Original numbered keycaps have a silver upper-left bevel and dark olive
+  // face. Draw that shape at atlas resolution so arbitrary Mac chords fit.
+  const gradient = ctx.createLinearGradient(0, 0, 0, edge);
+  for (const [at, color] of [[0, "#c4c7bd"], [.12, "#92988a"], [.28, "#666f59"], [.55, "#464d36"], [.8, "#30351f"], [1, "#171b0f"]] as const) gradient.addColorStop(at, color);
+  ctx.beginPath(); ctx.roundRect(1, 1, width - 2, edge - 2, [14, 2, 2, 2]);
+  ctx.fillStyle = "#090b06"; ctx.fill();
+  ctx.beginPath(); ctx.roundRect(3, 3, width - 7, edge - 7, [12, 1, 1, 1]);
+  ctx.fillStyle = gradient; ctx.fill();
+  ctx.beginPath(); ctx.moveTo(5, 26); ctx.lineTo(5, 15); ctx.quadraticCurveTo(5, 5, 16, 5); ctx.lineTo(width - 5, 5);
+  ctx.lineWidth = 4; ctx.strokeStyle = "#d0d3c9"; ctx.stroke();
+  ctx.beginPath(); ctx.moveTo(9, 29); ctx.lineTo(9, 17); ctx.quadraticCurveTo(9, 10, 18, 10); ctx.lineTo(width - 9, 10);
+  ctx.lineWidth = 3; ctx.strokeStyle = "#737b67"; ctx.stroke();
+  ctx.fillStyle = "rgba(0,0,0,.48)"; ctx.fillRect(4, edge - 7, width - 8, 3); ctx.fillRect(width - 7, 9, 3, edge - 13);
+  ctx.fillStyle = "#f4eed8";
+  ctx.shadowColor = "#050504"; ctx.shadowBlur = 1; ctx.shadowOffsetY = 2;
+  ctx.strokeStyle = "#080705"; ctx.lineWidth = 2.5; ctx.lineJoin = "round";
+  let x = (width - contentWidth) / 2;
+  for (const part of modifiers) {
+    ctx.font = part.font;
+    ctx.strokeText(part.label, x + part.left, part.baseline); ctx.fillText(part.label, x + part.left, part.baseline);
+    x += part.width + gap;
+  }
+  if (mainText) {
+    ctx.font = mainText.font;
+    ctx.strokeText(mainText.label, x + mainText.left, mainText.baseline); ctx.fillText(mainText.label, x + mainText.left, mainText.baseline);
+  }
+  else {
+    ctx.save(); ctx.translate(x + 6, 10); ctx.scale(1.65, 1.65); ctx.shadowBlur = 0; ctx.shadowOffsetY = 0;
+    ctx.beginPath(); ctx.roundRect(2.5, 1.5, 15, 21, 7.5); ctx.fillStyle = "rgba(24,23,19,.52)"; ctx.fill(); ctx.strokeStyle = "#f4eed8"; ctx.lineWidth = 1.25; ctx.stroke();
+    const active = main.kind === "mouse" ? main.button : "middle";
+    for (const [button, path] of [["left", "M3.2 8.8V7.2a5 5 0 0 1 5-5H9.5v6.6Z"], ["right", "M10.5 2.2h1.3a5 5 0 0 1 5 5v1.6h-6.3Z"], ["middle", "M10 3a1.8 1.8 0 0 1 1.8 1.8v3a1.8 1.8 0 0 1-3.6 0v-3A1.8 1.8 0 0 1 10 3Z"]] as const) {
+      const shape = new Path2D(path); ctx.fillStyle = active === button ? "#f4eed8" : "rgba(244,238,216,.18)"; ctx.fill(shape); ctx.lineWidth = .85; ctx.stroke(shape);
+    }
+    ctx.restore();
+    if (main.kind === "wheel") { ctx.font = `27px ${FONT}`; ctx.fillText(main.direction === "up" ? "↑" : "↓", x + 32, 44); }
+  }
+  return width;
+}
diff --git a/src/renderer/skill-key-binding-view.ts b/src/renderer/skill-key-binding-view.ts
deleted file mode 100644
index 136ada25..00000000
--- a/src/renderer/skill-key-binding-view.ts
+++ /dev/null
@@ -1,199 +0,0 @@
-/**
- * The one DOM projection of a saved skill-key binding. Settings and the live
- * HUD use the same segmented key plate so icons, abbreviations, and modifier
- * order cannot diverge.
- */
-import {
-  skillKeyPresentation,
-  type SkillKeyBinding,
-  type SkillKeyMainPresentation,
-} from "../shared/skill-key-bindings.js";
-import { ensureGuildWarsFont } from "./appearance.js";
-
-const STYLE_ID = "skill-key-binding-styles";
-const STYLE = `
-.skill-key-plate {
-  --skill-key-edge: 30px;
-  display: inline-flex;
-  align-items: stretch;
-  height: var(--skill-key-edge);
-  min-width: var(--skill-key-edge);
-  max-width: 100%;
-  box-sizing: border-box;
-  overflow: hidden;
-  color: #f4eed8;
-  border: 1px solid rgb(202 200 181 / 74%);
-  border-radius: max(4px, calc(var(--skill-key-edge) * .20));
-  background: linear-gradient(
-    180deg,
-    #c5c4ba 0%,
-    #b4b3a7 10%,
-    #898778 35%,
-    #77765b 50%,
-    #60573f 70%,
-    #494533 85%,
-    #3f3322 100%
-  );
-  box-shadow:
-    inset 0 1px rgb(255 255 241 / 42%),
-    inset 1px 0 rgb(255 255 241 / 18%),
-    inset 0 -1px rgb(0 0 0 / 58%),
-    0 0 0 1px rgb(19 18 14 / 88%),
-    0 1px 2px rgb(0 0 0 / 72%);
-  font-family: "Guild Wars Original Display", "Guild Wars Original", "QTFrizQuad", Palatino, Georgia, serif;
-  font-weight: 400;
-  font-variant-numeric: tabular-nums;
-  line-height: 1;
-  text-shadow: 0 1px 0 #16140e, 1px 1px 1px #050504, -1px 0 1px #050504;
-  -webkit-font-smoothing: antialiased;
-}
-.skill-key-plate-part {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex: 0 0 auto;
-  min-width: calc(var(--skill-key-edge) * .56);
-  padding: 0 calc(var(--skill-key-edge) * .10);
-  box-sizing: border-box;
-  font-size: calc(var(--skill-key-edge) * .53);
-}
-.skill-key-main-glyph {
-  display: inline-block;
-  transform: translate(
-    calc(var(--skill-key-edge) * .01),
-    calc(var(--skill-key-edge) * .055)
-  );
-}
-.skill-key-plate-part + .skill-key-plate-part {
-  box-shadow: inset 1px 0 rgb(19 18 14 / 66%), -1px 0 rgb(255 255 241 / 12%);
-}
-.skill-key-plate-main {
-  min-width: calc(var(--skill-key-edge) - 2px);
-  font-size: calc(var(--skill-key-edge) * .76);
-  padding-inline: calc(var(--skill-key-edge) * .16);
-}
-.skill-key-plate-main[data-wide="true"] {
-  font-size: calc(var(--skill-key-edge) * .58);
-}
-.skill-key-plate-main[data-long="true"] {
-  min-width: auto;
-  font-size: calc(var(--skill-key-edge) * .45);
-  padding-inline: calc(var(--skill-key-edge) * .20);
-}
-.skill-key-plate[data-compact="true"] .skill-key-plate-modifier {
-  min-width: calc(var(--skill-key-edge) * .42);
-  padding-inline: calc(var(--skill-key-edge) * .035);
-  font-size: calc(var(--skill-key-edge) * .46);
-}
-.skill-key-plate[data-compact="true"] .skill-key-plate-main {
-  min-width: calc(var(--skill-key-edge) * .82);
-  padding-inline: calc(var(--skill-key-edge) * .09);
-}
-.skill-key-plate[data-compact="true"] .skill-key-plate-main[data-long="true"] {
-  font-size: calc(var(--skill-key-edge) * .42);
-}
-.skill-key-mouse {
-  width: calc(var(--skill-key-edge) * .56);
-  height: calc(var(--skill-key-edge) * .70);
-  overflow: visible;
-}
-.skill-key-mouse-outline { fill: rgb(24 23 19 / 52%); stroke: currentColor; stroke-width: 1.25; }
-.skill-key-mouse-button { fill: rgb(244 238 216 / 18%); stroke: currentColor; stroke-width: .85; }
-.skill-key-mouse-button[data-active="true"] { fill: currentColor; }
-.skill-key-wheel-direction {
-  margin-left: calc(var(--skill-key-edge) * .02);
-  font-size: calc(var(--skill-key-edge) * .42);
-}
-.settings-skill-key-preview .skill-key-plate { --skill-key-edge: 30px; }
-`;
-
-function ensureStyles(document: Document): void {
-  if (document.getElementById(STYLE_ID)) return;
-  const style = document.createElement("style");
-  style.id = STYLE_ID;
-  style.textContent = STYLE;
-  document.head.append(style);
-}
-
-function mouseIcon(
-  document: Document,
-  main: Extract<SkillKeyMainPresentation, { kind: "mouse" | "wheel" }>,
-): SVGSVGElement {
-  const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-  svg.setAttribute("viewBox", "0 0 20 24");
-  svg.setAttribute("aria-hidden", "true");
-  svg.classList.add("skill-key-mouse");
-  const shape = (tag: "path" | "rect", className: string, attributes: Record<string, string>) => {
-    const node = document.createElementNS("http://www.w3.org/2000/svg", tag);
-    node.setAttribute("class", className);
-    for (const [name, value] of Object.entries(attributes)) node.setAttribute(name, value);
-    svg.append(node);
-    return node;
-  };
-  shape("rect", "skill-key-mouse-outline", {
-    x: "2.5", y: "1.5", width: "15", height: "21", rx: "7.5",
-  });
-  const active = main.kind === "mouse" ? main.button : "middle";
-  const left = shape("path", "skill-key-mouse-button", {
-    d: "M3.2 8.8V7.2a5 5 0 0 1 5-5H9.5v6.6Z",
-  });
-  const right = shape("path", "skill-key-mouse-button", {
-    d: "M10.5 2.2h1.3a5 5 0 0 1 5 5v1.6h-6.3Z",
-  });
-  const middle = shape("rect", "skill-key-mouse-button", {
-    x: "8.2", y: "3", width: "3.6", height: "6.6", rx: "1.8",
-  });
-  ({ left, right, middle }[active]).dataset.active = "true";
-  return svg;
-}
-
-export function createSkillKeyBindingView(parent: HTMLElement) {
-  const document = parent.ownerDocument;
-  ensureStyles(document);
-  void ensureGuildWarsFont();
-  const plate = document.createElement("span");
-  plate.className = "skill-key-plate";
-  plate.setAttribute("aria-hidden", "true");
-  parent.append(plate);
-  let signature = "";
-
-  return Object.freeze({
-    element: plate,
-    update(binding: SkillKeyBinding | null) {
-      const next = binding === null ? "" : JSON.stringify(binding);
-      if (next === signature) return;
-      signature = next;
-      plate.replaceChildren();
-      plate.hidden = binding === null;
-      if (binding === null) return;
-      const presentation = skillKeyPresentation(binding);
-      plate.dataset.compact = String(presentation.modifiers.length >= 3);
-      for (const glyph of presentation.modifiers) {
-        const part = document.createElement("span");
-        part.className = "skill-key-plate-part skill-key-plate-modifier";
-        part.textContent = glyph;
-        plate.append(part);
-      }
-      const main = document.createElement("span");
-      main.className = "skill-key-plate-part skill-key-plate-main";
-      if (presentation.main.kind === "text") {
-        const glyph = document.createElement("span");
-        glyph.className = "skill-key-main-glyph";
-        glyph.textContent = presentation.main.label;
-        main.append(glyph);
-        main.dataset.wide = String(presentation.main.label.length > 1);
-        main.dataset.long = String(presentation.main.label.length > 2);
-      } else {
-        main.append(mouseIcon(document, presentation.main));
-        if (presentation.main.kind === "wheel") {
-          const direction = document.createElement("span");
-          direction.className = "skill-key-wheel-direction";
-          direction.textContent = presentation.main.direction === "up" ? "↑" : "↓";
-          main.append(direction);
-        }
-      }
-      plate.append(main);
-      plate.title = presentation.accessibleLabel;
-    },
-  });
-}
diff --git a/src/renderer/skill-key-overlay-consumer.ts b/src/renderer/skill-key-overlay-consumer.ts
index f52eac28..f603f563 100644
--- a/src/renderer/skill-key-overlay-consumer.ts
+++ b/src/renderer/skill-key-overlay-consumer.ts
@@ -4,9 +4,10 @@
  * the only join between those two sources and it owns no discovery or input.
  */
 import type { CompanionSkillSlotState } from "./companion-skill-snapshot.js";
-import { createSkillKeyOverlay } from "./skill-key-overlay.js";
+import type { NativeHudLayer } from "./native-hud-layer.js";
 import {
   EMPTY_SKILL_KEY_BINDINGS,
+  EMPTY_SKILL_KEY_MODIFIERS,
   cloneSkillKeyBindings,
   type SkillKeyBindings,
 } from "../shared/skill-key-bindings.js";
@@ -15,8 +16,8 @@ import { projectSkillSlots } from "./skill-slot-projection.js";
 export function createSkillKeyOverlayConsumer(
   parent: HTMLElement,
   canvas: HTMLCanvasElement,
+  overlay: NativeHudLayer,
 ) {
-  const overlay = createSkillKeyOverlay(parent);
   let state: CompanionSkillSlotState = Object.freeze({
     status: "waiting",
     reason: "memory",
@@ -25,25 +26,21 @@ export function createSkillKeyOverlayConsumer(
   let enabled = false;
   function render() {
     if (!enabled || state.status !== "ready") {
-      overlay.update({ status: "waiting" });
+      overlay.update("keys", []);
       return;
     }
     const projected = projectSkillSlots(state, canvas);
     if (projected === null) {
-      overlay.update({ status: "waiting" });
+      overlay.update("keys", []);
       return;
     }
-    overlay.update({
-      status: "ready",
-      slots: bindings.flatMap((binding, index) => {
-        if (binding === null) return [];
-        const slot = projected[index]!;
-        return [{
-          ...slot,
-          binding,
-        }];
-      }),
-    });
+    overlay.update("keys", bindings.map((binding, index) => {
+      const slot = projected[index]!;
+      return {parent: state.status === "ready" ? state.frameId : 0, child: index,
+        width: slot.width, height: slot.height, binding: binding ?? {
+          input: {kind: "keyboard" as const, code: `Digit${index + 1}`}, modifiers: EMPTY_SKILL_KEY_MODIFIERS,
+        }};
+    }));
   }
   const view = parent.ownerDocument.defaultView;
   view?.addEventListener("resize", render);
@@ -62,7 +59,7 @@ export function createSkillKeyOverlayConsumer(
     },
     dispose() {
       view?.removeEventListener("resize", render);
-      overlay.dispose();
+      overlay.update("keys", []);
     },
   });
 }
diff --git a/src/renderer/skill-key-overlay.ts b/src/renderer/skill-key-overlay.ts
deleted file mode 100644
index 4f2b4801..00000000
--- a/src/renderer/skill-key-overlay.ts
+++ /dev/null
@@ -1,145 +0,0 @@
-/**
- * The skill-key HUD above Guild Wars' eight skill slots.
- *
- * This module owns presentation and rejects malformed display projections. It
- * does not discover game frames or read settings. Those values must arrive
- * through the one consumer that joins certified geometry with saved labels.
- */
-import { isSkillKeyBinding, type SkillKeyBinding } from "../shared/skill-key-bindings.js";
-import { createSkillKeyBindingView } from "./skill-key-binding-view.js";
-
-const MAX_SLOT_COUNT = 8;
-const MAX_COORDINATE = 32_768;
-const MAX_SLOT_EDGE = 2_048;
-
-const ROOT_STYLE = [
-  "position:fixed",
-  "inset:0",
-  "z-index:3",
-  "display:none",
-  "overflow:hidden",
-  "pointer-events:none",
-  "user-select:none",
-].join(";");
-
-const SLOT_STYLE = "position:absolute;pointer-events:none";
-export type SkillKeySlot = Readonly<{
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  binding: SkillKeyBinding;
-}>;
-
-export type SkillKeyOverlayState = Readonly<{
-  status?: string;
-  slots?: readonly unknown[];
-}>;
-
-function finiteBounded(value: unknown, maximum: number): value is number {
-  return typeof value === "number"
-    && Number.isFinite(value)
-    && Math.abs(value) <= maximum;
-}
-
-function skillKeySlot(value: unknown): SkillKeySlot | null {
-  if (value === null || typeof value !== "object" || Array.isArray(value)) {
-    return null;
-  }
-  const slot = value as Record<string, unknown>;
-  const { x, y, width, height, binding } = slot;
-  if (
-    !finiteBounded(x, MAX_COORDINATE)
-    || !finiteBounded(y, MAX_COORDINATE)
-    || !finiteBounded(width, MAX_SLOT_EDGE)
-    || !finiteBounded(height, MAX_SLOT_EDGE)
-    || width <= 0
-    || height <= 0
-    || !isSkillKeyBinding(binding)
-  ) {
-    return null;
-  }
-  return Object.freeze({ x, y, width, height, binding });
-}
-
-/** Return the complete display projection, or nothing for a state we cannot
- * place safely. One bad slot hides the whole row instead of showing a binding
- * over the wrong skill. */
-export function skillKeyOverlayProjection(
-  state: SkillKeyOverlayState,
-): readonly SkillKeySlot[] | null {
-  if (
-    state.status !== "ready"
-    || !state.slots
-    || state.slots.length === 0
-    || state.slots.length > MAX_SLOT_COUNT
-  ) return null;
-  const slots: SkillKeySlot[] = [];
-  for (const value of state.slots) {
-    const slot = skillKeySlot(value);
-    if (slot === null) return null;
-    slots.push(slot);
-  }
-  return Object.freeze(slots);
-}
-
-function slotSignature(slots: readonly SkillKeySlot[]): string {
-  return slots
-    .map(({ x, y, width, height, binding }) =>
-      `${x},${y},${width},${height},${JSON.stringify(binding)}`)
-    .join(";");
-}
-
-/** Mount the pointer-transparent surface. The caller owns when it exists; this
- * owner touches the DOM only when the complete projection changes. */
-export function createSkillKeyOverlay(parent: HTMLElement) {
-  const document = parent.ownerDocument;
-  const root = document.createElement("div");
-  root.id = "skill-key-overlay";
-  root.setAttribute("aria-hidden", "true");
-  root.style.cssText = ROOT_STYLE;
-
-  const views = Array.from({ length: MAX_SLOT_COUNT }, () => {
-    const slot = document.createElement("span");
-    slot.style.cssText = SLOT_STYLE;
-    root.append(slot);
-    return { slot, binding: createSkillKeyBindingView(slot) };
-  });
-  parent.append(root);
-
-  let rendered = "";
-
-  return {
-    update(state: SkillKeyOverlayState) {
-      const slots = skillKeyOverlayProjection(state);
-      const next = slots === null ? "" : slotSignature(slots);
-      if (next === rendered) return;
-      rendered = next;
-      if (slots === null) {
-        root.style.display = "none";
-        return;
-      }
-      slots.forEach((slot, index) => {
-        const view = views[index]!;
-        const edge = Math.min(slot.width, slot.height);
-        const badgeEdge = Math.round(Math.min(42, Math.max(17, edge * 0.295)));
-        const inset = Math.round(Math.max(2, edge * 0.018));
-        view.slot.style.cssText = `${SLOT_STYLE};display:block;left:${slot.x}px;top:${slot.y}px;`
-          + `width:${slot.width}px;height:${slot.height}px`;
-        view.binding.element.style.cssText = `--skill-key-edge:${badgeEdge}px;position:absolute;`
-          + `right:${inset}px;bottom:${inset}px;max-width:calc(100% - ${inset * 2}px)`;
-        view.binding.update(slot.binding);
-      });
-      views.slice(slots.length).forEach(({ slot }) => {
-        slot.style.cssText = `${SLOT_STYLE};display:none`;
-      });
-      root.style.display = "block";
-    },
-    get state() {
-      return Object.freeze({ visible: rendered !== "", signature: rendered });
-    },
-    dispose() {
-      root.remove();
-    },
-  };
-}
diff --git a/src/renderer/skill-overlays-installation.ts b/src/renderer/skill-overlays-installation.ts
index eef57d24..d0dc748d 100644
--- a/src/renderer/skill-overlays-installation.ts
+++ b/src/renderer/skill-overlays-installation.ts
@@ -3,6 +3,7 @@
  * certified geometry and recharge feeds. Native ownership stays in the feed
  * installations; this module owns only their shared settings/policy lifecycle.
  */
+import type { NativeHudLayer } from "./native-hud-layer.js";
 import { COMPANION_FEATURE_BITS } from "../shared/companion-abi.js";
 import type { AppSettings } from "../shared/contracts.js";
 import type { EnhancementCapabilities } from "../shared/enhancement-contracts.js";
@@ -18,7 +19,7 @@ type SkillFeaturePolicy = Readonly<{
 }>;
 
 export function createSkillOverlaysInstallation(
-  capabilities: Pick<EnhancementCapabilities, "skillSlotGeometry" | "skillCooldownObservation">,
+  capabilities: Pick<EnhancementCapabilities, "skillSlotGeometry" | "skillCooldownObservation" | "nativeHudRendering">,
 ) {
   const geometry = createSkillSlotGeometryInstallation(capabilities.skillSlotGeometry);
   const cooldowns = createSkillCooldownObservationInstallation(
@@ -40,24 +41,25 @@ export function createSkillOverlaysInstallation(
         ? COMPANION_FEATURE_BITS.skillCooldownObservation
         : 0),
     get activeFeatureFlags() { return activeFeatureFlags; },
-    mount(parent: HTMLElement, settings: SkillSettings) {
-      if (!capabilities.skillSlotGeometry || keyConsumer !== null) return;
+    mount(parent: HTMLElement, settings: SkillSettings, hud: NativeHudLayer) {
+      if (!capabilities.nativeHudRendering || !capabilities.skillSlotGeometry || keyConsumer !== null) return;
       const canvas = parent.ownerDocument.getElementById("canvas");
       if (!(canvas instanceof HTMLCanvasElement)) {
         throw new Error("Enhancement skill overlay target is missing");
       }
-      keyConsumer = createSkillKeyOverlayConsumer(parent, canvas);
+      keyConsumer = createSkillKeyOverlayConsumer(parent, canvas, hud);
       unsubscribeKeyGeometry = geometry.subscribe(keyConsumer.update);
       if (!capabilities.skillCooldownObservation) return;
-      cooldownConsumer = createSkillCooldownOverlayConsumer(parent, canvas);
+      cooldownConsumer = createSkillCooldownOverlayConsumer(parent, canvas, hud);
       cooldownConsumer.sync(settings.skillCooldownColor, false);
       unsubscribeCooldownGeometry = geometry.subscribe(cooldownConsumer.update);
       unsubscribeCooldownState = cooldowns.subscribe(cooldownConsumer.setCooldownState);
     },
     sync(settings: SkillSettings, policy: SkillFeaturePolicy) {
-      const geometryActive = policy.skillKeyLabels || policy.skillCooldowns;
+      const geometryActive = capabilities.nativeHudRendering && (policy.skillKeyLabels || policy.skillCooldowns);
+      const cooldownActive = capabilities.nativeHudRendering && policy.skillCooldowns;
       geometry.setActive(geometryActive);
-      cooldowns.setActive(policy.skillCooldowns);
+      cooldowns.setActive(cooldownActive);
       keyConsumer?.setBindings(settings.skillKeyBindings);
       keyConsumer?.setEnabled(policy.skillKeyLabels);
       cooldownConsumer?.sync(settings.skillCooldownColor, policy.skillCooldowns);
@@ -67,7 +69,7 @@ export function createSkillOverlaysInstallation(
           ? COMPANION_FEATURE_BITS.skillSlotGeometry
           : 0
       ) | (
-        capabilities.skillCooldownObservation && policy.skillCooldowns
+        capabilities.skillCooldownObservation && cooldownActive
           ? COMPANION_FEATURE_BITS.skillCooldownObservation
           : 0
       );
diff --git a/src/shared/contracts.ts b/src/shared/contracts.ts
index bb22938c..bb544dfe 100644
--- a/src/shared/contracts.ts
+++ b/src/shared/contracts.ts
@@ -819,6 +819,7 @@ export interface ClientCompatibility {
     playerEffectObservation: OptionalFeatureStatus;
     effectIconGeometry: OptionalFeatureStatus;
     alcoholObservation: OptionalFeatureStatus;
+    nativeHudRendering: OptionalFeatureStatus;
     resignAction: OptionalFeatureStatus;
     whisperChat: OptionalFeatureStatus;
     playRegionObservation: OptionalFeatureStatus;
diff --git a/src/shared/enhancement-contracts.ts b/src/shared/enhancement-contracts.ts
index 54f931b0..8cea6438 100644
--- a/src/shared/enhancement-contracts.ts
+++ b/src/shared/enhancement-contracts.ts
@@ -182,6 +182,13 @@ const CAPABILITY_DEFINITIONS = Object.freeze([
     configOwners: [],
     hooks: ["ui"],
   },
+  {
+    id: "nativeHudRendering",
+    requiresAll: [],
+    requiresAny: ["skillSlotGeometry", "effectIconGeometry"],
+    configOwners: [],
+    hooks: [],
+  },
 ] as const);
 for (const contract of CAPABILITY_DEFINITIONS) {
   Object.freeze(contract.requiresAll);
@@ -278,6 +285,7 @@ export const NO_ENHANCEMENT_CAPABILITIES: EnhancementCapabilities = Object.freez
   resignAction: false,
   whisperChat: false,
   alcoholObservation: false,
+  nativeHudRendering: false,
 });
 
 function isExactBooleanRecord<Key extends string>(
@@ -321,6 +329,7 @@ export function parseEnhancementCapabilities(
     resignAction: value.resignAction,
     whisperChat: value.whisperChat,
     alcoholObservation: value.alcoholObservation,
+    nativeHudRendering: value.nativeHudRendering,
   });
 }
 
@@ -357,7 +366,7 @@ export const ENHANCEMENT_CAPABILITY_PRESETS = Object.freeze({
   // Developer-only session: exact player effects plus the already-certified
   // roster projection needed to correlate later party-effect evidence.
   effectObserver: capabilitiesFromMask(0xc204),
-  all: capabilitiesFromMask(0x7ffff),
+  all: capabilitiesFromMask(0xfffff),
 });
 
 /** The two capability sets shipped by Core and Tools release launches. */
@@ -372,7 +381,7 @@ export {
   ENHANCEMENT_LAYOUT_WORD_COUNT,
   ENHANCEMENT_PARTY_DIRTY_MESSAGE_COUNT,
 } from "./enhancement-config.js";
-export const ENHANCEMENT_TRANSFORM_ABI = 58;
+export const ENHANCEMENT_TRANSFORM_ABI = 67;
 
 export const ENHANCEMENT_CHAT_FILTER_MASKS = Object.freeze({
   allyDrops: 1,
diff --git a/src/shared/native-hud.ts b/src/shared/native-hud.ts
new file mode 100644
index 00000000..c02a2b0c
--- /dev/null
+++ b/src/shared/native-hud.ts
@@ -0,0 +1,12 @@
+/**
+ * Bounded bitmap and icon-label layout shared by the HUD writer and transform.
+ * Native frame ownership remains private to the transformed client.
+ */
+export const NATIVE_HUD_MAGIC = 0x48445747;
+export const NATIVE_HUD_ATLAS_SIZE = 1024;
+export const NATIVE_HUD_LABELS = 72;
+export const NATIVE_HUD_KEYCAP = 1;
+export const NATIVE_HUD_SKILLS = 8;
+export const NATIVE_HUD_QUADS = 8;
+export const NATIVE_HUD_HEADER = 28;
+export type NativeHudQuad = Readonly<{ x: number; y: number; width: number; height: number; u: number; v: number; right: number; bottom: number }>;
diff --git a/tests/client-artifact/client-chain-qualification.test.ts b/tests/client-artifact/client-chain-qualification.test.ts
index 2276cb5a..cc02df76 100644
--- a/tests/client-artifact/client-chain-qualification.test.ts
+++ b/tests/client-artifact/client-chain-qualification.test.ts
@@ -10,6 +10,7 @@ import { prepareClientModule, type PreparedClientModule } from
 import {
   enhancementOutputSha256,
 } from "../../src/main/certification/enhancement-builds.js";
+import { wasmEvidence, functionBodySha256 } from "../../src/main/certification/wasm-evidence.js";
 import { transformEnhancementWasm } from
   "../../src/main/certification/enhancement-transform.js";
 import { deriveFriendObserverCertificate } from
@@ -75,6 +76,17 @@ test("every shipped runtime profile reproduces the real client chain", async ()
     const profileBuild = profileVerification.enhancementBuild;
     assert.ok(profileBuild, `profile ${profile} must prove independently`);
     const enhanced = transformEnhancementWasm(template, profileBuild, capabilities);
+    const nativeInput = wasmEvidence(template)!.moduleView();
+    const nativeOutput = wasmEvidence(enhanced)!.moduleView();
+    const hasHud = nativeOutput.exports.some((entry) => entry.name === "gwonmac_hud_label");
+    assert.equal(hasHud, capabilities.nativeHudRendering,
+      `${launch} must install native HUD only for a selected display owner`);
+    if (!hasHud) {
+      for (const index of [6490, 6492, 6585]) {
+        assert.equal(functionBodySha256(nativeOutput, index), functionBodySha256(nativeInput, index),
+          `${launch} must preserve original UI collection and destruction`);
+      }
+    }
     assert.ok(
       deriveFriendObserverCertificate(enhanced),
       `friend observation must prove against the ${profile} predecessor`,
diff --git a/tests/client-artifact/core-rebuild-recert.test.ts b/tests/client-artifact/core-rebuild-recert.test.ts
index f28aefd2..cd117e60 100644
--- a/tests/client-artifact/core-rebuild-recert.test.ts
+++ b/tests/client-artifact/core-rebuild-recert.test.ts
@@ -32,6 +32,7 @@ const CORE_CAPABILITIES = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
diff --git a/tests/client-artifact/native-hud-certification.test.ts b/tests/client-artifact/native-hud-certification.test.ts
new file mode 100644
index 00000000..76674b6f
--- /dev/null
+++ b/tests/client-artifact/native-hud-certification.test.ts
@@ -0,0 +1,44 @@
+/** Proves native HUD refusal stays independent of the observation capabilities. */
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+import { verifyLocalClientBytes, isLocalClientVerification } from "../../src/main/certification/local-client-verifier.js";
+import { rewriteTemplateSaveWasm } from "../../src/main/certification/template-save-compat.js";
+import { transformEnhancementWasm } from "../../src/main/certification/enhancement-transform.js";
+import { supportedEnhancementCapabilities } from "../../src/main/certification/enhancement-builds.js";
+import { appendNativeHud } from "../../src/main/certification/native-hud-transform.js";
+import { wasmEvidence } from "../../src/main/certification/wasm-evidence.js";
+import { concat, encodeCode, encodeSection, parseCode, sectionById, splitSections, WASM_HEADER } from "../../src/main/core/wasm-binary.js";
+import { ENHANCEMENT_CAPABILITY_PRESETS } from "../../src/shared/enhancement-contracts.js";
+
+test("changed native HUD ownership refuses only rendering and preserves independent observers", () => {
+  assert.ok(process.env.GW_CLIENT_WASM);
+  return readFile(process.env.GW_CLIENT_WASM).then((bytes) => {
+    const input = new Uint8Array(bytes);
+    const evidence = wasmEvidence(input); assert.ok(evidence);
+    const sections = splitSections(input), bodies = parseCode(sectionById(sections, 10));
+    const local = 6492 - evidence.moduleView().functionImportCount;
+    const original = bodies[local]!;
+    // Harmless code drift must revoke the exact draw-owner proof while leaving
+    // the separately proved skill/effect observation and other Tools intact.
+    bodies[local] = concat(original.slice(0, -1), Uint8Array.of(0x01, 0x0b));
+    const changed = concat(WASM_HEADER, ...sections.map((section) => encodeSection(section.id === 10
+      ? { id: 10, body: encodeCode(bodies) } : section)));
+    assert.ok(WebAssembly.validate(new Uint8Array(changed)));
+    assert.throws(() => appendNativeHud(changed, 0), /native HUD rendering proof changed/);
+    const requested = ENHANCEMENT_CAPABILITY_PRESETS.all;
+    const verified = verifyLocalClientBytes(changed, requested);
+    assert.equal(isLocalClientVerification(verified, verified.officialSha256, requested), true);
+    const build = verified.enhancementBuild; assert.ok(build);
+    assert.equal(build.nativeHudRendering, undefined);
+    assert.deepEqual(verified.featureVerdicts?.nativeHudRendering.status, "changed");
+    for (const feature of ["nativeCursor", "partyObservation", "skillSlotGeometry", "skillCooldownObservation", "playerEffectObservation", "effectIconGeometry", "alcoholObservation"] as const) {
+      assert.equal(verified.featureVerdicts?.[feature].status, "proved", `${feature} remains independently certified`);
+    }
+    assert.ok(verified.templateSaveBuild);
+    const template = rewriteTemplateSaveWasm(changed, verified.templateSaveBuild);
+    const output = transformEnhancementWasm(template, build, supportedEnhancementCapabilities(build));
+    const outputEvidence = wasmEvidence(output); assert.ok(outputEvidence);
+    assert.equal(outputEvidence.moduleView().exports.some(({ name }) => name.startsWith("gwonmac_hud_")), false);
+  });
+});
diff --git a/tests/client-artifact/native-hud.test.ts b/tests/client-artifact/native-hud.test.ts
new file mode 100644
index 00000000..02d3c46b
--- /dev/null
+++ b/tests/client-artifact/native-hud.test.ts
@@ -0,0 +1,228 @@
+/** Executes the native HUD attachment, resource and input boundaries with controlled peers. */
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+import { appendNativeHud } from "../../src/main/certification/native-hud-transform.js";
+import { wasmEvidence } from "../../src/main/certification/wasm-evidence.js";
+import { concat, encodeCode, encodeSection, parseCode, parseExports, sectionById, splitSections, uleb, vectorPayload, WASM_HEADER } from "../../src/main/core/wasm-binary.js";
+import { encodeName } from "../../src/main/certification/cartography-transform-internals.js";
+import { NATIVE_HUD_MAGIC, NATIVE_HUD_HEADER as HEADER, NATIVE_HUD_LABELS, NATIVE_HUD_KEYCAP } from "../../src/shared/native-hud.js";
+
+for (const channel of ["cooldowns", "keys", "effects"] as const) {
+ test(`native ${channel} retains icon clipping, updates geometry without texture uploads, and frees every resource`, async () => {
+  const isEffect = channel === "effects";
+  const recordIndex = isEffect ? 8 : channel === "keys" ? 7 : 0;
+  const childId = isEffect ? 127 : channel === "keys" ? 7 : 0;
+  assert.ok(process.env.GW_CLIENT_WASM);
+  const input = new Uint8Array(await readFile(process.env.GW_CLIENT_WASM));
+  const output = appendNativeHud(input, 1);
+  const sections = splitSections(output), bodies = parseCode(sectionById(sections, 10));
+  const evidence = wasmEvidence(output); assert.ok(evidence); const module = evidence.moduleView();
+  const exported = parseExports(sectionById(sections, 7));
+  const label = exported.find((entry) => entry.name === "gwonmac_hud_label")?.index; assert.ok(label);
+  const first = label - 8;
+  const selected = [...Array.from({length: 7}, (_, n) => first + 2 + n), first, 6492, 6585, first + 9];
+  const peers = [17640, 6587, 294, 295, 322, 334, 6588, 6598, 6599, 6601, 6602, first + 1, 6593, 748, 17791, 17793, 1444, 1445, 1446, 1448, 1449, 1554, 1572, 6446, 1563, 1569, 1579, 1333, 1334, 1357, 264, 1559, 5595, 2249, 3137];
+  const indices = new Map([...peers, ...selected].map((index, position) => [index, position]));
+  const decoded = evidence.decodeFunctions([]);
+  const rewritten = selected.map((index) => {
+    const body = bodies[index - module.functionImportCount]!;
+    const sites = decoded.find((row) => row.functionIndex === index)?.callSites; assert.ok(sites);
+    const edits = [...sites].flatMap(([target, calls]) => {
+      const replacement = indices.get(target); assert.ok(replacement !== undefined, `unexpected peer ${target}`);
+      return calls.map((site) => ({...site, replacement}));
+    }).sort((a, b) => a.offset - b.offset);
+    let cursor = 0; const parts: Uint8Array[] = [];
+    for (const edit of edits) { parts.push(body.slice(cursor, edit.offset + 1), uleb(edit.replacement)); cursor = edit.operandEnd; }
+    return concat(...parts, body.slice(cursor));
+  });
+  const scalarExports = exported.filter((entry) => entry.kind === 3 && entry.name.startsWith("gwonmac_hud_"));
+  const section = (id: number, body: Uint8Array) => encodeSection({id, body});
+  const labels = ["release", "reset", "mesh", "collect", "destroy", "atlas", "label", "originalCollect", "wrappedCollect", "buildCache", "hideStockKey"];
+  const globalCount = vectorPayload(sectionById(sections, 6)).count;
+  const fixture = concat(WASM_HEADER,
+    section(1, sectionById(sections, 1)),
+    section(2, concat(uleb(peers.length), ...peers.map((index) => concat(encodeName("peer"), encodeName(String(index)), Uint8Array.of(0), uleb(module.functionTypeIndices[index]!))))),
+    section(3, concat(uleb(selected.length), ...selected.map((index) => uleb(module.functionTypeIndices[index]!)))),
+    section(4, concat(uleb(1), Uint8Array.of(0x70, 0), uleb(1714))),
+    section(5, Uint8Array.of(1, 0, 128, 1)),
+    section(6, concat(uleb(globalCount), ...Array.from({length: globalCount}, () => Uint8Array.of(0x7f, 1, 0x41, 0, 0x0b)))),
+    section(7, concat(uleb(labels.length + scalarExports.length + 3),
+      ...labels.map((name, index) => concat(encodeName(name), Uint8Array.of(0), uleb(peers.length + index))),
+      encodeName("memory"), Uint8Array.of(2, 0), encodeName("stack"), Uint8Array.of(3, 0), encodeName("skillbar"), Uint8Array.of(3, 1),
+      ...scalarExports.map((entry) => concat(encodeName(entry.name), Uint8Array.of(3), uleb(entry.index))))),
+    section(9, concat(uleb(1), Uint8Array.of(0, 0x41, 0xae, 0x0d, 0x0b), uleb(4), ...[6598, 6599, 6601, 6602].map((index) => uleb(indices.get(index)!)))),
+    section(10, encodeCode(rewritten)));
+  let textureCreates = 0, invalidations = 0, meshes = 0, destroyed = 0, nextHandle = 100;
+  const refs = new Map<number, number>(); const meshVertices = new Map<number, number>();
+  const create = () => { const handle = nextHandle++; refs.set(handle, 1); return handle; };
+  const collected: number[] = [];
+  let heap = 5_000_000; const allocations = new Set<number>();
+  const exports: WebAssembly.Exports = new WebAssembly.Instance(new WebAssembly.Module(Uint8Array.from(fixture)), {peer: {
+    17640: () => { throw new Error("fixture cache must be initialized"); },
+    6587: (count: number, vectors: number) => {
+      for (let n = 0; n < count; n++) {
+        const vector = vectors + n * 16;
+        for (let at = 0; at < view.getUint32(vector + 8, true); at++) {
+          collected.push(view.getUint32(view.getUint32(vector, true) + at * 4, true));
+        }
+        view.setUint32(vector + 8, 0, true);
+      }
+    },
+    294: () => { throw new Error("fixture cache capacity exceeded"); },
+    295: () => { throw new Error("fixture cache allocation unexpected"); },
+    322: () => { throw new Error("native assertion"); },
+    334: () => { throw new Error("fixture cache free unexpected"); },
+    6588: () => { throw new Error("fixture cache grow unexpected"); },
+    6598: (out: number) => { [0, 0, 1024, 768].forEach((v, n) => view.setFloat32(out + n * 4, v, true)); },
+    6599: () => {},
+    6601: (out: number) => { [0, 0, 1024, 768].forEach((v, n) => view.setFloat32(out + n * 4, v, true)); },
+    6602: () => {},
+    [first + 1]: (owner: number) => { destroyed++; return owner; },
+    6593: () => { invalidations++; },
+    748: (handle: number) => { assert.ok(refs.has(handle), `release unknown ${handle}`); refs.delete(handle); },
+    17791: (bytes: number) => { const p = heap; heap += bytes; allocations.add(p); return p; },
+    17793: (pointer: number) => { assert.ok(allocations.delete(pointer)); },
+    1444: () => create(),
+    1445: () => 7_000_000,
+    1446: (handle: number) => { const p = 6_000_000; meshVertices.set(handle, p); meshes++; return p; },
+    1448: () => {}, 1449: () => {},
+    1554: (count: number, mesh: number, material: number) => {
+      assert.equal(count, 1); assert.ok(refs.has(view.getUint32(mesh, true))); assert.ok(refs.has(view.getUint32(material, true))); return create();
+    },
+    1572: (_draw: number, flags: number) => { assert.equal(flags, 6); },
+    6446: (position: number) => { assert.equal(position, 256 + 208); },
+    1563: () => {}, 1569: () => {}, 1579: () => {},
+    1333: () => 1000, 1334: () => {}, 1357: () => {},
+    264: (to: number, from: number, bytes: number) => { new Uint8Array(view.buffer).copyWithin(to >>> 0, from >>> 0, (from >>> 0) + bytes); },
+    1559: (_handle: number, alpha: number) => { assert.equal(alpha, 127); },
+    5595: (_output: number, needed: number, count: number) => { assert.equal(needed, count + 1); },
+    2249: (_pixels: number, format: number, dimensions: number, mips: number, flags: number) => {
+      assert.deepEqual([format, view.getUint32(dimensions, true), view.getUint32(dimensions + 4, true), mips, flags], [0, 1024, 1024, 1, 112]); textureCreates++; return create();
+    },
+    3137: (_count: number, _texture: number, stage: number, _shader: number, _a: number, _b: number, _flags: number, order: number) => {
+      assert.deepEqual([view.getUint32(stage, true), order], [7, 11]); return create();
+    },
+  }}).exports;
+  assert.ok(exports.memory instanceof WebAssembly.Memory); let view = new DataView(exports.memory.buffer);
+  const invoke = (name: string, ...args: number[]) => { const target = exports[name]; assert.equal(typeof target, "function"); if (typeof target === "function") return target(...args); };
+  const scalar = (name: string, value: number) => { const target = exports[name]; assert.ok(target instanceof WebAssembly.Global); target.value = value; };
+  scalar("stack", 7_900_000); scalar("skillbar", 43);
+  const region = 2048, atlasBytes = 8 + 1024 * 1024 * 4;
+  view.setUint32(region, NATIVE_HUD_MAGIC, true); view.setUint32(region + 4, 1024, true);
+  assert.equal(invoke("atlas", region, atlasBytes - 1), 0);
+  assert.equal(invoke("atlas", region, atlasBytes), 1);
+  const frame = 256, parent = 1024, outputVector = 1800;
+  const u = (at: number, value: number) => view.setUint32(at, value, true);
+  const f = (at: number, value: number) => view.setFloat32(at, value, true);
+  u(frame + 184, isEffect ? childId : 2); u(frame + 188, 50); u(frame + 296, parent + 296);
+  u(parent + 188, 44); u(parent + 184, childId); u(parent + 296, 4600 + 296); u(4600 + 188, 43); u(4600 + 308, 1726357791); f(4600 + 48, 1); f(parent + 48, 1); f(frame + 48, .5);
+  u(frame + 32, 4500); u(frame + 40, 6); // Live bitmap has six stock layer slots.
+  u(4500 + 5 * 16, 4700); u(4500 + 5 * 16 + 8, 1); u(4700, 777);
+  u(outputVector, 1900);
+  [100, 200, 164, 264].forEach((v, n) => f(frame + 268 + n * 4, v));
+  const header = (count = 1) => {
+    [NATIVE_HUD_MAGIC, HEADER + count * 32, recordIndex, 43, childId, count, channel === "keys" && count ? NATIVE_HUD_KEYCAP : 0].forEach((v, n) => u(region + n * 4, v));
+    [.25, .25, .5, .5, 0, 0, 1, 1].forEach((v, n) => f(region + HEADER + n * 4, v));
+  };
+  header(); assert.equal(invoke("label", region, HEADER + 32), 1);
+  if (!isEffect) assert.equal(invoke("collect", parent + 4, 9, outputVector), 0, "logical skill containers are not bitmap draw owners");
+  assert.equal(invoke("collect", frame + 4, 8, outputVector), 1, "empty intermediate slots keep the stock traversal alive");
+  assert.equal(meshes, 0, "only the native final clip category gets labels");
+  // Execute the exact stock cache loop, including its early-exit behavior.
+  // Calling collect(9) directly hid the live failure for six-slot bitmaps.
+  const veil = 16000, laterPanel = 17000, stockKey = 20000;
+  u(veil, 1); u(veil + 184, 0); u(veil + 188, 51); u(veil + 296, frame + 296);
+  u(veil + 32, 18000); u(veil + 40, 1); u(18000, 19000); u(18008, 1); u(19000, 778);
+  u(laterPanel + 184, 900); u(laterPanel + 188, 52);
+  u(laterPanel + 32, 18100); u(laterPanel + 40, 1); u(18100, 19004); u(18108, 1); u(19004, 779);
+  u(stockKey, 1); u(stockKey + 184, 6); u(stockKey + 188, 53); u(stockKey + 296, frame + 296);
+  u(stockKey + 28, 19400); u(19404, 780); // Stock keycap uses the implicit draw, without layer slots.
+  u(5913696, 1); u(5913576, 4); u(5913568, 4800); u(4800, frame); u(4804, veil); u(4808, stockKey); u(4812, laterPanel);
+  f(5910124, 1024); f(5910128, 768);
+  u(5913680, 8000); u(5913684, 16); u(5913688, 16);
+  for (let n = 0; n < 16; n++) { u(8000 + n * 16, 9000 + n * 256); u(8004 + n * 16, 64); }
+  [0, 3, 1710, 1711, 4, 8, 1712, 1713, 9, 9, 1710, 1711].forEach((v, n) => u(1420256 + n * 4, v));
+  invoke("buildCache");
+  assert.equal(collected[0], 777, "stock bitmap drawing is preserved");
+  assert.equal(collected.length, channel === "keys" ? 4 : 5, "only active key labels suppress the stock keycap");
+  assert.equal(collected[1], 778, "native child veil must precede our label");
+  if (channel !== "keys") assert.equal(collected[2], 780, "cooldowns and effects preserve stock keys");
+  assert.ok(refs.has(collected.at(-2)!), "the retained label is above the veil and stock key drawing");
+  assert.equal(collected.at(-1), 779, "later native panels remain above our label");
+  assert.equal(meshes, 1);
+  if (channel === "cooldowns") {
+    const draw = collected.at(-2);
+    const resourceCount = refs.size;
+    // A keycap joins an existing cooldown in the same native draw. There is
+    // no second object for later native sorting to move above the number.
+    header(2); u(region + 24, NATIVE_HUD_KEYCAP);
+    [.25, .25, .5, .5, 0, 0, 1, 1].forEach((v, n) => f(region + HEADER + 32 + n * 4, v));
+    f(region + HEADER, .5);
+    assert.equal(invoke("label", region, HEADER + 64), 1);
+    collected.length = 0; invoke("buildCache");
+    assert.deepEqual(collected, [777, 778, draw, 779], "keycap and cooldown are one ordered draw between the veil and later panels");
+    assert.equal(refs.size, resourceCount, "coexistence adds no independent sorting object");
+    assert.equal(view.getFloat32(6_000_000, true), 132, "first quad is the keycap");
+    assert.equal(view.getFloat32(6_000_096, true), 116, "cooldown triangles follow inside the same mesh");
+    const changedFlag = invalidations;
+    header(); assert.equal(invoke("label", region, HEADER + 32), 1);
+    assert.ok(invalidations > changedFlag, "turning off keycaps invalidates stock suppression without recreating the timer");
+    collected.length = 0; invoke("buildCache");
+    assert.deepEqual(collected, [777, 778, 780, draw, 779]);
+    assert.equal(refs.size, resourceCount);
+  }
+  assert.equal(invoke("collect", frame + 4, 9, outputVector), 1);
+  assert.equal(view.getUint32(outputVector + 8, true), 1);
+  assert.equal(view.getFloat32(6_000_000, true), 116);
+  assert.equal(view.getFloat32(6_000_004, true), 248);
+  const invalidationsBefore = invalidations;
+  header(); f(region + HEADER, .125); assert.equal(invoke("label", region, HEADER + 32), 1);
+  assert.equal(textureCreates, 1); assert.equal(invalidations, invalidationsBefore, "countdown changes retain the compiled native batch");
+  assert.equal(view.getFloat32(6_000_000, true), 108);
+  f(frame + 276, 228); invoke("collect", frame + 4, 9, outputVector);
+  assert.equal(view.getFloat32(6_000_000, true), 116, "native icon resize updates geometry without a texture upload");
+  for (const [offset, value] of [[0, 0], [8, NATIVE_HUD_LABELS], [20, 9]] as const) { header(); u(region + offset, value); assert.equal(invoke("label", region, HEADER + 32), 0); }
+  header(); u(region + 24, 2); assert.equal(invoke("label", region, HEADER + 32), 0, "unknown composition flags refuse");
+  header(); u(region + 8, 8); u(region + 24, NATIVE_HUD_KEYCAP); assert.equal(invoke("label", region, HEADER + 32), 0, "effect labels cannot suppress player keycaps");
+  for (const [field, value] of [[0, .75], [4, .75], [16, .75], [20, .75]] as const) {
+    header();
+    [.25, .25, .5, .5, .25, .25, .5, .5].forEach((v, n) => f(region + HEADER + n * 4, v));
+    f(region + HEADER + field, value);
+    assert.equal(invoke("label", region, HEADER + 32), 0, "complete extents and UV ordering must stay within the icon/atlas");
+  }
+  header(); f(region + HEADER + 8, 0); f(region + HEADER + 12, 0);
+  assert.equal(invoke("label", region, HEADER + 32), 1, "zero-area clipping remains valid");
+  header(); f(region + HEADER, NaN); assert.equal(invoke("label", region, HEADER + 32), 0);
+  header(); f(region + HEADER, -1); assert.equal(invoke("label", region, HEADER + 32), 0);
+  assert.equal(invoke("label", 8_388_604, 56), 0); assert.equal(invoke("label", -1, 56), 0);
+  header(0); assert.equal(invoke("label", region, HEADER), 1);
+  assert.equal(invoke("collect", frame + 4, 8, outputVector), 0, "disabled HUD restores the stock stopping point");
+  assert.equal(refs.size, 1, "hiding releases the label's retained resources");
+  collected.length = 0; invoke("buildCache");
+  assert.deepEqual(collected, [777, 778, 780, 779], "disabling the replacement restores the untouched stock keycap");
+  const meshesBeforeReappearance = meshes;
+  header(); assert.equal(invoke("label", region, HEADER + 32), 1);
+  assert.equal(invoke("collect", frame + 4, 9, outputVector), 1);
+  assert.equal(meshes, meshesBeforeReappearance + 1, "reappearing labels have populated geometry on their first draw, before any digit changes");
+  assert.equal(invoke("destroy", frame + 4), frame + 4); assert.equal(destroyed, 1);
+  assert.equal(refs.size, 1, "icon destruction leaves only the shared atlas material");
+  invoke("reset"); invoke("reset"); assert.equal(refs.size, 0); assert.equal(allocations.size, 0);
+  assert.equal(textureCreates, 1);
+  if (channel === "cooldowns") {
+    const memory = exports.memory;
+    const highRegion = 0x80000800;
+    memory.grow(32768 + 128 - memory.buffer.byteLength / 65536);
+    view = new DataView(memory.buffer);
+    u(highRegion, NATIVE_HUD_MAGIC); u(highRegion + 4, 1024);
+    assert.equal(invoke("atlas", highRegion | 0, atlasBytes), 1, "native atlas accepts a signed high-memory pointer");
+    header();
+    new Uint8Array(memory.buffer, highRegion, HEADER + 32).set(new Uint8Array(memory.buffer, region, HEADER + 32));
+    assert.equal(invoke("label", highRegion | 0, HEADER + 32), 1);
+    assert.equal(invoke("collect", frame + 4, 9, outputVector), 1);
+    invoke("reset");
+    assert.equal(refs.size, 0); assert.equal(allocations.size, 0);
+  }
+});
+
+}
diff --git a/tests/client-artifact/template-save-recert.test.ts b/tests/client-artifact/template-save-recert.test.ts
index bb136228..b872b8e5 100644
--- a/tests/client-artifact/template-save-recert.test.ts
+++ b/tests/client-artifact/template-save-recert.test.ts
@@ -194,7 +194,8 @@ test("the template-save verifier makes a fail-closed decision for a real client"
     quickItemMove: true,
     playerEffectObservation: true,
     effectIconGeometry: true,
-    alcoholObservation: false,
+    alcoholObservation: true,
+    nativeHudRendering: true,
     resignAction: true,
     whisperChat: true,
   } satisfies EnhancementCapabilities);
@@ -336,6 +337,7 @@ test("the template-save verifier makes a fail-closed decision for a real client"
     playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: true,
     resignAction: false,
     whisperChat: false,
   } satisfies EnhancementCapabilities);
@@ -364,6 +366,7 @@ test("the template-save verifier makes a fail-closed decision for a real client"
     playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: true,
     resignAction: false,
     whisperChat: false,
   } satisfies EnhancementCapabilities);
diff --git a/tests/fixtures/enhancement-transform.ts b/tests/fixtures/enhancement-transform.ts
index ab0b0856..03acf59a 100644
--- a/tests/fixtures/enhancement-transform.ts
+++ b/tests/fixtures/enhancement-transform.ts
@@ -30,6 +30,7 @@ export const UNSUPPORTED_ALL_CAPABILITIES: EnhancementCapabilities = Object.free
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -51,6 +52,7 @@ export const CURSOR_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -72,6 +74,7 @@ export const CURSOR_TARGET: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -93,6 +96,7 @@ export const TARGET_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -114,6 +118,7 @@ export const STORAGE_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -135,6 +140,7 @@ export const CURSOR_TOOLBOX: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -156,6 +162,7 @@ export const NO_CAPABILITIES: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -177,6 +184,7 @@ export const CURSOR_TOOLBOX_COMMANDS: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -198,6 +206,7 @@ export const CURSOR_TARGET_TOOLBOX_COMMANDS: EnhancementCapabilities = Object.fr
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -219,6 +228,7 @@ export const CURSOR_TOOLBOX_STORAGE: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
diff --git a/tests/helpers/packaged-enhancement-fixture.ts b/tests/helpers/packaged-enhancement-fixture.ts
index c503c91b..29732a10 100644
--- a/tests/helpers/packaged-enhancement-fixture.ts
+++ b/tests/helpers/packaged-enhancement-fixture.ts
@@ -143,6 +143,7 @@ export const TARGET_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -164,6 +165,7 @@ export const TOOLBOX_PROGRAM_CAPABILITIES: EnhancementCapabilities = Object.free
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -185,6 +187,7 @@ export const PRODUCT_TOOLS_CAPABILITIES: EnhancementCapabilities = Object.freeze
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -206,6 +209,7 @@ export const TARGET_OFF_PRODUCT_CAPABILITIES: EnhancementCapabilities = Object.f
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
diff --git a/tests/policy/effect-timers-are-display-only.test.ts b/tests/policy/effect-timers-are-display-only.test.ts
index 50c2b592..8b1a6eee 100644
--- a/tests/policy/effect-timers-are-display-only.test.ts
+++ b/tests/policy/effect-timers-are-display-only.test.ts
@@ -4,7 +4,7 @@ import { readFile } from "node:fs/promises";
 import test from "node:test";
 
 const rendererSources = [
-  "src/renderer/effect-timer-overlay.ts",
+  "src/renderer/native-hud-layer.ts",
   "src/renderer/effect-timer-overlay-consumer.ts",
   "src/renderer/player-effect-state-installation.ts",
 ] as const;
diff --git a/tests/policy/skill-cooldowns-are-display-only.test.ts b/tests/policy/skill-cooldowns-are-display-only.test.ts
index 953d83ac..c5811b33 100644
--- a/tests/policy/skill-cooldowns-are-display-only.test.ts
+++ b/tests/policy/skill-cooldowns-are-display-only.test.ts
@@ -3,8 +3,7 @@ import { readFile } from "node:fs/promises";
 import test from "node:test";
 
 const rendererSources = [
-  "src/renderer/skill-cooldown-view.ts",
-  "src/renderer/skill-cooldown-overlay.ts",
+  "src/renderer/native-hud-layer.ts",
   "src/renderer/skill-cooldown-overlay-consumer.ts",
   "src/renderer/skill-cooldown-state-installation.ts",
   "src/renderer/skill-overlays-installation.ts",
diff --git a/tests/unit/active-client.test.ts b/tests/unit/active-client.test.ts
index e09413f1..fd061256 100644
--- a/tests/unit/active-client.test.ts
+++ b/tests/unit/active-client.test.ts
@@ -35,6 +35,7 @@ function generation(wasmPath: string, size: number): ClientGeneration {
         playerEffectObservation: { status: "off" },
         effectIconGeometry: { status: "off" },
         alcoholObservation: { status: "off" },
+        nativeHudRendering: { status: "off" },
         resignAction: { status: "off" },
         whisperChat: { status: "off" },
       },
diff --git a/tests/unit/client-certification.test.ts b/tests/unit/client-certification.test.ts
index 91c32196..25768248 100644
--- a/tests/unit/client-certification.test.ts
+++ b/tests/unit/client-certification.test.ts
@@ -28,6 +28,7 @@ const ALL_CAPABILITIES = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
diff --git a/tests/unit/client-module.test.ts b/tests/unit/client-module.test.ts
index 9198fd01..7d2532e0 100644
--- a/tests/unit/client-module.test.ts
+++ b/tests/unit/client-module.test.ts
@@ -61,6 +61,7 @@ const CURSOR_TOOLBOX: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
@@ -82,6 +83,7 @@ const CURSOR_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: false,
@@ -103,6 +105,7 @@ const CURSOR_TARGET: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
@@ -124,6 +127,7 @@ const NO_CAPABILITIES: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: false,
diff --git a/tests/unit/client-recertification-evidence.test.ts b/tests/unit/client-recertification-evidence.test.ts
index 7c8d70d1..3f28e38d 100644
--- a/tests/unit/client-recertification-evidence.test.ts
+++ b/tests/unit/client-recertification-evidence.test.ts
@@ -9,6 +9,7 @@ import { createClientRecertificationEvidence } from
   "../../scripts/client-recertification-evidence.js";
 import { ENHANCEMENT_CAPABILITY_FIELDS } from
   "../../src/shared/enhancement-contracts.js";
+import { SEMANTIC_VERIFIER_ABI } from "../../src/main/certification/semantic-proof.js";
 import { LOCAL_FEATURE_INVARIANTS } from
   "../../src/main/certification/local-client-verification-contract.js";
 
@@ -25,8 +26,8 @@ test("retains bounded generation evidence without paths or raw addresses", async
   const fileOutputDigest = sha256("file-output");
   const feature601Input = sha256("features-e01-input");
   const feature601DoubleClick = sha256("features-e01-double-click");
-  const featureAllInput = sha256("features-7ffff-input");
-  const featureAllDoubleClick = sha256("features-7ffff-double-click");
+  const featureAllInput = sha256("features-fffff-input");
+  const featureAllDoubleClick = sha256("features-fffff-double-click");
   const generation = sha256("generation");
   const commit = "a".repeat(40);
   const files = {
@@ -52,7 +53,7 @@ test("retains bounded generation evidence without paths or raw addresses", async
       outputSha256: feature601DoubleClick,
       enhancementInputSha256: fileOutputDigest,
     }, {
-      profile: "features-7ffff",
+      profile: "features-fffff",
       inputSha256: featureAllInput,
       outputSha256: featureAllDoubleClick,
       enhancementInputSha256: fileOutputDigest,
@@ -76,7 +77,7 @@ test("retains bounded generation evidence without paths or raw addresses", async
       inputSha256: feature601DoubleClick,
       outputSha256: outputDigest,
     }, {
-      profile: "features-7ffff",
+      profile: "features-fffff",
       inputSha256: featureAllDoubleClick,
       outputSha256: outputDigest,
     }],
@@ -100,7 +101,7 @@ test("retains bounded generation evidence without paths or raw addresses", async
       outputSha256: sha256("cartography-e01"),
       memoryLayout: "relocated",
     }, {
-      profile: "features-7ffff",
+      profile: "features-fffff",
       inputSha256: featureAllInput,
       outputSha256: sha256("cartography-fff"),
       memoryLayout: "relocated",
@@ -129,11 +130,11 @@ test("retains bounded generation evidence without paths or raw addresses", async
       writeFile(files.js, js),
       writeFile(files.runtime, JSON.stringify({
         officialSha256: wasmDigest,
-        verifierAbi: 7,
+        verifierAbi: SEMANTIC_VERIFIER_ABI,
         fileVerdict: {
           status: "proved",
           inputSha256: wasmDigest,
-          verifierAbi: 7,
+          verifierAbi: SEMANTIC_VERIFIER_ABI,
           outputSha256: fileOutputDigest,
           rawAddress: 0x5a0ee0,
         },
@@ -305,18 +306,18 @@ test("retains bounded generation evidence without paths or raw addresses", async
     for (const fileVerdict of [{
       status: "refused",
       inputSha256: wasmDigest,
-      verifierAbi: 7,
+      verifierAbi: SEMANTIC_VERIFIER_ABI,
       reason: "template-shape-changed",
     }, {
       status: "proved",
       inputSha256: sha256("wrong-input"),
       outputSha256: outputDigest,
-      verifierAbi: 7,
+      verifierAbi: SEMANTIC_VERIFIER_ABI,
     }, {
       status: "proved",
       inputSha256: wasmDigest,
       outputSha256: outputDigest,
-      verifierAbi: 8,
+      verifierAbi: SEMANTIC_VERIFIER_ABI + 1,
     }]) {
       await Promise.all([
         writeFile(files.runtime, JSON.stringify({
@@ -336,10 +337,10 @@ test("retains bounded generation evidence without paths or raw addresses", async
     }
     await writeFile(files.runtime, JSON.stringify({
       ...record(evidence.runtime),
-      verifierAbi: 8,
+      verifierAbi: SEMANTIC_VERIFIER_ABI + 1,
       fileVerdict: {
         ...record(record(evidence.runtime).fileVerdict),
-        verifierAbi: 8,
+        verifierAbi: SEMANTIC_VERIFIER_ABI + 1,
       },
     }));
     const wrongSourceAbi = await createClientRecertificationEvidence(args, environment);
@@ -375,7 +376,7 @@ test("rejects poison strings and contradictory proved states", async () => {
       writeFile(files.js, js),
       writeFile(files.runtime, JSON.stringify({
         officialSha256: wasmDigest,
-        verifierAbi: 7,
+        verifierAbi: SEMANTIC_VERIFIER_ABI,
         fileVerdict: null,
         templateSaving: false,
         features: {
diff --git a/tests/unit/effective-enhancement-capabilities.test.ts b/tests/unit/effective-enhancement-capabilities.test.ts
index 44cf1136..e7cdf624 100644
--- a/tests/unit/effective-enhancement-capabilities.test.ts
+++ b/tests/unit/effective-enhancement-capabilities.test.ts
@@ -42,6 +42,7 @@ function session(capabilities: EnhancementCapabilities): ClientSession {
       playerEffectObservation: selected(capabilities.playerEffectObservation),
       effectIconGeometry: selected(capabilities.effectIconGeometry),
       alcoholObservation: selected(capabilities.alcoholObservation),
+      nativeHudRendering: selected(capabilities.nativeHudRendering),
       resignAction: selected(capabilities.resignAction),
       whisperChat: selected(capabilities.whisperChat),
       playRegionObservation: selected(capabilities.playRegionObservation),
@@ -94,6 +95,7 @@ describe("effective Enhancement capability boundary", () => {
           playerEffectObservation: off,
           effectIconGeometry: off,
           alcoholObservation: off,
+          nativeHudRendering: off,
           resignAction: off,
           whisperChat: off,
           playRegionObservation: off,
@@ -118,6 +120,7 @@ describe("effective Enhancement capability boundary", () => {
       playerEffectObservation: false,
       effectIconGeometry: false,
       alcoholObservation: false,
+      nativeHudRendering: false,
       resignAction: false,
       whisperChat: false,
       playRegionObservation: false,
diff --git a/tests/unit/enhancement-client-chain.test.ts b/tests/unit/enhancement-client-chain.test.ts
index c90644a4..efb78c10 100644
--- a/tests/unit/enhancement-client-chain.test.ts
+++ b/tests/unit/enhancement-client-chain.test.ts
@@ -35,6 +35,7 @@ const NO_CAPABILITIES = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -95,6 +96,7 @@ describe("Enhancement client chain", () => {
         playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
       },
diff --git a/tests/unit/enhancement-command-transform.test.ts b/tests/unit/enhancement-command-transform.test.ts
index f9e019e2..b9270482 100644
--- a/tests/unit/enhancement-command-transform.test.ts
+++ b/tests/unit/enhancement-command-transform.test.ts
@@ -257,6 +257,7 @@ describe("Enhancement command transform", () => {
       playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
     } as const;
diff --git a/tests/unit/enhancement-skill-transform.test.ts b/tests/unit/enhancement-skill-transform.test.ts
index 347d0508..ad9d9266 100644
--- a/tests/unit/enhancement-skill-transform.test.ts
+++ b/tests/unit/enhancement-skill-transform.test.ts
@@ -23,6 +23,7 @@ const capabilities: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
diff --git a/tests/unit/enhancement-transform.test.ts b/tests/unit/enhancement-transform.test.ts
index 6dd6ecb6..27a43c89 100644
--- a/tests/unit/enhancement-transform.test.ts
+++ b/tests/unit/enhancement-transform.test.ts
@@ -56,6 +56,7 @@ const PARTY_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -78,6 +79,7 @@ const EFFECT_ONLY: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: true,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
 });
@@ -341,6 +343,7 @@ describe("targeted Enhancement WebAssembly transform", () => {
           playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
         },
diff --git a/tests/unit/enhancements-are-derived-from-their-registry.test.ts b/tests/unit/enhancements-are-derived-from-their-registry.test.ts
index 93ba81bf..470c35e0 100644
--- a/tests/unit/enhancements-are-derived-from-their-registry.test.ts
+++ b/tests/unit/enhancements-are-derived-from-their-registry.test.ts
@@ -118,26 +118,26 @@ test("one capability plan derives hooks without losing feature identity", () =>
   ]) {
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "cursor-observer"),
-      { nativeCursor: true, targetObservation: false, partyObservation: false, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: false, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, alcoholObservation: false, resignAction: false, whisperChat: false },
+      { nativeCursor: true, targetObservation: false, partyObservation: false, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: false, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, nativeHudRendering: false, alcoholObservation: false, resignAction: false, whisperChat: false },
     );
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "target-observer"),
-      { nativeCursor: false, targetObservation: true, partyObservation: false, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, alcoholObservation: false, resignAction: false, whisperChat: false },
+      { nativeCursor: false, targetObservation: true, partyObservation: false, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, nativeHudRendering: false, alcoholObservation: false, resignAction: false, whisperChat: false },
     );
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "toolbox-foundation"),
-      { nativeCursor: false, targetObservation: false, partyObservation: true, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: true, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, alcoholObservation: false, resignAction: false, whisperChat: false },
+      { nativeCursor: false, targetObservation: false, partyObservation: true, teamApply: false, travelAction: false, xunlaiAction: false, chatAliases: false, skillSlotGeometry: true, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, nativeHudRendering: false, alcoholObservation: false, resignAction: false, whisperChat: false },
     );
     // The read foundation and the write program differ by exactly this bit,
     // and no saved setting reaches the second: choosing the panel can never
     // carry the ability to send a packet in with it.
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "toolbox-commands"),
-      { nativeCursor: false, targetObservation: false, partyObservation: true, teamApply: true, travelAction: true, xunlaiAction: true, chatAliases: true, skillSlotGeometry: true, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, alcoholObservation: false, resignAction: false, whisperChat: false },
+      { nativeCursor: false, targetObservation: false, partyObservation: true, teamApply: true, travelAction: true, xunlaiAction: true, chatAliases: true, skillSlotGeometry: true, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, nativeHudRendering: false, alcoholObservation: false, resignAction: false, whisperChat: false },
     );
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "xunlai-storage"),
-      { nativeCursor: false, targetObservation: false, partyObservation: false, teamApply: false, travelAction: true, xunlaiAction: true, chatAliases: true, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, alcoholObservation: false, resignAction: false, whisperChat: false },
+      { nativeCursor: false, targetObservation: false, partyObservation: false, teamApply: false, travelAction: true, xunlaiAction: true, chatAliases: true, skillSlotGeometry: false, skillCooldownObservation: false, playRegionObservation: true, preGameControls: false, characterSwitchAction: false, chatFiltering: false, quickItemMove: false, playerEffectObservation: false, effectIconGeometry: false, nativeHudRendering: false, alcoholObservation: false, resignAction: false, whisperChat: false },
     );
     assert.deepEqual(
       enhancementCapabilitiesFor(selection, "effect-observer"),
@@ -157,7 +157,7 @@ test("one capability plan derives hooks without losing feature identity", () =>
         chatFiltering: false,
         quickItemMove: false,
         playerEffectObservation: true,
-        effectIconGeometry: true,
+        effectIconGeometry: true, nativeHudRendering: false,
         alcoholObservation: false,
         resignAction: false,
         whisperChat: false,
@@ -169,7 +169,7 @@ test("one capability plan derives hooks without losing feature identity", () =>
 test("launch intent resolves to the canonical frozen capability profiles", () => {
   const cases = [
     [{ nativeCursor: true, tools: false }, "none", "features-e01"],
-    [{ nativeCursor: true, tools: true }, "none", "features-7ffff"],
+    [{ nativeCursor: true, tools: true }, "none", "features-fffff"],
     [{ nativeCursor: false, tools: false }, "cursor-observer", "features-01"],
     [{ nativeCursor: true, tools: false }, "target-observer", "features-202"],
     [{ nativeCursor: false, tools: false }, "toolbox-foundation", "features-284"],
@@ -217,6 +217,7 @@ test("the capability wire contract is exact and has one empty value", () => {
     quickItemMove: true,
     playerEffectObservation: true,
     effectIconGeometry: true,
+    nativeHudRendering: true,
     alcoholObservation: true,
     resignAction: true,
     whisperChat: true,
@@ -253,7 +254,7 @@ test("the capability wire contract is exact and has one empty value", () => {
     characterSwitchAction: false,
     quickItemMove: false,
     playerEffectObservation: false,
-    effectIconGeometry: false,
+    effectIconGeometry: false, nativeHudRendering: false,
     alcoholObservation: false,
     resignAction: false,
     whisperChat: false,
@@ -336,6 +337,7 @@ test("renderer consumes main's effective subset instead of launch intent", () =>
         playerEffectObservation: { status: "off" },
         effectIconGeometry: { status: "off" },
         alcoholObservation: { status: "off" },
+        nativeHudRendering: { status: "off" },
         resignAction: { status: "off" },
         whisperChat: { status: "off" },
       },
diff --git a/tests/unit/feature-contracts.test.ts b/tests/unit/feature-contracts.test.ts
index ce13cc6c..d9f8c70f 100644
--- a/tests/unit/feature-contracts.test.ts
+++ b/tests/unit/feature-contracts.test.ts
@@ -157,12 +157,13 @@ test("the capability registry is the ordered wire vocabulary", () => {
       hooks: ["ui"],
     },
     { id: "alcoholObservation", requiresAll: ["effectIconGeometry"], requiresAny: [], configOwners: [], hooks: ["ui"] },
+    { id: "nativeHudRendering", requiresAll: [], requiresAny: ["skillSlotGeometry", "effectIconGeometry"], configOwners: [], hooks: [] },
   ]);
   assert.deepEqual(
     ENHANCEMENT_CAPABILITY_CONTRACTS.map(({ id }) => id),
     ENHANCEMENT_CAPABILITY_FIELDS,
   );
-  assert.equal(new Set(ENHANCEMENT_CAPABILITY_FIELDS).size, 19);
+  assert.equal(new Set(ENHANCEMENT_CAPABILITY_FIELDS).size, 20);
   for (const contract of ENHANCEMENT_CAPABILITY_CONTRACTS) {
     assert.equal(Object.isFrozen(contract), true, contract.id);
     assert.equal(Object.isFrozen(contract.requiresAll), true, contract.id);
diff --git a/tests/unit/local-client-verifier.test.ts b/tests/unit/local-client-verifier.test.ts
index 00ca9234..6e51ec11 100644
--- a/tests/unit/local-client-verifier.test.ts
+++ b/tests/unit/local-client-verifier.test.ts
@@ -32,6 +32,7 @@ const NONE: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: false,
@@ -54,6 +55,7 @@ const ALL: EnhancementCapabilities = Object.freeze({
   playerEffectObservation: false,
     effectIconGeometry: false,
     alcoholObservation: false,
+    nativeHudRendering: false,
     resignAction: false,
     whisperChat: false,
   playRegionObservation: true,
diff --git a/tests/unit/native-hud.test.ts b/tests/unit/native-hud.test.ts
new file mode 100644
index 00000000..7e93aba4
--- /dev/null
+++ b/tests/unit/native-hud.test.ts
@@ -0,0 +1,199 @@
+/** Verifies native HUD joins, atlas reuse and lifecycle without mounting browser overlays. */
+import assert from "node:assert/strict";
+import test from "node:test";
+import { createNativeHudLayer, type NativeHudChannel, type NativeHudItem, type NativeHudLayer } from "../../src/renderer/native-hud-layer.js";
+import { createSkillKeyOverlayConsumer } from "../../src/renderer/skill-key-overlay-consumer.js";
+import { createSkillCooldownOverlayConsumer } from "../../src/renderer/skill-cooldown-overlay-consumer.js";
+import { createEffectTimerOverlayConsumer } from "../../src/renderer/effect-timer-overlay-consumer.js";
+import { EMPTY_SKILL_KEY_MODIFIERS } from "../../src/shared/skill-key-bindings.js";
+import { skillKeyPlateLayout } from "../../src/renderer/skill-key-artwork.js";
+import { NATIVE_HUD_MAGIC, NATIVE_HUD_HEADER as HEADER, NATIVE_HUD_KEYCAP } from "../../src/shared/native-hud.js";
+
+const geometry = {status: "ready" as const, sequence: 2, frameId: 43, viewportWidth: 800, viewportHeight: 600,
+  slots: Array.from({length: 8}, (_, n) => ({left: 100 + n * 50, bottom: 20, right: 148 + n * 50, top: 68}))};
+function peer() {
+  const view = new EventTarget();
+  const document = {defaultView: view};
+  const parent = {ownerDocument: document} as unknown as HTMLElement;
+  const canvas = {getBoundingClientRect: () => ({left: 0, top: 0, width: 800, height: 600})} as HTMLCanvasElement;
+  const output = new Map<NativeHudChannel, readonly (NativeHudItem | null)[]>();
+  const hud: NativeHudLayer = {update: (channel, items) => { output.set(channel, items); }, dispose() {}};
+  return {view, parent, canvas, output, hud};
+}
+test("skill consumers preserve slot identity, formatting, color and independent enablement", () => {
+  const {parent, canvas, output, hud} = peer();
+  const keys = createSkillKeyOverlayConsumer(parent, canvas, hud);
+  const cooldowns = createSkillCooldownOverlayConsumer(parent, canvas, hud);
+  keys.update(geometry); cooldowns.update(geometry);
+  keys.setBindings([null, null, null, null, null, null, null, {input: {kind: "keyboard", code: "KeyX"}, modifiers: {...EMPTY_SKILL_KEY_MODIFIERS, command: true, shift: true}}]);
+  keys.setEnabled(true);
+  assert.equal(output.get("keys")?.[7]?.child, 7);
+  assert.equal(output.get("keys")?.[7]?.parent, 43);
+  assert.deepEqual(output.get("keys")?.map(item => item?.binding?.input), Array.from({length: 8}, (_, n) => ({kind: "keyboard", code: n === 7 ? "KeyX" : `Digit${n + 1}`})));
+  assert.equal(output.get("keys")?.[7]?.binding?.modifiers.command, true);
+  assert.equal(output.get("keys")?.[7]?.binding?.modifiers.shift, true);
+  assert.equal(output.get("keys")?.filter(Boolean).length, 8);
+  cooldowns.sync({kind: "custom", value: "#abcdef"}, true);
+  const state = {status: "ready" as const, sequence: 2, generation: 1, gameTimer: 10000, playerAgentId: 7,
+    rechargeTimestamps: [12899, 24001, 0, 0, 0, 0, 0, 10400]};
+  cooldowns.setCooldownState(state);
+  assert.deepEqual(output.get("cooldowns")?.map((item) => item?.text ?? ""), ["2.9", "15", "", "", "", "", "", "0.4"]);
+  assert.equal(output.get("cooldowns")?.[0]?.color, "#abcdef");
+  const before = output.get("cooldowns"); cooldowns.setCooldownState({...state, sequence: 4, gameTimer: 10000});
+  assert.equal(output.get("cooldowns"), before, "unobservable timer changes do not publish labels");
+  cooldowns.update({status: "waiting", reason: "memory"}); assert.deepEqual(output.get("cooldowns"), []);
+  assert.ok(output.get("keys")?.[7]);
+  keys.dispose(); cooldowns.dispose(); assert.deepEqual(output.get("keys"), []);
+});
+test("effect consumers keep only finite player durations and withdraw on stale geometry", () => {
+  const {parent, canvas, output, hud} = peer();
+  const consumer = createEffectTimerOverlayConsumer(parent, canvas, hud);
+  consumer.setEnabled(true);
+  consumer.setGeometry({status: "ready", sequence: 2, generation: 1, frameId: 55, viewportWidth: 800, viewportHeight: 600,
+    anchor: {left: 100, bottom: 100, right: 132, top: 132},
+    icons: [{skillId: 10, left: 100, bottom: 100, right: 132, top: 132}]});
+  consumer.setEffects({status: "ready", sequence: 2, generation: 1, gameTimer: 1000, playerAgentId: 7,
+    effects: [{effectId: 1, skillId: 10, attributeLevel: 1, maintainerAgentId: 7, durationMs: 2400, appliedAtGameMs: 0}]});
+  assert.equal(output.get("effects")?.[0]?.child, 14); assert.equal(output.get("effects")?.[0]?.text, "1.4");
+  assert.equal(output.get("effects")?.[0]?.color, "#c86c65");
+  consumer.setGeometry({status: "waiting", reason: "memory"}); assert.deepEqual(output.get("effects"), []);
+  consumer.dispose();
+});
+
+test("all HUDs share cached artwork; countdowns, urgency and resize upload only glyph quads", async () => {
+  const context = {save() {}, restore() {}, translate() {}, clearRect() {}, beginPath() {}, moveTo() {}, lineTo() {}, quadraticCurveTo() {}, roundRect() {}, fill() {}, stroke() {}, fillRect() {}, strokeText() {}, fillText() {},
+    createLinearGradient: () => ({addColorStop() {}}), measureText: (text: string) => ({width: text === "1" ? 12 : text === "7" ? 22 : text.length * 28,
+      actualBoundingBoxLeft: text === "7" ? -3 : -1,
+      actualBoundingBoxRight: text === "1" ? 10 : text === "7" ? 18 : text.length * 26,
+      actualBoundingBoxAscent: text === "1" ? 31 : 33, actualBoundingBoxDescent: 0}),
+    getImageData: () => ({data: new Uint8ClampedArray(1024 * 1024 * 4)})};
+  const canvas = {width: 0, height: 0, getContext: () => context};
+  const view = new EventTarget();
+  const document = {defaultView: view, createElement(tag: string) { assert.equal(tag, "canvas"); return canvas; }} as unknown as Document;
+  const memory = new WebAssembly.Memory({initial: 80});
+  let uploads = 0, publications = 0, resets = 0, allocated = 0, freed = 0;
+  const labels = new Map<number, number>();
+  const positions = new Map<number, number[]>();
+  const layer = createNativeHudLayer({memory,
+    malloc: () => { allocated++; return 1024; }, free: () => { freed++; },
+    gwonmac_hud_reset: () => { resets++; },
+    gwonmac_hud_atlas: () => { uploads++; return 1; },
+    gwonmac_hud_label: (region: number, bytes: number) => {
+      const v = new DataView(memory.buffer, region, bytes);
+      assert.equal(v.getUint32(0, true), NATIVE_HUD_MAGIC); assert.equal(v.getUint32(4, true), bytes);
+      const count = v.getUint32(20, true); labels.set(v.getUint32(8, true), count);
+      const flags = v.getUint32(24, true);
+      if (count > (flags ? 1 : 0)) positions.set(v.getUint32(8, true), [0, 4, 8, 12].map(at => v.getFloat32(HEADER + (flags ? 32 : 0) + at, true)));
+      for (let at = HEADER; at < bytes; at += 4) { const value = v.getFloat32(at, true); assert.ok(Number.isFinite(value) && value >= 0 && value <= 1, `${at}: ${value}`); }
+      if (flags === NATIVE_HUD_KEYCAP && count >= 1) {
+        assert.ok(Math.abs(v.getFloat32(HEADER, true) + v.getFloat32(HEADER + 8, true) - 55 / 56) < 1e-6, "key plate hugs the right corner");
+        assert.ok(Math.abs(v.getFloat32(HEADER + 4, true) + v.getFloat32(HEADER + 12, true) - 55 / 56) < 1e-6, "key plate hugs the bottom corner");
+      }
+      publications++; return 1;
+    },
+  }, document);
+  const item = {parent: 43, child: 0, width: 64, height: 64, text: "15", color: "#abcdef"};
+  layer.update("cooldowns", [item]);
+  layer.update("keys", [{...item, binding: {input: {kind: "keyboard", code: "Digit1"}, modifiers: EMPTY_SKILL_KEY_MODIFIERS}}]);
+  layer.update("effects", [{...item, parent: 55, child: 14, text: "5.1", color: "#eadcc2"}]);
+  await Promise.resolve(); await Promise.resolve();
+  assert.equal(uploads, 1); assert.equal(labels.get(0), 3, "one combined keycap and two-digit timer publication"); assert.equal(labels.get(8), 3);
+  for (const size of [24, 32, 48, 64, 96]) {
+    layer.update("effects", [{...item, parent: 55, child: 14, width: size, height: size, text: "11", color: "#eadcc2"}]);
+    const [, top, , height] = positions.get(8)!;
+    assert.ok(top! >= 0 && top! + height! <= .840001, "effect number stays inside artwork above the duration strip at every scale");
+  }
+  const before = publications;
+  layer.update("cooldowns", [item]); assert.equal(publications, before);
+  layer.update("cooldowns", [{...item, text: "2.9"}]);
+  layer.update("effects", [{...item, parent: 55, child: 14, text: "1.9", color: "#c86c65"}]);
+  layer.update("cooldowns", [{...item, text: "2.8", width: 128, height: 128}]);
+  assert.equal(uploads, 1);
+  layer.update("effects", []); assert.equal(labels.get(8), 0);
+  layer.update("effects", [{...item, parent: 55, child: 14, text: "4.2", color: "#e5ad52"}]);
+  assert.equal(uploads, 1, "urgency sprites remain cached after expiry");
+  const digitPositions: number[][] = [];
+  for (const text of ["1", "7", "8", "6", "9"]) {
+    layer.update("cooldowns", [{...item, text}]);
+    digitPositions.push(positions.get(0)!);
+  }
+  for (const position of digitPositions) assert.deepEqual(position, digitPositions[0], "proportional font digits share a fixed cell and anchor");
+  assert.equal(uploads, 1, "digit changes still reuse the atlas");
+  layer.update("cooldowns", []); assert.equal(labels.get(0), 1, "expiry keeps the keycap in its existing composition");
+  layer.update("cooldowns", [{...item, text: "9"}]); assert.equal(labels.get(0), 2);
+  layer.update("keys", []); assert.equal(labels.get(0), 1, "disabling shortcuts preserves the timer");
+  layer.update("keys", [{...item, binding: {input: {kind: "keyboard", code: "Digit1"}, modifiers: EMPTY_SKILL_KEY_MODIFIERS}}]);
+  assert.equal(labels.get(0), 2);
+  layer.update("cooldowns", [{...item, parent: 99, text: "8"}]);
+  assert.equal(labels.get(0), 1, "different icon generations must not be merged");
+  view.dispatchEvent(new Event("gw:graphics-context-reset")); assert.equal(uploads, 2);
+  layer.dispose(); layer.dispose(); assert.equal(resets, 2); assert.equal(allocated, freed); assert.equal(canvas.width, 0);
+  layer.update("keys", []); assert.equal(allocated, freed);
+});
+
+
+test("keycaps retain stock proportions and corner position at every interface scale", () => {
+  for (const icon of [28, 35, 48, 56, 64, 84, 112, 168]) {
+    for (const artwork of [62, 138, 240]) {
+      const layout = skillKeyPlateLayout(icon, icon, artwork);
+      assert.equal(layout.inset / icon, 1 / 56);
+      assert.ok(Math.abs(layout.width / layout.height - artwork / 64) < 1e-9);
+      assert.ok(layout.width + 2 * layout.inset <= icon + 1e-9);
+      if (artwork <= 138) assert.ok(Math.abs(layout.height / icon - 17 / 56) < 1e-9);
+    }
+  }
+});
+
+
+for (const addressBase of [0, 0x80000000]) test(`inactive HUDs allocate nothing and atlas repacks withdraw removed native labels at ${addressBase}`, async () => {
+  let canvases = 0, uploads = 0, frees = 0, allocations = 0;
+  const memory = new WebAssembly.Memory({initial: addressBase / 65536 + 80});
+  const records = new Map<number, number>();
+  const context = {save() {}, restore() {}, translate() {}, clearRect() {}, strokeText() {}, fillText() {},
+    measureText: () => ({width: 28}), getImageData: () => ({data: new Uint8ClampedArray(1024 * 1024 * 4)})};
+  const document = {defaultView: new EventTarget(), createElement() {
+    canvases++; return {width: 0, height: 0, getContext: () => context};
+  }} as unknown as Document;
+  const layer = createNativeHudLayer({memory,
+    malloc() { allocations++; return (addressBase + 1024) | 0; },
+    free(region: number) { assert.equal(region, addressBase + 1024); frees++; },
+    gwonmac_hud_atlas() { uploads++; return 1; },
+    gwonmac_hud_reset() { records.clear(); },
+    gwonmac_hud_label(region: number) {
+      const view = new DataView(memory.buffer, region);
+      records.set(view.getUint32(8, true), view.getUint32(20, true)); return 1;
+    },
+  }, document);
+  await Promise.resolve(); await Promise.resolve();
+  layer.update("keys", []); layer.update("cooldowns", []); layer.update("effects", []);
+  assert.deepEqual({canvases, uploads, allocations}, {canvases: 0, uploads: 0, allocations: 0});
+  const item = {parent: 43, child: 0, width: 56, height: 56, text: "15", color: "#abcdef"};
+  layer.update("cooldowns", [item, {...item, child: 1, text: "9"}]);
+  assert.equal(records.get(1), 1);
+  // A new color repacks the atlas in the same update that slot 1 expires.
+  layer.update("cooldowns", [{...item, color: "#123456"}, null]);
+  assert.equal(uploads, 2);
+  assert.equal(records.get(1), 0, "repacking must not forget a previously published slot");
+  layer.update("cooldowns", []);
+  layer.update("cooldowns", [{...item, color: "#123456"}]);
+  assert.equal(uploads, 2, "a short idle gap retains the existing atlas");
+  assert.equal(canvases, 1);
+  layer.dispose();
+  assert.equal(allocations, frees);
+});
+
+
+test("a failed native reset still releases HUD listeners and diagnostic ownership", () => {
+  const view = new EventTarget() as EventTarget & {gwNativeHudStats?: unknown};
+  const document = {defaultView: view} as unknown as Document;
+  let resets = 0;
+  const layer = createNativeHudLayer({gwonmac_hud_reset() {
+    resets++; throw new Error("graphics context unavailable");
+  }}, document);
+  assert.equal(typeof view.gwNativeHudStats, "function");
+  assert.throws(() => layer.dispose(), /graphics context unavailable/);
+  assert.equal(view.gwNativeHudStats, undefined);
+  layer.dispose();
+  view.dispatchEvent(new Event("gw:graphics-context-reset"));
+  assert.equal(resets, 1);
+});
diff --git a/tests/unit/renderer-client-sessions.test.ts b/tests/unit/renderer-client-sessions.test.ts
index 0c9c9be1..03ac5017 100644
--- a/tests/unit/renderer-client-sessions.test.ts
+++ b/tests/unit/renderer-client-sessions.test.ts
@@ -23,6 +23,7 @@ const base: ClientSession = {
       playerEffectObservation: { status: "off" },
       effectIconGeometry: { status: "off" },
         alcoholObservation: { status: "off" },
+      nativeHudRendering: { status: "off" },
       resignAction: { status: "off" },
         whisperChat: { status: "off" },
       playRegionObservation: { status: "off" },
diff --git a/tests/unit/skill-cooldown-overlay.test.ts b/tests/unit/skill-cooldown-overlay.test.ts
deleted file mode 100644
index ad18ab2e..00000000
--- a/tests/unit/skill-cooldown-overlay.test.ts
+++ /dev/null
@@ -1,220 +0,0 @@
-import assert from "node:assert/strict";
-import test from "node:test";
-import { createSkillCooldownOverlayConsumer } from "../../src/renderer/skill-cooldown-overlay-consumer.js";
-import { createSkillCooldownOverlay } from "../../src/renderer/skill-cooldown-overlay.js";
-
-class FakeStyle {
-  cssText = "";
-  display = "";
-  values = new Map<string, string>();
-  setProperty(name: string, value: string) { this.values.set(name, value); }
-}
-class FakeElement {
-  id = "";
-  className = "";
-  hidden = false;
-  textContent = "";
-  style = new FakeStyle();
-  dataset: Record<string, string> = {};
-  children: FakeElement[] = [];
-  parent: FakeElement | null = null;
-  attributes = new Map<string, string>();
-  ownerDocument: FakeDocument;
-  classList = { add: (...names: string[]) => { this.className += ` ${names.join(" ")}`; } };
-  constructor(ownerDocument: FakeDocument) { this.ownerDocument = ownerDocument; }
-  setAttribute(name: string, value: string) { this.attributes.set(name, value); }
-  append(...children: FakeElement[]) {
-    for (const child of children) { child.parent = this; this.children.push(child); }
-  }
-  remove() {
-    if (this.parent) this.parent.children.splice(this.parent.children.indexOf(this), 1);
-  }
-}
-class FakeDocument {
-  head = new FakeElement(this);
-  defaultView = new FakeWindow();
-  createElement() { return new FakeElement(this); }
-  getElementById(id: string) { return this.head.children.find((child) => child.id === id) ?? null; }
-}
-class FakeWindow {
-  private listeners = new Map<string, Set<() => void>>();
-  addEventListener(type: string, listener: () => void) {
-    const listeners = this.listeners.get(type) ?? new Set();
-    listeners.add(listener);
-    this.listeners.set(type, listeners);
-  }
-  removeEventListener(type: string, listener: () => void) {
-    this.listeners.get(type)?.delete(listener);
-  }
-  dispatch(type: string) {
-    for (const listener of this.listeners.get(type) ?? []) listener();
-  }
-}
-
-const textOf = (element: FakeElement): string =>
-  element.textContent + element.children.map(textOf).join("");
-
-const geometry = (sequence = 2) => ({
-  status: "ready" as const,
-  sequence,
-  frameId: 4,
-  viewportWidth: 800,
-  viewportHeight: 600,
-  slots: Array.from({ length: 8 }, (_, index) => ({
-    left: 100 + index * 50,
-    bottom: 20,
-    right: 148 + index * 50,
-    top: 68,
-  })),
-});
-
-test("the presentation joins complete geometry and cooldown state without touching keys", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const canvas = {
-    getBoundingClientRect: () => ({ left: 10, top: 20, width: 800, height: 600 }),
-  } as HTMLCanvasElement;
-  const consumer = createSkillCooldownOverlayConsumer(body as unknown as HTMLElement, canvas);
-  consumer.sync({ kind: "preset", preset: "red" }, true);
-  consumer.update(geometry());
-  consumer.setCooldownState({
-    status: "ready",
-    sequence: 2,
-    generation: 1,
-    gameTimer: 10_000,
-    playerAgentId: 7,
-    rechargeTimestamps: [12_899, 24_001, 0, 0, 0, 0, 0, 10_400],
-  });
-  const root = body.children[0]!;
-  assert.equal(root.id, "skill-cooldown-overlay");
-  assert.equal(root.style.display, "block");
-  assert.equal(root.attributes.get("aria-hidden"), "true");
-  assert.match(root.style.cssText, /pointer-events:none/u);
-  assert.deepEqual(root.children.map(textOf), ["2.9", "15", "", "", "", "", "", "0.4"]);
-  assert.match(root.children[0]!.style.cssText, /left:110px;top:552px;width:48px;height:48px/u);
-  assert.equal(root.children[0]!.children[0]!.style.values.get("--skill-cooldown-slot-height"), "48px");
-});
-
-test("ready skills, stale state, disabled Tools, and incomplete publications hide everything", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const consumer = createSkillCooldownOverlayConsumer(
-    body as unknown as HTMLElement,
-    { getBoundingClientRect: () => ({ left: 0, top: 0, width: 800, height: 600 }) } as HTMLCanvasElement,
-  );
-  consumer.sync({ kind: "custom", value: "#abcdef" }, true);
-  consumer.update(geometry());
-  consumer.setCooldownState({
-    status: "ready",
-    sequence: 2,
-    generation: 1,
-    gameTimer: 10_000,
-    playerAgentId: 7,
-    rechargeTimestamps: [0, 0, 0, 0, 0, 0, 0, 0],
-  });
-  const root = body.children[0]!;
-  assert.equal(root.style.display, "none");
-  consumer.setCooldownState({ status: "waiting", reason: "loading" });
-  assert.equal(root.style.display, "none");
-  consumer.sync({ kind: "custom", value: "#abcdef" }, false);
-  consumer.setCooldownState({
-    status: "ready",
-    sequence: 4,
-    generation: 1,
-    gameTimer: 10_000,
-    playerAgentId: 7,
-    rechargeTimestamps: [11_000, 0, 0, 0, 0, 0, 0, 0],
-  });
-  assert.equal(root.style.display, "none");
-});
-
-test("sub-frame timer changes that keep the same label cause no presentation update", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const overlay = createSkillCooldownOverlay(body as unknown as HTMLElement);
-  const slots = Array.from({ length: 8 }, (_, index) => ({
-    x: index * 50,
-    y: 0,
-    width: 48,
-    height: 48,
-    remainingMs: index === 0 ? 2_899 : 0,
-  }));
-  overlay.update(slots, { kind: "preset", preset: "red" });
-  const signature = overlay.state.signature;
-  overlay.update(
-    slots.map((slot, index) => ({ ...slot, remainingMs: index === 0 ? 2_850 : 0 })),
-    { kind: "preset", preset: "red" },
-  );
-  assert.equal(overlay.state.signature, signature);
-});
-
-test("equal cooldown labels skip projection while resize refreshes it", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  let left = 10;
-  let reads = 0;
-  const consumer = createSkillCooldownOverlayConsumer(
-    body as unknown as HTMLElement,
-    {
-      getBoundingClientRect: () => {
-        reads += 1;
-        return { left, top: 20, width: 800, height: 600 };
-      },
-    } as HTMLCanvasElement,
-  );
-  consumer.sync({ kind: "preset", preset: "red" }, true);
-  consumer.update(geometry());
-  consumer.setCooldownState({
-    status: "ready",
-    sequence: 2,
-    generation: 1,
-    gameTimer: 10_000,
-    playerAgentId: 7,
-    rechargeTimestamps: [23_999, 0, 0, 0, 0, 0, 0, 0],
-  });
-  assert.equal(reads, 1);
-
-  consumer.setCooldownState({
-    status: "ready",
-    sequence: 4,
-    generation: 1,
-    gameTimer: 10_050,
-    playerAgentId: 7,
-    rechargeTimestamps: [23_999, 0, 0, 0, 0, 0, 0, 0],
-  });
-  assert.equal(reads, 1, "the still-visible 14-second label does not project again");
-
-  left = 30;
-  document.defaultView.dispatch("resize");
-  assert.equal(reads, 2);
-  assert.match(body.children[0]!.children[0]!.style.cssText, /left:130px/u);
-  consumer.dispose();
-});
-
-test("either accepted feed withdrawing hides the complete cooldown HUD", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const consumer = createSkillCooldownOverlayConsumer(
-    body as unknown as HTMLElement,
-    { getBoundingClientRect: () => ({ left: 0, top: 0, width: 800, height: 600 }) } as HTMLCanvasElement,
-  );
-  const cooldowns = {
-    status: "ready" as const,
-    sequence: 2,
-    generation: 1,
-    gameTimer: 10_000,
-    playerAgentId: 7,
-    rechargeTimestamps: [11_000, 0, 0, 0, 0, 0, 0, 0],
-  };
-  consumer.sync({ kind: "preset", preset: "red" }, true);
-  consumer.update(geometry());
-  consumer.setCooldownState(cooldowns);
-  const root = body.children[0]!;
-  assert.equal(root.style.display, "block");
-  consumer.setCooldownState({ status: "waiting", reason: "stale" });
-  assert.equal(root.style.display, "none");
-  consumer.update(geometry(4));
-  assert.equal(root.style.display, "none", "fresh geometry cannot mask withdrawn recharge state");
-  consumer.setCooldownState({ ...cooldowns, sequence: 4, gameTimer: 10_100 });
-  assert.equal(root.style.display, "block");
-});
diff --git a/tests/unit/skill-key-overlay.test.ts b/tests/unit/skill-key-overlay.test.ts
deleted file mode 100644
index 8103cd09..00000000
--- a/tests/unit/skill-key-overlay.test.ts
+++ /dev/null
@@ -1,346 +0,0 @@
-import assert from "node:assert/strict";
-import test from "node:test";
-import {
-  createSkillKeyOverlay,
-  skillKeyOverlayProjection,
-  type SkillKeySlot,
-} from "../../src/renderer/skill-key-overlay.js";
-import { createSkillKeyOverlayConsumer } from "../../src/renderer/skill-key-overlay-consumer.js";
-import { createCompanionSequenceFeed } from "../../src/renderer/companion-sequence-feed.js";
-import {
-  sameCompanionSkillSlotGeometry,
-  type CompanionSkillSlotState,
-} from "../../src/renderer/companion-skill-snapshot.js";
-
-class FakeElement {
-  id = "";
-  className = "";
-  hidden = false;
-  title = "";
-  textContent = "";
-  textWrites = 0;
-  style = { cssText: "", display: "" };
-  attributes = new Map<string, string>();
-  dataset: Record<string, string> = {};
-  children: FakeElement[] = [];
-  parent: FakeElement | null = null;
-  ownerDocument: FakeDocument;
-  classList = { add: (...names: string[]) => { this.className += ` ${names.join(" ")}`; } };
-
-  constructor(ownerDocument: FakeDocument) {
-    this.ownerDocument = ownerDocument;
-    return new Proxy(this, {
-      set(target, key, value) {
-        if (key === "textContent") target.textWrites += 1;
-        return Reflect.set(target, key, value);
-      },
-    });
-  }
-
-  setAttribute(name: string, value: string) {
-    this.attributes.set(name, value);
-  }
-
-  append(...children: FakeElement[]) {
-    for (const child of children) {
-      child.parent = this;
-      this.children.push(child);
-    }
-  }
-
-  replaceChildren(...children: FakeElement[]) {
-    this.children = [];
-    this.append(...children);
-  }
-
-  remove() {
-    const siblings = this.parent?.children;
-    if (siblings) siblings.splice(siblings.indexOf(this), 1);
-    this.parent = null;
-  }
-}
-
-class FakeDocument {
-  head: FakeElement;
-  defaultView = new FakeWindow();
-
-  constructor() {
-    this.head = new FakeElement(this);
-  }
-
-  createElement() {
-    return new FakeElement(this);
-  }
-
-  createElementNS() {
-    return new FakeElement(this);
-  }
-
-  getElementById(id: string) {
-    return this.head.children.find((child) => child.id === id) ?? null;
-  }
-}
-
-class FakeWindow {
-  private listeners = new Map<string, Set<() => void>>();
-  addEventListener(type: string, listener: () => void) {
-    const listeners = this.listeners.get(type) ?? new Set();
-    listeners.add(listener);
-    this.listeners.set(type, listeners);
-  }
-  removeEventListener(type: string, listener: () => void) {
-    this.listeners.get(type)?.delete(listener);
-  }
-  dispatch(type: string) {
-    for (const listener of this.listeners.get(type) ?? []) listener();
-  }
-}
-
-const slots = (): readonly SkillKeySlot[] => Object.freeze(
-  [Object.freeze({
-    x: 464,
-    y: 320,
-    width: 50,
-    height: 50,
-    binding: {
-      input: { kind: "keyboard" as const, code: "KeyC" },
-      modifiers: { control: false, option: false, shift: false, command: false },
-    },
-  })],
-);
-
-function mount() {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const overlay = createSkillKeyOverlay(body as unknown as HTMLElement);
-  const root = body.children[0]!;
-  return { body, overlay, root };
-}
-
-const textOf = (element: FakeElement | undefined): string | undefined =>
-  element === undefined
-    ? undefined
-    : element.textContent + element.children.map((child) => textOf(child) ?? "").join("");
-
-const textWritesOf = (element: FakeElement | undefined): number =>
-  element === undefined
-    ? 0
-    : element.textWrites
-      + element.children.reduce((total, child) => total + textWritesOf(child), 0);
-
-test("a custom projection adds only the changed key label", () => {
-  const view = mount();
-  view.overlay.update({ status: "ready", slots: slots() });
-  assert.equal(view.root.style.display, "block");
-  assert.equal(view.root.children.length, 8);
-  assert.deepEqual(
-    view.root.children.map((slot) => textOf(slot.children[0]?.children.at(-1))),
-    ["C", undefined, undefined, undefined, undefined, undefined, undefined, undefined],
-  );
-  assert.match(view.root.children[0]!.style.cssText, /left:464px;top:320px/u);
-  assert.match(view.root.children[0]!.children[0]!.style.cssText, /--skill-key-edge:17px/u);
-  assert.match(view.root.children[1]!.style.cssText, /display:none/u);
-});
-
-test("a malformed or absent custom binding hides the complete overlay", () => {
-  const good = slots();
-  for (const bad of [
-    [],
-    [{ ...good[0]!, x: Number.NaN }],
-    [{ ...good[0]!, width: 0 }],
-    [{ ...good[0]!, binding: null }],
-    [{ ...good[0]!, binding: { input: { kind: "keyboard", code: "Unknown" }, modifiers: {} } }],
-  ]) {
-    assert.equal(skillKeyOverlayProjection({ status: "ready", slots: bad }), null);
-  }
-  const view = mount();
-  view.overlay.update({ status: "ready", slots: good });
-  view.overlay.update({ status: "waiting", slots: good });
-  assert.equal(view.root.style.display, "none");
-  assert.equal(view.overlay.state.visible, false);
-});
-
-test("an unchanged frame performs no text write", () => {
-  const view = mount();
-  const state = { status: "ready", slots: slots() };
-  view.overlay.update(state);
-  const writes = view.root.children.reduce((total, slot) =>
-    total + textWritesOf(slot.children[0]?.children.at(-1)), 0);
-  for (let frame = 0; frame < 240; frame += 1) view.overlay.update(state);
-  assert.equal(
-    view.root.children.reduce(
-      (total, slot) => total + textWritesOf(slot.children[0]?.children.at(-1)),
-      0,
-    ),
-    writes,
-  );
-});
-
-test("the consumer maps only slot eight's custom C binding", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const canvas = {
-    getBoundingClientRect: () => ({ left: 10, top: 20, width: 800, height: 600 }),
-  } as HTMLCanvasElement;
-  const consumer = createSkillKeyOverlayConsumer(
-    body as unknown as HTMLElement,
-    canvas,
-  );
-  const feed = createCompanionSequenceFeed<CompanionSkillSlotState>(
-    { status: "waiting", reason: "memory" },
-    { status: "waiting", reason: "stale" },
-    { staleAfterMs: null, sameReadyState: sameCompanionSkillSlotGeometry },
-  );
-  const unsubscribe = feed.subscribe(consumer.update);
-  consumer.setBindings([null, null, null, null, null, null, null, slots()[0]!.binding]);
-  consumer.setEnabled(true);
-  const ready = {
-    status: "ready",
-    sequence: 2,
-    frameId: 1,
-    viewportWidth: 800,
-    viewportHeight: 600,
-    slots: Array.from({ length: 8 }, (_, index) => ({
-      left: 100 + index * 52,
-      bottom: 20,
-      right: 148 + index * 52,
-      top: 68,
-    })),
-  } as const;
-  feed.update(ready);
-  const root = body.children[0]!;
-  assert.equal(textOf(root.children[0]!.children[0]!.children.at(-1)), "C");
-  assert.match(root.children[0]!.style.cssText, /left:474px;top:552px/u);
-  assert.match(root.children[1]!.style.cssText, /display:none/u);
-  consumer.setEnabled(false);
-  assert.equal(root.style.display, "none");
-  feed.update({ ...ready, sequence: 4 });
-  const accepted = feed.state;
-  assert.equal(accepted.status, "ready");
-  if (accepted.status !== "ready") assert.fail("the heartbeat was not accepted");
-  assert.equal(accepted.sequence, 4, "the shared feed accepts the heartbeat");
-  consumer.setEnabled(true);
-  assert.equal(
-    root.style.display,
-    "block",
-    "re-enabling labels reuses geometry that another skill HUD kept fresh",
-  );
-  unsubscribe();
-  feed.dispose();
-  consumer.dispose();
-});
-
-test("a viewport resize refreshes projected key geometry", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  let width = 800;
-  let reads = 0;
-  const canvas = {
-    getBoundingClientRect: () => {
-      reads += 1;
-      return { left: 0, top: 0, width, height: 600 };
-    },
-  } as HTMLCanvasElement;
-  const consumer = createSkillKeyOverlayConsumer(body as unknown as HTMLElement, canvas);
-  consumer.setBindings([slots()[0]!.binding, null, null, null, null, null, null, null]);
-  consumer.setEnabled(true);
-  consumer.update({
-    status: "ready",
-    sequence: 2,
-    frameId: 1,
-    viewportWidth: 800,
-    viewportHeight: 600,
-    slots: Array.from({ length: 8 }, (_, index) => ({
-      left: 100 + index * 50,
-      bottom: 20,
-      right: 148 + index * 50,
-      top: 68,
-    })),
-  });
-  assert.match(body.children[0]!.children[0]!.style.cssText, /left:100px/u);
-  assert.equal(reads, 1);
-
-  width = 400;
-  document.defaultView.dispatch("resize");
-  assert.match(body.children[0]!.children[0]!.style.cssText, /left:50px/u);
-  assert.equal(reads, 2);
-  consumer.dispose();
-});
-
-test("the consumer withdraws geometry whose publisher stopped advancing", () => {
-  const document = new FakeDocument();
-  const body = document.createElement();
-  const canvas = {
-    getBoundingClientRect: () => ({ left: 0, top: 0, width: 800, height: 600 }),
-  } as HTMLCanvasElement;
-  let time = 0;
-  const timer: { pending?: () => void } = {};
-  const consumer = createSkillKeyOverlayConsumer(body as unknown as HTMLElement, canvas);
-  const feed = createCompanionSequenceFeed<CompanionSkillSlotState>(
-    { status: "waiting", reason: "memory" },
-    { status: "waiting", reason: "stale" },
-    {
-      now: () => time,
-      staleAfterMs: 500,
-      schedule: (callback) => {
-        timer.pending = callback;
-        return 1;
-      },
-      cancel: () => {
-        delete timer.pending;
-      },
-    },
-  );
-  const unsubscribe = feed.subscribe(consumer.update);
-  consumer.setBindings([slots()[0]!.binding, null, null, null, null, null, null, null]);
-  consumer.setEnabled(true);
-  const ready = {
-    status: "ready" as const,
-    sequence: 2,
-    frameId: 1,
-    viewportWidth: 800,
-    viewportHeight: 600,
-    slots: Array.from({ length: 8 }, (_, index) => ({
-      left: index * 50,
-      bottom: 20,
-      right: index * 50 + 48,
-      top: 68,
-    })),
-  };
-  feed.update(ready);
-  const root = body.children[0]!;
-  assert.equal(root.style.display, "block");
-  time = 499;
-  timer.pending?.();
-  assert.equal(root.style.display, "block");
-  time = 500;
-  timer.pending?.();
-  assert.equal(root.style.display, "none");
-  feed.update({ ...ready, sequence: 4 });
-  assert.equal(root.style.display, "block");
-  feed.update({ status: "waiting", reason: "snapshot" });
-  feed.update({ ...ready, sequence: 4 });
-  assert.equal(
-    root.style.display,
-    "none",
-    "a rejected snapshot cannot revive the sequence it invalidated",
-  );
-  feed.update({ ...ready, sequence: 6 });
-  assert.equal(root.style.display, "block");
-  unsubscribe();
-  feed.dispose();
-  consumer.dispose();
-});
-
-test("the surface never takes input or enters the accessibility tree", () => {
-  const view = mount();
-  assert.match(view.root.style.cssText, /pointer-events:none/u);
-  assert.equal(view.root.attributes.get("aria-hidden"), "true");
-});
-
-test("disposing removes the complete surface", () => {
-  const view = mount();
-  assert.equal(view.body.children.length, 1);
-  view.overlay.dispose();
-  assert.equal(view.body.children.length, 0);
-});
diff --git a/tests/unit/skill-overlays-installation.test.ts b/tests/unit/skill-overlays-installation.test.ts
index f304c68c..070764b5 100644
--- a/tests/unit/skill-overlays-installation.test.ts
+++ b/tests/unit/skill-overlays-installation.test.ts
@@ -29,6 +29,7 @@ const withBinding = Object.freeze({
 
 test("skill policy activates and withdraws only the observation regions it needs", () => {
   const skills = createSkillOverlaysInstallation({
+    nativeHudRendering: true,
     skillSlotGeometry: true,
     skillCooldownObservation: true,
   });
@@ -107,3 +108,14 @@ test("skill policy activates and withdraws only the observation regions it needs
   skills.geometry.dispose();
   skills.cooldowns.dispose();
 });
+
+
+test("a refused native renderer leaves skill display observers inactive", () => {
+  const skills = createSkillOverlaysInstallation({
+    nativeHudRendering: false, skillSlotGeometry: true, skillCooldownObservation: true,
+  });
+  skills.sync(withBinding, {skillKeyLabels: true, skillCooldowns: true});
+  assert.equal(skills.activeFeatureFlags, 0);
+  assert.equal(skills.geometry.active, false);
+  assert.equal(skills.cooldowns.active, false);
+});