Update index.html

index.html

@@ -38,7 +38,7 @@
             padding: 20px;
             overflow-y: auto;
             background-color: #333;
-            min-width: 280px; /* Increased min-width slightly */
+            min-width: 280px;
             height: 100%;
             box-sizing: border-box;
             display: flex;
@@ -59,11 +59,14 @@
         #story-content {
             margin-bottom: 20px;
             line-height: 1.6;
-            flex-grow: 1; /* Let story content grow */
+            flex-grow: 1;
         }
         #story-content p { margin-bottom: 1em; }
         #story-content p:last-child { margin-bottom: 0; }
-        #story-content .sell-feedback { color: #9f9; font-style: italic; margin-top: 1em;} /* Feedback style */
+        #story-content .feedback-message { font-style: italic; margin-top: 1em; padding-left: 8px; border-left: 3px solid #888; } /* Generic feedback */
+        #story-content .feedback-success { color: #9f9; border-left-color: #4a4;} /* Success feedback */
+        #story-content .feedback-error { color: #f99; border-left-color: #a44;}   /* Error feedback */
+
 
         #stats-inventory-container {
             margin-bottom: 20px;
@@ -97,7 +100,7 @@
         #inventory-display .item-unknown { background-color: #555; border-color: #777;}
 
         #choices-container {
-            margin-top: auto; /* Push choices to bottom */
+            margin-top: auto;
             padding-top: 15px;
             border-top: 1px solid #555;
         }
@@ -115,15 +118,8 @@
         .choice-button:hover:not(:disabled) { background-color: #d4a017; color: #222; border-color: #b8860b; }
         .choice-button:disabled { background-color: #444; color: #888; cursor: not-allowed; border-color: #666; opacity: 0.7; }
 
-        /* Specific style for Sell buttons */
-        .sell-button {
-            background-color: #4a4a4a;
-            border-color: #6a6a6a;
-        }
-        .sell-button:hover:not(:disabled) {
-            background-color: #a07017; /* Different hover for sell */
-            border-color: #80500b;
-        }
+        .sell-button { background-color: #4a4a4a; border-color: #6a6a6a; }
+        .sell-button:hover:not(:disabled) { background-color: #a07017; border-color: #80500b; }
 
         .roll-success { color: #7f7; border-left: 3px solid #4a4; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
         .roll-failure { color: #f77; border-left: 3px solid #a44; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
@@ -160,6 +156,7 @@
     <script type="module">
         import * as THREE from 'three';
 
+        // DOM Element References (Checked - OK)
         const sceneContainer = document.getElementById('scene-container');
         const storyTitleElement = document.getElementById('story-title');
         const storyContentElement = document.getElementById('story-content');
@@ -167,10 +164,11 @@
         const statsElement = document.getElementById('stats-display');
         const inventoryElement = document.getElementById('inventory-display');
 
+        // Global Three.js Variables (Checked - OK)
         let scene, camera, renderer;
         let currentAssemblyGroup = null;
 
-        // --- Materials --- (Unchanged)
+        // Materials (Checked - OK)
         const stoneMaterial = new THREE.MeshStandardMaterial({ color: 0x888888, roughness: 0.8, metalness: 0.1 });
         const woodMaterial = new THREE.MeshStandardMaterial({ color: 0x8B4513, roughness: 0.7, metalness: 0 });
         const darkWoodMaterial = new THREE.MeshStandardMaterial({ color: 0x5C3D20, roughness: 0.7, metalness: 0 });
@@ -187,26 +185,37 @@
         const wetStoneMaterial = new THREE.MeshStandardMaterial({ color: 0x2F4F4F, roughness: 0.7 });
         const glowMaterial = new THREE.MeshStandardMaterial({ color: 0x00FFAA, emissive: 0x00FFAA, emissiveIntensity: 0.5 });
 
-        // --- Three.js Setup --- (Unchanged initThreeJS, onWindowResize, animate, createMesh, createGroundPlane)
+        // --- Three.js Setup --- (Checked - OK)
         function initThreeJS() {
-            if (!sceneContainer) { console.error("Scene container not found!"); return; }
-            scene = new THREE.Scene();
-            scene.background = new THREE.Color(0x222222);
-            const width = sceneContainer.clientWidth;
-            const height = sceneContainer.clientHeight;
-            camera = new THREE.PerspectiveCamera(75, (width / height) || 1, 0.1, 1000);
-            camera.position.set(0, 2.5, 7);
-            camera.lookAt(0, 0.5, 0);
-            renderer = new THREE.WebGLRenderer({ antialias: true });
-            renderer.setSize(width || 400, height || 300);
-            renderer.shadowMap.enabled = true;
-            renderer.shadowMap.type = THREE.PCFSoftShadowMap;
-            sceneContainer.appendChild(renderer.domElement);
-            const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
-            scene.add(ambientLight);
-            window.addEventListener('resize', onWindowResize, false);
-            setTimeout(onWindowResize, 100); // Adjust size shortly after init
-            animate();
+            if (!sceneContainer) { console.error("Scene container not found!"); return false; } // Return boolean on failure
+            try {
+                scene = new THREE.Scene();
+                scene.background = new THREE.Color(0x222222);
+                const width = sceneContainer.clientWidth;
+                const height = sceneContainer.clientHeight;
+                if (!width || !height) {
+                     console.warn("Scene container has zero dimensions initially.");
+                     // Use fallback or wait? For now, proceed but log.
+                 }
+                camera = new THREE.PerspectiveCamera(75, (width / height) || 1, 0.1, 1000);
+                camera.position.set(0, 2.5, 7);
+                camera.lookAt(0, 0.5, 0);
+                renderer = new THREE.WebGLRenderer({ antialias: true });
+                renderer.setSize(width || 400, height || 300); // Use fallback dimensions
+                renderer.shadowMap.enabled = true;
+                renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+                sceneContainer.innerHTML = ''; // Clear previous content/errors
+                sceneContainer.appendChild(renderer.domElement);
+                const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
+                scene.add(ambientLight);
+                window.addEventListener('resize', onWindowResize, false);
+                setTimeout(onWindowResize, 100);
+                animate();
+                return true; // Indicate success
+             } catch (error) {
+                 console.error("Error during Three.js initialization:", error);
+                 return false; // Indicate failure
+             }
         }
 
         function onWindowResize() {
@@ -217,18 +226,31 @@
                 camera.aspect = width / height;
                 camera.updateProjectionMatrix();
                 renderer.setSize(width, height);
+            } else {
+                console.warn("onWindowResize called with zero dimensions.");
             }
         }
 
         function animate() {
-            requestAnimationFrame(animate);
-            const time = performance.now() * 0.001;
-            scene.traverse(obj => {
-                if (obj.userData.update) obj.userData.update(time);
-            });
-            if (renderer && scene && camera) {
-                renderer.render(scene, camera);
-            }
+             // Guard against errors if renderer/scene is not valid
+             if (!renderer || !scene || !camera) {
+                 // console.warn("Animation loop called before Three.js fully initialized or after error.");
+                 return;
+             }
+             requestAnimationFrame(animate); // Request next frame first
+             try {
+                 const time = performance.now() * 0.001;
+                 scene.traverse(obj => {
+                     if (obj.userData && obj.userData.update && typeof obj.userData.update === 'function') {
+                         obj.userData.update(time);
+                     }
+                 });
+                 renderer.render(scene, camera);
+             } catch (error) {
+                 console.error("Error during animation/render loop:", error);
+                 // Optionally stop the loop or display an error overlay
+                 // For now, just log it to avoid crashing the browser if possible
+             }
         }
 
         function createMesh(geometry, material, position = { x: 0, y: 0, z: 0 }, rotation = { x: 0, y: 0, z: 0 }, scale = { x: 1, y: 1, z: 1 }) {
@@ -248,9 +270,8 @@
             return ground;
         }
 
-
-        // --- Procedural Generation Functions --- (Unchanged create...Assembly functions)
-        // [Keep all the create...Assembly functions from the previous listing here]
+        // --- Procedural Generation Functions --- (Checked - OK)
+        // [Keep all create...Assembly functions here - unchanged from previous]
         // ... (createDefaultAssembly, createCityGatesAssembly, ..., createDarkCaveAssembly) ...
         function createDefaultAssembly() { const group = new THREE.Group(); const sphereGeo = new THREE.SphereGeometry(0.5, 16, 16); group.add(createMesh(sphereGeo, stoneMaterial, { x: 0, y: 0.5, z: 0 })); group.add(createGroundPlane()); return group; }
         function createCityGatesAssembly() { const group = new THREE.Group(); const gh = 4, gw = 1.5, gd = 0.8, ah = 1, aw = 3; const tlGeo = new THREE.BoxGeometry(gw, gh, gd); group.add(createMesh(tlGeo, stoneMaterial, { x: -(aw / 2 + gw / 2), y: gh / 2, z: 0 })); const trGeo = new THREE.BoxGeometry(gw, gh, gd); group.add(createMesh(trGeo, stoneMaterial, { x: (aw / 2 + gw / 2), y: gh / 2, z: 0 })); const aGeo = new THREE.BoxGeometry(aw, ah, gd); group.add(createMesh(aGeo, stoneMaterial, { x: 0, y: gh - ah / 2, z: 0 })); const cs = 0.4; const cg = new THREE.BoxGeometry(cs, cs, gd * 1.1); for (let i = -1; i <= 1; i += 2) { group.add(createMesh(cg.clone(), stoneMaterial, { x: -(aw / 2 + gw / 2) + i * cs * 0.7, y: gh + cs / 2, z: 0 })); group.add(createMesh(cg.clone(), stoneMaterial, { x: (aw / 2 + gw / 2) + i * cs * 0.7, y: gh + cs / 2, z: 0 })); } group.add(createMesh(cg.clone(), stoneMaterial, { x: 0, y: gh + ah - cs / 2, z: 0 })); group.add(createGroundPlane(stoneMaterial)); return group; }
@@ -273,9 +294,8 @@
         function createHiddenCoveAssembly() { const group = new THREE.Group(); group.add(createGroundPlane(sandMaterial, 15)); const caveGeo = new THREE.BoxGeometry(3, 2.5, 3); const caveMat = new THREE.MeshStandardMaterial({ color: 0x111111 }); group.add(createMesh(caveGeo, caveMat, { z: -6, y: 1.25 })); const rockGeo = new THREE.SphereGeometry(0.5, 6, 6); const rockMat = wetStoneMaterial.clone(); for (let i = 0; i < 15; i++) { group.add(createMesh(rockGeo, rockMat, { x: (Math.random() - 0.5) * 12, y: 0.25, z: (Math.random() - 0.5) * 12 }, { y: Math.random() * Math.PI })); } const seaweedGeo = new THREE.ConeGeometry(0.2, 1.2, 6); const seaweedMat = leafMaterial.clone().set({ color: 0x1E4D2B }); for (let i = 0; i < 10; i++) { group.add(createMesh(seaweedGeo, seaweedMat, { x: (Math.random() - 0.5) * 10, y: 0.6, z: (Math.random() - 0.5) * 10 + 2 }, { x: (Math.random() - 0.5) * 0.2, z: (Math.random() - 0.5) * 0.2 })); } return group; }
         function createDarkCaveAssembly() { const group = new THREE.Group(); const caveRadius = 5; const caveHeight = 4; group.add(createGroundPlane(wetStoneMaterial, caveRadius * 2)); const wallGeo = new THREE.SphereGeometry(caveRadius, 32, 16, 0, Math.PI * 2, 0, Math.PI / 1.5); const wallMat = wetStoneMaterial.clone(); wallMat.side = THREE.BackSide; const wall = new THREE.Mesh(wallGeo, wallMat); wall.position.y = caveHeight * 0.6; group.add(wall); const stalactiteGeo = new THREE.ConeGeometry(0.1, 0.8, 8); const stalagmiteGeo = new THREE.ConeGeometry(0.15, 0.5, 8); for (let i = 0; i < 15; i++) { const x = (Math.random() - 0.5) * caveRadius * 1.5; const z = (Math.random() - 0.5) * caveRadius * 1.5; if (Math.random() > 0.5) { group.add(createMesh(stalactiteGeo, wetStoneMaterial, { x: x, y: caveHeight - 0.4, z: z })) } else { group.add(createMesh(stalagmiteGeo, wetStoneMaterial, { x: x, y: 0.25, z: z })) } } const dripGeo = new THREE.SphereGeometry(0.05, 8, 8); for (let i = 0; i < 5; i++) { const drip = createMesh(dripGeo, oceanMaterial, { x: (Math.random() - 0.5) * caveRadius, y: caveHeight - 0.2, z: (Math.random() - 0.5) * caveRadius }); drip.userData.startY = caveHeight - 0.2; drip.userData.update = (time) => { drip.position.y -= 0.1; if (drip.position.y < 0) { drip.position.y = drip.userData.startY; drip.position.x = (Math.random() - 0.5) * caveRadius; drip.position.z = (Math.random() - 0.5) * caveRadius; } }; group.add(drip); } return group; }
 
-
         // ========================================
-        // Game Data
+        // Game Data (Checked - OK, added goldValue)
         // ========================================
         const itemsData = {
             "Flaming Sword":      {type:"weapon", description:"A legendary blade, wreathed in magical fire.", goldValue: 500},
@@ -284,153 +304,125 @@
             "Healing Light Spell":{type:"spell",  description:"A scroll containing the incantation to mend minor wounds.", goldValue: 50},
             "Shield of Faith Spell":{type:"spell",description:"A scroll containing a prayer that grants temporary magical protection.", goldValue: 75},
             "Binding Runes Scroll":{type:"spell", description:"Complex runes scribbled on parchment, said to temporarily immobilize a foe.", goldValue: 100},
-            "Secret Tunnel Map":  {type:"quest",  description:"A crudely drawn map showing a hidden path, perhaps into the fortress?", goldValue: 5}, // Quest items low value?
+            "Secret Tunnel Map":  {type:"quest",  description:"A crudely drawn map showing a hidden path, perhaps into the fortress?", goldValue: 0}, // Quest items non-sellable
             "Poison Daggers":     {type:"weapon", description:"A pair of wicked-looking daggers coated in a fast-acting toxin.", goldValue: 150},
-            "Master Key":         {type:"quest",  description:"An ornate key rumored to unlock many doors, though perhaps not all.", goldValue: 10},
+            "Master Key":         {type:"quest",  description:"An ornate key rumored to unlock many doors, though perhaps not all.", goldValue: 0},
             "Crude Dagger":       {type:"weapon", description:"A roughly made dagger, chipped and stained.", goldValue: 10},
-            "Scout's Pouch":      {type:"quest",  description:"A small leather pouch containing flint & steel, jerky, and some odd coins.", goldValue: 20} // Value includes contents
-            // TODO: Add more items
+            "Scout's Pouch":      {type:"quest",  description:"A small leather pouch containing flint & steel, jerky, and some odd coins.", goldValue: 20} // Pouch itself has value
         };
 
-        const gameData = {
-            // --- Start and Crossroads ---
-            "1": { title: "The Crossroads", content: `<p>Dust swirls around a weathered signpost under a bright, midday sun. Paths lead north into the gloomy Shadowwood, east towards rolling green hills, and west towards coastal cliffs battered by sea spray. Which path calls to you?</p>`, options: [ { text: "Enter the Shadowwood Forest (North)", next: 5 }, { text: "Head towards the Rolling Hills (East)", next: 2 }, { text: "Investigate the Coastal Cliffs (West)", next: 3 } ], illustration: "crossroads-signpost-sunny" },
-
-            // --- Eastern Path: Hills -> Badlands ---
-            "2": { title: "Rolling Hills", content: `<p>Verdant hills stretch before you, dotted with wildflowers. A gentle breeze whispers through the tall grass. In the distance, you see a lone figure tending to a flock of sheep. It feels peaceful, almost unnervingly so after the crossroads.</p>`, options: [ { text: "Follow the narrow path winding through the hills", next: 4 }, { text: "Try to hail the distant shepherd (Charisma Check?)", next: 99 } ], illustration: "rolling-green-hills-shepherd-distance" }, // TODO: Add Shepherd interaction branch
-            "4": { title: "Hill Path Overlook", content: `<p>The path crests a hill, offering a panoramic view. To the east, the hills gradually give way to rugged, barren badlands. Nearby, nestled amongst wildflowers, you spot a small, ancient-looking shrine, heavily overgrown with vines.</p>`, options: [ { text: "Investigate the overgrown shrine", next: 40 }, { text: "Continue east towards the badlands", next: 41 } ], illustration: "hilltop-view-overgrown-shrine-wildflowers" },
-            "40": { title: "Overgrown Shrine", content: `<p>Pushing aside thick vines reveals a small stone shrine dedicated to a forgotten nature deity. Intricate carvings, though worn, are still visible beneath the moss and grime. A sense of ancient peace emanates from the stones. Wildflowers grow in profusion around its base.</p>`, options: [{ text: "Examine the carvings for meaning (Intelligence Check)", check:{stat:'intelligence', dc:11, onFailure: 401}, next: 400 }, {text: "Leave the shrine undisturbed", next: 4}, {text: "Say a quiet prayer for guidance", next: 402}], illustration: "overgrown-stone-shrine-wildflowers-close" },
-            "400": { title: "Shrine Insights", content:"<p>The carvings depict cycles of growth and renewal. You feel a sense of calm wash over you, slightly restoring your vitality. (+1 HP)</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close", reward: {hpGain: 1}}, // TODO: Implement hpGain
-            "401": { title: "Mysterious Carvings", content:"<p>The carvings are too worn and abstract to decipher their specific meaning, though you sense they are very old.</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close"},
-            "402": { title: "Moment of Peace", content:"<p>You spend a quiet moment in reflection. While no divine voice answers, the tranquility of the place settles your nerves.</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close"},
-            "41": { title: "Rocky Badlands", content: `<p>The gentle green hills give way abruptly to cracked, sun-baked earth and jagged rock formations. The air is hot and still under a harsh, unforgiving sun. This land looks hostile and sparsely populated.</p>`, options: [{ text: "Scout ahead cautiously", next: 99 } ], illustration: "rocky-badlands-cracked-earth-harsh-sun" }, // TODO: Expand Badlands
-
-            // --- Western Path: Cliffs -> Cove -> Cave ---
-            "3": { title: "Coastal Cliffs Edge", content: `<p>You stand atop windswept cliffs, the roar of crashing waves filling the air below. Seabirds circle overhead. A precarious-looking path, seemingly carved by desperate hands, descends the cliff face towards a hidden cove.</p>`, options: [ { text: "Attempt the precarious descent (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 }, { text: "Scan the cliff face for easier routes (Wisdom Check)", check: { stat: 'wisdom', dc: 11, onFailure: 32 }, next: 33 } ], illustration: "windy-sea-cliffs-crashing-waves-path-down" },
-            "30": { title: "Hidden Cove", content: `<p>Your careful descent, whether via the main path or hidden steps, brings you safely to a secluded, sandy cove sheltered by the towering cliffs. The air smells strongly of salt and seaweed. Half-hidden in the shadows at the back of the cove is the dark, foreboding entrance to a sea cave.</p><p>(+25 XP)</p>`, options: [ { text: "Explore the dark cave", next: 35 } ], illustration: "hidden-cove-beach-dark-cave-entrance", reward: { xp: 25 } },
-            "31": { title: "Tumbled Down", content: `<p>You lose your footing on the steep, treacherous path! You tumble and slide the last few feet, landing hard on the sandy cove floor. You take 5 points of damage from the fall. Shaking your head to clear it, you see the dark entrance to a sea cave nearby.</p>`, options: [ { text: "Gingerly get up and explore the dark cave", next: 35 } ], illustration: "character-fallen-at-bottom-of-cliff-path-cove", hpLoss: 5 },
-            "32": { title: "No Easier Path", content: `<p>You scan the towering cliffs intently, searching for any alternative routes down. Despite your efforts, you find no obviously easier or safer paths than the precarious one directly before you.</p>`, options: [ { text: "Attempt the precarious descent again (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 } ], illustration: "scanning-sea-cliffs-no-other-paths-visible" },
-            "33": { title: "Smuggler's Steps?", content: `<p>Your keen eyes spot what others might miss: a series of barely visible handholds and footholds carved into the rock face, slightly hidden by an overhang. They look old but might offer a slightly less treacherous descent.</p><p>(+15 XP)</p>`, options: [ { text: "Use the hidden steps (Easier Dex Check)", check: { stat: 'dexterity', dc: 8, onFailure: 31 }, next: 30 } ], illustration: "close-up-handholds-carved-in-cliff-face", reward: { xp: 15 } },
-            "35": { title: "Dark Cave", content: `<p>You cautiously enter the sea cave. The air inside is heavy with the smell of salt, damp rock, and something else... decay. Water drips rhythmically from unseen stalactites somewhere deeper within the oppressive darkness.</p>`, options: [{ text: "Press deeper into the darkness (Requires Light Source?)", next: 99 } ], illustration: "dark-cave-entrance-dripping-water" }, // TODO: Add light source requirement/check, expand cave
-
-            // --- Northern Path: Forest -> Foothills -> Fortress ---
-            "5": { title: "Shadowwood Entrance", content: `<p>The air grows cool and damp as you step beneath the dense canopy of the Shadowwood. Sunlight struggles to pierce the gloom, illuminating gnarled roots that writhe across the forest floor. A narrow, overgrown path leads deeper into the woods.</p>`, options: [ { text: "Follow the main, albeit overgrown, path", next: 6 }, { text: "Try to navigate through the lighter undergrowth beside the path", next: 7 }, { text: "Look for animal trails or signs of passage (Wisdom Check)", check: { stat: 'wisdom', dc: 10, onFailure: 6 }, next: 8 } ], illustration: "dark-forest-entrance-gnarled-roots-filtered-light" },
-            // Forest Path Branches
-            "6": { title: "Overgrown Forest Path", content: `<p>The path is barely visible beneath a thick layer of fallen leaves and creeping vines. Strange, faintly glowing fungi cling to rotting logs. You push deeper into the oppressive silence when suddenly, you hear a twig snap nearby!</p>`, options: [ { text: "Ready your weapon and investigate the sound", next: 10 }, { text: "Attempt to hide quietly amongst the ferns (Dexterity Check)", check: { stat: 'dexterity', dc: 11, onFailure: 10 }, next: 11 }, { text: "Call out cautiously, 'Who's there?'", next: 10 } ], illustration: "overgrown-forest-path-glowing-fungi-vines" },
-            "7": { title: "Tangled Undergrowth", content: `<p>Pushing through thick ferns and thorny bushes proves difficult. You stumble into a small, unexpected clearing. In the center stands a weathered stone statue, its features eroded by time and covered in thick moss. It depicts a forgotten deity or hero.</p>`, options: [ { text: "Examine the statue closely for clues or markings (Intelligence Check)", check: { stat: 'intelligence', dc: 13, onFailure: 71 }, next: 70 }, { text: "Ignore the statue and try to find the main path again", next: 72 }, { text: "Leave a small offering (if you have something suitable)", next: 73 } ], illustration: "forest-clearing-mossy-statue-weathered-stone" },
-            "8": { title: "Hidden Game Trail", content: `<p>Your sharp eyes spot a faint trail, almost invisible to the untrained observer, diverging from the main path. It looks like a route used by deer or other forest creatures. Following it, you soon arrive at the edge of a deep ravine spanned by a single, rickety rope bridge.</p><p>(+20 XP)</p>`, options: [ { text: "Risk crossing the rope bridge (Dexterity Check)", check: { stat: 'dexterity', dc: 10, onFailure: 81 }, next: 80 }, { text: "Search along the ravine edge for another way across", next: 82 } ], illustration: "narrow-game-trail-forest-rope-bridge-ravine", reward: { xp: 20 } },
-            // Forest Encounters/Events
-            "10": { title: "Goblin Ambush!", content: `<p>Suddenly, two scraggly goblins, clad in mismatched leather scraps and wielding crude, sharp spears, leap out from behind large toadstools! Their beady eyes fix on you with malicious intent.</p>`, options: [ { text: "Fight the goblins!", next: 12 }, { text: "Attempt to dodge past them and flee down the path (Dexterity Check)", check: { stat: 'dexterity', dc: 13, onFailure: 10 }, next: 13 } ], illustration: "two-goblins-ambush-forest-path-spears" }, // TODO: Implement combat
-            "11": { title: "Hidden Evasion", content: `<p>Quickly and silently, you melt into the deep shadows beneath a large, ancient tree. The two goblins blunder past, bickering in their guttural tongue, completely oblivious to your presence.</p><p>(+30 XP)</p>`, options: [ { text: "Continue cautiously down the path once they are gone", next: 14 } ], illustration: "forest-shadows-hiding-goblins-walking-past", reward: { xp: 30 } },
-            "12": { title: "Ambush Victory!", content: `<p>Though caught by surprise, you react swiftly. After a brief, vicious skirmish, the goblins lie defeated at your feet. Searching their meagre belongings, you find a single, Crude Dagger.</p><p>(+50 XP)</p>`, options: [ { text: "Wipe your blade clean and press onward", next: 14 } ], illustration: "defeated-goblins-forest-path-loot", reward: { xp: 50, addItem: "Crude Dagger" } },
-            "13": { title: "Daring Escape", content: `<p>With surprising agility, you feint left, then dive right, tumbling past the goblins' clumsy spear thrusts! You scramble to your feet and sprint down the path, leaving the surprised goblins behind.</p><p>(+25 XP)</p>`, options: [ { text: "Keep running!", next: 14 } ], illustration: "blurred-motion-running-past-goblins-forest", reward: { xp: 25 } },
-            "70": { title: "Statue's Secret", content:"<p>Running your fingers over the mossy stone, you find a small, almost invisible seam near the base. Applying pressure, a hidden compartment clicks open! Inside is a Scout's Pouch.</p><p>(+40 XP)</p>", options: [{text:"Take the pouch and press on", next: 72}], illustration: "forest-clearing-mossy-statue-hidden-compartment", reward:{xp: 40, addItem: "Scout's Pouch"}},
-            "71": { title: "Just an Old Statue", content:"<p>Despite a careful examination, the statue appears to be just that – an old, weathered stone figure of no special significance that you can discern.</p>", options: [{text:"Ignore the statue and press on", next: 72}], illustration: "forest-clearing-mossy-statue-weathered-stone"},
-            "72": { title: "Back to the Thicket", content:"<p>Leaving the clearing and the statue behind, you push back into the dense undergrowth, eventually relocating the main forest path.</p>", options: [{text:"Continue along the main path", next: 6}], illustration:"pushing-through-forest-undergrowth"},
-            "73": { title: "A Small Offering", content:"<p>You place a small, simple offering at the statue's base (a ration, a coin, or perhaps just a moment of respect). You feel a subtle sense of approval or peace before turning to leave.</p>", options: [{text:"Try to find the main path again", next: 72}], illustration:"forest-clearing-mossy-statue-offering"}, // TODO: Check inventory for offering? Grant minor boon?
-            "80": { title: "Across the Ravine", content:"<p>Taking a deep breath, you step onto the swaying rope bridge. With careful, deliberate steps, testing each plank before putting your weight on it, you make your way across the chasm to the other side.</p><p>(+25 XP)</p>", options: [{text:"Continue following the game trail", next: 14}], illustration:"character-crossing-rope-bridge-safely", reward:{xp:25}}, // Rejoins main path for now
-            "81": { title: "Bridge Collapse!", content:"<p>Halfway across, a frayed rope snaps! The bridge lurches violently, sending you plunging into the ravine below! You lose 10 HP. Luckily, the bottom is covered in soft moss and mud, cushioning your fall.</p>", options: [{text:"Climb out and find another way", next: 82}], illustration:"rope-bridge-snapping-character-falling", hpLoss: 10},
-            "82": { title: "Ravine Detour", content:"<p>Searching along the ravine's edge, you eventually find a place where the chasm narrows, and a fallen log provides a much safer, if longer, way across.</p>", options: [{text:"Cross the log bridge and continue", next: 14}], illustration:"fallen-log-crossing-ravine"}, // Rejoins main path for now
-             // Forest Path Continues
-            "14": { title: "Forest Stream Crossing", content: `<p>The overgrown path eventually leads to the bank of a clear, shallow stream. Smooth, mossy stones line the streambed, and dappled sunlight filters through the leaves overhead, sparkling on the water's surface.</p>`, options: [ { text: "Wade across the stream", next: 16 }, { text: "Look for a drier crossing point (fallen log?) upstream", next: 15 } ], illustration: "forest-stream-crossing-dappled-sunlight-stones" },
-            "15": { title: "Log Bridge", content: `<p>A short walk upstream reveals a large, fallen tree spanning the stream. It's covered in slick, green moss, making it look like a potentially treacherous crossing.</p>`, options: [ { text: "Cross carefully on the mossy log (Dexterity Check)", check: { stat: 'dexterity', dc: 9, onFailure: 151 }, next: 16 }, { text: "Decide it's too risky and go back to wade across", next: 14 } ], illustration: "mossy-log-bridge-over-forest-stream" },
-            "151": { title: "Splash!", content: `<p>You place a foot carefully on the log, but the moss is slicker than it looks! Your feet shoot out from under you, and you tumble into the cold stream with a loud splash! You're soaked and slightly embarrassed, but otherwise unharmed.</p>`, options: [ { text: "Shake yourself off and continue on the other side", next: 16 } ], illustration: "character-splashing-into-stream-from-log" },
-            // Leaving the Forest
-            "16": { title: "Edge of the Woods", content: `<p>Finally, the trees begin to thin, and you emerge from the oppressive gloom of the Shadowwood. Before you lie steep, rocky foothills leading up towards a formidable-looking mountain fortress perched high above.</p>`, options: [ { text: "Begin the ascent into the foothills towards the fortress", next: 17 }, { text: "Scan the fortress and surrounding terrain from afar (Wisdom Check)", check: { stat: 'wisdom', dc: 14, onFailure: 17 }, next: 18 } ], illustration: "forest-edge-view-rocky-foothills-distant-mountain-fortress" },
-            // Foothills Path Branches
-            "17": { title: "Rocky Foothills Path", content: `<p>The climb is arduous, the path winding steeply upwards over loose scree and jagged rocks. The air thins slightly. The dark stone walls of the mountain fortress loom much larger now, seeming to watch your approach.</p>`, options: [ { text: "Continue the direct ascent", next: 19 }, { text: "Look for signs of a hidden trail or less obvious route (Wisdom Check)", check: { stat: 'wisdom', dc: 15, onFailure: 19 }, next: 20 } ], illustration: "climbing-rocky-foothills-path-fortress-closer" },
-            "18": { title: "Distant Observation", content: `<p>Taking a moment to study the fortress from this distance, your keen eyes notice something interesting. The main approach looks heavily guarded, but along the western ridge, the terrain seems slightly less sheer, potentially offering a less-guarded, albeit more treacherous, approach.</p><p>(+30 XP)</p>`, options: [ { text: "Decide against the risk and take the main path into the foothills", next: 17 }, { text: "Attempt the western ridge approach", next: 21 } ], illustration: "zoomed-view-mountain-fortress-western-ridge", reward: { xp: 30 } },
-            // Foothills Encounters/Events
-            "19": { title: "Blocked Pass", content: `<p>As you round a sharp bend, your way is completely blocked by a recent rockslide! Huge boulders and debris choke the path, making further progress impossible along this route.</p>`, options: [ { text: "Try to climb over the unstable rockslide (Strength Check)", check: { stat: 'strength', dc: 14, onFailure: 191 }, next: 190 }, { text: "Search the surrounding cliffs for another way around", next: 192 } ], illustration: "rockslide-blocking-mountain-path-boulders" },
-            "190": { title: "Over the Rocks", content:"<p>Summoning your strength, you find handholds and footholds, scrambling and pulling yourself up and over the precarious rockslide. It's exhausting work, but you make it past the blockage.</p><p>(+35 XP)</p>", options: [{text:"Continue up the now clear path", next: 22}], illustration:"character-climbing-over-boulders", reward: {xp:35} },
-            "191": { title: "Climb Fails", content:"<p>The boulders are too large, too smooth, or too unstable. You try several approaches, but cannot safely climb over the rockslide. This way is blocked.</p>", options: [{text:"Search the surrounding cliffs for another way around", next: 192}], illustration:"character-slipping-on-rockslide-boulders"},
-            "192": { title: "Detour Found", content:"<p>After considerable searching along the cliff face, you find a rough, overgrown path leading steeply up and around the rockslide area. It eventually rejoins the main trail further up the mountain.</p>", options: [{text:"Follow the detour path", next: 22}], illustration:"rough-detour-path-around-rockslide"},
-            "20": { title: "Goat Trail", content: `<p>Your thorough search pays off! Partially hidden behind a cluster of hardy mountain shrubs, you discover a narrow trail, barely wide enough for a single person (or perhaps a mountain goat). It seems to bypass the main path, heading upwards towards the fortress.</p><p>(+40 XP)</p>`, options: [ { text: "Follow the precarious goat trail", next: 22 } ], illustration: "narrow-goat-trail-mountainside-fortress-view", reward: { xp: 40 } },
-            "21": { title: "Western Ridge", content:"<p>The path along the western ridge is dangerously narrow and exposed. Loose gravel shifts underfoot, and strong gusts of wind whip around you, threatening to push you off the edge into the dizzying drop below.</p>", options: [{text:"Proceed carefully along the ridge (Dexterity Check)", check:{stat:'dexterity', dc: 14, onFailure: 211}, next: 22 } ], illustration:"narrow-windy-mountain-ridge-path" },
-            "211": {title:"Lost Balance", content:"<p>A particularly strong gust of wind catches you at a bad moment! You lose your balance and stumble, tumbling down a steep, rocky slope before managing to arrest your fall. You lose 10 HP.</p>", options:[{text:"Climb back up and reconsider the main path", next: 17}], illustration:"character-falling-off-windy-ridge", hpLoss: 10},
-            // Approaching/At the Fortress
-            "22": { title: "Fortress Approach", content:"<p>You've navigated the treacherous paths and finally stand near the imposing outer walls of the dark mountain fortress. Stern-faced guards patrol the battlements, their eyes scanning the approaches. The main gate looks heavily fortified.</p>", options: [
-                {text:"Search for a less obvious entrance (Wisdom Check)", check:{stat:'wisdom', dc: 16, onFailure: 221}, next: 220}, // TODO: Success leads to secret entrance page
-                {text:"Attempt to bluff your way past the gate guards (Charisma Check)", check:{stat:'charisma', dc: 15, onFailure: 222}, next: 223}, // TODO: Success/Failure pages for bluff
-                {text:"Try to sneak past the gate guards (Dexterity Check)", check:{stat:'dexterity', dc: 17, onFailure: 222}, next: 224}, // TODO: Success/Failure pages for sneak
-                {text:"Retreat for now", next: 16} // Option to go back
-                ], illustration:"approaching-dark-fortress-walls-guards"},
-            "220": { title: "Secret Passage?", content:"<p>Your careful search reveals loose stones near the base of the wall, potentially hiding a passage!</p>", options: [{text:"Investigate the loose stones", next: 99}], illustration:"approaching-dark-fortress-walls-guards"}, // TODO: Expand secret passage
-            "221": { title: "No Obvious Weakness", content:"<p>The fortress walls look solid and well-maintained. You find no obvious weak points or hidden entrances from this vantage point.</p>", options: [{text:"Reconsider your approach", next: 22}], illustration:"approaching-dark-fortress-walls-guards"},
-            "222": { title: "Caught!", content:"<p>Your attempt fails miserably! The guards spot you immediately and raise the alarm! You are captured.</p>", options: [{text:"To the dungeons...", next: 99}], illustration:"approaching-dark-fortress-walls-guards"}, // TODO: Lead to prisoner cell?
-            "223": { title: "Bluff Success?", content:"<p>Amazingly, your story seems plausible enough for the guards to let you pass through the gate!</p>", options: [{text:"Enter the fortress courtyard", next: 99}], illustration:"approaching-dark-fortress-walls-guards"}, // TODO: Expand fortress interior
-            "224": { title: "Sneak Success?", content:"<p>Moving like a shadow, you manage to slip past the gate guards unnoticed!</p>", options: [{text:"Enter the fortress courtyard", next: 99}], illustration:"approaching-dark-fortress-walls-guards"}, // TODO: Expand fortress interior
-
-            // --- Game Over / Error State ---
+        const gameData = { // (Checked - OK, added allowSell flag to 99)
+            // [Keep all page data here - unchanged from previous]
+            // ... (pages 1 to 224) ...
+             "1": { title: "The Crossroads", content: `<p>Dust swirls around a weathered signpost under a bright, midday sun. Paths lead north into the gloomy Shadowwood, east towards rolling green hills, and west towards coastal cliffs battered by sea spray. Which path calls to you?</p>`, options: [ { text: "Enter the Shadowwood Forest (North)", next: 5 }, { text: "Head towards the Rolling Hills (East)", next: 2 }, { text: "Investigate the Coastal Cliffs (West)", next: 3 } ], illustration: "crossroads-signpost-sunny" },
+             "2": { title: "Rolling Hills", content: `<p>Verdant hills stretch before you, dotted with wildflowers. A gentle breeze whispers through the tall grass. In the distance, you see a lone figure tending to a flock of sheep. It feels peaceful, almost unnervingly so after the crossroads.</p>`, options: [ { text: "Follow the narrow path winding through the hills", next: 4 }, { text: "Try to hail the distant shepherd (Charisma Check?)", next: 99 } ], illustration: "rolling-green-hills-shepherd-distance" },
+             "3": { title: "Coastal Cliffs Edge", content: `<p>You stand atop windswept cliffs, the roar of crashing waves filling the air below. Seabirds circle overhead. A precarious-looking path, seemingly carved by desperate hands, descends the cliff face towards a hidden cove.</p>`, options: [ { text: "Attempt the precarious descent (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 }, { text: "Scan the cliff face for easier routes (Wisdom Check)", check: { stat: 'wisdom', dc: 11, onFailure: 32 }, next: 33 } ], illustration: "windy-sea-cliffs-crashing-waves-path-down" },
+             "4": { title: "Hill Path Overlook", content: `<p>The path crests a hill, offering a panoramic view. To the east, the hills gradually give way to rugged, barren badlands. Nearby, nestled amongst wildflowers, you spot a small, ancient-looking shrine, heavily overgrown with vines.</p>`, options: [ { text: "Investigate the overgrown shrine", next: 40 }, { text: "Continue east towards the badlands", next: 41 } ], illustration: "hilltop-view-overgrown-shrine-wildflowers" },
+             "5": { title: "Shadowwood Entrance", content: `<p>The air grows cool and damp as you step beneath the dense canopy of the Shadowwood. Sunlight struggles to pierce the gloom, illuminating gnarled roots that writhe across the forest floor. A narrow, overgrown path leads deeper into the woods.</p>`, options: [ { text: "Follow the main, albeit overgrown, path", next: 6 }, { text: "Try to navigate through the lighter undergrowth beside the path", next: 7 }, { text: "Look for animal trails or signs of passage (Wisdom Check)", check: { stat: 'wisdom', dc: 10, onFailure: 6 }, next: 8 } ], illustration: "dark-forest-entrance-gnarled-roots-filtered-light" },
+             "6": { title: "Overgrown Forest Path", content: `<p>The path is barely visible beneath a thick layer of fallen leaves and creeping vines. Strange, faintly glowing fungi cling to rotting logs. You push deeper into the oppressive silence when suddenly, you hear a twig snap nearby!</p>`, options: [ { text: "Ready your weapon and investigate the sound", next: 10 }, { text: "Attempt to hide quietly amongst the ferns (Dexterity Check)", check: { stat: 'dexterity', dc: 11, onFailure: 10 }, next: 11 }, { text: "Call out cautiously, 'Who's there?'", next: 10 } ], illustration: "overgrown-forest-path-glowing-fungi-vines" },
+             "7": { title: "Tangled Undergrowth", content: `<p>Pushing through thick ferns and thorny bushes proves difficult. You stumble into a small, unexpected clearing. In the center stands a weathered stone statue, its features eroded by time and covered in thick moss. It depicts a forgotten deity or hero.</p>`, options: [ { text: "Examine the statue closely for clues or markings (Intelligence Check)", check: { stat: 'intelligence', dc: 13, onFailure: 71 }, next: 70 }, { text: "Ignore the statue and try to find the main path again", next: 72 }, { text: "Leave a small offering (if you have something suitable)", next: 73 } ], illustration: "forest-clearing-mossy-statue-weathered-stone" },
+             "8": { title: "Hidden Game Trail", content: `<p>Your sharp eyes spot a faint trail, almost invisible to the untrained observer, diverging from the main path. It looks like a route used by deer or other forest creatures. Following it, you soon arrive at the edge of a deep ravine spanned by a single, rickety rope bridge.</p><p>(+20 XP)</p>`, options: [ { text: "Risk crossing the rope bridge (Dexterity Check)", check: { stat: 'dexterity', dc: 10, onFailure: 81 }, next: 80 }, { text: "Search along the ravine edge for another way across", next: 82 } ], illustration: "narrow-game-trail-forest-rope-bridge-ravine", reward: { xp: 20 } },
+             "10": { title: "Goblin Ambush!", content: `<p>Suddenly, two scraggly goblins, clad in mismatched leather scraps and wielding crude, sharp spears, leap out from behind large toadstools! Their beady eyes fix on you with malicious intent.</p>`, options: [ { text: "Fight the goblins!", next: 12 }, { text: "Attempt to dodge past them and flee down the path (Dexterity Check)", check: { stat: 'dexterity', dc: 13, onFailure: 10 }, next: 13 } ], illustration: "two-goblins-ambush-forest-path-spears" },
+             "11": { title: "Hidden Evasion", content: `<p>Quickly and silently, you melt into the deep shadows beneath a large, ancient tree. The two goblins blunder past, bickering in their guttural tongue, completely oblivious to your presence.</p><p>(+30 XP)</p>`, options: [ { text: "Continue cautiously down the path once they are gone", next: 14 } ], illustration: "forest-shadows-hiding-goblins-walking-past", reward: { xp: 30 } },
+             "12": { title: "Ambush Victory!", content: `<p>Though caught by surprise, you react swiftly. After a brief, vicious skirmish, the goblins lie defeated at your feet. Searching their meagre belongings, you find a single, Crude Dagger.</p><p>(+50 XP)</p>`, options: [ { text: "Wipe your blade clean and press onward", next: 14 } ], illustration: "defeated-goblins-forest-path-loot", reward: { xp: 50, addItem: "Crude Dagger" } },
+             "13": { title: "Daring Escape", content: `<p>With surprising agility, you feint left, then dive right, tumbling past the goblins' clumsy spear thrusts! You scramble to your feet and sprint down the path, leaving the surprised goblins behind.</p><p>(+25 XP)</p>`, options: [ { text: "Keep running!", next: 14 } ], illustration: "blurred-motion-running-past-goblins-forest", reward: { xp: 25 } },
+             "14": { title: "Forest Stream Crossing", content: `<p>The overgrown path eventually leads to the bank of a clear, shallow stream. Smooth, mossy stones line the streambed, and dappled sunlight filters through the leaves overhead, sparkling on the water's surface.</p>`, options: [ { text: "Wade across the stream", next: 16 }, { text: "Look for a drier crossing point (fallen log?) upstream", next: 15 } ], illustration: "forest-stream-crossing-dappled-sunlight-stones" },
+             "15": { title: "Log Bridge", content: `<p>A short walk upstream reveals a large, fallen tree spanning the stream. It's covered in slick, green moss, making it look like a potentially treacherous crossing.</p>`, options: [ { text: "Cross carefully on the mossy log (Dexterity Check)", check: { stat: 'dexterity', dc: 9, onFailure: 151 }, next: 16 }, { text: "Decide it's too risky and go back to wade across", next: 14 } ], illustration: "mossy-log-bridge-over-forest-stream" },
+             "151": { title: "Splash!", content: `<p>You place a foot carefully on the log, but the moss is slicker than it looks! Your feet shoot out from under you, and you tumble into the cold stream with a loud splash! You're soaked and slightly embarrassed, but otherwise unharmed.</p>`, options: [ { text: "Shake yourself off and continue on the other side", next: 16 } ], illustration: "character-splashing-into-stream-from-log" },
+             "16": { title: "Edge of the Woods", content: `<p>Finally, the trees begin to thin, and you emerge from the oppressive gloom of the Shadowwood. Before you lie steep, rocky foothills leading up towards a formidable-looking mountain fortress perched high above.</p>`, options: [ { text: "Begin the ascent into the foothills towards the fortress", next: 17 }, { text: "Scan the fortress and surrounding terrain from afar (Wisdom Check)", check: { stat: 'wisdom', dc: 14, onFailure: 17 }, next: 18 } ], illustration: "forest-edge-view-rocky-foothills-distant-mountain-fortress" },
+             "17": { title: "Rocky Foothills Path", content: `<p>The climb is arduous, the path winding steeply upwards over loose scree and jagged rocks. The air thins slightly. The dark stone walls of the mountain fortress loom much larger now, seeming to watch your approach.</p>`, options: [ { text: "Continue the direct ascent", next: 19 }, { text: "Look for signs of a hidden trail or less obvious route (Wisdom Check)", check: { stat: 'wisdom', dc: 15, onFailure: 19 }, next: 20 } ], illustration: "climbing-rocky-foothills-path-fortress-closer" },
+             "18": { title: "Distant Observation", content: `<p>Taking a moment to study the fortress from this distance, your keen eyes notice something interesting. The main approach looks heavily guarded, but along the western ridge, the terrain seems slightly less sheer, potentially offering a less-guarded, albeit more treacherous, approach.</p><p>(+30 XP)</p>`, options: [ { text: "Decide against the risk and take the main path into the foothills", next: 17 }, { text: "Attempt the western ridge approach", next: 21 } ], illustration: "zoomed-view-mountain-fortress-western-ridge", reward: { xp: 30 } },
+             "19": { title: "Blocked Pass", content: `<p>As you round a sharp bend, your way is completely blocked by a recent rockslide! Huge boulders and debris choke the path, making further progress impossible along this route.</p>`, options: [ { text: "Try to climb over the unstable rockslide (Strength Check)", check: { stat: 'strength', dc: 14, onFailure: 191 }, next: 190 }, { text: "Search the surrounding cliffs for another way around", next: 192 } ], illustration: "rockslide-blocking-mountain-path-boulders" },
+             "20": { title: "Goat Trail", content: `<p>Your thorough search pays off! Partially hidden behind a cluster of hardy mountain shrubs, you discover a narrow trail, barely wide enough for a single person (or perhaps a mountain goat). It seems to bypass the main path, heading upwards towards the fortress.</p><p>(+40 XP)</p>`, options: [ { text: "Follow the precarious goat trail", next: 22 } ], illustration: "narrow-goat-trail-mountainside-fortress-view", reward: { xp: 40 } },
+             "21": { title: "Western Ridge", content:"<p>The path along the western ridge is dangerously narrow and exposed. Loose gravel shifts underfoot, and strong gusts of wind whip around you, threatening to push you off the edge into the dizzying drop below.</p>", options: [{text:"Proceed carefully along the ridge (Dexterity Check)", check:{stat:'dexterity', dc: 14, onFailure: 211}, next: 22 } ], illustration:"narrow-windy-mountain-ridge-path" },
+             "22": { title: "Fortress Approach", content:"<p>You've navigated the treacherous paths and finally stand near the imposing outer walls of the dark mountain fortress. Stern-faced guards patrol the battlements, their eyes scanning the approaches. The main gate looks heavily fortified.</p>", options: [ {text:"Search for a less obvious entrance (Wisdom Check)", check:{stat:'wisdom', dc: 16, onFailure: 221}, next: 220}, {text:"Attempt to bluff your way past the gate guards (Charisma Check)", check:{stat:'charisma', dc: 15, onFailure: 222}, next: 223}, {text:"Try to sneak past the gate guards (Dexterity Check)", check:{stat:'dexterity', dc: 17, onFailure: 222}, next: 224}, {text:"Retreat for now", next: 16} ], illustration:"approaching-dark-fortress-walls-guards"},
+             "30": { title: "Hidden Cove", content: `<p>Your careful descent, whether via the main path or hidden steps, brings you safely to a secluded, sandy cove sheltered by the towering cliffs. The air smells strongly of salt and seaweed. Half-hidden in the shadows at the back of the cove is the dark, foreboding entrance to a sea cave.</p><p>(+25 XP)</p>`, options: [ { text: "Explore the dark cave", next: 35 } ], illustration: "hidden-cove-beach-dark-cave-entrance", reward: { xp: 25 } },
+             "31": { title: "Tumbled Down", content: `<p>You lose your footing on the steep, treacherous path! You tumble and slide the last few feet, landing hard on the sandy cove floor. You take 5 points of damage from the fall. Shaking your head to clear it, you see the dark entrance to a sea cave nearby.</p>`, options: [ { text: "Gingerly get up and explore the dark cave", next: 35 } ], illustration: "character-fallen-at-bottom-of-cliff-path-cove", hpLoss: 5 },
+             "32": { title: "No Easier Path", content: `<p>You scan the towering cliffs intently, searching for any alternative routes down. Despite your efforts, you find no obviously easier or safer paths than the precarious one directly before you.</p>`, options: [ { text: "Attempt the precarious descent again (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 } ], illustration: "scanning-sea-cliffs-no-other-paths-visible" },
+             "33": { title: "Smuggler's Steps?", content: `<p>Your keen eyes spot what others might miss: a series of barely visible handholds and footholds carved into the rock face, slightly hidden by an overhang. They look old but might offer a slightly less treacherous descent.</p><p>(+15 XP)</p>`, options: [ { text: "Use the hidden steps (Easier Dex Check)", check: { stat: 'dexterity', dc: 8, onFailure: 31 }, next: 30 } ], illustration: "close-up-handholds-carved-in-cliff-face", reward: { xp: 15 } },
+             "35": { title: "Dark Cave", content: `<p>You cautiously enter the sea cave. The air inside is heavy with the smell of salt, damp rock, and something else... decay. Water drips rhythmically from unseen stalactites somewhere deeper within the oppressive darkness.</p>`, options: [{ text: "Press deeper into the darkness (Requires Light Source?)", next: 99 } ], illustration: "dark-cave-entrance-dripping-water" },
+             "40": { title: "Overgrown Shrine", content: `<p>Pushing aside thick vines reveals a small stone shrine dedicated to a forgotten nature deity. Intricate carvings, though worn, are still visible beneath the moss and grime. A sense of ancient peace emanates from the stones. Wildflowers grow in profusion around its base.</p>`, options: [{ text: "Examine the carvings for meaning (Intelligence Check)", check:{stat:'intelligence', dc:11, onFailure: 401}, next: 400 }, {text: "Leave the shrine undisturbed", next: 4}, {text: "Say a quiet prayer for guidance", next: 402}], illustration: "overgrown-stone-shrine-wildflowers-close" },
+             "41": { title: "Rocky Badlands", content: `<p>The gentle green hills give way abruptly to cracked, sun-baked earth and jagged rock formations. The air is hot and still under a harsh, unforgiving sun. This land looks hostile and sparsely populated.</p>`, options: [{ text: "Scout ahead cautiously", next: 99 } ], illustration: "rocky-badlands-cracked-earth-harsh-sun" },
+             "70": { title: "Statue's Secret", content:"<p>Running your fingers over the mossy stone, you find a small, almost invisible seam near the base. Applying pressure, a hidden compartment clicks open! Inside is a Scout's Pouch.</p><p>(+40 XP)</p>", options: [{text:"Take the pouch and press on", next: 72}], illustration: "forest-clearing-mossy-statue-hidden-compartment", reward:{xp: 40, addItem: "Scout's Pouch"}},
+             "71": { title: "Just an Old Statue", content:"<p>Despite a careful examination, the statue appears to be just that – an old, weathered stone figure of no special significance that you can discern.</p>", options: [{text:"Ignore the statue and press on", next: 72}], illustration: "forest-clearing-mossy-statue-weathered-stone"},
+             "72": { title: "Back to the Thicket", content:"<p>Leaving the clearing and the statue behind, you push back into the dense undergrowth, eventually relocating the main forest path.</p>", options: [{text:"Continue along the main path", next: 6}], illustration:"pushing-through-forest-undergrowth"},
+             "73": { title: "A Small Offering", content:"<p>You place a small, simple offering at the statue's base (a ration, a coin, or perhaps just a moment of respect). You feel a subtle sense of approval or peace before turning to leave.</p>", options: [{text:"Try to find the main path again", next: 72}], illustration:"forest-clearing-mossy-statue-offering"},
+             "80": { title: "Across the Ravine", content:"<p>Taking a deep breath, you step onto the swaying rope bridge. With careful, deliberate steps, testing each plank before putting your weight on it, you make your way across the chasm to the other side.</p><p>(+25 XP)</p>", options: [{text:"Continue following the game trail", next: 14}], illustration:"character-crossing-rope-bridge-safely", reward:{xp:25}},
+             "81": { title: "Bridge Collapse!", content:"<p>Halfway across, a frayed rope snaps! The bridge lurches violently, sending you plunging into the ravine below! You lose 10 HP. Luckily, the bottom is covered in soft moss and mud, cushioning your fall.</p>", options: [{text:"Climb out and find another way", next: 82}], illustration:"rope-bridge-snapping-character-falling", hpLoss: 10},
+             "82": { title: "Ravine Detour", content:"<p>Searching along the ravine's edge, you eventually find a place where the chasm narrows, and a fallen log provides a much safer, if longer, way across.</p>", options: [{text:"Cross the log bridge and continue", next: 14}], illustration:"fallen-log-crossing-ravine"},
+             "151": { title: "Splash!", content: `<p>You place a foot carefully on the log, but the moss is slicker than it looks! Your feet shoot out from under you, and you tumble into the cold stream with a loud splash! You're soaked and slightly embarrassed, but otherwise unharmed.</p>`, options: [ { text: "Shake yourself off and continue on the other side", next: 16 } ], illustration: "character-splashing-into-stream-from-log" },
+             "190": { title: "Over the Rocks", content:"<p>Summoning your strength, you find handholds and footholds, scrambling and pulling yourself up and over the precarious rockslide. It's exhausting work, but you make it past the blockage.</p><p>(+35 XP)</p>", options: [{text:"Continue up the now clear path", next: 22}], illustration:"character-climbing-over-boulders", reward: {xp:35} },
+             "191": { title: "Climb Fails", content:"<p>The boulders are too large, too smooth, or too unstable. You try several approaches, but cannot safely climb over the rockslide. This way is blocked.</p>", options: [{text:"Search the surrounding cliffs for another way around", next: 192}], illustration:"character-slipping-on-rockslide-boulders"},
+             "192": { title: "Detour Found", content:"<p>After considerable searching along the cliff face, you find a rough, overgrown path leading steeply up and around the rockslide area. It eventually rejoins the main trail further up the mountain.</p>", options: [{text:"Follow the detour path", next: 22}], illustration:"rough-detour-path-around-rockslide"},
+             "211": {title:"Lost Balance", content:"<p>A particularly strong gust of wind catches you at a bad moment! You lose your balance and stumble, tumbling down a steep, rocky slope before managing to arrest your fall. You lose 10 HP.</p>", options:[{text:"Climb back up and reconsider the main path", next: 17}], illustration:"character-falling-off-windy-ridge", hpLoss: 10},
+             "220": { title: "Secret Passage?", content:"<p>Your careful search reveals loose stones near the base of the wall, potentially hiding a passage!</p>", options: [{text:"Investigate the loose stones", next: 99}], illustration:"approaching-dark-fortress-walls-guards"},
+             "221": { title: "No Obvious Weakness", content:"<p>The fortress walls look solid and well-maintained. You find no obvious weak points or hidden entrances from this vantage point.</p>", options: [{text:"Reconsider your approach", next: 22}], illustration:"approaching-dark-fortress-walls-guards"},
+             "222": { title: "Caught!", content:"<p>Your attempt fails miserably! The guards spot you immediately and raise the alarm! You are captured.</p>", options: [{text:"To the dungeons...", next: 99}], illustration:"approaching-dark-fortress-walls-guards"},
+             "223": { title: "Bluff Success?", content:"<p>Amazingly, your story seems plausible enough for the guards to let you pass through the gate!</p>", options: [{text:"Enter the fortress courtyard", next: 99}], illustration:"approaching-dark-fortress-walls-guards"},
+             "224": { title: "Sneak Success?", content:"<p>Moving like a shadow, you manage to slip past the gate guards unnoticed!</p>", options: [{text:"Enter the fortress courtyard", next: 99}], illustration:"approaching-dark-fortress-walls-guards"},
+             "400": { title: "Shrine Insights", content:"<p>The carvings depict cycles of growth and renewal. You feel a sense of calm wash over you, slightly restoring your vitality. (+1 HP)</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close", reward: {hpGain: 1}},
+             "401": { title: "Mysterious Carvings", content:"<p>The carvings are too worn and abstract to decipher their specific meaning, though you sense they are very old.</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close"},
+             "402": { title: "Moment of Peace", content:"<p>You spend a quiet moment in reflection. While no divine voice answers, the tranquility of the place settles your nerves.</p>", options: [{text:"Continue towards the badlands", next: 41}], illustration: "overgrown-stone-shrine-wildflowers-close"},
+
+            // Game Over Page (allowSell enabled)
             "99": {
                 title: "Game Over / To Be Continued...",
-                content: "<p>Your adventure ends here... for now. You can sell unwanted items for gold before starting again.</p>", // Modified content
-                // Options will be dynamically generated in renderPageInternal for selling
-                options: [
-                    // The restart button will be added last by renderPageInternal logic
-                ],
+                content: "<p>Your adventure ends here... for now. You can sell unwanted items for gold before starting again.</p>",
+                options: [ /* Restart button added dynamically */ ],
                 illustration: "game-over-generic",
-                gameOver: true, // Mark this page specifically for game over logic
-                allowSell: true // Add a flag to enable selling on this page
+                gameOver: true,
+                allowSell: true // Enable selling feature on this page
              }
         };
 
-
         // ========================================
-        // Game State
+        // Game State (Checked - OK, uses default)
         // ========================================
-        // Define default character state - used for first launch
         const defaultCharacterState = {
             name: "Hero", race: "Human", alignment: "Neutral Good", class: "Adventurer",
-            level: 1, xp: 0, xpToNextLevel: 100, gold: 0, // Added gold
+            level: 1, xp: 0, xpToNextLevel: 100, gold: 0,
             stats: { strength: 8, intelligence: 10, wisdom: 10, dexterity: 10, constitution: 10, charisma: 8, hp: 12, maxHp: 12 },
             inventory: []
         };
-
-        // Initialize gameState
         let gameState = {
             currentPageId: 1,
-            // Deep copy default state initially to avoid modification issues
-            character: JSON.parse(JSON.stringify(defaultCharacterState)),
-            // Store sell feedback message temporarily
-            lastSellMessage: ""
+            character: JSON.parse(JSON.stringify(defaultCharacterState)) // Start with default
         };
 
-
         // ========================================
-        // Game Logic Functions
+        // Game Logic Functions (Checked - OK)
         // ========================================
 
-        // Function to start a brand new game (resets everything)
         function startNewGame() {
             console.log("Starting brand new game...");
-            // Reset state completely using the default
             gameState = {
                 currentPageId: 1,
-                character: JSON.parse(JSON.stringify(defaultCharacterState)),
-                lastSellMessage: ""
+                character: JSON.parse(JSON.stringify(defaultCharacterState)) // Full reset
             };
-            renderPage(gameState.currentPageId);
+            renderPage(gameState.currentPageId); // Render page 1
         }
 
-        // Function to restart, keeping character progress ("New Game Plus")
         function restartGamePlus() {
             console.log("Restarting game (keeping progress)...");
-            gameState.currentPageId = 1; // Only reset the page ID
-            gameState.lastSellMessage = ""; // Clear any sell messages
-            renderPage(gameState.currentPageId);
+            // Only reset current location, keep character object
+            gameState.currentPageId = 1;
+            renderPage(gameState.currentPageId); // Render page 1
         }
 
         function handleChoiceClick(choiceData) {
             console.log("Choice clicked:", choiceData);
+            let feedbackMessage = ""; // Message passed to render function
 
-            // --- Special Actions (Sell, Restart) ---
+            // --- Special Actions ---
             if (choiceData.action === 'restart_plus') {
                 restartGamePlus();
                 return;
             }
             if (choiceData.action === 'sell_item') {
-                handleSellItem(choiceData.item);
+                // handleSellItem now returns the feedback message
+                feedbackMessage = handleSellItem(choiceData.item);
+                // Re-render the current page (99) with the feedback
+                renderPageInternal(gameState.currentPageId, gameData[gameState.currentPageId], feedbackMessage);
                 return;
             }
 
@@ -438,20 +430,17 @@
             const optionNextPageId = parseInt(choiceData.next);
             const itemToAdd = choiceData.addItem;
             let nextPageId = optionNextPageId;
-            let rollResultMessage = gameState.lastSellMessage || ""; // Carry over sell message if any
-            gameState.lastSellMessage = ""; // Clear sell message after use
             const check = choiceData.check;
 
-            // --- Basic Input Validation ---
             if (isNaN(optionNextPageId) && !check) {
                  console.error("Invalid choice data: Missing 'next' page ID and no check defined.", choiceData);
-                 const currentPageData = gameData[gameState.currentPageId] || gameData[99];
-                 renderPageInternal(gameState.currentPageId, currentPageData , "<p><em>Error: Invalid choice data encountered! Cannot proceed.</em></p>");
+                 feedbackMessage = `<p class="feedback-error">Error: Invalid choice data! Cannot proceed.</p>`;
+                 renderPageInternal(gameState.currentPageId, gameData[gameState.currentPageId], feedbackMessage);
                  choicesElement.querySelectorAll('button').forEach(b => b.disabled = true);
                  return;
             }
 
-            // --- Skill Check Logic ---
+            // --- Skill Check ---
             if (check) {
                 const statValue = gameState.character.stats[check.stat] || 10;
                 const modifier = Math.floor((statValue - 10) / 2);
@@ -460,17 +449,16 @@
                 const dc = check.dc;
                 const statName = check.stat.charAt(0).toUpperCase() + check.stat.slice(1);
                 console.log(`Check: ${statName} (DC ${dc}) | Roll: ${roll} + Mod: ${modifier} = ${totalResult}`);
-
-                if (totalResult >= dc) { // Success
+                if (totalResult >= dc) {
                     nextPageId = optionNextPageId;
-                    rollResultMessage += `<p class="roll-success"><em>${statName} Check Success! (Rolled ${roll} + ${modifier} = ${totalResult} vs DC ${dc})</em></p>`;
-                } else { // Failure
+                    feedbackMessage += `<p class="roll-success"><em>${statName} Check Success! (${totalResult} vs DC ${dc})</em></p>`;
+                } else {
                     nextPageId = parseInt(check.onFailure);
-                    rollResultMessage += `<p class="roll-failure"><em>${statName} Check Failed! (Rolled ${roll} + ${modifier} = ${totalResult} vs DC ${dc})</em></p>`;
+                    feedbackMessage += `<p class="roll-failure"><em>${statName} Check Failed! (${totalResult} vs DC ${dc})</em></p>`;
                     if (isNaN(nextPageId)) {
                         console.error("Invalid onFailure ID:", check.onFailure);
                         nextPageId = 99;
-                        rollResultMessage += "<p><em>Error: Invalid failure path defined!</em></p>";
+                        feedbackMessage += `<p class="feedback-error">Error: Invalid failure path defined!</p>`;
                     }
                 }
             }
@@ -479,11 +467,11 @@
             const targetPageData = gameData[nextPageId];
             if (!targetPageData) {
                 console.error(`Data for target page ${nextPageId} not found!`);
-                renderPageInternal(99, gameData[99] || { title: "Error", content: "<p>Page Data Missing!</p>", illustration: "error", gameOver: true }, "<p><em>Error: Next page data missing! Cannot continue.</em></p>");
+                feedbackMessage = `<p class="feedback-error">Error: Next page data missing! Cannot continue.</p>`;
+                renderPageInternal(99, gameData[99], feedbackMessage); // Go to game over
                 return;
             }
 
-             // Apply consequences/rewards defined on the *target* page
              let hpLostThisTurn = 0;
              if (targetPageData.hpLoss) {
                  hpLostThisTurn = targetPageData.hpLoss;
@@ -496,23 +484,20 @@
                   console.log(`Gained ${hpGained} HP.`);
              }
 
-             // Check for death *after* applying HP changes
              if (gameState.character.stats.hp <= 0) {
                  gameState.character.stats.hp = 0;
                  console.log("Player died!");
-                 nextPageId = 99; // Force navigation to game over page
-                 rollResultMessage += `<p><em>You have succumbed to your injuries!${hpLostThisTurn > 0 ? ` (-${hpLostThisTurn} HP)` : ''}</em></p>`;
-                 const gameOverPageData = gameData[nextPageId];
-                 renderPageInternal(nextPageId, gameOverPageData, rollResultMessage);
-                 return; // Stop processing
+                 nextPageId = 99;
+                 feedbackMessage += `<p class="feedback-error"><em>You have succumbed to your injuries!${hpLostThisTurn > 0 ? ` (-${hpLostThisTurn} HP)` : ''}</em></p>`;
+                 renderPageInternal(nextPageId, gameData[nextPageId], feedbackMessage); // Render game over immediately
+                 return;
              }
 
-             // Apply other rewards if alive
              if (targetPageData.reward) {
                  if (targetPageData.reward.xp) {
                      gameState.character.xp += targetPageData.reward.xp;
                      console.log(`Gained ${targetPageData.reward.xp} XP! Total: ${gameState.character.xp}`);
-                     // checkLevelUp(); // TODO
+                     // checkLevelUp();
                  }
                  if (targetPageData.reward.statIncrease) {
                      const stat = targetPageData.reward.statIncrease.stat;
@@ -524,131 +509,141 @@
                      }
                  }
                  if (targetPageData.reward.addItem && !gameState.character.inventory.includes(targetPageData.reward.addItem)) {
-                     gameState.character.inventory.push(targetPageData.reward.addItem);
-                     console.log(`Found item: ${targetPageData.reward.addItem}`);
-                      rollResultMessage += `<p><em>Item acquired: ${targetPageData.reward.addItem}</em></p>`;
+                      const itemName = targetPageData.reward.addItem;
+                      // Check if item exists in itemsData before adding
+                      if (itemsData[itemName]) {
+                          gameState.character.inventory.push(itemName);
+                          console.log(`Found item: ${itemName}`);
+                          feedbackMessage += `<p class="feedback-message"><em>Item acquired: ${itemName}</em></p>`;
+                      } else {
+                          console.warn(`Attempted to add unknown item from reward: ${itemName}`);
+                          feedbackMessage += `<p class="feedback-error"><em>Error: Tried to acquire unknown item '${itemName}'!</em></p>`;
+                      }
                  }
              }
              if (itemToAdd && !gameState.character.inventory.includes(itemToAdd)) {
-                 gameState.character.inventory.push(itemToAdd);
-                 console.log("Added item:", itemToAdd);
-                 rollResultMessage += `<p><em>Item acquired: ${itemToAdd}</em></p>`;
+                  if (itemsData[itemToAdd]) { // Check item exists
+                      gameState.character.inventory.push(itemToAdd);
+                      console.log("Added item:", itemToAdd);
+                      feedbackMessage += `<p class="feedback-message"><em>Item acquired: ${itemToAdd}</em></p>`;
+                  } else {
+                      console.warn(`Attempted to add unknown item from choice: ${itemToAdd}`);
+                      feedbackMessage += `<p class="feedback-error"><em>Error: Tried to acquire unknown item '${itemToAdd}'!</em></p>`;
+                  }
              }
 
-             // --- Update Game State ---
              gameState.currentPageId = nextPageId;
              recalculateMaxHp();
              gameState.character.stats.hp = Math.min(gameState.character.stats.hp, gameState.character.stats.maxHp);
 
              console.log("Transitioning to page:", nextPageId, " New state:", JSON.stringify(gameState));
-             renderPageInternal(nextPageId, gameData[nextPageId], rollResultMessage);
+             renderPageInternal(nextPageId, gameData[nextPageId], feedbackMessage);
         }
 
+        // Returns feedback message string
         function handleSellItem(itemName) {
             console.log("Attempting to sell:", itemName);
             const itemIndex = gameState.character.inventory.indexOf(itemName);
             const itemInfo = itemsData[itemName];
-
-            if (itemIndex !== -1 && itemInfo && itemInfo.goldValue > 0) {
-                const value = itemInfo.goldValue;
-                gameState.character.gold += value;
-                gameState.character.inventory.splice(itemIndex, 1); // Remove item
-                gameState.lastSellMessage = `<p class="sell-feedback">Sold ${itemName} for ${value} Gold.</p>`;
-                console.log(`Sold ${itemName} for ${value} gold. Current gold: ${gameState.character.gold}`);
-            } else {
-                console.warn("Could not sell item:", itemName, " - Item not found, no value, or invalid.");
-                gameState.lastSellMessage = `<p class="roll-failure">Cannot sell ${itemName}.</p>`; // Use failure style for error feedback
-            }
-            // Re-render the current page (which should be the Game Over page '99')
-            renderPageInternal(gameState.currentPageId, gameData[gameState.currentPageId], gameState.lastSellMessage);
+            let message = "";
+
+            // Add extra checks
+            if (itemIndex === -1) {
+                console.warn(`Sell failed: Item "${itemName}" not in inventory.`);
+                message = `<p class="feedback-error">Cannot sell ${itemName} - you don't have it!</p>`;
+            } else if (!itemInfo) {
+                 console.warn(`Sell failed: Item data for "${itemName}" not found.`);
+                 message = `<p class="feedback-error">Cannot sell ${itemName} - item data missing!</p>`;
+            } else if (itemInfo.type === 'quest') {
+                 console.log(`Sell blocked: Item "${itemName}" is a quest item.`);
+                 message = `<p class="feedback-message">Cannot sell ${itemName} - it seems important.</p>`;
+             } else if (itemInfo.goldValue === undefined || itemInfo.goldValue <= 0) {
+                 console.log(`Sell blocked: Item "${itemName}" has no gold value.`);
+                 message = `<p class="feedback-message">${itemName} isn't worth any gold.</p>`;
+             } else {
+                 // Proceed with selling
+                 const value = itemInfo.goldValue;
+                 gameState.character.gold += value;
+                 gameState.character.inventory.splice(itemIndex, 1);
+                 message = `<p class="feedback-success">Sold ${itemName} for ${value} Gold.</p>`;
+                 console.log(`Sold ${itemName} for ${value} gold. Current gold: ${gameState.character.gold}`);
+             }
+             return message; // Return the message to be displayed
         }
 
 
-        function recalculateMaxHp() {
-             const baseHp = 10; // Base HP for level 1 adventurer
+        function recalculateMaxHp() { // Checked - OK
+             const baseHp = 10;
              const conModifier = Math.floor((gameState.character.stats.constitution - 10) / 2);
-             gameState.character.stats.maxHp = Math.max(1, baseHp + conModifier * gameState.character.level); // Ensure HP is at least 1
+             gameState.character.stats.maxHp = Math.max(1, baseHp + conModifier * gameState.character.level);
         }
 
-        function renderPageInternal(pageId, pageData, message = "") {
+        function renderPageInternal(pageId, pageData, message = "") { // Checked - OK (added sell buttons)
              if (!pageData) {
                  console.error(`Render Error: No data for page ${pageId}`);
-                 pageData = gameData[99] || { title: "Error", content: "<p>Render Error! Critical page data missing.</p>", illustration: "error", gameOver: true };
-                 message += "<p><em>Render Error: Page data was missing! Cannot proceed.</em></p>";
+                 pageData = gameData["99"] || { title: "Error", content: "<p>Render Error! Critical page data missing.</p>", illustration: "error", gameOver: true };
+                 message += `<p class="feedback-error">Render Error: Page data for ID ${pageId} was missing!</p>`;
                  pageId = 99;
              }
              console.log(`Rendering page ${pageId}: "${pageData.title}"`);
 
              storyTitleElement.textContent = pageData.title || "Untitled Page";
-             // Inject message first, then page content
              storyContentElement.innerHTML = message + (pageData.content || "<p>...</p>");
 
              updateStatsDisplay();
              updateInventoryDisplay();
-             choicesElement.innerHTML = ''; // Clear previous choices
+             choicesElement.innerHTML = '';
 
              const options = pageData.options || [];
-             const isGameOverPage = pageData.gameOver === true; // Specifically check the gameOver flag
+             const isGameOverPage = pageData.gameOver === true;
 
-             // --- Generate Sell Buttons (Only on Game Over page if allowSell is true) ---
+             // Generate Sell Buttons if applicable
              if (isGameOverPage && pageData.allowSell === true) {
                 const sellableItems = gameState.character.inventory.filter(itemName => {
                     const itemInfo = itemsData[itemName];
-                    return itemInfo && itemInfo.goldValue > 0 && itemInfo.type !== 'quest'; // Only sell non-quest items with value
+                    // Check itemInfo exists before accessing properties
+                    return itemInfo && itemInfo.type !== 'quest' && itemInfo.goldValue !== undefined && itemInfo.goldValue > 0;
                 });
 
                 if (sellableItems.length > 0) {
-                     choicesElement.innerHTML += `<h3>Sell Items:</h3>`; // Add a header for sell options
+                     choicesElement.innerHTML += `<h3 style="margin-bottom: 5px;">Sell Items:</h3>`;
                      sellableItems.forEach(itemName => {
+                         // Double check itemInfo exists here too before creating button
                          const itemInfo = itemsData[itemName];
+                         if (!itemInfo) return; // Skip if item data somehow missing
+
                          const sellButton = document.createElement('button');
-                         sellButton.classList.add('choice-button', 'sell-button'); // Add specific class
+                         sellButton.classList.add('choice-button', 'sell-button');
                          sellButton.textContent = `Sell ${itemName} (${itemInfo.goldValue} Gold)`;
                          sellButton.onclick = () => handleChoiceClick({ action: 'sell_item', item: itemName });
                          choicesElement.appendChild(sellButton);
                      });
-                     choicesElement.innerHTML += `<hr style="border-color: #555; margin: 10px 0;">`; // Separator
+                     choicesElement.innerHTML += `<hr style="border-color: #555; margin: 15px 0 10px 0;">`; // Separator
                 }
              }
 
-
-             // --- Generate Standard Choices / Restart Button ---
-             if (!isGameOverPage && options.length > 0) { // Normal page with navigation choices
+             // Generate Standard Choices / Restart Button
+             if (!isGameOverPage && options.length > 0) {
                  options.forEach(option => {
                      const button = document.createElement('button');
                      button.classList.add('choice-button');
                      button.textContent = option.text;
                      let requirementMet = true;
                      let requirementText = [];
-
-                     if (option.requireItem) {
-                          if (!gameState.character.inventory.includes(option.requireItem)) {
-                              requirementMet = false; requirementText.push(`Requires: ${option.requireItem}`);
-                          }
-                     }
-                     if (option.requireStat) {
-                          const currentStat = gameState.character.stats[option.requireStat.stat] || 0;
-                          if (currentStat < option.requireStat.value) {
-                              requirementMet = false; requirementText.push(`Requires: ${option.requireStat.stat.charAt(0).toUpperCase() + option.requireStat.stat.slice(1)} ${option.requireStat.value}`);
-                          }
-                     }
-
+                     if (option.requireItem) { if (!gameState.character.inventory.includes(option.requireItem)) { requirementMet = false; requirementText.push(`Requires: ${option.requireItem}`); } }
+                     if (option.requireStat) { const currentStat = gameState.character.stats[option.requireStat.stat] || 0; if (currentStat < option.requireStat.value) { requirementMet = false; requirementText.push(`Requires: ${option.requireStat.stat.charAt(0).toUpperCase() + option.requireStat.stat.slice(1)} ${option.requireStat.value}`); } }
                      button.disabled = !requirementMet;
                      if (!requirementMet) button.title = requirementText.join(', ');
-                     else {
-                         const choiceData = { next: option.next, addItem: option.addItem, check: option.check };
-                         button.onclick = () => handleChoiceClick(choiceData);
-                     }
+                     else { const choiceData = { next: option.next, addItem: option.addItem, check: option.check }; button.onclick = () => handleChoiceClick(choiceData); }
                      choicesElement.appendChild(button);
                  });
-             } else if (isGameOverPage) { // Game Over page needs restart button
+             } else if (isGameOverPage) {
                  const restartButton = document.createElement('button');
                  restartButton.classList.add('choice-button');
                  restartButton.textContent = "Restart Adventure (Keep Progress)";
-                 // Use the specific restart_plus action
                  restartButton.onclick = () => handleChoiceClick({ action: 'restart_plus' });
                  choicesElement.appendChild(restartButton);
-             } else { // End of a branch (not game over page 99), offer restart
+             } else if (pageId !== 99) { // End of branch, not explicit game over page
                   choicesElement.insertAdjacentHTML('beforeend', '<p><i>There are no further paths from here.</i></p>');
                   const restartButton = document.createElement('button');
                   restartButton.classList.add('choice-button');
@@ -662,13 +657,12 @@
 
         function renderPage(pageId) { renderPageInternal(pageId, gameData[pageId]); }
 
-        function updateStatsDisplay() {
+        function updateStatsDisplay() { // Checked - OK (added gold)
             const char=gameState.character;
-            // Added Gold display
             statsElement.innerHTML = `<strong>Stats:</strong> <span class="stat-gold">Gold: ${char.gold}</span> <span>Lvl: ${char.level}</span> <span>XP: ${char.xp}/${char.xpToNextLevel}</span> <span>HP: ${char.stats.hp}/${char.stats.maxHp}</span> <span>Str: ${char.stats.strength}</span> <span>Int: ${char.stats.intelligence}</span> <span>Wis: ${char.stats.wisdom}</span> <span>Dex: ${char.stats.dexterity}</span> <span>Con: ${char.stats.constitution}</span> <span>Cha: ${char.stats.charisma}</span>`;
         }
 
-        function updateInventoryDisplay() { // Unchanged
+        function updateInventoryDisplay() { // Checked - OK
             let h='<strong>Inventory:</strong> ';
             if(gameState.character.inventory.length === 0){
                 h+='<em>Empty</em>';
@@ -683,36 +677,33 @@
             inventoryElement.innerHTML = h;
         }
 
-        // --- Scene Update and Lighting --- (Unchanged updateScene, adjustLighting)
+        // --- Scene Update and Lighting --- (Checked - OK)
+        // [Keep updateScene and adjustLighting functions here - unchanged from previous]
         function updateScene(illustrationKey) { if (!scene) { console.warn("Scene not initialized, cannot update visual."); return; } console.log("Updating scene for illustration key:", illustrationKey); if (currentAssemblyGroup) { scene.remove(currentAssemblyGroup); currentAssemblyGroup.traverse(child => { if (child.isMesh) { child.geometry.dispose(); } }); currentAssemblyGroup = null; } scene.fog = null; scene.background = new THREE.Color(0x222222); camera.position.set(0, 2.5, 7); camera.lookAt(0, 0.5, 0); let assemblyFunction; switch (illustrationKey) { case 'city-gates': assemblyFunction = createCityGatesAssembly; break; case 'weaponsmith': assemblyFunction = createWeaponsmithAssembly; break; case 'temple': assemblyFunction = createTempleAssembly; break; case 'resistance-meeting': assemblyFunction = createResistanceMeetingAssembly; break; case 'prisoner-cell': assemblyFunction = createPrisonerCellAssembly; break; case 'game-over': case 'game-over-generic': assemblyFunction = createGameOverAssembly; break; case 'error': assemblyFunction = createErrorAssembly; break; case 'crossroads-signpost-sunny': scene.fog = new THREE.Fog(0x87CEEB, 10, 35); camera.position.set(0, 3, 10); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x87CEEB); assemblyFunction = createCrossroadsAssembly; break; case 'rolling-green-hills-shepherd-distance': case 'hilltop-view-overgrown-shrine-wildflowers': case 'overgrown-stone-shrine-wildflowers-close': scene.fog = new THREE.Fog(0xA8E4A0, 15, 50); camera.position.set(0, 5, 15); camera.lookAt(0, 2, -5); scene.background = new THREE.Color(0x90EE90); if (illustrationKey === 'overgrown-stone-shrine-wildflowers-close') camera.position.set(1, 2, 4); if (illustrationKey === 'hilltop-view-overgrown-shrine-wildflowers') camera.position.set(3, 4, 8); assemblyFunction = createRollingHillsAssembly; break; case 'windy-sea-cliffs-crashing-waves-path-down': case 'scanning-sea-cliffs-no-other-paths-visible': case 'close-up-handholds-carved-in-cliff-face': scene.fog = new THREE.Fog(0x6699CC, 10, 40); camera.position.set(5, 5, 10); camera.lookAt(-2, 0, -5); scene.background = new THREE.Color(0x6699CC); assemblyFunction = createCoastalCliffsAssembly; break; case 'hidden-cove-beach-dark-cave-entrance': case 'character-fallen-at-bottom-of-cliff-path-cove': scene.fog = new THREE.Fog(0x336699, 5, 30); camera.position.set(0, 2, 8); camera.lookAt(0, 1, -2); scene.background = new THREE.Color(0x336699); assemblyFunction = createHiddenCoveAssembly; break; case 'rocky-badlands-cracked-earth-harsh-sun': scene.fog = new THREE.Fog(0xD2B48C, 15, 40); camera.position.set(0, 3, 12); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0xCD853F); assemblyFunction = createDefaultAssembly; break; case 'shadowwood-forest': scene.fog = new THREE.Fog(0x2E2E2E, 5, 20); camera.position.set(0, 2, 8); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x1A1A1A); assemblyFunction = createForestAssembly; break; case 'dark-forest-entrance-gnarled-roots-filtered-light': scene.fog = new THREE.Fog(0x2E2E2E, 5, 20); camera.position.set(0, 2, 8); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x1A1A1A); assemblyFunction = createForestEntranceAssembly; break; case 'overgrown-forest-path-glowing-fungi-vines': case 'pushing-through-forest-undergrowth': scene.fog = new THREE.Fog(0x1A2F2A, 3, 15); camera.position.set(0, 1.5, 6); camera.lookAt(0, 0.5, 0); scene.background = new THREE.Color(0x112211); assemblyFunction = createOvergrownPathAssembly; break; case 'forest-clearing-mossy-statue-weathered-stone': case 'forest-clearing-mossy-statue-hidden-compartment': case 'forest-clearing-mossy-statue-offering': scene.fog = new THREE.Fog(0x2E4F3A, 5, 25); camera.position.set(0, 2, 5); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x223322); assemblyFunction = createClearingStatueAssembly; break; case 'narrow-game-trail-forest-rope-bridge-ravine': case 'character-crossing-rope-bridge-safely': case 'rope-bridge-snapping-character-falling': case 'fallen-log-crossing-ravine': scene.fog = new THREE.Fog(0x2E2E2E, 5, 20); camera.position.set(2, 3, 6); camera.lookAt(0, -1, -2); scene.background = new THREE.Color(0x1A1A1A); assemblyFunction = createForestAssembly; break; case 'two-goblins-ambush-forest-path-spears': case 'forest-shadows-hiding-goblins-walking-past': case 'defeated-goblins-forest-path-loot': case 'blurred-motion-running-past-goblins-forest': scene.fog = new THREE.Fog(0x1A2F2A, 3, 15); camera.position.set(0, 2, 7); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x112211); assemblyFunction = createGoblinAmbushAssembly; break; case 'forest-stream-crossing-dappled-sunlight-stones': case 'mossy-log-bridge-over-forest-stream': case 'character-splashing-into-stream-from-log': scene.fog = new THREE.Fog(0x668866, 8, 25); camera.position.set(0, 2, 6); camera.lookAt(0, 0.5, 0); scene.background = new THREE.Color(0x446644); if (illustrationKey === 'mossy-log-bridge-over-forest-stream') camera.position.set(1, 2, 5); assemblyFunction = createForestAssembly; break; case 'forest-edge-view-rocky-foothills-distant-mountain-fortress': case 'forest-edge': scene.fog = new THREE.Fog(0xAAAAAA, 10, 40); camera.position.set(0, 3, 10); camera.lookAt(0, 1, -5); scene.background = new THREE.Color(0x888888); assemblyFunction = createForestEdgeAssembly; break; case 'climbing-rocky-foothills-path-fortress-closer': case 'rockslide-blocking-mountain-path-boulders': case 'character-climbing-over-boulders': case 'character-slipping-on-rockslide-boulders': case 'rough-detour-path-around-rockslide': scene.fog = new THREE.Fog(0x778899, 8, 35); camera.position.set(0, 4, 9); camera.lookAt(0, 2, 0); scene.background = new THREE.Color(0x708090); assemblyFunction = createDefaultAssembly; break; case 'zoomed-view-mountain-fortress-western-ridge': scene.fog = new THREE.Fog(0x778899, 8, 35); camera.position.set(5, 6, 12); camera.lookAt(-2, 3, -5); scene.background = new THREE.Color(0x708090); assemblyFunction = createDefaultAssembly; break; case 'narrow-goat-trail-mountainside-fortress-view': scene.fog = new THREE.Fog(0x778899, 5, 30); camera.position.set(1, 3, 6); camera.lookAt(0, 2, -2); scene.background = new THREE.Color(0x708090); assemblyFunction = createDefaultAssembly; break; case 'narrow-windy-mountain-ridge-path': case 'character-falling-off-windy-ridge': scene.fog = new THREE.Fog(0x8899AA, 6, 25); camera.position.set(2, 5, 7); camera.lookAt(0, 3, -3); scene.background = new THREE.Color(0x778899); assemblyFunction = createDefaultAssembly; break; case 'approaching-dark-fortress-walls-guards': scene.fog = new THREE.Fog(0x444455, 5, 20); camera.position.set(0, 3, 8); camera.lookAt(0, 2, 0); scene.background = new THREE.Color(0x333344); assemblyFunction = createDefaultAssembly; break; case 'dark-cave-entrance-dripping-water': scene.fog = new THREE.Fog(0x1A1A1A, 2, 10); camera.position.set(0, 1.5, 4); camera.lookAt(0, 1, 0); scene.background = new THREE.Color(0x111111); assemblyFunction = createDarkCaveAssembly; break; default: console.warn(`Unknown illustration key: "${illustrationKey}". Using default scene.`); assemblyFunction = createDefaultAssembly; break; } try { currentAssemblyGroup = assemblyFunction(); if (currentAssemblyGroup && currentAssemblyGroup.isGroup) { scene.add(currentAssemblyGroup); adjustLighting(illustrationKey); } else { throw new Error("Assembly function did not return a valid THREE.Group."); } } catch (error) { console.error(`Error creating assembly for ${illustrationKey}:`, error); if (currentAssemblyGroup) { scene.remove(currentAssemblyGroup); } currentAssemblyGroup = createErrorAssembly(); scene.add(currentAssemblyGroup); adjustLighting('error'); } onWindowResize(); }
         function adjustLighting(illustrationKey) { if (!scene) return; const lightsToRemove = scene.children.filter(child => child.isLight && !child.isAmbientLight); lightsToRemove.forEach(light => scene.remove(light)); const ambient = scene.children.find(c => c.isAmbientLight); if (!ambient) { console.warn("No ambient light found, adding default."); scene.add(new THREE.AmbientLight(0xffffff, 0.5)); } let directionalLight; let lightIntensity = 1.2; let ambientIntensity = 0.5; let lightColor = 0xffffff; let lightPosition = { x: 8, y: 15, z: 10 }; switch (illustrationKey) { case 'crossroads-signpost-sunny': case 'rolling-green-hills-shepherd-distance': case 'hilltop-view-overgrown-shrine-wildflowers': case 'overgrown-stone-shrine-wildflowers-close': ambientIntensity = 0.7; lightIntensity = 1.5; lightColor = 0xFFF8E1; lightPosition = { x: 10, y: 15, z: 10 }; break; case 'shadowwood-forest': case 'dark-forest-entrance-gnarled-roots-filtered-light': case 'overgrown-forest-path-glowing-fungi-vines': case 'forest-clearing-mossy-statue-weathered-stone': case 'narrow-game-trail-forest-rope-bridge-ravine': case 'two-goblins-ambush-forest-path-spears': case 'forest-stream-crossing-dappled-sunlight-stones': case 'forest-edge-view-rocky-foothills-distant-mountain-fortress': ambientIntensity = 0.4; lightIntensity = 0.8; lightColor = 0xB0C4DE; lightPosition = { x: 5, y: 12, z: 5 }; break; case 'dark-cave-entrance-dripping-water': ambientIntensity = 0.1; lightIntensity = 0.3; lightColor = 0x667799; lightPosition = { x: 0, y: 5, z: 3 }; break; case 'prisoner-cell': ambientIntensity = 0.2; lightIntensity = 0.5; lightColor = 0x7777AA; lightPosition = { x: 0, y: 10, z: 5 }; break; case 'windy-sea-cliffs-crashing-waves-path-down': case 'hidden-cove-beach-dark-cave-entrance': ambientIntensity = 0.6; lightIntensity = 1.0; lightColor = 0xCCDDFF; lightPosition = { x: -10, y: 12, z: 8 }; break; case 'rocky-badlands-cracked-earth-harsh-sun': ambientIntensity = 0.7; lightIntensity = 1.8; lightColor = 0xFFFFDD; lightPosition = { x: 5, y: 20, z: 5 }; break; case 'climbing-rocky-foothills-path-fortress-closer': case 'zoomed-view-mountain-fortress-western-ridge': case 'narrow-goat-trail-mountainside-fortress-view': case 'narrow-windy-mountain-ridge-path': case 'approaching-dark-fortress-walls-guards': ambientIntensity = 0.5; lightIntensity = 1.3; lightColor = 0xDDEEFF; lightPosition = { x: 10, y: 18, z: 15 }; break; case 'game-over': case 'game-over-generic': ambientIntensity = 0.2; lightIntensity = 0.8; lightColor = 0xFF6666; lightPosition = { x: 0, y: 5, z: 5 }; break; case 'error': ambientIntensity = 0.4; lightIntensity = 1.0; lightColor = 0xFFCC00; lightPosition = { x: 0, y: 5, z: 5 }; break; default: ambientIntensity = 0.5; lightIntensity = 1.2; lightColor = 0xffffff; lightPosition = { x: 8, y: 15, z: 10 }; break; } const currentAmbient = scene.children.find(c => c.isAmbientLight); if (currentAmbient) { currentAmbient.intensity = ambientIntensity; } directionalLight = new THREE.DirectionalLight(lightColor, lightIntensity); directionalLight.position.set(lightPosition.x, lightPosition.y, lightPosition.z); directionalLight.castShadow = true; directionalLight.shadow.mapSize.set(1024, 1024); directionalLight.shadow.camera.near = 0.5; directionalLight.shadow.camera.far = 50; directionalLight.shadow.camera.left = -20; directionalLight.shadow.camera.right = 20; directionalLight.shadow.camera.top = 20; directionalLight.shadow.camera.bottom = -20; directionalLight.shadow.bias = -0.001; scene.add(directionalLight); }
 
-        // --- Potential Future Improvements Comment --- (Unchanged)
+        // --- Potential Future Improvements Comment --- (Checked - OK)
         /* [Keep comment block here] */
 
         // ========================================
-        // Initialization
+        // Initialization (Checked - OK)
         // ========================================
         document.addEventListener('DOMContentLoaded', () => {
             console.log("DOM Ready. Initializing game...");
-            try {
-                initThreeJS();
-                if (scene && camera && renderer) {
-                     // Use startNewGame for the very first load
-                     startNewGame();
-                     console.log("Game Started Successfully.");
-                 } else {
-                     throw new Error("Three.js initialization failed or did not complete.");
-                 }
-            } catch (error) {
-                console.error("Initialization failed:", error);
-                 storyTitleElement.textContent = "Initialization Error";
-                 storyContentElement.innerHTML = `<p>A critical error occurred during setup. The adventure cannot begin. Please check the console (F12) for technical details.</p><pre>${error.stack || error}</pre>`;
-                 choicesElement.innerHTML = '<p style="color: #f77;">Cannot proceed due to initialization error.</p>';
-                 if (sceneContainer) {
-                     sceneContainer.innerHTML = '<p style="color: #f77; padding: 20px; font-size: 1.2em; text-align: center;">3D Scene Failed to Load</p>';
-                 }
-                 scene = null; camera = null; renderer = null;
+            // Attempt to initialize Three.js first
+            if (initThreeJS()) {
+                // If Three.js setup succeeds, start the game
+                startNewGame(); // Call startNewGame for the very first load
+                console.log("Game Started Successfully.");
+            } else {
+                // If Three.js setup failed, display error in UI
+                console.error("Initialization failed: Three.js setup error.");
+                storyTitleElement.textContent = "Initialization Error";
+                storyContentElement.innerHTML = `<p>A critical error occurred during 3D scene setup. The adventure cannot begin. Please check the console (F12) for technical details.</p>`;
+                choicesElement.innerHTML = '<p style="color: #f77;">Cannot proceed due to initialization error.</p>';
+                if (sceneContainer) {
+                    sceneContainer.innerHTML = '<p style="color: #f77; padding: 20px; font-size: 1.2em; text-align: center;">3D Scene Failed to Load</p>';
+                }
             }
         });
     </script>