Add HLL Vietnam release countdown

ai/tasks/done/TASK-233-add-hll-vietnam-release-countdown.md

@@ -0,0 +1,73 @@
+---
+id: TASK-233
+title: Add HLL Vietnam release countdown
+status: done
+type: frontend
+team: Frontend Senior
+supporting_teams: []
+roadmap_item: foundation
+priority: medium
+---
+
+# TASK-233 - Add HLL Vietnam release countdown
+
+## Goal
+
+Add a visible frontend-only countdown to the public home page for the Hell Let Loose Vietnam release date.
+
+## Context
+
+The home page is `frontend/index.html` and it loads `frontend/assets/js/main.js`, not `frontend/assets/js/index.js`. The countdown should work without backend support and should not affect other pages if the markup is absent.
+
+## Files Read First
+
+- `ai/architecture-index.md`
+- `ai/repo-context.md`
+- `ai/orchestrator/frontend-senior.md`
+- `frontend/index.html`
+- `frontend/assets/js/main.js`
+- `frontend/assets/css/styles.css`
+
+## Expected Files Modified
+
+- `frontend/index.html`
+- `frontend/assets/js/main.js`
+- `frontend/assets/css/styles.css`
+- this task file
+
+## Changes
+
+1. Added a semantic countdown block below the main trailer video.
+2. Added `data-hll-vietnam-countdown` and `data-countdown-target`.
+3. Used target date `2026-08-13T00:00:00+02:00`.
+4. Added frontend-only countdown logic in `main.js`.
+5. Rendered days, hours, minutes and seconds every second.
+6. Stopped the interval when the target date is reached.
+7. Prevented negative values by clamping remaining time to zero.
+8. Added a final available state message: `Hell Let Loose Vietnam ya esta disponible.`
+9. Added responsive CSS integrated with the existing tactical panel style.
+
+## Design Decision
+
+The countdown is placed below the video. This keeps it visually tied to the HLL Vietnam trailer while avoiding changes to the public hero or server sections.
+
+## Validation
+
+Passed:
+
+```powershell
+node --check frontend/assets/js/main.js
+```
+
+The implementation is guarded by `if (!root) return;`, so pages without the countdown block do not throw errors if they load the same JS.
+
+Manual logic review:
+
+- Target date parsed from `data-countdown-target`.
+- Days, hours, minutes and seconds are calculated from remaining seconds.
+- Values are clamped with `Math.max(0, ...)`.
+- After the target date, the UI shows the available message and the interval is cleared.
+
+## Outcome
+
+The public home now shows a responsive countdown below the main video for `2026-08-13T00:00:00+02:00`. No backend file or backend configuration was changed.