TheriapolisV3/_design_handoff/character_creation/IMPLEMENTATION_STATUS.md

Character Creation — Implementation Status

Last updated: 2026-04-25 Source design: from_design/ (React/HTML/CSS prototype produced by Claude Design) Implementation: Theriapolis.Game/Screens/CharacterCreationScreen.cs Helpers: Theriapolis.Game/UI/CodexCopy.cs (skill / language / item / class-clade copy)

The React prototype in from_design/ is the canonical design reference. Keep it intact as a snapshot; this document records what the C# / Myra port preserves, adapts, and defers.

Faithful ports ✓

• 7-step wizard structure — Clade → Species → Calling → History → Abilities → Skills → Sign. Matches the design's STEPS array in app.jsx.
• Stepper at top with locked / active / completed states — uses ✓ / ✕ / Roman numerals as visual marks. Locked steps are disabled buttons; the user can always click backward to revisit completed folios.
• Aside summary panel on the right — name, lineage, calling+history, abilities (with mods applied), skills counter. Updates live as the player builds the character.
• Validation contract — every step has ValidateStep(int) → string?; Next is disabled while the current step is invalid; Confirm is disabled unless every step is valid. Messages match the design's vocabulary.
• All four content collections — clades, species, classes, backgrounds — rendered from the same JSON the design used. Filtering rules (species filtered to selected clade, skills filtered to class options) match.
• Class↔clade recommendations — the "★ Suits Clade" badge on the Calling cards uses the same lookup table from the design's CLASS_CLADE_REC. Informational only; doesn't gate selection.
• Standard Array vs 4d6-drop-lowest — both methods supported. The roll seed formula worldSeed ^ RNG_STAT_ROLL ^ msSinceGameStart (locked by the Phase 5 plan §4.2 / DESIGN_INTENT.md) is preserved; tests inject msOverride.
• Auto-assign + Clear — match the design's affordances. Auto-assign honours already-pinned abilities and fills the rest from the pool by class-primary priority.
• Roll history — last 3 prior rolls displayed when in roll mode (just like the React prototype's "Previous rolls:" line).
• Skills grouped by ability — same layout. Background-sealed skills are pre-checked and locked; class-pickable skills show a counter ("N / required chosen"); skills not on the class's offered list are disabled with [—] markers.
• Review step — name input + summary blocks for lineage, calling+history, final abilities, skills, starting kit. Each block has an "Edit ›" link back to the relevant earlier step. Starting kit reads from ClassDef.StartingKit (same as M3).

Adapted (not 1:1, but functionally equivalent)

• Drag-and-drop stat assignment → click-pick-then-click-place. Myra doesn't ship native drag-drop. The pool shows clickable value buttons; a selected value is bracketed ([15]); the next ability slot click consumes it. Click a filled slot to return its value to the pool. Same end state as drag-drop; one extra click per assignment.
• Hover popovers → "Selected" detail panel. Trait/skill/feature descriptions surface in the bottom of the aside panel when the relevant card is clicked, instead of on hover. Myra has no rich tooltip system; building one would mean a custom popup widget. Click-to-show is a reasonable substitute for keyboard-and-controller futures too.
• Card grid with wrapping → fixed-width buttons in rows of 2 or 3. Myra has no native flex-wrap container, so each step's grid is hand-laid with HorizontalStackPanels of fixed-width TextButtons. Each card is a multi-line button (name on line 1, mods/stats on line 2, features/traits on line 3). Less pretty than the design's framed cards but information-equivalent.
• Predator/prey clade grouping — kept as section headers between rows ("── Predators ──", "── Prey ──") instead of separately styled groups, since Myra has no rich section-divider widget.
• Folio numerals + "Codex of Becoming" header — preserved as text ("Folio I of VII — Clade") even without serif fonts to render it ceremonial. The aesthetic gap is the next item.

Deferred (visual / aesthetic gap)

The React prototype's "illuminated codex" art direction — parchment-paper background, gilded accents (--gild, --seal), serif display fonts (Cormorant Garamond, Cinzel), monospace tags (JetBrains Mono), section rules with ornament glyphs — is not portable to Myra without custom theming work.

Myra theming requires:

1. A theme.json declaring colors + brushes
2. Custom SpriteFont builds for the serif/display fonts
3. Optional 9-slice background brushes for card frames
4. A Stylesheet instance the Desktop loads at startup

For M5 ship-point, the C# wizard uses Myra's default fonts + a semi-transparent dark panel (Color(15, 15, 25, 220)). The visual polish is M6+ theming work — when we tackle it, the design's index.html <style> block (font choices, color variables, density tokens) is the source of truth.

Specific gaps worth tracking:

• No portrait component (the design has a placeholder silhouette/heraldry panel in the aside).
• No "scent aura" highlight behind selected cards.
• No bonus pill with sourced popover — bonus tags currently render as text "(+1 from clade+species)" instead of clickable chips.
• No language hover chips — language list shows as a plain comma- separated string.
• No fonts that match the codex tone — Myra default font only.

Out of scope (matches the design's "Known caveats")

• No save/load mid-creation — wizard is in-memory; close before confirm = start over. Same as the React prototype.
• No subclass selection — both implementations defer this to a level-up flow; subclass features are filtered out of the displayed level-1 feature list.
• No tool/weapon proficiency display — present in data, not surfaced.
• No equipment substitution — the starting kit is what the class config says it is; player can't swap items at creation time.

How to refresh this comparison

1. If Claude Design ships an updated prototype: replace the contents of from_design/ with the new zip, then update this file and the matching sections of IMPLEMENTATION_STATUS.md.
2. If the C# implementation gains a feature from the "Deferred" list, move that bullet up to "Faithful ports" or "Adapted".
3. If the underlying schema changes (e.g. a new field on ClassDef), refresh the snapshot in MANIFEST.md's file list and re-run the bundled refresh command.