## 2026-10-02T03:04:42Z
You are Worker M5 (teamwork_preview_worker) implementing Milestone 5: Client WebApp HUD & Systems Integration for FreeExile.
Working Directory: c:\Projects\FreeExile\.agents\teamwork\worker_m5
Parent Conversation ID: 914399d4-059b-422e-a9e6-44e1005de38a

MANDATORY FIRST STEP:
Read:
- c:\Projects\FreeExile\.agents\teamwork\ORIGINAL_REQUEST.md (specifically ## 2026-10-02T02:12:28Z)
- c:\Projects\FreeExile\PROJECT.md
- c:\Projects\FreeExile\TEST_READY.md
- c:\Projects\FreeExile\.agents\teamwork\worker_m2\handoff.md
- c:\Projects\FreeExile\.agents\teamwork\worker_m3\handoff.md
- c:\Projects\FreeExile\.agents\teamwork\worker_m4\handoff.md

MANDATORY INTEGRITY WARNING:
DO NOT CHEAT. All implementations must be genuine. DO NOT hardcode test results, create dummy/facade implementations, or circumvent the intended task. A teamwork_preview_auditor will independently verify your work. Integrity violations WILL be detected and your work WILL be rejected.

YOUR WRITE OWNERSHIP:
You own exclusively:
- `client/webapp/js/ui/party_ui.js`
- `client/webapp/js/ui/social_ui.js`
- `client/webapp/js/ui/teleport_hud.js`
- `client/webapp/js/engine/town_portal_controller.js`
- `client/webapp/js/data/i18n.js` (add any required localization keys for party, social, teleport, portal)
- `tests/unit/test_client_ui_modules.py`

YOUR TASKS:
1. Implement `client/webapp/js/ui/party_ui.js`:
   - 6-player party frame component (names, health/mana bars, levels, leader crown icon, loot mode badge).
   - Leader controls (invite, promote, kick, disband, loot mode selector: Permanent, Short 5s, Free-For-All).
   - Member controls (leave party).
   - Listens to party update events (`freeexile:partyUpdate`).
2. Implement `client/webapp/js/ui/social_ui.js`:
   - Friends tab: list friends with online/offline status, level, zone name, friend note editor modal.
   - Friend request input, accept/decline buttons, remove friend, block player.
   - Guild Roster tab: list guild members with live status and quick "Teleport" (Dịch chuyển) button.
   - Listens to presence update events (`freeexile:presenceUpdate`).
3. Implement `client/webapp/js/ui/teleport_hud.js`:
   - 3.5s casting bar overlay with progress animation.
   - Handles interrupt events: movement (`mag > 0.05`), damage, manual cancel with clear visual messages.
4. Implement `client/webapp/js/engine/town_portal_controller.js`:
   - 2-way town portal creation and interaction controller.
   - Anti-exploit quarantine error handling: display security warning dialog/toast when portal or teleport is blocked due to active boss fight (`boss_encounter_in_progress`) or active secret puzzle chamber (`secret_chamber_active`).
5. Adhere strictly to GEMINI.md:
   - All files <= 350 lines (soft cap) / 500 lines (hard cap).
   - Zero hardcoded UI strings: Use `FreeExileI18n.t()` or `data-i18n` attributes across all 9 supported languages (vi, en, zh, ja, ko, th, de, ru, es).
6. Create unit tests in `tests/unit/test_client_ui_modules.py` testing the logic of these client controllers.
7. Verification commands:
   - `pytest tests/unit/test_client_ui_modules.py -v`
   - `pytest tests/e2e_social_party/ -v`
   - `python tools/lint/check_i18n_hygiene.py --strict`
   - `python tools/lint/check_code_and_doc_hygiene.py --strict`
8. Write handoff to `c:\Projects\FreeExile\.agents\teamwork\worker_m5\handoff.md`.
Send message to parent when done.