# Minimalist Front Implementation Plan

> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.

**Goal:** Make the Transcript desktop UI quieter, more minimal, and better organized without adding dependencies.

**Architecture:** Keep the current vanilla TypeScript DOM structure. Use the shortest safe path: CSS cleanup/overrides, small copy changes, and one keyboard behavior fix. No component split in this pass.

**Tech Stack:** Tauri, TypeScript, Vite, Vitest, CSS.

---

### Task 1: Regression tests

**Files:**
- Modify: `src/app.test.ts`

- [ ] Add tests for Escape closing settings and minimalist CSS baseline.
- [ ] Run `npm test -- --run src/app.test.ts --reporter=verbose`; expect new tests to fail before implementation.

### Task 2: Behavior and copy polish

**Files:**
- Modify: `src/app.ts`

- [ ] Add Escape handling to close the settings modal.
- [ ] Rename technical settings labels to calmer user-facing labels.

### Task 3: Minimal visual pass

**Files:**
- Modify: `src/styles.css`

- [ ] Fix the invalid `height: 100dvh` declaration.
- [ ] Hide ambient decoration.
- [ ] Flatten shell, topbar, buttons, editor, settings, and dictation overlay.
- [ ] Keep reduced motion and existing accessibility styles.

### Task 4: Verification

**Files:**
- Read-only verification.

- [ ] Run `npm test -- --run`.
- [ ] Run `npm run build`.
- [ ] Run `cargo check --manifest-path src-tauri/Cargo.toml` through VS Build Tools environment.