feat(view): add 3D pier viewer and P1 sample page

- three.js scene in the pier frame (pivot at first column centre)
- coping as extruded elevation outline; columns, footings, piles, blinding, bearing blocks and pads
- four view presets, per-part visibility toggles
- workbook load (sample or file), result table, issue list and undetermined defaults
- frame orientation test and bounding-box test

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

src/style.css

@@ -0,0 +1,227 @@
+:root {
+  --bg: #f5f7fa;
+  --panel: #ffffff;
+  --text: #1d2733;
+  --muted: #5b6878;
+  --line: #d5dce4;
+  --primary: #1f5fa8;
+  --warn: #9a5b00;
+  --focus: 2px solid #1f5fa8;
+  color-scheme: light dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    --bg: #111820;
+    --panel: #1a232d;
+    --text: #e6ebf0;
+    --muted: #9aa7b4;
+    --line: #2d3a47;
+    --primary: #5b93d6;
+    --warn: #e0a24a;
+  }
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  background: var(--bg);
+  color: var(--text);
+  font: 14px/1.5 system-ui, 'Noto Sans KR', sans-serif;
+}
+
+button,
+select,
+input,
+label {
+  font: inherit;
+}
+
+button,
+select,
+.file {
+  min-height: 44px;
+}
+
+button:focus-visible,
+select:focus-visible,
+input:focus-visible {
+  outline: var(--focus);
+  outline-offset: 2px;
+}
+
+.top {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  border-bottom: 1px solid var(--line);
+  background: var(--panel);
+}
+
+.top h1 {
+  font-size: 18px;
+  margin: 0;
+}
+
+.stage {
+  font-size: 13px;
+  color: var(--muted);
+  font-weight: 400;
+  margin-left: 8px;
+}
+
+.actions {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.primary {
+  background: var(--primary);
+  color: #fff;
+  border: 0;
+  border-radius: 6px;
+  padding: 0 14px;
+  cursor: pointer;
+}
+
+.file {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 10px;
+  border: 1px solid var(--line);
+  border-radius: 6px;
+  cursor: pointer;
+}
+
+.file input {
+  font-size: 12px;
+  max-width: 220px;
+}
+
+.layout {
+  display: grid;
+  grid-template-columns: 240px 1fr 320px;
+  gap: 12px;
+  padding: 12px 16px;
+  min-height: calc(100vh - 80px);
+}
+
+.side,
+.results,
+.viewer {
+  background: var(--panel);
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  padding: 12px;
+}
+
+.side section,
+.results section {
+  margin-bottom: 16px;
+}
+
+h2 {
+  font-size: 15px;
+  margin: 0 0 8px;
+}
+
+.muted {
+  color: var(--muted);
+}
+
+select {
+  width: 100%;
+  padding: 6px;
+  border: 1px solid var(--line);
+  border-radius: 6px;
+  background: var(--panel);
+  color: var(--text);
+}
+
+.parts label,
+.views button {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-height: 44px;
+}
+
+.views {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 8px;
+}
+
+.views button {
+  border: 1px solid var(--line);
+  border-radius: 6px;
+  background: var(--panel);
+  color: var(--text);
+  justify-content: center;
+  cursor: pointer;
+}
+
+.views button[aria-pressed='true'] {
+  border-color: var(--primary);
+  color: var(--primary);
+  font-weight: 600;
+}
+
+.canvas {
+  width: 100%;
+  height: calc(100vh - 140px);
+  min-height: 420px;
+  border-radius: 6px;
+  overflow: hidden;
+  background: #e9eef4;
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+td {
+  padding: 4px 6px;
+  border-bottom: 1px solid var(--line);
+  vertical-align: top;
+}
+
+td:first-child {
+  color: var(--muted);
+  width: 48%;
+}
+
+.issues {
+  padding-left: 18px;
+  margin: 0;
+}
+
+.issues li {
+  margin-bottom: 6px;
+  color: var(--text);
+}
+
+.issues .code {
+  font-weight: 600;
+  color: var(--warn);
+}
+
+@media (max-width: 900px) {
+  .layout {
+    grid-template-columns: 1fr;
+  }
+
+  .canvas {
+    height: 60vh;
+  }
+}