---
phase: quick
plan: 260329-u4z
type: execute
wave: 1
depends_on: []
files_modified:
  - index.html
  - src/ui/screens.ts
  - src/companion/fallbacks.ts
  - src/app.ts
  - CLAUDE.md
autonomous: true
---

<objective>
Replace ae/oe/ue transliterations with proper German umlauts in all user-visible UI strings, and document the convention in CLAUDE.md.

Purpose: A 7-year-old child should see correct German text, not ASCII transliterations.
Output: All hardcoded UI strings use proper umlauts; CLAUDE.md convention documented.
</objective>

<context>
@CLAUDE.md
@index.html
@src/ui/screens.ts
@src/companion/fallbacks.ts
@src/app.ts
</context>

<tasks>

<task type="auto">
  <name>Task 1: Replace ae/oe/ue transliterations with proper umlauts in all UI-visible strings</name>
  <files>index.html, src/ui/screens.ts, src/companion/fallbacks.ts, src/app.ts</files>
  <action>
Replace the following transliterations with proper German umlauts in user-visible hardcoded strings only. Do NOT modify code identifiers, variable names, or any strings sent as API parameters.

**index.html** (line 34, 134, 138):
- "Waehle" -> "Wähle"
- "uebe" -> "übe"
- "Uebung" -> "Übung"
- "waechst" -> "wächst"
- "Naechstes" -> "Nächstes"
- "Uebungstage" -> "Übungstage"
- "Haeufigste" -> "Häufigste"

**src/ui/screens.ts** (lines 111, 114, 164, 165, 369):
- "Naechstes" -> "Nächstes"
- "schoener" -> "schöner"
- "ueben" -> "üben"
- "Druecke" -> "Drücke"
- "herunterfaellt" -> "herunterfällt"
- "Woerter" -> "Wörter"
- "grosse" -> "große"
- "drueckst" -> "drückst"

**src/companion/fallbacks.ts** (lines 29, 59, 72, 73, 75, 76, 90, 100, 133):
- "Frueh" -> "Früh"
- "schoensten" -> "schönsten"
- "Schoen" -> "Schön"
- "Gluehwuermchen" -> "Glühwürmchen"
- "waechst" -> "wächst"
- "naechstes" -> "nächstes"
- "Baeumen" -> "Bäumen"
- "Stueck" -> "Stück"
- "schoen" -> "schön"
- "veraendert" -> "verändert"
- "Spuerst" -> "Spürst"
- "Huegel" -> "Hügel"
- "grosse" -> "große"
- "drueckst" -> "drückst"
- "druecken" -> "drücken"
- "Oe" -> "Ö" (in the text "Das Oe mit den zwei Punkten")

**src/app.ts** (comments only, lines 115, 121):
- "ueben" -> "üben" (in comment)
- "Zurueck" -> "Zurück" (in comment)

These are ALL user-visible strings. Do not touch the Gemini API prompt strings in companion.ts (those already use proper umlauts).
  </action>
  <verify>
    <automated>cd /home/dev/workspace/zauberwald && grep -rn "uebe\|Ueb\|waechst\|Naechst\|naechst\|drueck\|Drueck\|faellt\|Woerter\|schoen\|Schoen\|grosse\|Grosse\|Stueck\|Baeumen\|veraendert\|Spuerst\|Huegel\|Gluehwuerm\|Waehle\|Haeufigste\|Frueh" --include="*.html" --include="*.ts" src/ index.html | grep -v node_modules | grep -v ".planning" ; echo "EXIT:$?"</automated>
  </verify>
  <done>Zero matches from grep -- all ae/oe/ue transliterations in UI strings replaced with proper German umlauts. The app displays correct German text to the child.</done>
</task>

<task type="auto">
  <name>Task 2: Document umlaut convention in CLAUDE.md</name>
  <files>CLAUDE.md</files>
  <action>
In CLAUDE.md, replace the "## Conventions" section content (between the GSD markers) with actual convention text. Keep the GSD comment markers intact. Replace:

```
Conventions not yet established. Will populate as patterns emerge during development.
```

With:

```
- Immer deutsche Umlaute (ä, ö, ü, Ä, Ö, Ü, ß) in UI-Texten verwenden, niemals ae/oe/ue Transliterierung.
```
  </action>
  <verify>
    <automated>cd /home/dev/workspace/zauberwald && grep -c "Immer deutsche Umlaute" CLAUDE.md</automated>
  </verify>
  <done>CLAUDE.md Conventions section contains the umlaut convention rule. Future code generation will follow this convention.</done>
</task>

</tasks>

<verification>
1. `grep` for transliteration patterns returns zero matches in .ts and .html files
2. CLAUDE.md contains the new convention
3. `npx vite build` completes without errors (no broken strings)
</verification>

<success_criteria>
- All user-visible German text uses proper umlauts
- CLAUDE.md documents the convention for future work
- Build passes
</success_criteria>

<output>
After completion, update .planning/quick/260329-u4z-deutsche-umlaute-in-ui-texten-und-claude/ with summary.
</output>