feat: communicate exploration zone unlock conditions in-game (#74)

## Summary

- Locked exploration zones now show a `🔒 This zone is locked. Unlock exploration by:` hint above the area list, with the specific `⚔️ Defeat: {boss}` and `📜 Complete: {quest}` required
- Updated the About panel's Exploration how-to-play entry to document the zone unlock rule explicitly
- No new data required — unlock conditions are read directly from `zone.unlockBossId` and `zone.unlockQuestId` already in state

## Test plan

- [ ] Verify locked exploration zones display the correct boss and quest unlock hints
- [ ] Verify already-unlocked zones show no hint
- [ ] Verify starter zone (no unlock conditions) shows no hint
- [ ] Verify the About panel Exploration entry reflects the updated description
- [ ] Confirm lint, build, and tests all pass

Closes #59

Reviewed-on: #74
Co-authored-by: Hikari <hikari@nhcarrigan.com>
Co-committed-by: Hikari <hikari@nhcarrigan.com>

apps/web/src/components/game/explorationPanel.tsx

@@ -6,6 +6,7 @@
  */
 /* eslint-disable max-lines-per-function -- Complex component with many render paths */
 /* eslint-disable complexity -- Complex component with many conditional render paths */
+/* eslint-disable max-lines -- Exploration panel requires many render paths and result display */
 import { type JSX, useState } from "react";
 import { useGame } from "../../context/gameContext.js";
 import { EXPLORATION_AREAS } from "../../data/explorations.js";
@@ -91,7 +92,24 @@ const ExplorationPanel = (): JSX.Element => {
     );
   }
 
-  const { zones, exploration: explorationState } = state;
+  const { zones, exploration: explorationState, bosses, quests } = state;
+
+  const activeZone = zones.find((zone) => {
+    return zone.id === activeZoneId;
+  });
+  const zoneIsLocked = activeZone?.status === "locked";
+  const unlockBoss = activeZone?.unlockBossId === null
+    || activeZone?.unlockBossId === undefined
+    ? undefined
+    : bosses.find((boss) => {
+      return boss.id === activeZone.unlockBossId;
+    });
+  const unlockQuest = activeZone?.unlockQuestId === null
+    || activeZone?.unlockQuestId === undefined
+    ? undefined
+    : quests.find((quest) => {
+      return quest.id === activeZone.unlockQuestId;
+    });
 
   const zoneAreas = EXPLORATION_AREAS.filter((area) => {
     return area.zoneId === activeZoneId;
@@ -220,6 +238,27 @@ const ExplorationPanel = (): JSX.Element => {
         zones={zones}
       />
 
+      {zoneIsLocked && (unlockBoss !== undefined || unlockQuest !== undefined)
+        ? <div className="exploration-zone-locked-hint">
+          <p>{"🔒 This zone is locked. Unlock exploration by:"}</p>
+          {unlockBoss === undefined
+            ? null
+            : <p>
+              {"⚔️ Defeat: "}
+              {unlockBoss.name}
+            </p>
+          }
+          {unlockQuest === undefined
+            ? null
+            : <p>
+              {"📜 Complete: "}
+              {unlockQuest.name}
+            </p>
+          }
+        </div>
+        : null
+      }
+
       <div className="exploration-list">
         {zoneAreas.map((area) => {
           const areaState = explorationState?.areas.find((explorationArea) => {