prts-terrarchive 0.2.0

package/ui/rhine/shelf-layout.ts

@@ -0,0 +1,38 @@
+// One bounded page spans both physical tiers; source order fills bottom first.
+export const SHELF_LEVELS = 2;
+export const SHELF_SLOTS_PER_LEVEL = 12;
+export const SHELF_PAGE_SIZE = SHELF_LEVELS * SHELF_SLOTS_PER_LEVEL;
+export const SHELF_SLOT_SPACING = 0.78;
+export const SHELF_LEVEL_SPACING = 4.6;
+export const SHELF_WIDTH = 5.35;
+export const SHELF_DEPTH = (SHELF_SLOTS_PER_LEVEL - 1) * SHELF_SLOT_SPACING + 1.05;
+export const SHELF_HEIGHT = (SHELF_LEVELS - 1) * SHELF_LEVEL_SPACING + 4.3;
+// Clear the entire cassette width before turning or changing tiers.
+export const SHELF_EXIT_DISTANCE = SHELF_WIDTH + 0.65;
+
+// The reading station stays outside the rack's full rotation envelope and in
+// front of its nearest row. Moving the camera cannot make an internal target safe.
+export const SHELF_READING_POSITION = {
+  x: -SHELF_EXIT_DISTANCE, y: SHELF_HEIGHT / 2 - 1.85, z: SHELF_DEPTH / 2 + 3.2,
+};
+export const SHELF_WITHDRAW_END = 0.38;
+export function shelfReadingPath(index: number, progress: number, focus = 0) {
+  const slot = shelfSlot(index);
+  const smooth = (v: number) => { const t = Math.max(0, Math.min(1, v)); return t * t * t * (t * (t * 6 - 15) + 10); };
+  const turn = smooth((progress - SHELF_WITHDRAW_END) / (1 - SHELF_WITHDRAW_END));
+  if (progress < SHELF_WITHDRAW_END) return {
+    x: -focus * 0.5 + (-SHELF_EXIT_DISTANCE + focus * 0.5) * smooth(progress / SHELF_WITHDRAW_END),
+    y: slot.y, z: slot.z, turn: 0,
+  };
+  return { x: SHELF_READING_POSITION.x,
+    y: slot.y + (SHELF_READING_POSITION.y - slot.y) * turn,
+    z: slot.z + (SHELF_READING_POSITION.z - slot.z) * turn, turn };
+}
+
+export function shelfSlot(index: number) {
+  const pageSlot = ((Math.trunc(index) % SHELF_PAGE_SIZE) + SHELF_PAGE_SIZE) % SHELF_PAGE_SIZE;
+  const level = Math.floor(pageSlot / SHELF_SLOTS_PER_LEVEL);
+  const slot = pageSlot % SHELF_SLOTS_PER_LEVEL;
+  return { level, slot, x: 0, y: 0.28 + level * SHELF_LEVEL_SPACING,
+    z: (slot - (SHELF_SLOTS_PER_LEVEL - 1) / 2) * SHELF_SLOT_SPACING };
+}

package/ui/rhine/snapshot-update-gate.ts

@@ -0,0 +1,22 @@
+import type { InvestigationSnapshot } from './types';
+
+/** Keep value signatures: snapshots may mutate in place or contain equal new objects. */
+export class SnapshotUpdateGate {
+  private session = '';
+  private sources = '';
+  private status = '';
+  constructor(snapshot: InvestigationSnapshot) { this.read(snapshot); }
+  read(snapshot: InvestigationSnapshot) {
+    // Records and answer text belong to the reading panels. Answer presence still
+    // affects the status/report entry; every other field remains significant.
+    const { sources, answer, records: _records, ...status } = snapshot;
+    const nextSources = JSON.stringify([snapshot.sessionId, sources]);
+    const nextStatus = JSON.stringify({ ...status, hasAnswer: Boolean(answer) });
+    const sessionChanged = snapshot.sessionId !== this.session;
+    this.session = snapshot.sessionId;
+    const sourcesChanged = nextSources !== this.sources;
+    const statusChanged = sourcesChanged || nextStatus !== this.status;
+    this.sources = nextSources; this.status = nextStatus;
+    return { sessionChanged, sourcesChanged, statusChanged };
+  }
+}

package/ui/rhine/source-reading.ts

@@ -0,0 +1,15 @@
+import type { ArchiveSource } from './types';
+
+/** A citation's reading position is independent of cumulative search/read receipts. */
+export function referenceSource(source: ArchiveSource, ref: { line_start?: number; line_end?: number }): ArchiveSource {
+  return ref.line_start ? { ...source, lineStart: ref.line_start, lineEnd: ref.line_end ?? ref.line_start,
+    readingRange: { start: ref.line_start, end: ref.line_end ?? ref.line_start } } : source;
+}
+
+export function resolveReadingSource(source: ArchiveSource, latest?: ArchiveSource): ArchiveSource {
+  return latest ? { ...latest, ...(source.readingRange ? { readingRange: source.readingRange } : {}) } : source;
+}
+
+export function readerStartLine(source: ArchiveSource) {
+  return Math.max(1, (source.readingRange?.start || source.readRanges?.[0]?.start || source.lineStart || 1) - 3);
+}

package/ui/rhine/source-selection.css

@@ -0,0 +1,164 @@
+/* Title-first selectors remain on the HUD plane; the physical archive stays behind them. */
+.rhine-workbench .rhine-original-stage{--choice-ink:#30382d;--choice-muted:#707461;--choice-rule:#7c81642e;--choice-font:max(17px,calc(14px / var(--stage-scale,1)))}
+.rhine-workbench [data-layout] .rhine-source-choice{display:grid;grid-template-columns:33px minmax(0,1fr) 16px;gap:10px;align-items:start;width:100%;height:auto;min-height:70px;margin:0;padding:10px 10px 10px 2px;border:0;border-bottom:1px solid var(--choice-rule);text-align:left;color:var(--choice-ink);background:transparent;transform:none;transition:background .18s,color .18s}
+.rhine-workbench [data-layout] .rhine-choice-number{font-size:11px;font-variant-numeric:tabular-nums;color:var(--choice-muted);padding-top:4px}
+.rhine-workbench [data-layout] .rhine-choice-copy{min-width:0;display:grid;gap:4px}
+.rhine-workbench [data-layout] .rhine-choice-copy strong{font-size:var(--choice-font);font-weight:500;line-height:1.45;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
+.rhine-workbench [data-layout] .rhine-choice-copy small{font-size:11px;line-height:1.5;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-choice-mark{font-size:16px;opacity:0;padding-top:2px;color:#62714e}
+.rhine-workbench [data-layout] .rhine-source-choice:is(:hover,:focus-visible,.selected,.is-selected){background:transparent;color:#283222;transform:none;border-bottom:1px solid #90967d70}
+.rhine-workbench [data-layout] .rhine-source-choice:is(.selected,.is-selected){box-shadow:inset 2px 0 #78835c;padding-left:9px}
+.rhine-workbench [data-layout] .rhine-source-choice:is(:hover,:focus-visible,.selected,.is-selected) .rhine-choice-mark{opacity:1}
+.rhine-workbench [data-layout] .rhine-source-choice:focus-visible{outline:1px solid #7a845e;outline-offset:-1px}
+.rhine-workbench [data-layout] .rhine-source-choice:is([data-state=read],[data-state=cited]) .rhine-choice-number{color:#52683e}
+.rhine-workbench :is(.file-ticks,.rhine-desk-list,.rhine-rack-index-list,.rhine-result-list){scrollbar-width:thin;scrollbar-color:#82877270 transparent;overscroll-behavior:contain;scroll-padding-block:5px}
+.rhine-workbench :is(.file-ticks,.rhine-desk-list,.rhine-rack-index-list,.rhine-result-list)::-webkit-scrollbar{width:4px}
+.rhine-workbench :is(.file-ticks,.rhine-desk-list,.rhine-rack-index-list,.rhine-result-list)::-webkit-scrollbar-track{background:transparent}
+.rhine-workbench :is(.file-ticks,.rhine-desk-list,.rhine-rack-index-list,.rhine-result-list)::-webkit-scrollbar-thumb{background:#82877270;border-radius:2px}
+.rhine-workbench :is(.file-ticks,.rhine-desk-list,.rhine-rack-index-list,.rhine-result-list)::-webkit-scrollbar-button{display:none}
+
+/* The array's former anonymous ticks are now a bounded title directory. */
+.rhine-workbench [data-layout] .archive-navigation{left:var(--edge);top:24%;bottom:235px;width:min(440px,32%);display:flex;flex-direction:column;align-items:stretch;gap:0;transform:none;background:transparent;padding:0 16px 0 0}
+.rhine-workbench [data-layout] .rhine-choice-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--choice-muted);font-size:10px;letter-spacing:1px;min-height:28px}
+.rhine-workbench [data-layout] .rhine-choice-heading button{font-size:12px;letter-spacing:0;min-height:32px;white-space:nowrap;color:var(--choice-ink)}
+.rhine-workbench [data-layout] .archive-navigation .column-navigation{position:static;display:flex;flex:none;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid #7c816461;padding:10px 0 14px;transform:none}
+.rhine-workbench .archive-navigation .column-navigation>div{flex:1;min-width:0;gap:4px}
+.rhine-workbench .archive-navigation .column-navigation strong{font-size:24px}
+.rhine-workbench .archive-navigation .column-navigation button{height:38px;width:30px;font-size:22px}
+.rhine-workbench [data-layout] .file-ticks{display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;max-width:none;flex:1;overflow:auto}
+.rhine-workbench [data-layout] .file-ticks button{flex:none;width:100%;height:auto;min-height:70px}
+.rhine-workbench [data-layout] .file-ticks button:before{display:none}
+.rhine-workbench [data-layout] .rhine-choice-footer{flex:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--choice-rule);font-size:11px;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-choice-footer button{font-size:12px;min-height:30px;color:var(--choice-ink)}
+.rhine-workbench [data-layout] .rhine-choice-footer button:disabled{opacity:.35}
+.rhine-workbench [data-layout] :is(.archive-counter,.archive-hint){display:none}
+
+/* A persistent header and reading action frame the scrollable shelf directory. */
+.rhine-workbench [data-layout] .rhine-desk-panel{left:var(--edge);top:21%;bottom:190px;width:min(460px,35%);max-height:none;overflow:visible;gap:0;background:transparent;padding-right:16px}
+.rhine-workbench [data-layout] .rhine-desk-panel h2{font-size:30px;margin:10px 0 5px}
+.rhine-workbench [data-layout] .rhine-desk-panel>.rhine-rack-intro{font-size:12px;line-height:1.6;margin:0 0 10px;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-desk-panel>:not(.rhine-shelf-navigation){flex:none}
+.rhine-workbench [data-layout] .rhine-shelf-search{display:flex;align-items:center;gap:9px;border-bottom:1px solid #7c816478;min-height:40px}
+.rhine-workbench [data-layout] .rhine-shelf-search>span{font-size:23px;color:#697153}
+.rhine-workbench [data-layout] .rhine-shelf-filter{background:transparent;border:0;outline:none;box-shadow:none;font:inherit;font-size:13px;min-width:0;flex:1;padding:10px 0;color:var(--choice-ink)}
+.rhine-workbench [data-layout] .rhine-shelf-filter::placeholder{color:#737665}
+.rhine-workbench [data-layout] .rhine-shelf-filter::-webkit-search-cancel-button{display:none}
+.rhine-workbench [data-layout] .rhine-shelf-search:focus-within{border-color:#65734c}
+.rhine-workbench [data-layout] .rhine-shelf-clear{width:30px;min-height:32px;font-size:19px}
+.rhine-workbench [data-layout] .rhine-rack-range{font-size:11px;color:var(--choice-muted);margin:10px 0 5px}
+.rhine-workbench [data-layout] .rhine-shelf-navigation{display:flex;flex:1;min-height:80px;gap:0;margin:0;align-items:stretch;order:1}
+.rhine-workbench [data-layout] .rhine-shelf-navigation>button{display:none}
+.rhine-workbench [data-layout] .rhine-desk-list{display:flex;flex-direction:column;min-height:0;overflow:auto;gap:0;padding-right:5px;border-bottom:1px solid var(--choice-rule)}
+.rhine-workbench [data-layout] .rhine-desk-item{flex:none;display:grid;font-size:inherit;text-align:left;border-bottom-width:1px;min-height:70px}
+.rhine-workbench [data-layout] .rhine-desk-pagination{order:2;display:flex;justify-content:space-between;align-items:center;padding:3px 0;margin:0;min-height:32px;color:var(--choice-muted);font-size:11px}
+.rhine-workbench [data-layout] .rhine-desk-pagination button{font-size:12px;min-height:30px}
+.rhine-workbench [data-layout] .rhine-desk-pagination[hidden]{display:none}
+.rhine-workbench [data-layout] .rhine-shelf-current{order:3;position:relative;border-block:0;border-top:1px solid #7c816461;padding:12px 0 0;margin:0}
+.rhine-workbench [data-layout] .rhine-shelf-number{font-size:11px;display:block;padding-right:100px}
+.rhine-workbench [data-layout] .rhine-shelf-title{font-size:17px;line-height:1.5;margin:10px 0 6px;-webkit-line-clamp:2}
+.rhine-workbench [data-layout] .rhine-shelf-meta{font-size:11px;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-shelf-excerpt{font-size:12px;line-height:1.6;-webkit-line-clamp:2;margin:6px 0;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-shelf-open{position:absolute;right:0;top:3px;width:auto;gap:12px;min-height:34px;margin:0;font-size:13px;color:#39482c}
+.rhine-workbench [data-layout] .rhine-rack-directory{order:4;min-height:34px;margin-top:5px;font-size:12px;border-top:1px solid var(--choice-rule)}
+.rhine-workbench [data-layout] .rhine-rack-legend,.rhine-workbench [data-layout] .rhine-shelf-report{display:none}
+
+/* Directory, extracts and receipts use the same thin, translucent reading surface. */
+.rhine-workbench [data-layout] :is(.rhine-results,.rhine-rack-index,.rhine-basket,.rhine-log).modal-backdrop{background:linear-gradient(90deg,#eeece57a,#eeece5c9 28%,#eeece5b3 75%,#eeece573);backdrop-filter:blur(7px);padding:0}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal){width:min(1250px,calc(100% - 2 * var(--edge)));max-width:none;height:78%;max-height:880px;min-height:0;padding:24px 28px 18px;background:linear-gradient(115deg,#f1efe668,#f1efe624);border:0;border-block:1px solid #83896e70;box-shadow:none;color:var(--choice-ink)}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal) .modal-top{padding-bottom:10px;min-height:40px;font-size:11px;border-bottom:1px solid var(--choice-rule)}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal) .modal-top button{font-size:12px;gap:12px;color:#4a553c}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal) h2{font-size:30px;font-weight:500;letter-spacing:0;margin:20px 0 18px;gap:18px}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal) h2 small{font-size:11px;letter-spacing:1.7px;color:var(--choice-muted)}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal) .search-field{height:48px;gap:16px;border-bottom:1px solid #6f7959}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal) .search-field input{font-size:16px;background:transparent;border:0;box-shadow:none;outline:none}
+.rhine-workbench [data-layout] :is(.rhine-index-modal,.rhine-rack-index-modal) .search-field:focus-within{box-shadow:0 1px #6f7959}
+.rhine-workbench [data-layout] .rhine-index-modal .category-filters{gap:20px;padding:13px 0 9px}
+.rhine-workbench [data-layout] .rhine-index-modal .category-filters button{min-height:32px;font-size:13px}
+.rhine-workbench [data-layout] .rhine-index-modal .rhine-query-actions{font-size:12px;margin-top:10px}
+.rhine-workbench [data-layout] .rhine-index-modal .rhine-search-submit{font-size:13px;min-height:38px}
+.rhine-workbench [data-layout] .rhine-index-modal .result-header{display:flex;justify-content:space-between;color:var(--choice-muted);font-size:10px;padding:10px 0;border-block:1px solid var(--choice-rule)}
+.rhine-workbench [data-layout] .rhine-result-summary{position:static;margin:0;padding:9px 0;font-size:11px;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-result-item{display:grid;grid-template-columns:minmax(0,1fr) 175px;gap:30px;padding:16px 10px 18px 0;border-bottom:1px solid var(--choice-rule)}
+.rhine-workbench [data-layout] .rhine-result-open strong{font-size:20px;line-height:1.5;font-weight:500;margin-top:6px;overflow-wrap:anywhere}
+.rhine-workbench [data-layout] .rhine-result-open p{font-size:13px;line-height:1.75;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-result-item:hover{background:#eff0e138}
+.rhine-workbench [data-layout] .rhine-result-meta{font-size:11px;gap:12px;align-items:flex-start}
+.rhine-workbench [data-layout] .rhine-result-meta button{font-size:12px;min-height:26px}
+.rhine-workbench [data-layout] .rhine-rack-index-item{grid-template-columns:60px minmax(0,1fr) 195px;gap:18px;padding:20px 4px;border-bottom:1px solid var(--choice-rule);align-items:baseline}
+.rhine-workbench [data-layout] .rhine-rack-index-item strong{font-size:19px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}
+.rhine-workbench [data-layout] .rhine-rack-index-item span{font-size:11px;line-height:1.6;color:var(--choice-muted)}
+.rhine-workbench [data-layout] .rhine-rack-index-list{margin-top:15px}
+.rhine-workbench [data-layout] .rhine-index-modal .modal-bottom{position:static;margin-top:12px;padding:12px 0 0;font-size:9px;border-top:1px solid var(--choice-rule)}
+
+.rhine-workbench [data-layout=compact] .archive-navigation{top:22%;bottom:174px;width:34%;padding-right:10px}
+.rhine-workbench [data-layout=compact] .rhine-desk-panel{top:19%;bottom:160px;width:38%;padding-right:12px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]){--choice-font:15px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-choice-copy small{font-size:10px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-choice-heading>span{font-size:9px;letter-spacing:.5px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-choice-heading button{font-size:11px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-shelf-excerpt{display:none}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-desk-panel h2{font-size:24px;margin:6px 0}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-shelf-title{font-size:15px;margin:7px 0 4px;-webkit-line-clamp:1}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) .rhine-source-choice{gap:7px;grid-template-columns:26px minmax(0,1fr) 12px;padding-block:10px;min-height:60px}
+.rhine-workbench :is([data-layout=compact],[data-layout=portrait]) :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal){height:90%;padding:12px 18px;overflow:hidden}
+.rhine-workbench [data-layout=portrait] .archive-navigation{top:48%;bottom:183px;left:var(--edge);width:calc(100% - 2 * var(--edge));padding:0;background:transparent}
+.rhine-workbench [data-layout=portrait] .archive-navigation .column-navigation{padding:3px 0 6px;gap:8px}
+.rhine-workbench [data-layout=portrait] .archive-navigation .column-navigation>div{display:flex;align-items:baseline;justify-content:space-between}
+.rhine-workbench [data-layout=portrait] .archive-navigation .column-navigation strong{font-size:18px}
+.rhine-workbench [data-layout=portrait] .rhine-choice-heading{min-height:24px}
+.rhine-workbench [data-layout=portrait] .rhine-choice-footer{padding:4px 0}
+.rhine-workbench [data-layout=portrait] .rhine-desk-panel{left:var(--edge);top:31%;bottom:175px;width:calc(100% - 2 * var(--edge));padding:0;background:transparent}
+.rhine-workbench [data-layout=portrait] .rhine-desk-panel>.rhine-rack-intro{display:none}
+.rhine-workbench [data-layout=portrait] .rhine-shelf-current{padding-top:8px}
+.rhine-workbench [data-layout=portrait] .rhine-desk-pagination{padding:2px 0;min-height:28px}
+.rhine-workbench [data-layout=portrait] :is(.rhine-index-modal,.rhine-rack-index-modal,.rhine-basket-modal,.rhine-log-modal) h2{font-size:24px;margin:12px 0}
+.rhine-workbench [data-layout=portrait] .rhine-index-modal .category-filters{gap:6px 15px;padding:8px 0}
+.rhine-workbench [data-layout=portrait] .rhine-index-modal .category-filters button{font-size:12px;min-height:26px}
+.rhine-workbench [data-layout=portrait] .rhine-result-item{grid-template-columns:minmax(0,1fr);gap:12px;padding:15px 0}
+.rhine-workbench [data-layout=portrait] .rhine-result-meta{flex-direction:row;flex-wrap:wrap;gap:6px 14px;align-items:center}
+.rhine-workbench [data-layout=portrait] .rhine-result-meta>span{width:100%}
+.rhine-workbench [data-layout=portrait] .rhine-result-open strong{font-size:17px}
+.rhine-workbench [data-layout=portrait] .rhine-rack-index-item{grid-template-columns:38px minmax(0,1fr);gap:8px;padding:14px 0}
+.rhine-workbench [data-layout=portrait] .rhine-rack-index-item strong{font-size:16px}
+.rhine-workbench [data-layout=portrait] .rhine-rack-index-item span{grid-column:2}
+.rhine-workbench [data-layout=portrait] .rhine-result-summary{font-size:10px}
+@media(max-height:600px){
+ .rhine-workbench [data-layout=compact] :is(.archive-navigation,.rhine-desk-panel){top:110px;bottom:128px}
+ .rhine-workbench [data-layout=compact] .rhine-desk-panel>.rhine-rack-intro{display:none}
+ .rhine-workbench [data-layout=compact] .rhine-shelf-meta{display:none}
+ .rhine-workbench [data-layout=compact] .rhine-shelf-title{-webkit-line-clamp:1;margin:5px 0}
+ .rhine-workbench [data-layout=compact] .rhine-shelf-current{padding-top:6px}
+}
+/* Leave the list more room than the already selected item's summary. */
+.rhine-workbench [data-layout] .rhine-shelf-excerpt{display:none}
+.rhine-workbench [data-layout] .rhine-shelf-current{padding:10px 0 8px}
+.rhine-workbench [data-layout] .rhine-shelf-meta{display:none}
+.rhine-workbench [data-layout] .rhine-shelf-title{margin:8px 0 0}
+.rhine-workbench [data-layout] .rhine-rack-directory{padding:6px 0;margin-top:0}
+.rhine-workbench [data-layout] .rhine-desk-list{gap:0}
+.rhine-workbench [data-layout] .rhine-array-read{display:none}
+.rhine-workbench [data-layout=portrait] .rhine-array-read{display:block}
+.rhine-workbench [data-layout=portrait] .rhine-choice-heading>span{display:none}
+.rhine-workbench [data-layout=portrait] .rhine-investigation-brief{top:175px;bottom:auto;max-height:calc(43% - 195px)}
+.rhine-workbench [data-layout=portrait] .rhine-investigation-brief .rhine-current-source{display:none}
+.rhine-workbench [data-layout=portrait] .archive-navigation{top:43%;bottom:218px}
+.rhine-workbench [data-layout=portrait] .rhine-desk-panel{top:29%;bottom:218px}
+.rhine-workbench [data-layout=portrait] .rhine-desk-panel>.tiny-label{font-size:10px}
+.rhine-workbench [data-layout=portrait] .rhine-shelf-navigation{margin-top:0}
+.rhine-workbench [data-layout=portrait] .rhine-shelf-title{font-size:14px}
+
+/* The directory is an on-demand control, with the same unfilled HUD as the brief. */
+.rhine-workbench [data-layout] .archive-navigation[hidden],
+.rhine-workbench [data-layout] .rhine-array-toggle[hidden]{display:none}
+.rhine-workbench [data-layout] .rhine-array-toggle{position:absolute;left:var(--edge);bottom:235px;display:flex;align-items:center;gap:12px;min-height:38px;font-size:13px;color:#414b36;background:none;border:0;border-bottom:1px solid #7c81644a;padding:6px 0}
+.rhine-workbench [data-layout] .rhine-array-toggle>span{font-size:18px}
+.rhine-workbench [data-layout] .rhine-array-toggle small{font-size:10px;color:#747863;font-weight:400}
+.rhine-workbench [data-layout] .rhine-array-toggle:hover{color:#25371f;border-color:#78835c}
+.rhine-workbench [data-layout] .rhine-array-toggle:focus-visible{outline:1px solid #78835c;outline-offset:4px}
+.rhine-workbench [data-layout] .rhine-array-collapse{color:#646e54}
+.rhine-workbench [data-layout] .archive-navigation[inert]{pointer-events:none}
+.rhine-workbench [data-layout=compact] .rhine-array-toggle{bottom:174px;font-size:12px}
+.rhine-workbench [data-layout=portrait] .rhine-array-toggle{bottom:218px;font-size:12px}
+.rhine-workbench [data-layout=portrait][data-array-list=closed] .rhine-investigation-brief{max-height:calc(100% - 455px)}
+.rhine-workbench [data-layout=portrait][data-array-list=closed] .rhine-investigation-brief .rhine-current-source{display:block}
+@media(max-height:600px){.rhine-workbench [data-layout=compact] .rhine-array-toggle{bottom:128px}}

package/ui/rhine/temporary-performance-observers.ts

@@ -0,0 +1,163 @@
+// TEMPORARY RHINE PROFILER: observers exist only during an explicitly started capture.
+import { RenderPerformanceCapture } from './temporary-performance.ts';
+import type { DiagnosticChannel } from './temporary-performance.ts';
+
+type Entry = Record<string, unknown>;
+const number = (value: unknown) => typeof value === 'number' && Number.isFinite(value) ? value : null;
+const fields = (entry: Entry, keys: string[]) => Object.fromEntries(keys.map(key => [key, number(entry[key])]));
+const relative = (value: unknown, origin: number) => typeof value === 'number' && value > 0 ? value - origin : null;
+const allowed = (value: unknown, list: string[]) => typeof value === 'string' && list.includes(value) ? value : 'other';
+
+/** Only authored public asset names; never export arbitrary URLs or document IDs. */
+export function resourceIdentity(value: unknown) {
+  if (typeof value !== 'string') return null;
+  try {
+    const name = new URL(value, 'https://local.invalid').pathname.split('/').pop() || '';
+    return ['archive-cassette.glb', 'archive-assembly.glb', 'rhine.js', 'rhine.css', 'client.js', 'evidence-observatory.webp'].includes(name)
+      ? name : /^MiSans-(Light|Regular|Medium|Demibold|Semibold|SemiBold|Bold)\.woff2?$/.test(name) ? name : null;
+  } catch { return null; }
+}
+function surface(node: unknown) {
+  if (typeof Element === 'undefined' || !(node instanceof Element)) return 'unknown';
+  for (const [selector, name] of [['.rhine-perf-tools', 'profiler'], ['.rhine-reader', 'reader'],
+    ['.rhine-report', 'report'], ['.model-viewer', 'viewer'], ['.rhine-case', 'status'], ['canvas', 'canvas']]) {
+    if (node.closest(selector)) return name;
+  }
+  return 'other-ui';
+}
+export function resourceKind(value: unknown) {
+  if (typeof value !== 'string') return 'unknown';
+  try {
+    const path = new URL(value, 'https://local.invalid').pathname;
+    if (/\/rhine\.js$/.test(path)) return 'rhine-bundle';
+    if (/\/client\.js$/.test(path)) return 'host-client';
+    if (/\.(woff2?|ttf|otf)$/i.test(path)) return 'font';
+    if (/\.(glb|gltf)$/i.test(path)) return 'model';
+    if (/\.(png|jpg|jpeg|webp|avif|svg)$/i.test(path)) return 'image';
+    if (/\.css$/i.test(path)) return 'stylesheet';
+    if (/\.(m?js)$/i.test(path)) return 'other-script';
+    return 'other';
+  } catch { return 'unknown'; }
+}
+export function sanitizePerformanceEntry(type: string, entry: Entry, origin: number): Record<string, unknown> {
+  if (type === 'long-animation-frame') {
+    const scripts = Array.isArray(entry.scripts) ? entry.scripts : [];
+    return { ...fields(entry, ['duration', 'blockingDuration']),
+      renderStart: relative(entry.renderStart, origin), styleAndLayoutStart: relative(entry.styleAndLayoutStart, origin),
+      firstUIEventTimestamp: relative(entry.firstUIEventTimestamp, origin),
+      scriptsTotal: scripts.length, scriptsOmitted: Math.max(0, scripts.length - 16),
+      scripts: scripts.slice(0, 16).map((value: Entry) => ({
+        source: resourceKind(value.sourceURL), asset: resourceIdentity(value.sourceURL),
+        invokerType: allowed(value.invokerType, ['event-listener', 'user-callback', 'resolve-promise', 'reject-promise', 'classic-script', 'module-script']),
+        windowAttribution: allowed(value.windowAttribution, ['self', 'same-origin-ancestor', 'same-origin-descendant', 'same-origin', 'cross-origin-ancestor', 'cross-origin-descendant', 'cross-origin', 'other']),
+        executionStart: relative(value.executionStart, origin),
+        ...fields(value, ['duration', 'pauseDuration', 'forcedStyleAndLayoutDuration', 'sourceCharPosition']),
+      })) };
+  }
+  if (type === 'event') return {
+    event: allowed(entry.name, ['click', 'pointerdown', 'pointerup', 'mousedown', 'mouseup', 'keydown', 'keyup', 'touchstart', 'touchend', 'input', 'change']),
+    ...fields(entry, ['duration', 'interactionId']),
+    inputDelayMs: typeof entry.processingStart === 'number' && typeof entry.startTime === 'number' ? entry.processingStart - entry.startTime : null,
+    processingMs: typeof entry.processingStart === 'number' && typeof entry.processingEnd === 'number' ? entry.processingEnd - entry.processingStart : null,
+  };
+  if (type === 'resource') return {
+    resource: resourceKind(entry.name), asset: resourceIdentity(entry.name),
+    initiator: allowed(entry.initiatorType, ['fetch', 'xmlhttprequest', 'script', 'css', 'img', 'link', 'other']),
+    ...fields(entry, ['duration', 'transferSize', 'encodedBodySize', 'decodedBodySize', 'responseStatus']),
+    responseStart: relative(entry.responseStart, origin), responseEnd: relative(entry.responseEnd, origin),
+  };
+  if (type === 'layout-shift') return { value: number(entry.value), hadRecentInput: entry.hadRecentInput === true,
+    surfaces: [...new Set((Array.isArray(entry.sources) ? entry.sources : []).map((source: Entry) => surface(source.node)))] };
+  return { duration: number(entry.duration) };
+}
+
+export function observePerformance(capture: RenderPerformanceCapture, root: HTMLElement, state: () => unknown = () => null) {
+  const observers: { observer: PerformanceObserver; consume: (entries: PerformanceEntry[]) => void }[] = [];
+  const events = new AbortController();
+  const types: [string, DiagnosticChannel | 'longtask'][] = [
+    ['longtask', 'longtask'], ['long-animation-frame', 'longAnimationFrames'],
+    ['event', 'interactions'], ['resource', 'resources'], ['layout-shift', 'layoutShifts'],
+  ];
+  for (const [type, channel] of types) {
+    const supported = typeof PerformanceObserver !== 'undefined' && PerformanceObserver.supportedEntryTypes?.includes(type) === true;
+    const capability: { supported: boolean; active: boolean; reason: string } = capture.capabilities[type] = { supported, active: false, reason: supported ? '' : 'unsupported' };
+    if (type === 'longtask') capture.longTasksSupported = supported;
+    if (!supported) continue;
+    const consume = (entries: PerformanceEntry[]) => {
+      if (!entries.length) return;
+      const start = performance.now();
+      for (const entry of entries) {
+        if (channel === 'longtask') capture.addLongTask(entry.startTime, entry.duration);
+        else {
+          const detail = sanitizePerformanceEntry(type, entry as unknown as Entry, capture.startedAt);
+          if (type === 'event') {
+            capture.diagnostic('interactionSummary', { kind: detail.event, durationMs: detail.duration,
+              inputDelayMs: detail.inputDelayMs, processingMs: detail.processingMs }, entry.startTime);
+            // Hover/movement entries have interactionId=0 and formerly exhausted
+            // the raw channel. Keep real interactions and slow anonymous events.
+            if (!(Number(detail.interactionId) > 0 || Number(detail.duration) >= 48)) continue;
+          }
+          capture.diagnostic(channel, detail, entry.startTime);
+        }
+      }
+      capture.diagnostic('overhead', { kind: 'observer', entryType: type, entries: entries.length, durationMs: performance.now() - start }, start);
+    };
+    let observer: PerformanceObserver | undefined;
+    try {
+      observer = new PerformanceObserver(list => consume(list.getEntries()));
+      // Event Timing has a browser minimum threshold (16ms), and rounds durations.
+      observer.observe({ type, buffered: false, ...(type === 'event' ? { durationThreshold: 16 } : {}) } as PerformanceObserverInit);
+      observers.push({ observer, consume }); capability.active = true; capability.reason = '';
+    } catch {
+      observer?.disconnect(); capability.reason = 'observe-failed';
+      if (type === 'longtask') capture.longTasksSupported = false;
+    }
+  }
+  const memory = () => {
+    const heap = (performance as unknown as { memory?: { usedJSHeapSize: number; totalJSHeapSize: number; jsHeapSizeLimit: number } }).memory;
+    return heap ? { usedJSHeapSize: heap.usedJSHeapSize, totalJSHeapSize: heap.totalJSHeapSize, jsHeapSizeLimit: heap.jsHeapSizeLimit } : null;
+  };
+  capture.capabilities['js-heap'] = { supported: memory() !== null, active: memory() !== null, reason: 'Chromium estimate; may be shared/rounded; no GC attribution' };
+  let expected = performance.now() + 1000;
+  const heartbeat = (initial = false) => {
+    const start = performance.now();
+    if (!capture.running) return;
+    capture.diagnostic('heartbeat', {
+      timerDelayMs: initial ? null : Math.max(0, start - expected),
+      hidden: document.hidden, focused: document.hasFocus(), visibility: document.visibilityState,
+      viewport: { width: innerWidth, height: innerHeight, dpr: devicePixelRatio,
+        visualWidth: visualViewport?.width ?? null, visualHeight: visualViewport?.height ?? null, visualScale: visualViewport?.scale ?? null },
+      fonts: document.fonts?.status ?? null, heap: memory(), pendingGpu: capture.pendingGpu,
+      renderers: capture.rendererStates(), workbench: state(), loading: capture.loadingState(),
+    }, start);
+    expected = start + 1000;
+    capture.diagnostic('overhead', { kind: 'heartbeat', durationMs: performance.now() - start }, start);
+  };
+  heartbeat(true);
+  const interval = window.setInterval(heartbeat, 1000);
+  const lifecycle = (kind: string, detail?: unknown) => capture.mark(kind, detail);
+  for (const name of ['focus', 'blur']) window.addEventListener(name, () => lifecycle('window-' + name), { signal: events.signal });
+  for (const name of ['pagehide', 'pageshow']) window.addEventListener(name, event => {
+    capture.breakTimeline(name); lifecycle(name, { persisted: (event as PageTransitionEvent).persisted });
+  }, { signal: events.signal });
+  for (const name of ['freeze', 'resume']) document.addEventListener(name, () => capture.breakTimeline(name), { signal: events.signal });
+  window.addEventListener('resize', () => lifecycle('viewport-resize', { width: innerWidth, height: innerHeight, dpr: devicePixelRatio }), { signal: events.signal });
+  let lastWheel = -Infinity;
+  for (const name of ['pointerdown', 'wheel', 'keydown']) root.addEventListener(name, event => {
+    if (!capture.running) return;
+    if (name === 'wheel') { if (performance.now() - lastWheel < 150) return; lastWheel = performance.now(); }
+    const target = event.target instanceof Element ? event.target : null;
+    const surface = target?.closest('.rhine-perf-tools') ? 'profiler' : target?.closest('.model-viewer') ? 'viewer' : target?.tagName === 'CANVAS' ? 'scene' : 'ui';
+    capture.mark('input', { type: name, surface, trusted: event.isTrusted,
+      ...(name === 'keydown' ? { key: allowed((event as KeyboardEvent).key, ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Enter', 'Escape', 'Tab', 'Home', 'End', 'PageUp', 'PageDown', ' ']) } : {}) });
+  }, { signal: events.signal, capture: true, passive: true });
+  window.addEventListener('error', event => lifecycle('runtime-error', {
+    kind: event instanceof ErrorEvent ? 'script' : 'resource',
+    ...(event instanceof ErrorEvent ? { source: resourceKind(event.filename), line: event.lineno, column: event.colno } : {}),
+  }), { signal: events.signal, capture: true });
+  window.addEventListener('unhandledrejection', () => lifecycle('unhandled-rejection'), { signal: events.signal });
+  return () => {
+    clearInterval(interval); events.abort();
+    for (const { observer, consume } of observers) { consume(observer.takeRecords()); observer.disconnect(); }
+  };
+}

package/ui/rhine/temporary-performance-panel.ts

@@ -0,0 +1,124 @@
+// TEMPORARY RHINE PROFILER — remove this module and its marked workbench hooks after testing.
+import { RenderPerformanceCapture, liveFrameSummary } from './temporary-performance';
+import { observePerformance } from './temporary-performance-observers';
+import './temporary-performance.css';
+
+const ms = (n: number | null | undefined) => n == null ? '—' : n.toFixed(2);
+const count = (n: number | null | undefined) => n == null ? '—' : Math.round(n).toLocaleString();
+const states: Record<string, string> = { array: '阵列', rack: '档案架', detail: '抽出 / 阅读', travel: '移动到档案架', viewer: '360° 模型' };
+const stateLabel = (state: string) => state.split(':').map(s => states[s] || ({ search: '检索', activity: '资料动画' }[s]) || s).join(' · ');
+
+export function mountTemporaryPerformancePanel(root: HTMLElement, metadata: () => unknown, state: () => unknown = () => null) {
+  const capture = new RenderPerformanceCapture();
+  capture.longTasksSupported = typeof PerformanceObserver !== 'undefined' && PerformanceObserver.supportedEntryTypes?.includes('longtask') === true;
+  const container = document.createElement('div');
+  container.className = 'rhine-perf-tools';
+  container.innerHTML = `<button type="button" class="rhine-perf-toggle" aria-expanded="false">性能测试 · 临时</button>
+    <section class="rhine-perf-panel" aria-label="临时渲染性能测试" hidden>
+      <header><strong>性能诊断 / v3.10</strong><button type="button" data-perf="close" aria-label="收起性能面板">收起 ×</button></header>
+      <p>保持日常使用即可，收起面板仍采集完整日志。可先录制 120 秒静置，再单独录制操作过程。</p>
+      <div class="rhine-perf-controls"><label>时长 <select aria-label="性能测试时长"><option value="30">30 秒</option><option value="60" selected>60 秒</option><option value="120">120 秒</option></select></label><button type="button" data-perf="start">开始测试</button><button type="button" data-perf="stop" disabled>停止</button><button type="button" data-perf="export" disabled>导出 JSON</button></div>
+      <div class="rhine-perf-controls"><label><input type="checkbox" data-perf="gpu" checked> GPU 计时</label><label><input type="checkbox" data-perf="detailed" checked> 详细诊断（抽样）</label><button type="button" data-perf="mark" disabled>标记刚才的卡顿</button><span>关闭详细诊断或 GPU 计时可对照采集开销</span></div>
+      <div class="rhine-perf-status" role="status">尚未开始</div>
+      <div class="rhine-perf-current">请等模型载入后开始。</div>
+      <canvas width="680" height="110" class="rhine-perf-chart" aria-label="最近 120 帧的实际回调间隔曲线，横线为 16.7 与 33.3 毫秒"></canvas>
+      <table><caption>最近 2 秒（最多 512 帧）· 单位 ms</caption><thead><tr><th>测量项</th><th>平均</th><th>P95</th><th>P99</th><th>最高</th></tr></thead><tbody></tbody></table>
+      <div class="rhine-perf-resources"></div><div class="rhine-perf-gpu"></div><div class="rhine-perf-tasks"></div>
+      <details><summary>如何读数</summary><p>实际回调间隔越长，停顿越明显；RAF 时间戳差单独保留在日志中。P95 表示 95% 的样本不超过此值。60 帧的单帧预算是 16.7 ms。FPS 是渲染回调频率，不保证屏幕实际呈现帧数。</p><p>CPU 是场景更新和绘制提交耗时；GPU 包含阴影、透射与后处理。两者不能相加，也不代表占用率。表格只统计最近窗口，全程数据和精确累计分位数保留在导出中。日志还记录绘制阶段、场景构成、资源加载生命周期、界面更新、长动画帧、交互延迟和后台档案准备。浏览器不支持的项目会明确注明。</p><p>资源显示数量，无法读取整卡显存或 GPU 占用率。切到后台时断开帧间隔统计，恢复后继续。首次出现的卡顿会保留；可先预热，再另开一次测试。记录只导出到本机；不采集正文或输入内容。JS 堆是浏览器估值，不能据此直接判断泄漏。新测试会覆盖未导出的记录。</p></details>
+    </section>`;
+  root.append(container); // Outside the scaled stage and viewer's inert siblings.
+  const get = <T extends HTMLElement = HTMLElement>(selector: string) => container.querySelector<T>(selector)!;
+  const toggle = get<HTMLButtonElement>('.rhine-perf-toggle'), panel = get('.rhine-perf-panel');
+  const start = get<HTMLButtonElement>('[data-perf=start]'), stop = get<HTMLButtonElement>('[data-perf=stop]');
+  const download = get<HTMLButtonElement>('[data-perf=export]');
+  const labels = ['实际回调间隔', 'RAF 调度滞后', '帧外空档', 'CPU 场景帧', 'GPU 帧区间 / 分段合计', '逐帧采集开销'];
+  const tbody = get('tbody');
+  const cells = labels.map(label => {
+    const row = document.createElement('tr'), heading = document.createElement('th');
+    heading.textContent = label; row.append(heading);
+    const values = Array.from({ length: 4 }, () => document.createElement('td'));
+    row.append(...values); tbody.append(row); return values;
+  });
+  const textNodes = new Map<string, HTMLElement>();
+  const setText = (selector: string, text: string) => {
+    let node = textNodes.get(selector);
+    if (!node) { node = get(selector); textNodes.set(selector, node); }
+    if (node.textContent !== text) node.textContent = text;
+  };
+  const graph = get<HTMLCanvasElement>('canvas'), graphContext = graph.getContext('2d');
+  const detailed = get<HTMLInputElement>('[data-perf=detailed]');
+  const gpu = get<HTMLInputElement>('[data-perf=gpu]'), marker = get<HTMLButtonElement>('[data-perf=mark]');
+  let interval = 0, active = true, disconnect: (() => void) | undefined, collecting = false;
+  const events = new AbortController();
+  const finishObserver = () => {
+    disconnect?.(); disconnect = undefined;
+    if (collecting) { capture.endMetadata = metadata(); collecting = false; }
+  };
+  const paint = () => {
+    const paintStart = performance.now();
+    capture.poll();
+    if (!capture.running) finishObserver();
+    toggle.textContent = capture.running ? `● 测试中 ${Math.floor(capture.elapsedMs / 1000)}s` : '性能测试 · 临时';
+    if (!panel.hidden) {
+      const samples = capture.samples, latest = samples.at(-1);
+      const recentEnd = capture.running ? capture.elapsedMs : latest?.at || 0;
+      const summary = liveFrameSummary(samples, recentEnd);
+      const recentMean = summary.callbackMs.mean;
+      const fps = recentMean ? 1000 / recentMean : null;
+      start.disabled = capture.running || capture.pendingGpu > 0;
+      stop.disabled = !capture.running; download.disabled = !capture.startedISO || capture.running || capture.pendingGpu > 0;
+      gpu.disabled = capture.running || capture.pendingGpu > 0; detailed.disabled = gpu.disabled; marker.disabled = !capture.running;
+      start.textContent = samples.length ? '开始新测试' : '开始测试';
+      setText(".rhine-perf-status", `${capture.running ? !active || document.hidden ? '采样中 · 页面未激活' : '采样中' : samples.length ? '已停止' : '尚未开始'} · ${(capture.elapsedMs / 1000).toFixed(1)}s · ${samples.length} 帧${capture.pendingGpu ? ` · GPU 待回读 ${capture.pendingGpu}` : ''}`);
+      setText(".rhine-perf-current", latest ? `${stateLabel(latest.state)} · 最近 2 秒 ${ms(fps)} 回调/秒 · ${latest.width} × ${latest.height}${summary.truncated ? ' · 已达 512 帧窗口上限' : ''} · 加载中 ${capture.loadingState().active.length}` : '请等模型载入后开始。');
+      [summary.callbackMs, summary.rafLagMs, summary.outsideFrameMs, summary.cpuMs, summary.gpuMs, summary.probeMs]
+        .forEach((d, row) => [d.mean, d.p95, d.p99, d.max].forEach((value, col) => {
+          const text = ms(value); if (cells[row][col].textContent !== text) cells[row][col].textContent = text;
+        }));
+      setText(".rhine-perf-resources", latest ? `最近一帧：${count(latest.triangles)} 三角形 / ${latest.calls} 次绘制（含多遍）\n资源：${latest.geometries} 几何 / ${latest.textures} 纹理 / ${latest.programs} 着色程序` : '');
+      const adapter = capture.adapters.find(a => a.name === latest?.renderer);
+      setText(".rhine-perf-gpu", adapter ? `${adapter.software ? '软件渲染器 · 不能代表硬件表现\n' : ''}${adapter.renderer}\n${!capture.options.gpuTiming ? '本次已关闭 GPU 计时，仍记录 CPU 和浏览器诊断。' : adapter.gpuTimerSupported ? `窗口内 GPU 有效样本 ${summary.gpuMs.count}/${summary.frames}；全程统计见导出` : '浏览器不支持 GPU 计时；GPU 耗时不作推算。'}` : '');
+      setText(".rhine-perf-tasks", `窗口内实际回调间隔 >50ms：${summary.callbackOver50ms} 次；RAF >50ms：${summary.over50ms} 次\n${capture.longTasksSupported ? `页面长任务：${capture.longTasks.length} 次，最长 ${ms(capture.longTaskMaxMs)} ms` : '浏览器不支持页面长任务观测'}\n长动画帧：${capture.capabilities['long-animation-frame']?.active ? capture.diagnostics.longAnimationFrames.length + ' 次' : '不可用'}；交互记录：${capture.diagnostics.interactions.length}；心跳：${capture.diagnostics.heartbeat.length}`);
+      if (graphContext) {
+        const ctx = graphContext, tail = samples.slice(-120);
+        const ceiling = Math.max(50, ...tail.map(s => s.callbackIntervalMs || 0));
+        ctx.clearRect(0, 0, graph.width, graph.height);
+        ctx.font = '18px sans-serif';
+        for (const line of [16.67, 33.34]) { const y = 108 - line / ceiling * 98; ctx.strokeStyle = '#bbc0b3'; ctx.beginPath(); ctx.moveTo(0, y); ctx.lineTo(680, y); ctx.stroke(); ctx.fillStyle = '#676e5f'; if (ceiling < 90) ctx.fillText(`${line.toFixed(1)} ms`, 6, y - 2); }
+        if (ceiling >= 90) ctx.fillText('16.7 / 33.3 ms', 6, 100);
+        ctx.fillText(`${Math.ceil(ceiling)} ms`, 565, 20);
+        ctx.strokeStyle = '#96734d'; ctx.lineWidth = 2; ctx.beginPath();
+        let move = true;
+        tail.forEach((s, i) => { if (s.callbackIntervalMs === null) { move = true; return; } const x = i / 119 * 680, y = 108 - s.callbackIntervalMs / ceiling * 98; if (move) ctx.moveTo(x, y); else ctx.lineTo(x, y); move = false; }); ctx.stroke();
+      }
+    }
+    capture.diagnostic('overhead', { kind: 'panel', visible: !panel.hidden, durationMs: performance.now() - paintStart }, paintStart);
+    if (!capture.running && !capture.pendingGpu) { clearInterval(interval); interval = 0; }
+  };
+  const wake = () => { if (!interval) interval = window.setInterval(paint, 1000); paint(); };
+  const show = (visible: boolean) => { capture.mark('profiler-panel', { visible }); panel.hidden = !visible; toggle.setAttribute('aria-expanded', String(visible)); wake(); };
+  toggle.addEventListener('click', () => show(panel.hidden));
+  get('[data-perf=close]').addEventListener('click', () => { show(false); toggle.focus(); });
+  start.addEventListener('click', () => {
+    finishObserver(); capture.start(metadata(), Number(get<HTMLSelectElement>('select').value), { gpuTiming: gpu.checked, detailed: detailed.checked }); collecting = true;
+    disconnect = observePerformance(capture, root, () => ({ active, state: state() }));
+    capture.mark('profiler-panel', { visible: !panel.hidden });
+    wake();
+  });
+  marker.addEventListener('click', () => capture.mark('user-hitch-marker'));
+  stop.addEventListener('click', () => { capture.stop(); paint(); });
+  download.addEventListener('click', () => {
+    if (capture.running || capture.pendingGpu) return;
+    const blob = new Blob([JSON.stringify(capture.report(), null, 2)], { type: 'application/json' });
+    const url = URL.createObjectURL(blob), link = document.createElement('a');
+    link.href = url; link.download = `rhine-performance-${capture.startedISO.replace(/[:.]/g, '-')}.json`; link.click();
+    window.setTimeout(() => URL.revokeObjectURL(url), 1000);
+  });
+  // Local keyboard/wheel interaction must not rotate or navigate the model behind the panel.
+  for (const name of ['keydown', 'wheel', 'pointerdown']) container.addEventListener(name, e => e.stopPropagation());
+  document.addEventListener('visibilitychange', () => capture.breakTimeline(document.hidden ? 'hidden' : 'visible'), { signal: events.signal });
+  return { capture,
+    setActive(value: boolean) { if (active !== value) capture.breakTimeline(value ? 'workbench-active' : 'workbench-inactive'); active = value; },
+    dispose() { capture.stop('dispose'); finishObserver(); clearInterval(interval); events.abort(); capture.dispose(); container.remove(); },
+  };
+}

package/ui/rhine/temporary-performance.css

@@ -0,0 +1,19 @@
+/* TEMPORARY RHINE PROFILER: no blur/filter, animations, or full-screen compositing layer. */
+.rhine-workbench .rhine-perf-tools{position:absolute;right:12px;bottom:10px;z-index:300;font:12px/1.5 system-ui,sans-serif;color:#262b24;text-align:left}
+.rhine-workbench .rhine-perf-tools button,.rhine-workbench .rhine-perf-tools select{font:inherit;color:inherit;background:#f1f1e9;border:1px solid #b8bdad;border-radius:3px;padding:5px 8px;cursor:pointer;letter-spacing:0}
+.rhine-workbench .rhine-perf-tools button:disabled{opacity:.45;cursor:default}
+.rhine-workbench .rhine-perf-tools button:focus-visible,.rhine-workbench .rhine-perf-tools select:focus-visible{outline:2px solid #647749;outline-offset:2px}
+.rhine-workbench .rhine-perf-toggle{float:right}
+.rhine-workbench .rhine-perf-panel{position:absolute;bottom:38px;right:0;width:min(380px,calc(100vw - 24px));max-height:calc(100dvh - 76px);overflow:auto;box-sizing:border-box;background:#f4f4ed;border:1px solid #abb29f;padding:14px;border-radius:5px;box-shadow:0 3px 16px #0002}
+.rhine-workbench .rhine-perf-panel header,.rhine-workbench .rhine-perf-controls{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
+.rhine-workbench .rhine-perf-panel p{margin:8px 0;color:#656c60;font-size:11px}
+.rhine-workbench .rhine-perf-status{margin-top:10px;color:#536440}
+.rhine-workbench .rhine-perf-current{font-variant-numeric:tabular-nums;margin-top:6px}
+.rhine-workbench .rhine-perf-chart{width:100%;height:55px;margin-top:10px}
+.rhine-workbench .rhine-perf-panel table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
+.rhine-workbench .rhine-perf-panel caption{text-align:left;font-size:10px;color:#656c60}
+.rhine-workbench .rhine-perf-panel th,.rhine-workbench .rhine-perf-panel td{padding:4px;text-align:right;border-bottom:1px solid #d8dccf}
+.rhine-workbench .rhine-perf-panel th:first-child{text-align:left;font-weight:400}
+.rhine-workbench .rhine-perf-resources,.rhine-workbench .rhine-perf-gpu,.rhine-workbench .rhine-perf-tasks{font-size:11px;margin-top:8px;white-space:pre-line;overflow-wrap:anywhere}
+.rhine-workbench .rhine-perf-panel details{border-top:1px solid #d8dccf;margin-top:10px;padding-top:8px;font-size:11px}
+.rhine-workbench .rhine-perf-panel summary{cursor:pointer}