feat(view): turn the bearing blocks, pads and block rebar to the bearing row (삽도)

Each block takes the skew of its bearing row against the perpendicular of its stretch axis (rowSkewDeg, from the bearing
azimuth). The blocks and pads are turned to that skew, and the S1/S2 bars are drawn in the block frame and turned with
it, so their lengths and embedments do not change. ② shows the row skew (P1: front −4.42°, back −3.11°). Approved
2026-10-23 with the drawing as reference.

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

src/view/rebar3d.ts

@@ -5,6 +5,7 @@ import { bottomPiece, MAIN, widthLayout } from '../core/rebar/coping-main';
 import { C14_INSET, c14Bars, CAP, COPING_REBAR, SHEAR_LOOP_STEP, shearBars, shearBarsMulti, shearUHeight, copingSideBars, SIDE_HOOK_LEG, stairBars, undersideAt } from '../core/rebar/coping';
 import { columnRebar, COLUMN_P1 } from '../core/rebar/column';
 import { barsAcross, BLOCK_REBAR } from '../core/rebar/bearing-block';
+import { blockFramePoint } from '../core/geometry';
 import { bendRadius, DEFAULT_MATERIAL, FckByMember, hookLength, Material, materialFor, NOMINAL_DIAMETER } from '../core/rebar/common';
 import { diameterGroupIndex, DIAMETER_GROUPS, memberOfBar, type RebarMemberKey } from '../core/rebar/color';
 import { stretchMatrix } from './scene';
@@ -468,18 +469,21 @@ export function buildRebar3D(m: PierModel, common: Material = DEFAULT_MATERIAL,
   const legM = BLOCK_REBAR.legLength / 1000;
   const offsets = Array.from({ length: across.count }, (_, i) => (across.firstEnd + i * across.spacing) / 1000 - BLOCK_REBAR.dim / 2000);
   const dBar = NOMINAL_DIAMETER.H19;
+  // The bars are drawn in the block's own frame (a along its s side, c along its n side) and turned with the block.
   for (const b of m.blocks) {
     const z2 = b.top - BLOCK_REBAR.depthS2 / 1000;
     const z1 = b.top - BLOCK_REBAR.depthS1 / 1000;
+    const P = (a: number, c: number, y: number): [number, number, number] => {
+      const [s, n] = blockFramePoint(b, a, c);
+      return [s, y, n];
+    };
     for (const off of offsets) {
-      const n2 = b.n + off;
-      addBar('S2', b.k, [b.s - half, z2, n2], [b.s + half, z2, n2], dBar, COLOR.block);
-      addBar('S2', b.k, [b.s - half, z2 - legM, n2], [b.s - half, z2, n2], dBar, COLOR.block);
-      addBar('S2', b.k, [b.s + half, z2, n2], [b.s + half, z2 - legM, n2], dBar, COLOR.block);
-      const s1 = b.s + off;
-      addBar('S1', b.k, [s1, z1, b.n - half], [s1, z1, b.n + half], dBar, COLOR.block);
-      addBar('S1', b.k, [s1, z1 - legM, b.n - half], [s1, z1, b.n - half], dBar, COLOR.block);
-      addBar('S1', b.k, [s1, z1, b.n + half], [s1, z1 - legM, b.n + half], dBar, COLOR.block);
+      addBar('S2', b.k, P(-half, off, z2), P(half, off, z2), dBar, COLOR.block);
+      addBar('S2', b.k, P(-half, off, z2 - legM), P(-half, off, z2), dBar, COLOR.block);
+      addBar('S2', b.k, P(half, off, z2), P(half, off, z2 - legM), dBar, COLOR.block);
+      addBar('S1', b.k, P(off, -half, z1), P(off, half, z1), dBar, COLOR.block);
+      addBar('S1', b.k, P(off, -half, z1 - legM), P(off, -half, z1), dBar, COLOR.block);
+      addBar('S1', b.k, P(off, half, z1), P(off, half, z1 - legM), dBar, COLOR.block);
     }
   }
 

src/view/scene.ts

@@ -125,11 +125,15 @@ export function buildPierScene(m: PierModel): PierScene {
   }
 
   for (const b of m.blocks) {
+    // Turn the block so its sides follow the bearing row (rowSkewDeg); the 3D turn is rotateY(−skew).
+    const turn = (-b.rowSkewDeg * Math.PI) / 180;
     const h = b.top - b.bottom;
     const g = new THREE.BoxGeometry(1.2, h, 1.2);
+    g.rotateY(turn);
     g.translate(b.s, b.bottom + h / 2, b.n);
     add('blocks', g, 1, b.k);
     const pad = new THREE.BoxGeometry(1.0, 0.05, 1.0);
+    pad.rotateY(turn);
     pad.translate(b.s, b.padTop - 0.025, b.n);
     add('pads', pad, 1, b.k);
   }