Give users a race that provides passive bonuses and flavor!

interface Race {
  id: string;
  name: string;
  description: string;
  lore: string;
  icon: string;
  passives: RacialPassive[];
  startingStats: Partial<CharacterStats>;
}

interface RacialPassive {
  name: string;
  description: string;
  effect: PassiveEffect;
}

┌─────────────────────────────────────────────────────┐
│  ⚔️ CHOOSE YOUR ORIGIN                              │
├─────────────────────────────────────────────────────┤
│                                                     │
│  🧝 ELF                    🧔 DWARF                 │
│  ┌─────────────┐          ┌─────────────┐          │
│  │   [image]   │          │   [image]   │          │
│  │ +20% MP     │          │ +20% HP     │          │
│  │ +2 INT      │          │ +10% Gold   │          │
│  └─────────────┘          └─────────────┘          │
│                                                     │
│  👤 HUMAN                  💪 ORC                   │
│  ┌─────────────┐          ┌─────────────┐          │
│  │   [image]   │          │   [image]   │          │
│  │ +10% XP     │          │ Pressure    │          │
│  │ Versatile   │          │ Bonus       │          │
│  └─────────────┘          └─────────────┘          │
│                                                     │
└─────────────────────────────────────────────────────┘

The class tree is 4 → 8 → 3: four base classes, eight advanced classes (one parent each) and three crown classes (two advanced parents each). The shipped version is deliberately smaller than the old 28-class sketch: every class has an icon the app already bundles and a passive built from fields the loop already reads, so it never complicates play. Rule zero stands: no class completes a chore.

graph TD
    W[Warrior] --> K[Knight]
    W --> B[Berserker]
    M[Mage] --> WM[White Mage]
    M --> BM[Black Mage]
    T[Thief] --> AS[Assassin]
    T --> R[Ranger]
    MK[Monk] --> MA[Martial Artist]
    MK --> MY[Mystic]

    K --> P[Paladin]
    MY --> P
    AS --> N[Ninja]
    B --> N
    WM --> S[Sage]
    MY --> S

Tier 1 (always open): Warrior, Mage, Thief, Monk. Tier 2 (advanced): the eight classes in the top half of the graph. Tier 3 (crown): Paladin, Ninja, Sage, each the meeting point of two advanced classes. The Mystic feeds both Paladin and Sage.

Levels are class levels (stats.classes[name].level, grown by the XP of the class the hero is playing), not the hero's level. The rule lives in JOB_UNLOCK_REQUIREMENTS (src/lib/services/stats/PlayerStatsService.ts); isClassUnlocked (ClassPassives.ts) reads it, and setJobClass refuses a sealed class.

A hero who already plays Paladin, Ninja or Sage keeps the class. Someone who opened one of them under the old rule (two base classes at 10) may now find it sealed again until the new parents reach 10; there is no migration.

• Advanced (tier 2): the parent's 15 base stats, each 10 % higher and rounded up (raiseBaseStats: integer maths, so 10 becomes 11), and the parent's level boosts. HP/MP rows in JOB_CLASS_BASE_STATS stay close to the parent and lean the way the class does; CLASS_LEVEL_BONUSES pays HP/MP per class level (Knight 6/1, Berserker 6/0, White Mage 2/5, Black Mage 1/6, Assassin 4/2, Ranger 3/3, Martial Artist 5/2, Mystic 3/4).
• Crown (tier 3): the average of the two advanced parents' base stats (averageBaseStats) and the union of their boosts (combineStatBoosts). Their HP/MP rows are the numbers they have always had, so no hero's maximum moves when the tree grows.
• Pillars (primary, secondary, tertiary): Knight Body, Legend, Heart · Berserker Body, Legend, Spirit · White Mage Mind, Heart, Legend · Black Mage Mind, Spirit, Legend · Assassin Spirit, Body, Legend · Ranger Spirit, Heart, Legend · Martial Artist Body, Spirit, Mind · Mystic Mind, Spirit, Body. Paladin, Ninja and Sage keep the pillars they had.

Each advanced class is its parent's passive plus one nudge made only of existing ClassPassive fields (see section C of Items and Classes Contract): Knight (wall + 5 % HP back), Berserker (35 % brace + 15 % HP back), White Mage (25 % MP discount + 20 % MP back + 10 % HP back), Black Mage (35 % MP discount + 10 % MP back), Assassin (90 % run + 30 % GP), Ranger (25 % GP + 1 minute), Martial Artist (2 minutes + 1 AP), Mystic (2 AP + 10 % MP back). Paladin, Ninja and Sage keep their passives.

Warrior (Lv 1)
├── Knight (Warrior 10) ─── the protector
│   └── Paladin (Knight 10 + Mystic 10)
└── Berserker (Warrior 10) ─── the sprinter
    └── Ninja (Assassin 10 + Berserker 10)

Mage (Lv 1)
├── White Mage (Mage 10) ─── the healer
│   └── Sage (White Mage 10 + Mystic 10)
└── Black Mage (Mage 10) ─── the deep-focus caster

Thief (Lv 1)
├── Assassin (Thief 10) ─── in and out unseen
│   └── Ninja (Assassin 10 + Berserker 10)
└── Ranger (Thief 10) ─── the outdoor scout

Monk (Lv 1)
├── Martial Artist (Monk 10) ─── the daily drill
└── Mystic (Monk 10) ─── the calm one
    ├── Paladin (Knight 10 + Mystic 10)
    └── Sage (White Mage 10 + Mystic 10)

All icons come from the bundled Font Awesome duotone set (src/assets/fonts/font-awesome): Knight fa-helmet-battle, Berserker fa-axe-battle, White Mage fa-hand-holding-medical, Black Mage fa-meteor, Assassin fa-dagger, Ranger fa-bow-arrow, Martial Artist fa-hand-rock, Mystic fa-eye; Paladin fa-shield-cross, Ninja fa-user-ninja, Sage fa-hat-wizard. A child never reuses its base parent's exact icon, and tests/unit/ClassTree.spec.ts checks every icon against the font files.

See src/constants/JOB_CLASS_OPTIONS.ts for current classes:

• Warrior, Mage, Thief, Monk (base)
• Knight, Berserker, White Mage, Black Mage, Assassin, Ranger, Martial Artist, Mystic (advanced)
• Paladin, Ninja, Sage (crown)
• A few more are commented out for future use

See src/app/SideMenu/SwitchProfile/AddProfile/components/JobClassSelector.vue for:

• Class selection UI with radar charts
• Class descriptions and abilities
• Difficulty ratings and tags