v0.3 Phase 5d: Files page migrated to quietware skeleton

Same gated-layout pattern as Phase 5c. v0.2 surface untouched;
quietware path renders FilesPage via LumotiaPageSkeleton with the
four zones the page actually needs:

  Capture header    "File transcription" + "Transcribe audio files locally."
  Primary surface   drop zone / progress / transcript states
  Action dock       Browse files / Copy / Export
  Mono footer       formats · model · Local only

State + handlers preserved.

  fileTranscript, segments, isDragOver, progress, progressText,
  fileName, error, transcribing, showExportMenu — all unchanged.

  handleBrowse, transcribeFiles, copyAll, handleExport — all
  unchanged. Tauri drag-drop listeners stay live on onMount; new
  MutationObserver for data-design joins them.

Primary surface state machine.

  transcribing      Upload icon, "Transcribing" label, mono file
                    name, LumotiaProgress (tone="transcribing", so
                    the blue Phase 4k progress fill applies).
                    Progress text below.

  empty             Dashed drop zone using --button-primary-bg
                    accent when isDragOver, neutral subtle border
                    otherwise. Empty-state typography mirrors
                    Dictation: Young Serif italic "Drop an audio
                    file.", Work Sans support, format list in
                    JetBrains Mono.

  has transcript    Full-bleed editable textarea.

Action dock.

  Browse files (primary when no transcript; secondary when transcript
  exists — at that point Export becomes the primary action).
  Copy (tertiary, disabled until transcript exists).
  Export (LumotiaMenu trigger — primary when transcript exists,
  secondary otherwise).

  Disabled controls render neutral per the Phase 4k token contract.

Mono footer.

  Single line: "MP3 · WAV · M4A · MP4 · FLAC · OGG · {model} · Local only"

Capture script updated.

  scripts/capture-quietware-screenshots.mjs now navigates to the
  Files page via the sidebar nav button after capturing the root
  route, and screenshots both quietware modes.

Verified.

  - npm run check: 0 errors, 0 warnings across 5707 files.
  - Headless captures confirm the new layout in both modes:
    drop zone + action dock + mono footer with the right Phase 4j
    colour grammar applied. Browse Files blue primary, disabled
    actions neutral, dashed border picks up --button-primary-bg
    when isDragOver.

Phase 5e (Tasks) and 5f (History) follow same pattern.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

scripts/capture-quietware-screenshots.mjs

@@ -83,5 +83,25 @@ try {
   console.error(`root route skipped: ${e.message}`);
 }
 
+// Files page — SPA navigation via the sidebar item.
+try {
+  console.log("\n=== files page (best effort) ===");
+  await page.evaluate(() => {
+    const items = Array.from(document.querySelectorAll('button, a, [role="button"], li'));
+    const target = items.find(el => (el.textContent || "").trim().toLowerCase() === "files");
+    if (target) target.click();
+  });
+  await page.waitForTimeout(1500);
+  for (const mode of MODES.slice(1, 3)) {
+    await setMode(mode);
+    await page.waitForTimeout(400);
+    const file = `${OUT}/files__${mode.id}.png`;
+    await page.screenshot({ path: file, fullPage: false });
+    console.log(`  files ${mode.id}`);
+  }
+} catch (e) {
+  console.error(`files page skipped: ${e.message}`);
+}
+
 await browser.close();
 console.log(`\nWrote screenshots to ${OUT}/`);