feedback5: merge feedback4 (3af5b84) — PRs #186 / #134 / #185 / #24 / #183 ported to the split layout (terrainInfo / TERRAIN_TIPS into a new ui/gameLogic/terrain.js re-exported by the gameLogic.js barrel, closesOnFieldPress into ui/gameLogic/shortcuts.js, the rest in place; 42 strings through t(), #183's 设置 too); golden unchanged

Ported by hand:
- public/js/ui/gameLogic.js is a re-export shim on feedback5: #185's TERRAIN_TIPS / terrainInfo went into the new
  public/js/ui/gameLogic/terrain.js (the barrel gains one re-export line); closesOnFieldPress 'terrain' into
  ui/gameLogic/shortcuts.js.
- i18n (docs/I18N.md): every new user-visible string goes through t() with an English entry in public/i18n/en.json
  (42, after the 补位 strings): the terrain names / tags / fact table are N_() and translated where terrainInfo hands
  them out, the mechanism lines are msgids with their numbers as params (a line with an optional half is two whole
  msgids, the list joins use an array param), the card's 地形机制 / 这一格 titles in ui/detailPanel.js. Official EN
  terms where the EN client has them (stage_table tileInfo: Active Originium, Mire, Exhaust Grille, Deep Water Zone,
  Incursion Point, Protection Objective, Tunnel Entry / Exit, High Ground; Camouflage). The Chinese output is
  byte-identical to feedback4's terrainInfo on all 5187 tiles of the 13 stages and on synthetic stages.
- public/js/screens/game.js (MatchScreen still lives there): the import keeps feedback5's names plus terrainInfo /
  fieldTile; the terrain stage is the one view.setStage gets, so it includes feedback5's fieldStage — a 联防 field is
  played on its own map (GitHub #41), and a tap there explains that map's tile, not the round stage's. The tileClick
  handler and render/app.js emitTileClick / ui/fallbackField.js auto-merged in place. terrainInfo reads the stage only,
  so a 补位 / 自选 board explains its tiles the same way (their pieces only change a piece's art and name).
- public/js/ui/detailPanel.js: the terrain branch of resolveDetail before feedback5's stand-in / 自选 helpers.
- public/js/screens/title.js (#183): feedback5's LangToggle / t() imports plus GIcon / SettingsModal; the gear
  button's aria-label / title are t('设置') (en.json already has "Settings").
- tools/fetch-assets.mjs / tools/assets/downloader.mjs: --add-only (keepExisting, the font skip) beside #24's
  --asset-source / SP_ASSET_SOURCE and the shared MirrorPolicy; feedback5's extraOperators / moduleTypes and the
  voice plan unchanged.
- data/assets.json: feedback5's manifest plus #134's audio.sfx.battle.leak (after heal, the plan order); stats files
  6993 → 6994 and bytes +23 240 as measured on feedback4; the hash recomputed with the generator's contentHash
  (c01aa739a2d3 → 6a547fc5c937). A field-wise JSON diff against feedback5 shows only those four fields.
- docs: DESIGN §24 intro and §24.5 / §24.6 as on feedback4 (the rest of DESIGN.md is feedback5's); ASSETS.md,
  DEPLOY.md, PLAYING.md auto-merged.
- Auto-merged and checked: audio.js (the sim still emits ['leak', id], server/sim/battle/deploy.js), render/style.js,
  textures.js, tiles.js, board3d/materials.js, boardArt.js, tools/assets/*, tools/setup.mjs, extract.py, the tests.

Checks: the PRs' unit tests (audio 22, gameLogic 44, terrain-detail 1, originium-art 4, boardart 15,
board3d-extract 9, asset-network 21, fetch-assets-shrink 4), i18n 9 / i18n-data 8 / i18n-server 4, client-static 313,
docs-consistency 24, kits_layout 6 pass; lint 0 errors (no new warnings), check:imports, typecheck; golden: all 283
scenarios match, nothing regenerated.

public/js/render/app.js

@@ -35,6 +35,8 @@
 //        pieceDragStart { uid, piece, from } · pieceDrop { uid, piece, from, target } · pieceDragEnd {uid, dropped}
 //        pieceClick { uid, piece, button, detail, clientX, clientY } (battle units: { unitId, uid, unit, … })
 //        pieceDetail (right-click / long-press) · pieceHover { uid } | { uid: null } (battle: + unitId, unit)
+//        tileClick { row, col, x, y } — the ground itself was tapped and nothing stands there (GitHub issue #184:
+//        a special terrain tile's own tip; the screen resolves it with gameLogic.terrainInfo)
 //        tileHover { row, col, area, idx } | null (while dragging: the drop target — the tile under the pointer)
 //   view.pieceScreenRect(uid) → { left, top, right, bottom, width, height, x, y } (client px: the drawn body) | null
 // Picking (user playtest #4 item 1: the ground is drawn as tiles — a press on a tile is a press on the unit standing
@@ -1099,6 +1101,21 @@ export async function createFieldView(host, options = {}) {
     return hit ? hit.ref : null;
   }
 
+  /**
+   * The ground itself was tapped: nothing stands there, so the TILE explains itself — a special terrain tile (活性源石,
+   * 沼泽, 排气格栅, 深水区, 红/蓝门, 传送) opens its own card (GitHub issue #184; screens/game.js `tileClick` →
+   * gameLogic.terrainInfo, which says nothing about an ordinary floor / road / wall tile).
+   * The tile is picked as a BOARD tile (`pickBoardTile`, i.e. through `prepXf.toBoard`): on a Final Assault / Hidden Core
+   * PREP the board draws the boss field's own rows (stage 2–5 as board 9–12), and the screen maps board → stage once more
+   * with `gameLogic.fieldTile` — reporting the DRAWN tile here would be converted twice and explain the wrong tile
+   * (review on #185).
+   */
+  function emitTileClick(ev, e) {
+    const t = pickBoardTile(ev.x, ev.y);
+    if (!t || !(t.row >= 0) || !(t.col >= 0)) return;    // outside the board this field draws
+    emit('tileClick', { row: t.row, col: t.col, button: e.button, clientX: e.clientX, clientY: e.clientY });
+  }
+
   const onPointerDown = (e) => {
     if (destroyed) return;
     const ev = evPayload(e);
@@ -1109,18 +1126,20 @@ export async function createFieldView(host, options = {}) {
         const payload = { unitId: v.id, uid: info?.uid ?? null, unit: info, button: e.button, detail: e.button === 2, clientX: e.clientX, clientY: e.clientY };
         emit('pieceClick', payload);
         if (e.button === 2) emit('pieceDetail', payload);
-      } else if (penViews.size) {
-        const pv = penUnitAt(ev.x, ev.y);
-        if (pv) emitPenClick(pv, e);
+        return;
       }
+      const pv = penViews.size ? penUnitAt(ev.x, ev.y) : null;
+      if (pv) emitPenClick(pv, e);
+      else emitTileClick(ev, e);
       return;
     }
     if (drag.pointerDown(ev)) { try { canvas.setPointerCapture(e.pointerId); } catch { /* ignore */ } return; }
     if (mode === 'prep') { const lv = leaderAt(ev.x, ev.y); if (lv) { emitPenClick(lv, e); return; } }
     if (penViews.size && mode === 'prep') {
       const pv = penUnitAt(ev.x, ev.y);
-      if (pv) emitPenClick(pv, e);
+      if (pv) { emitPenClick(pv, e); return; }
     }
+    emitTileClick(ev, e);
   };
   const onPointerMove = (e) => {
     if (destroyed) return;

public/js/render/board3d/materials.js

@@ -12,6 +12,8 @@
 // (a soft world-space falloff), so the active field reads like the original's lit board without re-building
 // geometry when the camera moves.
 
+import { ORIGINIUM } from '../style.js';
+
 /** Shared focus uniforms (one object for every lit material). */
 export function focusUniforms(THREE) {
   return {
@@ -275,7 +277,17 @@ export function mireMaterial(THREE, tex, focus) {
   });
 }
 
-/** Infection (活性源石): dark originium crust patches with glowing, pulsing orange veins over the concrete. */
+/**
+ * 活性源石 (infection): dark originium crust patches with glowing, pulsing orange veins over the concrete. The palette
+ * (`style.js ORIGINIUM`) and the recipe are the ones `render/textures.js originiumOverlay` draws on the 2D board —
+ * two octaves of noise for the crust, the ridge of the fine one for the veins, a third for the crystal grains — so both
+ * boards show ONE material (GitHub #184).
+ * The noise is world-space, so the crust carries on into the neighbouring tile: there is deliberately NO per-tile edge
+ * fade (the old `edge` term faded every tile out at its own border, which made a field of 活性源石 read as separate
+ * patches instead of one floor).
+ */
+const V3 = (c) => `vec3(${c.map((v) => Number(v).toFixed(3)).join(', ')})`;
+
 export function infectionMaterial(THREE, tex, focus) {
   const uniforms = { uTime: { value: 0 }, uNoise: { value: tex.noise || null }, ...focus };
   return new THREE.ShaderMaterial({
@@ -288,15 +300,17 @@ export function infectionMaterial(THREE, tex, focus) {
       'void main() {',
       '  float n = texture2D(uNoise, vWorld.xy * 0.55).r;',
       '  float n2 = texture2D(uNoise, vWorld.xy * 1.3 + 0.37).r;',
+      '  float n3 = texture2D(uNoise, vWorld.xy * 3.1 + 0.11).r;',
       '  float crust = smoothstep(0.38, 0.62, n * 0.7 + n2 * 0.45);',
       '  float vein = smoothstep(0.86, 0.98, 1.0 - abs(n2 * 2.0 - 1.0)) * (0.35 + 0.65 * crust);',
+      '  float grain = smoothstep(0.93, 1.0, n3) * crust;',
       '  float pulse = 0.6 + 0.4 * sin(uTime * 2.2 + n * 9.0);',
-      '  vec2 e = min(vUv, 1.0 - vUv);',
-      '  float edge = smoothstep(0.0, 0.1, min(e.x, e.y));',
-      '  vec3 base = mix(vec3(0.16, 0.05, 0.05), vec3(0.3, 0.1, 0.07), n2);',
-      '  vec3 glow = vec3(1.0, 0.46, 0.18) * (1.2 + 0.8 * pulse);',
-      '  vec3 c = mix(base, glow, vein) * focusMask(vWorld.xy);',
-      '  float a = clamp(crust * 0.72 + vein, 0.0, 1.0) * edge;',
+      `  vec3 base = mix(${V3(ORIGINIUM.base)}, ${V3(ORIGINIUM.crust)}, n2);`,
+      `  vec3 glow = ${V3(ORIGINIUM.vein)} * (1.2 + 0.8 * pulse);`,
+      '  vec3 c = mix(base, glow, vein);',
+      `  c = mix(c, ${V3(ORIGINIUM.spec)} * (1.0 + 0.6 * pulse), grain);`,
+      '  c *= focusMask(vWorld.xy);',
+      '  float a = clamp(crust * 0.72 + vein, 0.0, 1.0);',
       '  gl_FragColor = vec4(c, a);',
       '  #include <colorspace_fragment>',
       '}',

public/js/render/boardArt.js

@@ -7,11 +7,29 @@
 // `map/autochess → TX_autochessi_D`; its crop table `tiles.json` sits next to it (written by
 // tools/crop-board-atlas.mjs). Every image referenced by the table is loaded through the shared image cache; a
 // missing image drops only the materials that use it. Everything is cached per page (one load for every view).
+// A table image is fetched at the URL the manifest lists for the same texture (sourceUrl), so the 3D board
+// (board3d/load.js, which reads the manifest only) and this art share one download — also when the manifest lists
+// the WebP copy tools/local-extract writes and the table still names the PNG.
 
 let cached = null;
 
 const isObj = (v) => v !== null && typeof v === 'object' && !Array.isArray(v);
 
+/** The manifest group of the board textures (and of their crop table). */
+export const BOARD_GROUP = 'map/autochess';
+
+/**
+ * URL of a crop-table image: the local-art manifest's entry for the same texture (group `BOARD_GROUP`, name = the
+ * file name without its extension), else the table's own path.
+ * @param {any} assets store of public/js/assets.js
+ * @param {string} path tiles.json `source[k].path`
+ */
+export function sourceUrl(assets, path) {
+  const name = path.replace(/^.*\//, '').replace(/\.[^.]*$/, '');
+  const listed = name && typeof assets?.localUrl === 'function' ? assets.localUrl(BOARD_GROUP, name) : null;
+  return typeof listed === 'string' && listed ? listed : path;
+}
+
 /** @param {any} assets store of public/js/assets.js (needs local(), localUrl(), image()) */
 export function loadBoardArt(assets) {
   if (cached) return cached;
@@ -19,7 +37,7 @@ export function loadBoardArt(assets) {
     if (!assets || typeof assets.local !== 'function' || typeof assets.image !== 'function') return null;
     const manifest = await assets.local().catch(() => null);
     if (!manifest) return null;
-    const atlasUrl = assets.localUrl ? assets.localUrl('map/autochess', 'TX_autochessi_D') : null;
+    const atlasUrl = assets.localUrl ? assets.localUrl(BOARD_GROUP, 'TX_autochessi_D') : null;
     if (!atlasUrl) return null;
     const dir = atlasUrl.replace(/\/[^/]*$/, '');
     let tiles = null;
@@ -30,7 +48,7 @@ export function loadBoardArt(assets) {
     if (!isObj(tiles) || !isObj(tiles.materials) || !isObj(tiles.source)) return null;
     const images = {};
     await Promise.all(Object.entries(tiles.source).map(async ([k, s]) => {
-      const url = isObj(s) && typeof s.path === 'string' ? s.path : null;
+      const url = isObj(s) && typeof s.path === 'string' && s.path ? sourceUrl(assets, s.path) : null;
       if (!url) return;
       const img = await assets.image(url).catch(() => null);
       if (img && img.width > 0) images[k] = img;

public/js/render/style.js

@@ -70,6 +70,37 @@ export const COLORS = Object.freeze({
 export const TIER_COLORS = Object.freeze([0x9aa5a0, 0x9aa5a0, 0x7fd37a, 0x52b6ff, 0xb98cff, 0xffc600, 0xff6b3d]);
 export const ENEMY_FRAME = Object.freeze({ normal: 0xc84a3c, elite: 0xff7a33, boss: 0xff2d55 });
 
+/**
+ * 活性源石 (infection) — the ONE palette of that tile, shared by the two boards (GitHub #184: the 2D atlas cell and the
+ * 3D shader used to be two different materials — a beveled brick with crystal clusters against a world-space crust).
+ * The values are the 3D board's own working colours (`render/board3d/materials.js` writes them into its shaders, which
+ * end in `#include <colorspace_fragment>`, i.e. they are LINEAR); `textures.js` converts them for its canvas with
+ * `linearToHex`, so both renderers show the same colour.
+ *   base — the crust's dark side, crust — its lit side, vein — the glowing veins, spec — the bright crystal grains.
+ */
+export const ORIGINIUM = Object.freeze({
+  base: Object.freeze([0.16, 0.05, 0.05]),
+  crust: Object.freeze([0.3, 0.1, 0.07]),
+  vein: Object.freeze([1.0, 0.46, 0.18]),
+  spec: Object.freeze([1.0, 0.78, 0.52]),
+  glow: 0xff6a3d,        // the additive pulse the 2D board tints per tile
+});
+
+/**
+ * One channel of a working (linear) colour as the 0–255 sRGB value a canvas stores — the shaders' `#include
+ * <colorspace_fragment>` does this for the 3D board, the canvas has to do it itself.
+ */
+export function linearToSrgb255(v) {
+  const k = Number(v);
+  const s = k <= 0.0031308 ? k * 12.92 : 1.055 * Math.pow(Math.max(0, k), 1 / 2.4) - 0.055;
+  return Math.max(0, Math.min(255, Math.round(s * 255)));
+}
+
+/** A working (linear) `ORIGINIUM` colour as the `#rrggbb` sRGB string of the canvas (`textures.js originiumCanvas`). */
+export function linearToHex(rgb) {
+  return `#${rgb.map((v) => linearToSrgb255(v).toString(16).padStart(2, '0')).join('')}`;
+}
+
 export const DMG_STYLE = Object.freeze({
   phys: { font: 'sp-dmg-phys', fill: ['#fffbe8', '#ffb35c'], stroke: '#3b1400' },
   arts: { font: 'sp-dmg-arts', fill: ['#fbe8ff', '#c77dff'], stroke: '#2a0b45' },

public/js/render/textures.js

@@ -11,7 +11,7 @@
 // Everything procedural is deterministic (seeded noise) and generated lazily on first use. Requires
 // globalThis.PIXI and a DOM canvas at call time (never at import time).
 
-import { statusIconKey } from './style.js';
+import { statusIconKey, ORIGINIUM, linearToSrgb255 } from './style.js';
 
 const PIXI = () => globalThis.PIXI;
 
@@ -50,7 +50,7 @@ const PROC_UNIT = 112;
 export const MATERIALS = [
   'road', 'road2', 'road3', 'roadN', 'roadN2', 'floor', 'floor2', 'preview', 'wall', 'wallSide', 'forbid', 'forbid2', 'forbidSide',
   'sep', 'sepSide', 'fence', 'fenceSide', 'start', 'end', 'telin', 'telout', 'hand', 'temp', 'benchSide', 'benchSideTemp', 'mire',
-  'smog', 'deepsea', 'infection', 'cliff', 'blank', 'lowSide', 'margin',
+  'smog', 'deepsea', 'infection', 'infection2', 'cliff', 'blank', 'lowSide', 'margin',
   // high-ground plates by connectivity (horizontal strip L/M/R, vertical strip B(near)/VM/T(far); 'wall' = single)
   'wallL', 'wallM', 'wallR', 'wallB', 'wallVM', 'wallT',
   // textured props
@@ -62,6 +62,11 @@ export const MATERIALS = [
 /** Art layers of materials the crop table (tiles.json) may not describe yet: the board atlas' glass hatch + a glaze. */
 const DEFAULT_ART_LAYERS = Object.freeze({
   penGlass: Object.freeze([Object.freeze({ src: 'D', rect: [549, 1787, 255, 256] }), Object.freeze({ proc: 'glass' })]),
+  // 活性源石 (GitHub #184): the official concrete slab the 3D board lays its crust on (`board3d/atlas.js concrete`), plus
+  // the same crust as a procedural layer — so with the board art installed the 2D tile is composed exactly like the 3D
+  // one, and `MAT_DRAW.infection` is only the no-art fallback.
+  infection: Object.freeze([Object.freeze({ src: 'D', rect: [256, 512, 256, 256] }), Object.freeze({ proc: 'originium' })]),
+  infection2: Object.freeze([Object.freeze({ src: 'D', rect: [256, 512, 256, 256] }), Object.freeze({ proc: 'originium2' })]),
 });
 
 function speckle(ctx, x, y, w, h, r, n, colors, size = [0.6, 1.8]) {
@@ -91,6 +96,97 @@ function bevelTile(ctx, x, y, s, o) {
   ctx.fillRect(x + s - m - bw, y + m, bw, s - 2 * m);
 }
 
+/**
+ * Toroidal value noise on an `n × n` grid: `(u, v) ∈ [0, 1)` wraps, so a cell that is repeated over the board joins
+ * itself without a seam (the knobs of 活性源石's crust line up across neighbouring tiles).
+ */
+function noiseField(n, seed) {
+  const r = rng(seed);
+  const g = new Float32Array(n * n);
+  for (let i = 0; i < g.length; i++) g[i] = r();
+  const smooth = (t) => t * t * (3 - 2 * t);
+  return (u, v) => {
+    const x = u * n, y = v * n;
+    const x0 = Math.floor(x), y0 = Math.floor(y);
+    const i0 = ((x0 % n) + n) % n, j0 = ((y0 % n) + n) % n;
+    const i1 = (i0 + 1) % n, j1 = (j0 + 1) % n;
+    const sx = smooth(x - x0), sy = smooth(y - y0);
+    const a = g[j0 * n + i0], b = g[j0 * n + i1], c = g[j1 * n + i0], d = g[j1 * n + i1];
+    return (a * (1 - sx) + b * sx) * (1 - sy) + (c * (1 - sx) + d * sx) * sy;
+  };
+}
+
+const ORIGINIUM_RES = 256;   // the crust's own resolution (scaled into the atlas cell)
+
+const smoothstep = (a, b, t) => {
+  const k = Math.max(0, Math.min(1, (t - a) / (b - a)));
+  return k * k * (3 - 2 * k);
+};
+
+/**
+ * 活性源石 (infection) — the dark originium crust with thin glowing veins, drawn with the palette and the recipe the 3D
+ * board's shader uses (`render/board3d/materials.js infectionMaterial`, the same octaves and thresholds over its own
+ * world-space noise), so the two boards show ONE material (GitHub #184). Two octaves make the crust mask, the ridge of
+ * the fine octave its veins (brightened where the crust is), the rare top of a third one the crystal grains; the crust
+ * reaches the tile's edges, so a field of 活性源石 carries on into the neighbouring tile instead of ending in a frame.
+ * `mirrored` draws the second variant (`infection2`; `render/tiles.js variantMat` picks between them by tile).
+ */
+const _originiumCells = new Map();
+
+/**
+ * 活性源石's crust, rendered once per variant into `size × size` pixels (cached: the atlas rebuilds on every board art
+ * change, the pattern does not). `mirrored` is the second variant (see `originiumOverlay`).
+ */
+function originiumCanvas(size, mirrored) {
+  const key = `${size}:${mirrored ? 1 : 0}`;
+  const hit = _originiumCells.get(key);
+  if (hit) return hit;
+  const canvas = makeCanvas(size, size);
+  const ctx = canvas.getContext('2d');
+  const crustN = noiseField(16, 9137), fineN = noiseField(32, 4421), grainN = noiseField(64, 733);
+  const img = ctx.createImageData(size, size);
+  const d = img.data;
+  const base = ORIGINIUM.base, crust = ORIGINIUM.crust, vein = ORIGINIUM.vein, spec = ORIGINIUM.spec;
+  for (let py = 0; py < size; py++) {
+    const v = (py + 0.5) / size;
+    for (let px = 0; px < size; px++) {
+      const u = mirrored ? 1 - (px + 0.5) / size : (px + 0.5) / size;
+      const n1 = crustN(u, v), n2 = fineN(u, v), n3 = grainN(u, v);
+      const crustM = smoothstep(0.38, 0.62, n1 * 0.7 + n2 * 0.45);
+      const ridge = smoothstep(0.86, 0.98, 1 - Math.abs(n2 * 2 - 1)) * (0.35 + 0.65 * crustM);
+      const grain = smoothstep(0.93, 1, n3) * crustM;
+      const alpha = Math.min(1, crustM * 0.72 + ridge);
+      if (alpha <= 0.004 && grain <= 0.01) continue;
+      const i = (py * size + px) * 4;
+      for (let c = 0; c < 3; c++) {
+        const lit = base[c] * (1 - n2) + crust[c] * n2;          // the crust's own shading
+        const vc = lit * (1 - ridge) + vein[c] * ridge;          // …and the vein over it
+        // the mixing happens in the shaders' working (linear) space; the canvas stores sRGB (the 3D board's
+        // colorspace_fragment does the same conversion at the end of its fragment shader)
+        d[i + c] = linearToSrgb255(Math.max(0, Math.min(1, vc * (1 - grain) + spec[c] * grain)));
+      }
+      d[i + 3] = Math.round(alpha * 255);
+    }
+  }
+  ctx.putImageData(img, 0, 0);
+  _originiumCells.set(key, canvas);
+  return canvas;
+}
+
+/**
+ * 活性源石 (infection) — the dark originium crust with thin glowing veins, drawn with the palette and the recipe the 3D
+ * board's shader uses (`render/board3d/materials.js infectionMaterial`: the same octaves and thresholds over its own
+ * world-space noise), so the two boards show ONE material (GitHub #184: this cell used to be a beveled brick with random
+ * crystal clusters while the 3D quad carried the crust). Two octaves make the crust mask, the ridge of the fine octave
+ * its veins (brightened where the crust is), the rare top of a third one the crystal grains; the crust reaches the
+ * tile's edges, so a field of 活性源石 carries on into the neighbouring tile instead of ending in a frame — the noise
+ * wraps, so a repeated cell joins itself. Drawn through `drawImage`, so the callers' transform (the procedura draw path
+ * scales a 112 px cell up to the atlas cell) applies; `putImageData` would ignore it.
+ */
+function originiumOverlay(ctx, x, y, s, mirrored = false) {
+  ctx.drawImage(originiumCanvas(ORIGINIUM_RES, mirrored), x, y, s, s);
+}
+
 function cracks(ctx, x, y, s, r, n, color) {
   ctx.strokeStyle = color;
   ctx.lineWidth = 1;
@@ -285,23 +381,8 @@ const MAT_DRAW = {
     }
     speckle(ctx, x, y, s, s, r, 60, ['rgba(200,255,255,0.12)']);
   },
-  infection(ctx, x, y, s, r) {
-    bevelTile(ctx, x, y, s, { light: '#3a2a33', dark: '#241a20', seamColor: '#140e11', hi: 'rgba(255,140,90,0.14)' });
-    for (let i = 0; i < 7; i++) {
-      const cx = x + 16 + r() * (s - 32), cy = y + 16 + r() * (s - 32), rr = 5 + r() * 10, a = r() * Math.PI;
-      const g = ctx.createRadialGradient(cx, cy, 0, cx, cy, rr * 2.2);
-      g.addColorStop(0, 'rgba(255,110,60,0.45)'); g.addColorStop(1, 'rgba(255,110,60,0)');
-      ctx.fillStyle = g; ctx.beginPath(); ctx.arc(cx, cy, rr * 2.2, 0, Math.PI * 2); ctx.fill();
-      ctx.fillStyle = i % 2 ? '#ff7a45' : '#ffb070';
-      ctx.beginPath();
-      for (let k = 0; k < 5; k++) {
-        const aa = a + (k / 5) * Math.PI * 2, rad = k % 2 ? rr * 0.45 : rr;
-        ctx.lineTo(cx + Math.cos(aa) * rad, cy + Math.sin(aa) * rad);
-      }
-      ctx.closePath(); ctx.fill();
-    }
-    cracks(ctx, x, y, s, r, 4, 'rgba(255,120,70,0.45)');
-  },
+  infection(ctx, x, y, s, r) { floorBase(ctx, x, y, s, r); originiumOverlay(ctx, x, y, s, false); },
+  infection2(ctx, x, y, s, r) { floorBase(ctx, x, y, s, r); originiumOverlay(ctx, x, y, s, true); },
   cliff(ctx, x, y, s) {
     const g = ctx.createLinearGradient(x, y, x, y + s);
     g.addColorStop(0, 'rgba(70,80,86,1)'); g.addColorStop(0.08, 'rgba(38,45,49,1)'); g.addColorStop(1, 'rgba(10,13,14,0)');
@@ -439,6 +520,9 @@ const _atlases = new Map();   // art key → atlas
 
 /** Procedural finishing layers usable in tiles.json (`{ proc: 'rim' }`): a bevelled block edge. */
 const PROC_LAYERS = {
+  /** 活性源石's crust over the official concrete (DEFAULT_ART_LAYERS.infection); the second variant is mirrored. */
+  originium(ctx, x, y, s) { originiumOverlay(ctx, x, y, s, false); },
+  originium2(ctx, x, y, s) { originiumOverlay(ctx, x, y, s, true); },
   /** A glossy glass pane over the inner square of a hatch: sky-lit gradient, soft cloud reflections, a highlight. */
   glass(ctx, x, y, s) {
     const i = s * 0.135, w = s - i * 2;

public/js/render/tiles.js

@@ -31,7 +31,7 @@
 // are built; switching back (WebGL context lost, art missing) rebuilds the 2D board.
 
 import { tileAtlas, fxAtlas, rng, groundTexture } from './textures.js';
-import { GLYPH, TILEKEY_GLYPH, TILE_H, COLORS } from './style.js';
+import { GLYPH, TILEKEY_GLYPH, TILE_H, COLORS, ORIGINIUM } from './style.js';
 import { parsePenRect, PEN_RECT } from './pen.js';
 
 /**
@@ -193,6 +193,9 @@ function variantMat(t) {
     case 'roadN': return h < 4 ? 'roadN' : 'roadN2';
     case 'floor': return h < 4 ? 'floor' : 'floor2';
     case 'forbid': return h < 4 ? 'forbid' : 'forbid2';
+    // 活性源石: the same material twice (the second mirrored), so a field of it does not repeat one pattern
+    // (textures.js originiumOverlay — the palette and recipe match the 3D board's shader, GitHub #184)
+    case 'infection': return h < 4 ? 'infection' : 'infection2';
     default: return t.mat;
   }
 }
@@ -650,7 +653,7 @@ export class TileField {
       switch (t.glyph) {
         case 'g': add('smog', 'smoke', P.BLEND_MODES.NORMAL, 0xb8c4c0, 2); break;
         case 'd': add('sea', 'soft', P.BLEND_MODES.ADD, 0x5fe0ff, 1); break;
-        case 'i': add('infect', 'glow', P.BLEND_MODES.ADD, 0xff6a3d, 1); break;
+        case 'i': add('infect', 'glow', P.BLEND_MODES.ADD, ORIGINIUM.glow, 1); break;
         case 'm': add('mire', 'dot', P.BLEND_MODES.ADD, 0xc8d890, 2); break;
         case 'I': case 'O': add('tel', 'ring', P.BLEND_MODES.ADD, 0xb36bff, 1); break;
         case 'S': if (r <= 12) add('gateGlow', 'glow', P.BLEND_MODES.ADD, COLORS.gateRed, 1); break;