diff --git "a/index.html" "b/index.html"
--- "a/index.html"
+++ "b/index.html"
@@ -3,1068 +3,1235 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>D&D 5e Random Character Generator</title>
+    <title>Faerûn City Generator</title>
     <script src="https://cdn.tailwindcss.com"></script>
-    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Fauna+One&display=swap">
     <style>
         body {
-            font-family: 'Roboto', sans-serif;
-            background-color: #f5f5f5;
-            color: #212121;
+            font-family: 'Fauna One', serif;
+            background-color: #f0e6d2;
+            color: #3a3226;
+            background-image: url('https://www.transparenttextures.com/patterns/parchment.png');
+        }
+        
+        .title-font {
+            font-family: 'Cinzel', serif;
+            text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
         }
         
         .card {
-            background-color: white;
-            border-radius: 8px;
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
             transition: all 0.3s ease;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+            background-color: rgba(255, 253, 245, 0.85);
+            border: 1px solid #d4c9a8;
+            border-radius: 8px;
         }
         
         .card:hover {
-            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
-            transform: translateY(-2px);
+            transform: translateY(-5px);
+            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
         }
         
-        .stat-block {
-            background-color: #f5f5f5;
+        .progress-bar {
+            height: 8px;
             border-radius: 4px;
-            transition: all 0.3s ease;
+            background-color: #e0d6b8;
+            overflow: hidden;
         }
         
-        .stat-block:hover {
-            background-color: #e0e0e0;
+        .progress-fill {
+            height: 100%;
+            transition: width 0.6s ease;
         }
         
-        .btn-primary {
-            background-color: #212121;
-            color: white;
-            transition: all 0.3s ease;
-        }
-        
-        .btn-primary:hover {
-            background-color: #424242;
-            transform: translateY(-2px);
+        .fade-in {
+            animation: fadeIn 0.8s ease-in;
         }
         
-        .btn-secondary {
-            background-color: #e0e0e0;
-            color: #212121;
-            transition: all 0.3s ease;
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
         }
         
-        .btn-secondary:hover {
-            background-color: #bdbdbd;
-            transform: translateY(-2px);
+        .race-bar {
+            height: 20px;
+            border-radius: 4px;
+            margin-bottom: 8px;
+            box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);
         }
         
-        .tab-active {
-            border-bottom: 2px solid #212121;
-            font-weight: 500;
+        .header-bg {
+            background: linear-gradient(to right, #5c3c20, #8b5a2b);
+            border-bottom: 3px solid #3a2a1b;
         }
         
-        @keyframes fadeIn {
-            from { opacity: 0; transform: translateY(10px); }
-            to { opacity: 1; transform: translateY(0); }
+        .generate-btn {
+            background: linear-gradient(to bottom, #8b5a2b, #5c3c20);
+            border: 2px solid #3a2a1b;
+            text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
+            letter-spacing: 1px;
         }
         
-        .animate-fade-in {
-            animation: fadeIn 0.4s ease-out forwards;
+        .generate-btn:hover {
+            background: linear-gradient(to bottom, #9d6b3b, #6d4c30);
+            transform: translateY(-2px);
         }
         
-        @keyframes pulse {
-            0% { transform: scale(1); }
-            50% { transform: scale(1.05); }
-            100% { transform: scale(1); }
+        .section-title {
+            border-bottom: 2px solid #d4c9a8;
+            color: #5c3c20;
         }
         
-        .animate-pulse {
-            animation: pulse 0.5s ease-in-out;
+        .tooltip {
+            position: relative;
+            display: inline-block;
+            border-bottom: 1px dotted #5c3c20;
+            cursor: help;
         }
         
-        .material-icons {
-            vertical-align: middle;
+        .tooltip .tooltiptext {
+            visibility: hidden;
+            width: 200px;
+            background-color: #3a3226;
+            color: #fff;
+            text-align: center;
+            border-radius: 6px;
+            padding: 5px;
+            position: absolute;
+            z-index: 1;
+            bottom: 125%;
+            left: 50%;
+            margin-left: -100px;
+            opacity: 0;
+            transition: opacity 0.3s;
+            font-size: 14px;
         }
         
-        @keyframes spin {
-            0% { transform: rotate(0deg); }
-            100% { transform: rotate(360deg); }
+        .tooltip:hover .tooltiptext {
+            visibility: visible;
+            opacity: 1;
         }
         
-        .animate-spin {
-            animation: spin 1s linear infinite;
+        .notable-feature {
+            display: inline-block;
+            background-color: #e8dfc8;
+            border-radius: 15px;
+            padding: 2px 10px;
+            margin: 2px;
+            font-size: 0.9em;
+            border: 1px solid #d4c9a8;
         }
     </style>
 </head>
-<body class="min-h-screen py-8 px-4">
-    <div class="max-w-6xl mx-auto">
-        <header class="text-center mb-8">
-            <h1 class="text-3xl md:text-4xl font-bold mb-2">D&D 5e Character Generator</h1>
-            <p class="text-gray-600">Create your next adventurer with a single click</p>
+<body class="bg-amber-50">
+    <div class="container mx-auto px-4 py-8 max-w-6xl">
+        <header class="text-center mb-12">
+            <h1 class="title-font text-5xl font-bold mb-2 text-amber-900">Faerûn City Generator</h1>
+            <p class="text-amber-800 text-lg">Forge unique settlements for your Forgotten Realms adventures</p>
         </header>
         
-        <div class="flex flex-wrap gap-3 mb-6 justify-center">
-            <button id="generateAll" class="btn-primary px-6 py-3 rounded-lg font-medium flex items-center gap-2">
-                <span class="material-icons">casino</span> Generate Full Character
-            </button>
-            <button id="generateStats" class="btn-secondary px-4 py-2 rounded-lg font-medium flex items-center gap-2">
-                <span class="material-icons">swap_vert</span> Reroll Stats
-            </button>
-            <button id="generateVisuals" class="btn-secondary px-4 py-2 rounded-lg font-medium flex items-center gap-2">
-                <span class="material-icons">palette</span> Reroll Appearance
-            </button>
-            <button id="saveCharacter" class="btn-primary px-4 py-2 rounded-lg font-medium flex items-center gap-2">
-                <span class="material-icons">save</span> Save Character
+        <div class="flex justify-center mb-8">
+            <button id="generateBtn" class="generate-btn text-white font-bold py-3 px-8 rounded-lg shadow-lg transition duration-300 hover:shadow-xl animate__animated animate__pulse animate__infinite">
+                Forge a New City
             </button>
         </div>
         
-        <div class="card p-6 mb-8">
-            <div class="flex border-b border-gray-200 mb-6">
-                <button class="tab tab-active px-4 py-2 mr-2" data-tab="basic">
-                    <span class="material-icons mr-1">person</span> Basic Info
-                </button>
-                <button class="tab px-4 py-2 mr-2" data-tab="stats">
-                    <span class="material-icons mr-1">assessment</span> Stats & Skills
-                </button>
-                <button class="tab px-4 py-2" data-tab="equipment">
-                    <span class="material-icons mr-1">backpack</span> Equipment
-                </button>
+        <div id="cityDisplay" class="bg-white rounded-xl shadow-lg overflow-hidden mb-8 hidden fade-in">
+            <div class="header-bg text-white p-6">
+                <h2 id="cityName" class="title-font text-4xl font-bold text-amber-100"></h2>
+                <p id="cityTagline" class="text-amber-200 italic"></p>
             </div>
             
-            <div id="basicTab" class="tab-content">
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">badge</span> Character
-                        </h3>
-                        <div class="space-y-2">
-                            <p><span class="font-medium">Name:</span> <span id="charName">-</span></p>
-                            <p><span class="font-medium">Race:</span> <span id="race">-</span></p>
-                            <p><span class="font-medium">Subrace:</span> <span id="subrace">-</span></p>
-                            <p><span class="font-medium">Class:</span> <span id="class">-</span></p>
-                            <p><span class="font-medium">Subclass:</span> <span id="subclass">-</span></p>
-                            <p><span class="font-medium">Level:</span> <span id="level">1</span></p>
+            <div class="p-6 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+                <!-- Overview Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Overview</h3>
+                        <div class="space-y-3">
+                            <div>
+                                <span class="font-semibold text-amber-900">Population:</span>
+                                <span id="population" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Size:</span>
+                                <span id="citySize" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Population Density:</span>
+                                <span id="density" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Location:</span>
+                                <span id="location" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Government:</span>
+                                <span id="government" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Languages:</span>
+                                <span id="languages" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Founded:</span>
+                                <span id="founded" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Current Age:</span>
+                                <span id="currentAge" class="text-amber-800"></span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Demographics Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Demographics</h3>
+                        <div id="raceDemographics" class="space-y-2">
+                            <!-- Race percentages will be inserted here -->
+                        </div>
+                        <div class="mt-4">
+                            <span class="font-semibold text-amber-900">Social Strata:</span>
+                            <span id="socialStrata" class="text-amber-800"></span>
+                        </div>
+                        <div class="mt-2">
+                            <span class="font-semibold text-amber-900">Gender Ratio:</span>
+                            <span id="genderRatio" class="text-amber-800"></span>
                         </div>
                     </div>
-                    
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">history_edu</span> Background
-                        </h3>
-                        <div class="space-y-2">
-                            <p><span class="font-medium">Background:</span> <span id="background">-</span></p>
-                            <p><span class="font-medium">Alignment:</span> <span id="alignment">-</span></p>
-                            <p><span class="font-medium">Personality:</span> <span id="personality">-</span></p>
-                            <p><span class="font-medium">Ideal:</span> <span id="ideal">-</span></p>
-                            <p><span class="font-medium">Bond:</span> <span id="bond">-</span></p>
-                            <p><span class="font-medium">Flaw:</span> <span id="flaw">-</span></p>
+                </div>
+                
+                <!-- Economy Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Economy</h3>
+                        <div class="space-y-3">
+                            <div>
+                                <span class="font-semibold text-amber-900">Primary Industries:</span>
+                                <span id="industries" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Major Exports:</span>
+                                <span id="exports" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Trade Partners:</span>
+                                <span id="tradePartners" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Wealth Level:</span>
+                                <span id="wealth" class="text-amber-800"></span>
+                                <div class="progress-bar mt-1">
+                                    <div id="wealthBar" class="progress-fill bg-green-700"></div>
+                                </div>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Coinage:</span>
+                                <span id="coinage" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Taxation:</span>
+                                <span id="taxation" class="text-amber-800"></span>
+                            </div>
                         </div>
                     </div>
                 </div>
                 
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">accessibility</span> Physical Traits
-                        </h3>
-                        <div class="grid grid-cols-2 gap-2">
-                            <p><span class="font-medium">Age:</span> <span id="age">-</span></p>
-                            <p><span class="font-medium">Height:</span> <span id="height">-</span></p>
-                            <p><span class="font-medium">Weight:</span> <span id="weight">-</span></p>
-                            <p><span class="font-medium">Eyes:</span> <span id="eyes">-</span></p>
-                            <p><span class="font-medium">Skin:</span> <span id="skin">-</span></p>
-                            <p><span class="font-medium">Hair:</span> <span id="hair">-</span></p>
+                <!-- Architecture Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Architecture</h3>
+                        <div class="space-y-3">
+                            <div>
+                                <span class="font-semibold text-amber-900">Style:</span>
+                                <span id="architectureStyle" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Notable Features:</span>
+                                <div id="architectureFeatures" class="mt-1 flex flex-wrap">
+                                    <!-- Features will be inserted here -->
+                                </div>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Building Materials:</span>
+                                <span id="buildingMaterials" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Fortifications:</span>
+                                <span id="fortifications" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Layout:</span>
+                                <span id="cityLayout" class="text-amber-800"></span>
+                            </div>
                         </div>
                     </div>
-                    
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">star</span> Distinctive Features
-                        </h3>
-                        <p id="distinctive">-</p>
+                </div>
+                
+                <!-- Geography Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Geography</h3>
+                        <div class="space-y-3">
+                            <div>
+                                <span class="font-semibold text-amber-900">Terrain:</span>
+                                <span id="terrain" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Climate:</span>
+                                <span id="climate" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Water Source:</span>
+                                <span id="waterSource" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Elevation:</span>
+                                <span id="elevation" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Natural Resources:</span>
+                                <span id="naturalResources" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Hazards:</span>
+                                <span id="hazards" class="text-amber-800"></span>
+                            </div>
+                        </div>
                     </div>
                 </div>
                 
-                <div class="card p-4">
-                    <h3 class="font-medium text-lg mb-3 flex items-center">
-                        <span class="material-icons mr-2">menu_book</span> Backstory
-                    </h3>
-                    <p id="backstory" class="text-gray-700">Your character's unique backstory will appear here...</p>
+                <!-- Culture Card -->
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Culture</h3>
+                        <div class="space-y-3">
+                            <div>
+                                <span class="font-semibold text-amber-900">Popular Classes:</span>
+                                <span id="popularClasses" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Religions:</span>
+                                <span id="religions" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Crime Level:</span>
+                                <span id="crime" class="text-amber-800"></span>
+                                <div class="progress-bar mt-1">
+                                    <div id="crimeBar" class="progress-fill bg-red-700"></div>
+                                </div>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Magic Prevalence:</span>
+                                <span id="magic" class="text-amber-800"></span>
+                                <div class="progress-bar mt-1">
+                                    <div id="magicBar" class="progress-fill bg-purple-700"></div>
+                                </div>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Education:</span>
+                                <span id="education" class="text-amber-800"></span>
+                            </div>
+                            <div>
+                                <span class="font-semibold text-amber-900">Cultural Values:</span>
+                                <span id="culturalValues" class="text-amber-800"></span>
+                            </div>
+                        </div>
+                    </div>
                 </div>
             </div>
             
-            <div id="statsTab" class="tab-content hidden">
-                <div class="grid grid-cols-2 md:grid-cols-6 gap-3 mb-6">
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Strength</div>
-                        <div class="text-3xl font-medium" id="str">10</div>
-                        <div class="text-sm" id="strMod">+0</div>
-                    </div>
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Dexterity</div>
-                        <div class="text-3xl font-medium" id="dex">10</div>
-                        <div class="text-sm" id="dexMod">+0</div>
-                    </div>
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Constitution</div>
-                        <div class="text-3xl font-medium" id="con">10</div>
-                        <div class="text-sm" id="conMod">+0</div>
-                    </div>
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Intelligence</div>
-                        <div class="text-3xl font-medium" id="int">10</div>
-                        <div class="text-sm" id="intMod">+0</div>
-                    </div>
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Wisdom</div>
-                        <div class="text-3xl font-medium" id="wis">10</div>
-                        <div class="text-sm" id="wisMod">+0</div>
-                    </div>
-                    <div class="stat-block p-3 text-center">
-                        <div class="text-xs uppercase tracking-wider text-gray-600">Charisma</div>
-                        <div class="text-3xl font-medium" id="cha">10</div>
-                        <div class="text-sm" id="chaMod">+0</div>
+            <!-- City Description -->
+            <div class="px-6 pb-6">
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">City Description</h3>
+                        <p id="cityDescription" class="text-amber-900 leading-relaxed"></p>
                     </div>
                 </div>
-                
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">check_circle</span> Proficiencies
-                        </h3>
-                        <ul id="proficiencies" class="list-disc pl-5 space-y-1">
-                            <li>None generated yet</li>
-                        </ul>
-                    </div>
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">auto_awesome</span> Features & Traits
-                        </h3>
-                        <ul id="features" class="list-disc pl-5 space-y-1">
-                            <li>None generated yet</li>
-                        </ul>
+            </div>
+            
+            <!-- Notable Locations -->
+            <div class="px-6 pb-6">
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Notable Locations</h3>
+                        <div id="notableLocations" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+                            <!-- Locations will be inserted here -->
+                        </div>
                     </div>
                 </div>
             </div>
             
-            <div id="equipmentTab" class="tab-content hidden">
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">shield</span> Equipment
-                        </h3>
-                        <ul id="equipmentList" class="list-disc pl-5 space-y-1">
-                            <li>None generated yet</li>
-                        </ul>
-                    </div>
-                    <div class="card p-4">
-                        <h3 class="font-medium text-lg mb-3 flex items-center">
-                            <span class="material-icons mr-2">auto_fix_high</span> Spells
-                        </h3>
-                        <ul id="spellsList" class="list-disc pl-5 space-y-1">
-                            <li>None generated yet</li>
-                        </ul>
+            <!-- Current Events -->
+            <div class="px-6 pb-6">
+                <div class="card">
+                    <div class="p-6">
+                        <h3 class="section-title text-xl font-bold mb-4 pb-2">Current Events</h3>
+                        <div id="currentEvents" class="space-y-3">
+                            <!-- Events will be inserted here -->
+                        </div>
                     </div>
                 </div>
             </div>
         </div>
-        
-        <div class="text-center text-gray-600">
-            <p>Click the dice to generate your next D&D 5e character!</p>
-        </div>
     </div>
 
     <script>
-        // Data for character generation
-        const races = [
-            "Dragonborn", "Dwarf", "Elf", "Gnome", "Half-Elf", 
-            "Halfling", "Half-Orc", "Human", "Tiefling"
+        // Expanded name components for city generation
+        const prefixes = ["Al", "Bar", "Cal", "Dor", "El", "Fal", "Gor", "Har", "Il", "Jor", 
+                         "Kel", "Lor", "Mor", "Nor", "Oth", "Pel", "Quar", "Riv", "Sel", "Tor",
+                         "Ul", "Val", "Wes", "Xan", "Yar", "Zor", "Bel", "Cor", "Dun", "Ere",
+                         "Fen", "Gul", "Hel", "Iri", "Jar", "Kor", "Lun", "Mir", "Nar", "Olo",
+                         "Pir", "Quil", "Ror", "Sar", "Tel", "Uth", "Vor", "Wil", "Xor", "Yil"];
+        
+        const middles = ["an", "ar", "en", "il", "or", "ur", "ath", "ith", "oth", "esh",
+                        "ish", "osh", "ash", "eth", "yth", "al", "el", "ol", "ul", "ir",
+                        "am", "em", "im", "om", "um", "in", "on", "un", "ad", "ed",
+                        "id", "od", "ud", "ag", "eg", "ig", "og", "ug", "ak", "ek"];
+        
+        const suffixes = ["dor", "mar", "ton", "ven", "wick", "ford", "stead", "burg", "holm", 
+                         "crest", "watch", "spire", "haven", "port", "reach", "rock", "fall", 
+                         "glen", "hollow", "keep", "moor", "peak", "ridge", "vale", "wood",
+                         "bridge", "dale", "field", "gate", "hill", "light", "meet", "nest",
+                         "pass", "quay", "rest", "ship", "tower", "wall", "yard", "band",
+                         "cairn", "dell", "earth", "firth", "garde", "hold", "isle", "joust"];
+        
+        const standalone = ["Duskendale", "Brightwater", "Stormhaven", "Mooncrest", "Dragonfell",
+                          "Silvermarsh", "Goldspire", "Ironford", "Shadowfen", "Highcliff",
+                          "Deepwood", "Fairwind", "Stonebridge", "Blackmoor", "Whitepeak",
+                          "Neverwinter", "Waterdeep", "Baldur's Gate", "Silverymoon", "Mithral Hall",
+                          "Candlekeep", "Secomber", "Daggerford", "Trollbark", "Shadowdale",
+                          "Myth Drannor", "Zhentil Keep", "Hillsfar", "Elventree", "Eveningstar",
+                          "Suzail", "Westgate", "Procampur", "Tantras", "Elturel", "Scornubel",
+                          "Berdusk", "Iriaebor", "Yartar", "Luskan", "Mirabar", "Longsaddle"];
+        
+        // Expanded location options
+        const locations = [
+            "Along the Sword Coast", "In the Dalelands", "Near the Sea of Fallen Stars",
+            "In the North", "In the Western Heartlands", "In Amn", "In Tethyr",
+            "In the Silver Marches", "In the Unapproachable East", "In the Shaar",
+            "On the Moonsea", "In the Vilhon Reach", "In the Lake of Steam region",
+            "In the Chultan Peninsula", "In the Underdark", "On an island in the Trackless Sea",
+            "In the High Forest", "In the Anauroch desert", "In the Storm Horns mountains",
+            "Along the River Chionthar", "Near the Marsh of Chelimber", "In the Graypeak Mountains",
+            "In the Lurkwood", "On the edge of the High Moor", "In the Delimbiyr Vale",
+            "Near the Marsh of Dead Men", "In the Trollclaws", "Along the Trade Way",
+            "In the Sunset Vale", "Near the Stonelands", "In the Vast", "In the Ride",
+            "In the Tunlands", "Near the Flooded Forest", "In the Border Kingdoms",
+            "In the Great Dale", "In the Rawlinswood", "In the Forest of Wyrms",
+            "On the Shining Plains", "In the Hordelands", "In the Endless Wastes"
         ];
         
-        const subraces = {
-            "Dragonborn": ["Black", "Blue", "Brass", "Bronze", "Copper", "Gold", "Green", "Red", "Silver", "White"],
-            "Dwarf": ["Hill Dwarf", "Mountain Dwarf"],
-            "Elf": ["High Elf", "Wood Elf", "Dark Elf (Drow)"],
-            "Gnome": ["Forest Gnome", "Rock Gnome"],
-            "Half-Elf": ["Standard", "Aquatic", "Drow", "Wood Elf"],
-            "Halfling": ["Lightfoot", "Stout"],
-            "Half-Orc": ["Standard"],
-            "Human": ["Standard", "Variant"],
-            "Tiefling": ["Asmodeus", "Baalzebul", "Dispater", "Fierna", "Glasya", "Levistus", "Mammon", "Mephistopheles", "Zariel"]
-        };
+        // Expanded government types with subtypes
+        const governments = [
+            {type: "Monarchy", subtype: ["Hereditary", "Elected", "Divine Right", "Constitutional"]},
+            {type: "Council of Merchants", subtype: ["Oligarchy", "Representative", "Corrupt"]},
+            {type: "Mageocracy", subtype: ["Archmage Rule", "Circle of Magi", "Arcane Senate"]},
+            {type: "Theocracy", subtype: ["Temple Rule", "Divine Mandate", "Prophet's Word"]},
+            {type: "Military Dictatorship", subtype: ["Warlord", "Knightly Order", "Mercenary Company"]},
+            {type: "Oligarchy", subtype: ["Noble Families", "Guild Masters", "Wealthy Elite"]},
+            {type: "Democracy", subtype: ["Direct", "Representative", "Magically Enforced"]},
+            {type: "Feudal System", subtype: ["Traditional", "Decentralized", "Oppressive"]},
+            {type: "Guild-run", subtype: ["Merchant's League", "Artisan Collective", "Thieves' Guild"]},
+            {type: "Tribal Council", subtype: ["Elders", "Shamans", "Warrior Chiefs"]},
+            {type: "Magistrate Rule", subtype: ["Appointed", "Elected", "Hereditary"]},
+            {type: "Undead Overlord", subtype: ["Lich", "Vampire", "Death Knight"]},
+            {type: "Dragon Rule", subtype: ["Ancient Wyrm", "Dragon Council", "Half-Dragon"]},
+            {type: "Plutocracy", subtype: ["Wealth-based", "Trade Prince", "Banker's Guild"]},
+            {type: "Anarchy", subtype: ["True Chaos", "Neighborhood Collectives", "Survival of the Fittest"]},
+            {type: "Matriarchy", subtype: ["Queen's Rule", "Priestess Council", "Amazonian"]},
+            {type: "Patriarchy", subtype: ["King's Rule", "Elder Council", "Warrior Code"]},
+            {type: "Elder Council", subtype: ["Wise Ones", "Ancient Beings", "Immortal Guardians"]},
+            {type: "Divine Mandate", subtype: ["Chosen One", "Oracle's Word", "Celestial Being"]},
+            {type: "Secret Society Control", subtype: ["Illuminati", "Shadow Cabal", "Cult Leadership"]}
+        ];
         
-        const classes = [
-            "Barbarian", "Bard", "Cleric", "Druid", "Fighter", 
-            "Monk", "Paladin", "Ranger", "Rogue", "Sorcerer", 
-            "Warlock", "Wizard"
+        // City sizes with population ranges and descriptions
+        const citySizes = [
+            { name: "Village", population: "100-1,000", desc: "A small, tight-knit community where everyone knows each other" },
+            { name: "Small Town", population: "1,000-5,000", desc: "A growing settlement with basic amenities and some specialization" },
+            { name: "Large Town", population: "5,000-10,000", desc: "A bustling town with multiple districts and established trade" },
+            { name: "Small City", population: "10,000-25,000", desc: "A proper city with walls, guilds, and significant infrastructure" },
+            { name: "Medium City", population: "25,000-50,000", desc: "A regional hub with diverse populations and complex politics" },
+            { name: "Large City", population: "50,000-100,000", desc: "A major metropolis with international influence and all amenities" },
+            { name: "Metropolis", population: "100,000+", desc: "A vast city that dominates the region, rivaling Waterdeep or Calimport" },
+            { name: "City-State", population: "Varies", desc: "An independent city that governs surrounding lands" },
+            { name: "Floating City", population: "5,000-50,000", desc: "A magical city suspended in the air or on clouds" },
+            { name: "Undercity", population: "1,000-20,000", desc: "A subterranean settlement, either by choice or necessity" }
         ];
         
-        const subclasses = {
-            "Barbarian": ["Path of the Berserker", "Path of the Totem Warrior", "Path of the Ancestral Guardian", "Path of the Storm Herald", "Path of the Zealot"],
-            "Bard": ["College of Lore", "College of Valor", "College of Glamour", "College of Swords", "College of Whispers"],
-            "Cleric": ["Knowledge Domain", "Life Domain", "Light Domain", "Nature Domain", "Tempest Domain", "Trickery Domain", "War Domain", "Forge Domain", "Grave Domain"],
-            "Druid": ["Circle of the Land", "Circle of the Moon", "Circle of Dreams", "Circle of the Shepherd", "Circle of Spores"],
-            "Fighter": ["Champion", "Battle Master", "Eldritch Knight", "Arcane Archer", "Cavalier", "Samurai"],
-            "Monk": ["Way of the Open Hand", "Way of Shadow", "Way of the Four Elements", "Way of the Drunken Master", "Way of the Kensei", "Way of the Sun Soul"],
-            "Paladin": ["Oath of Devotion", "Oath of the Ancients", "Oath of Vengeance", "Oath of Conquest", "Oath of Redemption", "Oathbreaker"],
-            "Ranger": ["Hunter", "Beast Master", "Gloom Stalker", "Horizon Walker", "Monster Slayer"],
-            "Rogue": ["Thief", "Assassin", "Arcane Trickster", "Mastermind", "Swashbuckler", "Inquisitive", "Scout"],
-            "Sorcerer": ["Draconic Bloodline", "Wild Magic", "Storm Sorcery", "Shadow Magic", "Divine Soul"],
-            "Warlock": ["The Archfey", "The Fiend", "The Great Old One", "The Celestial", "The Hexblade"],
-            "Wizard": ["School of Abjuration", "School of Conjuration", "School of Divination", "School of Enchantment", "School of Evocation", "School of Illusion", "School of Necromancy", "School of Transmutation", "War Magic"]
-        };
+        // Population densities with descriptions
+        const densities = [
+            {name: "Very sparse (rural)", desc: "Spread out farms and homesteads with large distances between buildings"},
+            {name: "Sparse", desc: "Small clusters of buildings with open spaces between neighborhoods"},
+            {name: "Moderate", desc: "Reasonable spacing between buildings with some open areas"},
+            {name: "Dense", desc: "Close-built structures with narrow streets and few open spaces"},
+            {name: "Very dense (urban)", desc: "Tightly packed buildings with multi-level structures"},
+            {name: "Extremely dense (crowded)", desc: "Overflowing population with buildings stacked upon each other"},
+            {name: "Variable (sprawling)", desc: "Mix of dense centers and sparse outskirts"},
+            {name: "Vertical density", desc: "Population lives in tall towers or deep underground"},
+            {name: "Nomadic density", desc: "Population moves seasonally between different areas"}
+        ];
         
-        const backgrounds = [
-            "Acolyte", "Charlatan", "Criminal", "Entertainer", "Folk Hero", 
-            "Guild Artisan", "Hermit", "Noble", "Outlander", "Sage", 
-            "Sailor", "Soldier", "Urchin"
+        // Architecture styles with descriptions
+        const architectureStyles = [
+            {name: "Gothic", desc: "Pointed arches, ribbed vaults, and flying buttresses"},
+            {name: "Romanesque", desc: "Round arches, thick walls, and sturdy pillars"},
+            {name: "Elven Elegance", desc: "Graceful curves, living wood, and integration with nature"},
+            {name: "Dwarven Stonework", desc: "Precise masonry, geometric patterns, and underground structures"},
+            {name: "Moorish", desc: "Intricate geometric designs, horseshoe arches, and lush courtyards"},
+            {name: "Byzantine", desc: "Domes, mosaics, and a mix of eastern and western influences"},
+            {name: "Nordic", desc: "Wooden structures, steep roofs, and runic decorations"},
+            {name: "Oriental", desc: "Pagoda-style roofs, paper screens, and zen gardens"},
+            {name: "Mage-touched", desc: "Floating elements, impossible angles, and glowing runes"},
+            {name: "Underdark", desc: "Fungal lighting, organic curves, and bioluminescent accents"},
+            {name: "Pirate-inspired", desc: "Salvaged materials, ship-like structures, and waterfront focus"},
+            {name: "Naval", desc: "Lighthouse motifs, wave patterns, and sea-worthy construction"},
+            {name: "Agricultural", desc: "Practical designs, large barns, and irrigation systems"},
+            {name: "Militaristic", desc: "Defensive structures, barracks-like buildings, and watchtowers"},
+            {name: "Religious", desc: "Temple-like structures, holy symbols, and sacred geometry"},
+            {name: "Arcane", desc: "Wizard towers, alchemical labs, and magical enhancements"},
+            {name: "Decadent", desc: "Overly ornate, gilded everything, and excessive decoration"},
+            {name: "Ruined", desc: "Partially destroyed but still inhabited, with makeshift repairs"},
+            {name: "Rebuilt", desc: "New construction atop old ruins, with visible layers of history"},
+            {name: "Eclectic Mix", desc: "No consistent style, with buildings from many different influences"}
         ];
         
-        const alignments = [
-            "Lawful Good", "Neutral Good", "Chaotic Good",
-            "Lawful Neutral", "True Neutral", "Chaotic Neutral",
-            "Lawful Evil", "Neutral Evil", "Chaotic Evil"
+        // Architecture features (now with descriptors)
+        const architectureFeatures = [
+            {name: "Tall spires", desc: "Reaching high into the sky, visible for miles"},
+            {name: "Underground tunnels", desc: "Connecting buildings beneath the streets"},
+            {name: "Canals", desc: "Waterways used for transport and drainage"},
+            {name: "Floating districts", desc: "Sections of the city that hover magically"},
+            {name: "Tree-top walkways", desc: "Bridges and paths connecting canopy dwellings"},
+            {name: "Massive walls", desc: "Imposing fortifications that dominate the skyline"},
+            {name: "Glass domes", desc: "Enormous transparent structures covering districts"},
+            {name: "Hanging gardens", desc: "Terraced greenery on buildings and walls"},
+            {name: "Elevated walkways", desc: "Second-story paths keeping pedestrians above the streets"},
+            {name: "Magical lighting", desc: "Ever-burning lamps or floating light orbs"},
+            {name: "Flying buttresses", desc: "Architectural supports that look like they're flying"},
+            {name: "Underground cities", desc: "Vast complexes beneath the surface"},
+            {name: "Portals to other planes", desc: "Permanent gates to other dimensions"},
+            {name: "Living buildings", desc: "Structures that grow and change like organisms"},
+            {name: "Shifting architecture", desc: "Buildings that rearrange themselves periodically"},
+            {name: "Crystal structures", desc: "Geometric formations of glowing crystal"},
+            {name: "Bone towers", desc: "Structures built from enormous bones or skeletons"},
+            {name: "Petrified wood buildings", desc: "Hardened wood that's stone-like in durability"},
+            {name: "Waterfront docks", desc: "Expansive piers and wharves for maritime trade"},
+            {name: "Multi-level city", desc: "Districts stacked vertically with bridges between"}
         ];
         
-        // Enhanced name generation system
-        const namePrefixes = {
-            "male": ["Al", "Bal", "Cor", "Dain", "Ed", "Fal", "Gar", "Hal", "Ian", "Jor", "Kal", "Lor", "Mal", "Nor", "Oth", "Pal", "Quin", "Ral", "Sor", "Tal", "Ul", "Val", "Wil", "Xan", "Yor", "Zan"],
-            "female": ["Ael", "Bri", "Cer", "Dae", "Eli", "Fae", "Gwy", "Hel", "Iri", "Jas", "Kyl", "Lil", "Mae", "Nym", "Ori", "Pha", "Quel", "Rae", "Syl", "Tae", "Una", "Vyl", "Wyn", "Xyl", "Yll", "Zyl"],
-            "neutral": ["Aer", "Ber", "Cyr", "Dru", "Ere", "Fyr", "Gry", "Hyr", "Ith", "Jyr", "Kyr", "Lyr", "Myr", "Nyr", "Ory", "Pyr", "Qyr", "Ryr", "Syr", "Tyr", "Ury", "Vyr", "Wyr", "Xyr", "Yyr", "Zyr"]
-        };
+        // Building materials with descriptors
+        const buildingMaterials = [
+            {name: "Stone", desc: "Quarried rock, durable and fireproof"},
+            {name: "Wood", desc: "Local timber, warm but flammable"},
+            {name: "Brick", desc: "Fired clay, uniform and sturdy"},
+            {name: "Marble", desc: "Luxurious stone with beautiful veining"},
+            {name: "Crystal", desc: "Magically grown or naturally formed"},
+            {name: "Magically reinforced", desc: "Enhanced to be stronger than normal"},
+            {name: "Living plants", desc: "Still growing and requiring maintenance"},
+            {name: "Bone", desc: "From large creatures or magical sources"},
+            {name: "Obsidian", desc: "Volcanic glass, sharp and dark"},
+            {name: "Metal", desc: "Expensive but extremely durable"},
+            {name: "Petrified wood", desc: "Ancient wood turned to stone"},
+            {name: "Ice", desc: "Magically preserved or in cold climates"},
+            {name: "Adobe", desc: "Sun-dried earth bricks"},
+            {name: "Thatch", desc: "Dried vegetation for roofing"},
+            {name: "Mud brick", desc: "Simple and inexpensive"},
+            {name: "Glass", desc: "For windows or entire structures"},
+            {name: "Compacted earth", desc: "Rammed into solid forms"},
+            {name: "Coral", desc: "Harvested from reefs or magically grown"},
+            {name: "Fungal growth", desc: "Living fungus shaped into structures"},
+            {name: "Unknown alien material", desc: "From other planes or worlds"}
+        ];
         
-        const nameSuffixes = {
-            "male": ["dor", "fin", "gar", "horn", "ian", "jar", "kor", "lin", "mar", "nor", "or", "par", "quin", "rik", "sar", "tor", "ur", "var", "win", "xor", "yor", "zar"],
-            "female": ["ara", "belle", "cyn", "delle", "elle", "fina", "gwen", "halla", "ira", "jara", "kala", "lyra", "mira", "nara", "ora", "pia", "quira", "ria", "sira", "tira", "ura", "vira", "wina", "xira", "yra", "zira"],
-            "neutral": ["an", "ban", "can", "dan", "en", "fan", "gan", "han", "ian", "jan", "kan", "lan", "man", "nan", "on", "pan", "qan", "ran", "san", "tan", "uan", "van", "wan", "xan", "yan", "zan"]
-        };
+        // Fortifications with descriptors
+        const fortifications = [
+            {name: "None", desc: "Completely open and undefended"},
+            {name: "Simple wooden palisade", desc: "Basic defense against small threats"},
+            {name: "Stone walls", desc: "Standard city defenses"},
+            {name: "High walls with towers", desc: "Imposing defenses with lookout points"},
+            {name: "Massive walls with magical defenses", desc: "Nearly impregnable fortifications"},
+            {name: "Citadel at center", desc: "Last bastion of defense if outer walls fall"},
+            {name: "Multiple layered walls", desc: "Successive rings of defense"},
+            {name: "Floating defensive platforms", desc: "Magically suspended guard posts"},
+            {name: "Underground bunkers", desc: "Hidden shelters beneath the city"},
+            {name: "Maze-like streets designed for defense", desc: "Confusing layout to slow invaders"},
+            {name: "Living walls of thorny plants", desc: "Natural barriers that grow back"},
+            {name: "Animated statues", desc: "Construct guardians that come to life"},
+            {name: "Elemental guardians", desc: "Bound elemental beings that defend the city"},
+            {name: "Glyphs and wards", desc: "Magical protections against specific threats"},
+            {name: "Moat with drawbridges", desc: "Water defenses with controlled access"},
+            {name: "Cliffside defenses", desc: "Natural terrain enhanced with fortifications"},
+            {name: "Hidden escape tunnels", desc: "Secret routes out of the city"},
+            {name: "Magical barrier", desc: "Invisible force field surrounding the city"},
+            {name: "Dimensional locks", desc: "Preventing teleportation or planar travel"},
+            {name: "Dragon perches", desc: "Towers designed for dragon allies to land on"}
+        ];
         
-        const surnamePrefixes = ["Black", "Bright", "Copper", "Dark", "Ember", "Frost", "Gold", "Hollow", "Iron", "Jade", "King", "Long", "Moon", "Night", "Oak", "Proud"];
-        const surnameSuffixes = ["wood", "shield", "water", "hold", "mane", "way", "root", "helm", "ford", "shadow", "shade", "breeze", "leaf", "more"];
+        // Terrain types with descriptors
+        const terrains = [
+            {name: "Plains", desc: "Flat open land with good visibility"},
+            {name: "Hills", desc: "Rolling terrain with some elevation changes"},
+            {name: "Mountains", desc: "Steep slopes and high altitudes"},
+            {name: "Forest", desc: "Dense tree cover limiting visibility"},
+            {name: "Jungle", desc: "Lush, overgrown vegetation and high humidity"},
+            {name: "Desert", desc: "Arid landscape with extreme temperatures"},
+            {name: "Tundra", desc: "Frozen plains with permafrost"},
+            {name: "Swamp", desc: "Wetlands with standing water and muddy ground"},
+            {name: "Coastal", desc: "Along a sea or ocean with maritime influence"},
+            {name: "Island", desc: "Surrounded by water on all sides"},
+            {name: "Underground", desc: "Beneath the surface in caves or caverns"},
+            {name: "Floating", desc: "Suspended in air or water by magic or technology"},
+            {name: "Cliffside", desc: "Built into or on the side of steep cliffs"},
+            {name: "Volcanic", desc: "Near active or dormant volcanoes"},
+            {name: "Marsh", desc: "Wet, boggy ground with reeds and grasses"},
+            {name: "River delta", desc: "Where a river splits into many channels"},
+            {name: "Plateau", desc: "Elevated flat terrain with steep sides"},
+            {name: "Canyon", desc: "Deep gorge with steep walls"},
+            {name: "Fey-touched", desc: "Landscape altered by Feywild influence"},
+            {name: "Shadow-infused", desc: "Darkened by Shadowfell energy"}
+        ];
         
-        const titlePrefixes = ["The", "Sir", "Lady", "Master", "Dame", "Lord", "Captain", "Baron", "Count", "Duke"];
-        const titleSuffixes = ["Brave", "Wise", "Strong", "Swift", "Clever", "Mighty", "Noble", "Fair", "Just", "Valiant"];
+        // Climates with descriptors
+        const climates = [
+            {name: "Temperate", desc: "Moderate with four distinct seasons"},
+            {name: "Cold", desc: "Long winters and short summers"},
+            {name: "Warm", desc: "Hot summers and mild winters"},
+            {name: "Arid", desc: "Dry with little precipitation"},
+            {name: "Humid", desc: "Moist air and frequent rainfall"},
+            {name: "Frigid", desc: "Permanently cold with ice and snow"},
+            {name: "Tropical", desc: "Hot and wet year-round"},
+            {name: "Mediterranean", desc: "Hot dry summers and cool wet winters"},
+            {name: "Magically altered", desc: "Climate controlled by arcane means"},
+            {name: "Variable", desc: "Changes unpredictably or frequently"},
+            {name: "Eternal spring", desc: "Perpetually mild and flowering"},
+            {name: "Perpetual autumn", desc: "Always harvest-like with falling leaves"},
+            {name: "Controlled by magic", desc: "Weather regulated by spellcasters"},
+            {name: "Storm-wracked", desc: "Frequent thunderstorms or tempests"},
+            {name: "Fog-shrouded", desc: "Persistent mists and low visibility"},
+            {name: "Dusty", desc: "Dry with frequent dust storms"},
+            {name: "Misty", desc: "Light fog common throughout the year"},
+            {name: "Rainy", desc: "Frequent precipitation of all types"},
+            {name: "Windy", desc: "Constant strong breezes or gales"},
+            {name: "Strange planar influences", desc: "Climate affected by other planes"}
+        ];
         
-        const namePatterns = [
-            // Single name patterns
-            () => getRandomItem(["The ", ""]) + generateNamePart("neutral"),
-            () => generateNamePart("male") + getRandomItem([" the ", " of ", " from "]) + getRandomItem([generatePlaceName(), generateTitle()]),
-            () => generateNamePart("female") + getRandomItem([" the ", " of ", " from "]) + getRandomItem([generatePlaceName(), generateTitle()]),
-            
-            // First + last name patterns
-            () => generateNamePart("male") + " " + generateSurname(),
-            () => generateNamePart("female") + " " + generateSurname(),
-            () => generateNamePart("neutral") + " " + generateSurname(),
-            
-            // Compound names
-            () => generateNamePart("male") + getRandomItem(["", "-"]) + generateNamePart("male"),
-            () => generateNamePart("female") + getRandomItem(["", "-"]) + generateNamePart("female"),
-            
-            // Title + name patterns
-            () => getRandomItem(titlePrefixes) + " " + generateNamePart("male"),
-            () => getRandomItem(titlePrefixes) + " " + generateNamePart("female"),
-            () => generateNamePart("male") + " " + getRandomItem(titleSuffixes),
-            () => generateNamePart("female") + " " + getRandomItem(titleSuffixes)
+        // Water sources with descriptors
+        const waterSources = [
+            {name: "River", desc: "Flowing freshwater source"},
+            {name: "Lake", desc: "Large standing body of water"},
+            {name: "Oasis", desc: "Isolated water in arid regions"},
+            {name: "Underground springs", desc: "Water rising from below"},
+            {name: "Magical creation", desc: "Conjured or created water"},
+            {name: "Rain collection", desc: "Gathered from precipitation"},
+            {name: "Desalination", desc: "Saltwater made drinkable"},
+            {name: "Ice melt", desc: "From glaciers or permanent snow"},
+            {name: "Portals to elemental plane of water", desc: "Endless pure water"},
+            {name: "Condensation towers", desc: "Devices that pull moisture from air"},
+            {name: "Aqueducts", desc: "Engineered water transport"},
+            {name: "Wells", desc: "Dug deep to reach groundwater"},
+            {name: "Artesian springs", desc: "Naturally pressurized water"},
+            {name: "Tidal flows", desc: "Using ocean tides for fresh water"},
+            {name: "Living water creatures", desc: "Elementals or other beings provide water"},
+            {name: "Divine blessing", desc: "Provided by deities or celestials"},
+            {name: "Elemental binding", desc: "Water elementals compelled to provide"},
+            {name: "Dew collectors", desc: "Gathering morning condensation"},
+            {name: "Cloud siphoning", desc: "Pulling water directly from clouds"},
+            {name: "Alchemical processes", desc: "Creating water through magic or science"}
         ];
         
-        function generateNamePart(gender) {
-            const prefix = getRandomItem(namePrefixes[gender]);
-            const suffix = getRandomItem(nameSuffixes[gender]);
-            
-            // Sometimes add an extra syllable or modify the name
-            if (Math.random() > 0.7) {
-                const extra = getRandomItem(["a", "e", "i", "o", "u", "ar", "el", "in", "or", "yn"]);
-                return prefix + extra + suffix;
-            }
-            
-            return prefix + suffix;
-        }
+        // Elevations with descriptors
+        const elevations = [
+            {name: "Sea level", desc: "At or near the ocean's surface"},
+            {name: "Lowlands", desc: "Slightly above sea level"},
+            {name: "Hills", desc: "Moderate elevation changes"},
+            {name: "Mountainous", desc: "High altitude location"},
+            {name: "Underground", desc: "Below the surface"},
+            {name: "Floating", desc: "Above ground level"},
+            {name: "Cliffside", desc: "On the face of steep drops"},
+            {name: "Valley", desc: "Surrounded by higher elevations"},
+            {name: "Plateau", desc: "Elevated flat area"},
+            {name: "Canyon", desc: "Below ground level between cliffs"},
+            {name: "Suspended in trees", desc: "Built among giant trees"},
+            {name: "Built into a giant creature", desc: "On or in a colossal being"},
+            {name: "Flying", desc: "Constantly airborne"},
+            {name: "On a massive bridge", desc: "Spanning a chasm or river"},
+            {name: "In a crater", desc: "Within a massive impact site"},
+            {name: "On a glacier", desc: "Moving slowly with the ice"},
+            {name: "On a massive tree", desc: "In the branches of a single enormous tree"},
+            {name: "On a giant mushroom", desc: "Fungal platform high above ground"},
+            {name: "On a floating island", desc: "Landmass suspended in air"},
+            {name: "In a massive geode", desc: "Within a crystal-lined cavern"}
+        ];
         
-        function generateSurname() {
-            const prefix = getRandomItem(surnamePrefixes);
-            const suffix = getRandomItem(surnameSuffixes);
-            
-            // Sometimes combine two prefixes or suffixes
-            if (Math.random() > 0.6) {
-                const extraPrefix = getRandomItem(surnamePrefixes);
-                return prefix + extraPrefix + suffix;
-            }
-            
-            return prefix + suffix;
-        }
+        // Industries with descriptors
+        const industries = [
+            {name: "Agriculture", desc: "Farming crops and livestock"},
+            {name: "Mining", desc: "Extracting minerals and ores"},
+            {name: "Fishing", desc: "Harvesting from seas, rivers, or lakes"},
+            {name: "Lumber", desc: "Forestry and wood products"},
+            {name: "Textiles", desc: "Cloth and clothing production"},
+            {name: "Metalworking", desc: "Blacksmithing and metal goods"},
+            {name: "Shipbuilding", desc: "Constructing maritime vessels"},
+            {name: "Magic items", desc: "Creating enchanted objects"},
+            {name: "Alchemy", desc: "Potions and chemical products"},
+            {name: "Glassmaking", desc: "Glassware and windows"},
+            {name: "Pottery", desc: "Ceramic goods and tiles"},
+            {name: "Weapons", desc: "Arms manufacturing"},
+            {name: "Armor", desc: "Protective gear production"},
+            {name: "Spices", desc: "Growing or trading in seasonings"},
+            {name: "Wine", desc: "Viticulture and winemaking"},
+            {name: "Livestock", desc: "Animal husbandry"},
+            {name: "Hunting", desc: "Game and fur procurement"},
+            {name: "Trapping", desc: "Capturing animals for various uses"},
+            {name: "Fur trade", desc: "Pelts and leather goods"},
+            {name: "Slave trade", desc: "Unfortunate but profitable"},
+            {name: "Information brokering", desc: "Selling knowledge and secrets"},
+            {name: "Smuggling", desc: "Illicit transport of goods"},
+            {name: "Piracy", desc: "Maritime raiding and theft"},
+            {name: "Mercenary work", desc: "Selling martial services"},
+            {name: "Art", desc: "Creative works and craftsmanship"}
+        ];
         
-        function generatePlaceName() {
-            const places = ["the Mountains", "the Forest", "the Vale", "the Hills", "the River", "the Sea", "the North", "the South", "the East", "the West"];
-            return getRandomItem(places);
-        }
+        // Exports with descriptors
+        const exports = [
+            {name: "Grain", desc: "Staple crops for food"},
+            {name: "Ore", desc: "Unrefined mineral resources"},
+            {name: "Fish", desc: "Fresh or preserved seafood"},
+            {name: "Timber", desc: "Lumber and wood products"},
+            {name: "Cloth", desc: "Textiles and fabrics"},
+            {name: "Metal goods", desc: "Tools, weapons, and implements"},
+            {name: "Ships", desc: "Seaworthy vessels"},
+            {name: "Magic items", desc: "Enchanted objects of all kinds"},
+            {name: "Potions", desc: "Alchemical concoctions"},
+            {name: "Glassware", desc: "Decorative and practical glass"},
+            {name: "Ceramics", desc: "Pottery and tilework"},
+            {name: "Weapons", desc: "From simple to masterwork"},
+            {name: "Armor", desc: "Protective gear of all types"},
+            {name: "Spices", desc: "Exotic flavorings"},
+            {name: "Wine", desc: "Fine vintages and table wines"},
+            {name: "Livestock", desc: "Live animals for various purposes"},
+            {name: "Furs", desc: "Pelts and hides"},
+            {name: "Slaves", desc: "Unfortunate sentient trade"},
+            {name: "Information", desc: "Secrets and intelligence"},
+            {name: "Art", desc: "Paintings, sculptures, and more"},
+            {name: "Exotic animals", desc: "Unusual creatures for menageries"},
+            {name: "Rare plants", desc: "Botanical specimens"},
+            {name: "Ancient artifacts", desc: "Relics of past civilizations"},
+            {name: "Spell components", desc: "Magical ingredients"},
+            {name: "Mercenaries", desc: "Skilled warriors for hire"}
+        ];
         
-        function generateTitle() {
-            return getRandomItem(titleSuffixes);
-        }
+        // Trade partners with descriptors
+        const tradePartners = [
+            {name: "Waterdeep", desc: "City of Splendors"},
+            {name: "Baldur's Gate", desc: "Bustling port city"},
+            {name: "Neverwinter", desc: "City of Skilled Hands"},
+            {name: "Silverymoon", desc: "Gem of the North"},
+            {name: "Mirabar", desc: "Mountain fortress city"},
+            {name: "Luskan", desc: "City of Sails"},
+            {name: "Calimport", desc: "Southern trade hub"},
+            {name: "Athkatla", desc: "Amnian trade capital"},
+            {name: "Suzail", desc: "Cormyrian royal city"},
+            {name: "Westgate", desc: "City of Merchants"},
+            {name: "Zhentil Keep", desc: "Mercantile power"},
+            {name: "Hillsfar", desc: "Red Plume city"},
+            {name: "Mulmaster", desc: "City of Danger"},
+            {name: "Phlan", desc: "Reborn city"},
+            {name: "Elturgard", desc: "Shining crusader state"},
+            {name: "Daggerford", desc: "Small but strategic"},
+            {name: "Secomber", desc: "River trade town"},
+            {name: "Tethyr", desc: "Reborn kingdom"},
+            {name: "Amn", desc: "Merchant kingdom"},
+            {name: "Thay", desc: "Red Wizards' domain"},
+            {name: "Underdark cities", desc: "Drow and duergar metropolises"},
+            {name: "Elven settlements", desc: "Hidden enclaves"},
+            {name: "Dwarven strongholds", desc: "Mountain citadels"},
+            {name: "Gnomish enclaves", desc: "Innovative communities"},
+            {name: "Dragonmarked houses", desc: "Eberron's mercantile powers"}
+        ];
         
-        function generateCharacterName(gender) {
-            // Choose a random naming pattern
-            const pattern = getRandomItem(namePatterns);
-            return pattern();
-        }
+        // Wealth levels with descriptors
+        const wealthLevels = [
+            {name: "Destitute", desc: "Most live in poverty", value: 1},
+            {name: "Poor", desc: "Struggling to get by", value: 2},
+            {name: "Modest", desc: "Basic needs met", value: 3},
+            {name: "Comfortable", desc: "Some luxuries available", value: 4},
+            {name: "Wealthy", desc: "Prosperous with trade", value: 5},
+            {name: "Very wealthy", desc: "Significant surplus", value: 6},
+            {name: "Extremely wealthy", desc: "Regional economic power", value: 7},
+            {name: "Decadently rich", desc: "Almost unimaginable wealth", value: 8}
+        ];
         
-        const personalityTraits = [
-            "I idolize a particular hero of my faith and constantly refer to that person's deeds and example.",
-            "I can find common ground between the fiercest enemies, empathizing with them and always working toward peace.",
-            "I see omens in every event and action. The gods try to speak to us, we just need to listen.",
-            "Nothing can shake my optimistic attitude.",
-            "I quote (or misquote) sacred texts and proverbs in almost every situation.",
-            "I am tolerant (or intolerant) of other faiths and respect (or condemn) the worship of other gods.",
-            "I've enjoyed fine food, drink, and high society among my temple's elite. Rough living grates on me.",
-            "I've spent so long in the temple that I have little practical experience dealing with people in the outside world."
+        // Popular classes with descriptors
+        const popularClasses = [
+            {name: "Fighters", desc: "Martial warriors of all types"},
+            {name: "Rogues", desc: "Sneaks and thieves"},
+            {name: "Wizards", desc: "Learned spellcasters"},
+            {name: "Clerics", desc: "Divine servants"},
+            {name: "Rangers", desc: "Wilderness experts"},
+            {name: "Paladins", desc: "Holy warriors"},
+            {name: "Druids", desc: "Nature's guardians"},
+            {name: "Bards", desc: "Artists and lorekeepers"},
+            {name: "Barbarians", desc: "Fierce warriors"},
+            {name: "Monks", desc: "Disciplined martial artists"},
+            {name: "Sorcerers", desc: "Innate spellcasters"},
+            {name: "Warlocks", desc: "Pact-bound magic users"},
+            {name: "Artificers", desc: "Magical inventors"},
+            {name: "Blood hunters", desc: "Monster slayers"},
+            {name: "Psions", desc: "Mind mages"}
         ];
         
-        const ideals = [
-            "Tradition. The ancient traditions of worship and sacrifice must be preserved and upheld. (Lawful)",
-            "Charity. I always try to help those in need, no matter what the personal cost. (Good)",
-            "Change. We must help bring about the changes the gods are constantly working in the world. (Chaotic)",
-            "Power. I hope to one day rise to the top of my faith's religious hierarchy. (Lawful)",
-            "Faith. I trust that my deity will guide my actions. I have faith that if I work hard, things will go well. (Lawful)",
-            "Aspiration. I seek to prove myself worthy of my god's favor by matching my actions against his or her teachings. (Any)"
+        // Religions with descriptors
+        const religions = [
+            {name: "Worship of the Seldarine (elven pantheon)", desc: "Corellon, Sehanine, and others"},
+            {name: "Moradin and the dwarven pantheon", desc: "Dwarven gods of crafting and war"},
+            {name: "The Triad (Tyr, Torm, Ilmater)", desc: "Law, justice, and endurance"},
+            {name: "The Moonmaiden (Selûne)", desc: "Goddess of the moon"},
+            {name: "The Morninglord (Lathander)", desc: "God of dawn and renewal"},
+            {name: "The Dead Three (Bane, Bhaal, Myrkul)", desc: "Gods of tyranny, murder, and death"},
+            {name: "Mystra's faith", desc: "Goddess of magic"},
+            {name: "The Red Knight", desc: "Goddess of strategy"},
+            {name: "Tempus", desc: "God of war"},
+            {name: "Gond", desc: "God of craft"},
+            {name: "Oghma", desc: "God of knowledge"},
+            {name: "Chauntea", desc: "Goddess of agriculture"},
+            {name: "Sune", desc: "Goddess of love and beauty"},
+            {name: "Shar", desc: "Goddess of darkness"},
+            {name: "Cyric", desc: "God of lies"},
+            {name: "Talos", desc: "God of storms"},
+            {name: "Local deity", desc: "Unique to this region"},
+            {name: "Primordial worship", desc: "Elemental powers"},
+            {name: "Dragon cult", desc: "Veneration of dragonkind"},
+            {name: "Demon worship", desc: "Dark and dangerous"},
+            {name: "No organized religion", desc: "Secular or individual spirituality"}
         ];
         
-        const bonds = [
-            "I would die to recover an ancient relic of my faith that was lost long ago.",
-            "I will someday get revenge on the corrupt temple hierarchy who branded me a heretic.",
-            "I owe my life to the priest who took me in when my parents died.",
-            "Everything I do is for the common people.",
-            "I will do anything to protect the temple where I served.",
-            "I seek to preserve a sacred text that my enemies consider heretical and seek to destroy."
+        // Crime levels with descriptors
+        const crimeLevels = [
+            {name: "Virtually nonexistent", desc: "Almost perfectly lawful", value: 1},
+            {name: "Very low", desc: "Occasional petty crimes", value: 2},
+            {name: "Low", desc: "Some theft and minor offenses", value: 3},
+            {name: "Moderate", desc: "Regular criminal activity", value: 4},
+            {name: "High", desc: "Dangerous in some areas", value: 5},
+            {name: "Very high", desc: "Gangs and organized crime", value: 6},
+            {name: "Rampant", desc: "Lawlessness common", value: 7},
+            {name: "Controlled by thieves' guilds", desc: "Criminal organizations rule", value: 8},
+            {name: "Organized crime rules", desc: "Outlaws hold real power", value: 9},
+            {name: "Anarchy", desc: "No effective law enforcement", value: 10}
         ];
         
-        const flaws = [
-            "I judge others harshly, and myself even more severely.",
-            "I put too much trust in those who wield power within my temple's hierarchy.",
-            "My piety sometimes leads me to blindly trust those that profess faith in my god.",
-            "I am inflexible in my thinking.",
-            "I am suspicious of strangers and expect the worst of them.",
-            "Once I pick a goal, I become obsessed with it to the detriment of everything else in my life."
+        // Magic prevalence with descriptors
+        const magicLevels = [
+            {name: "Nonexistent", desc: "Magic is feared or unknown", value: 1},
+            {name: "Very rare", desc: "Few practitioners", value: 2},
+            {name: "Uncommon", desc: "Present but not widespread", value: 3},
+            {name: "Common", desc: "Used in daily life", value: 4},
+            {name: "Widespread", desc: "Integrated into society", value: 5},
+            {name: "Very common", desc: "Most people benefit", value: 6},
+            {name: "Ubiquitous", desc: "Affects nearly everything", value: 7},
+            {name: "Arcane city", desc: "Built on magical principles", value: 8},
+            {name: "Magocracy", desc: "Mages rule directly", value: 9},
+            {name: "Magical experiments everywhere", desc: "Constant arcane innovation", value: 10}
         ];
         
-        const eyeColors = ["Amber", "Blue", "Brown", "Gray", "Green", "Hazel", "Red", "Violet", "Yellow"];
-        const skinColors = ["Pale", "Fair", "Light", "Medium", "Olive", "Tan", "Brown", "Dark", "Ebony", "Gray", "Blue", "Green"];
-        const hairColors = ["Black", "Brown", "Blonde", "Red", "White", "Gray", "Auburn", "Chestnut", "Silver", "Blue", "Green"];
-        const hairStyles = ["Short", "Long", "Curly", "Straight", "Wavy", "Bald", "Braided", "Ponytail", "Mohawk", "Dreadlocks"];
+        // Races with color coding and descriptors
+        const races = [
+            { name: "Humans", color: "bg-blue-700", desc: "Adaptable and ambitious" },
+            { name: "Elves", color: "bg-green-700", desc: "Graceful and long-lived" },
+            { name: "Dwarves", color: "bg-yellow-700", desc: "Sturdy and traditional" },
+            { name: "Halflings", color: "bg-red-700", desc: "Cheerful and nimble" },
+            { name: "Gnomes", color: "bg-purple-700", desc: "Inventive and curious" },
+            { name: "Half-Elves", color: "bg-indigo-700", desc: "Diplomatic and versatile" },
+            { name: "Half-Orcs", color: "bg-orange-700", desc: "Strong and resilient" },
+            { name: "Tieflings", color: "bg-pink-700", desc: "Fiend-touched outsiders" },
+            { name: "Dragonborn", color: "bg-teal-700", desc: "Draconic heritage" },
+            { name: "Aasimar", color: "bg-amber-300", desc: "Celestial-touched" },
+            { name: "Genasi", color: "bg-cyan-500", desc: "Elemental heritage" },
+            { name: "Firbolgs", color: "bg-gray-400", desc: "Giant-kin forest dwellers" },
+            { name: "Goliaths", color: "bg-stone-500", desc: "Mountain-dwelling giants" },
+            { name: "Tabaxi", color: "bg-orange-500", desc: "Cat-like wanderers" },
+            { name: "Tritons", color: "bg-blue-400", desc: "Underwater nobility" },
+            { name: "Other", color: "bg-gray-700", desc: "Various uncommon races" }
+        ];
         
-        const distinctiveFeatures = [
-            "Scar across the face", "Missing finger", "Tattoos covering arms", "Piercings", "Unusual birthmark",
-            "Heterochromia (different colored eyes)", "Limp", "Crooked nose", "Unusually tall/short", "Distinctive voice",
-            "Always wears a specific color", "Always carries a particular item", "Unusual jewelry", "Memorable laugh"
+        // Languages with descriptors
+        const languages = [
+            {name: "Common", desc: "Trade tongue understood by most"},
+            {name: "Elvish", desc: "Flowing and poetic"},
+            {name: "Dwarvish", desc: "Guttural and precise"},
+            {name: "Halfling", desc: "Cheerful and informal"},
+            {name: "Gnomish", desc: "Technical and complex"},
+            {name: "Draconic", desc: "Ancient and powerful"},
+            {name: "Infernal", desc: "Harsh and commanding"},
+            {name: "Celestial", desc: "Harmonious and pure"},
+            {name: "Undercommon", desc: "Underdark trade language"},
+            {name: "Giant", desc: "Booming and simple"},
+            {name: "Orcish", desc: "Aggressive and blunt"},
+            {name: "Abyssal", desc: "Chaotic and disturbing"},
+            {name: "Primordial", desc: "Elemental languages"},
+            {name: "Sylvan", desc: "Fey tongue"},
+            {name: "Deep Speech", desc: "Alien and unsettling"},
+            {name: "Thieves' Cant", desc: "Secret criminal language"},
+            {name: "Druidic", desc: "Nature's secret tongue"},
+            {name: "Sign language", desc: "Gestural communication"},
+            {name: "Regional dialect", desc: "Local variations"},
+            {name: "Secret tongue", desc: "Unique to this city"}
         ];
         
-        // Equipment lists
-        const weapons = {
-            "Simple Melee": ["Club", "Dagger", "Greatclub", "Handaxe", "Javelin", "Light hammer", "Mace", "Quarterstaff", "Sickle", "Spear"],
-            "Simple Ranged": ["Light crossbow", "Dart", "Shortbow", "Sling"],
-            "Martial Melee": ["Battleaxe", "Flail", "Glaive", "Greataxe", "Greatsword", "Halberd", "Lance", "Longsword", "Maul", "Morningstar", "Pike", "Rapier", "Scimitar", "Shortsword", "Trident", "War pick", "Warhammer", "Whip"],
-            "Martial Ranged": ["Blowgun", "Hand crossbow", "Heavy crossbow", "Longbow", "Net"]
-        };
+        // Taglines with descriptors
+        const taglines = [
+            {text: "Where shadows whisper and gold flows like water.", desc: "A city of intrigue and wealth"},
+            {text: "A jewel of the North, rough-cut but shining bright.", desc: "Proud frontier city"},
+            {text: "The city of a thousand spires and ten thousand secrets.", desc: "Arcane metropolis"},
+            {text: "Built on magic, ruled by steel.", desc: "Where might and magic meet"},
+            {text: "Where the river meets the road and all paths converge.", desc: "Crossroads of civilization"},
+            {text: "A beacon of civilization in the wild lands.", desc: "Lone bastion against wilderness"},
+            {text: "The city that never sleeps, for nightmares walk its streets.", desc: "Dark and dangerous"},
+            {text: "Carved from the living rock, a testament to dwarven ingenuity.", desc: "Underground marvel"},
+            {text: "Floating on the clouds, touched by the divine.", desc: "Celestial city"},
+            {text: "A den of scoundrels and thieves, but oh what treasures they hold!", desc: "Notorious pirate haven"},
+            {text: "Where every stone tells a story older than memory.", desc: "Ancient beyond reckoning"},
+            {text: "The forge where empires are made and unmade.", desc: "Powerful and political"},
+            {text: "A tapestry woven from a hundred cultures.", desc: "Melting pot of peoples"},
+            {text: "The candle that draws moths and burns them to ash.", desc: "Beautiful but deadly"},
+            {text: "Where the gods walk among mortals and the streets run with miracles.", desc: "Holy city"}
+        ];
         
-        const armor = {
-            "Light": ["Padded", "Leather", "Studded leather"],
-            "Medium": ["Hide", "Chain shirt", "Scale mail", "Breastplate", "Half plate"],
-            "Heavy": ["Ring mail", "Chain mail", "Splint", "Plate"],
-            "Shields": ["Shield"]
-        };
+        // City descriptions with descriptors
+        const cityDescriptions = [
+            {text: "This city has stood for centuries, weathering wars, plagues, and magical catastrophes. Its streets tell stories of glory and ruin, with each district bearing the marks of different eras in its architecture and culture.", desc: "Ancient and storied"},
+            {text: "A relatively new settlement by Faerûnian standards, this city has rapidly grown due to its strategic location and abundant resources. The mix of old traditions and new ideas creates a vibrant, if sometimes chaotic, atmosphere.", desc: "Young and growing"},
+            {text: "Ancient beyond memory, this city was old when Netheril was young. Its foundations contain secrets best left buried, though scholars and adventurers constantly seek them out.", desc: "Elder city"},
+            {text: "Built upon layer upon layer of previous civilizations, this city is literally and figuratively deep. The upper levels gleam with wealth and power, while the lower levels descend into darkness and mystery.", desc: "Layered history"},
+            {text: "Perched precariously in a dangerous location, this city survives through a combination of stubbornness, ingenuity, and sheer luck. Its people are hardened by their environment but proud of their home.", desc: "Defiant stronghold"},
+            {text: "A city of contrasts, where splendor and squalor exist side by side. The wealthy live in opulent towers while the poor scrape by in shadowed alleys, yet all share a fierce love for their city.", desc: "Divided but united"},
+            {text: "Known for its stunning beauty and artistic culture, this city attracts bards, artists, and philosophers from across Faerûn. Its walls are adorned with murals and its squares filled with music.", desc: "Cultural center"},
+            {text: "A grim, utilitarian city where function outweighs form. Its people are practical to a fault, valuing strength and skill above all else. Not a place for the weak or faint of heart.", desc: "No-nonsense"},
+            {text: "Shrouded in mist and mystery, this city seems half-real at times. Visitors speak of streets that shift when no one is looking and buildings that weren't there yesterday.", desc: "Ethereal and strange"},
+            {text: "A melting pot of cultures and races, this city thrives on diversity. Dozens of languages can be heard in its markets, and its cuisine is legendary across the Sword Coast.", desc: "Cosmopolitan hub"},
+            {text: "This city lives and breathes commerce, with goods from across Toril flowing through its markets. The clink of coins is the true language here, and everything has its price.", desc: "Mercantile powerhouse"},
+            {text: "A holy city where pilgrims come to worship at dozens of temples. The faithful walk the streets alongside skeptics, and divine magic is as common as rain.", desc: "Sacred site"},
+            {text: "Built around a massive magical college or artifact, this city pulses with arcane energy. Spell duels light up the night sky, and even children know a few cantrips.", desc: "Arcane heart"},
+            {text: "Once great, now fallen into decay, this city clings to past glories while crumbling at the edges. Yet in its ruins, new life and opportunities spring up like weeds through cobblestones.", desc: "Fading grandeur"},
+            {text: "A city constantly at war, whether with external enemies or internal factions. Its walls are scarred from battles, and its people know how to fight—whether they want to or not.", desc: "Battleground"}
+        ];
         
-        const adventuringGear = [
-            "Backpack", "Bedroll", "Bell", "Blanket", "Block and tackle", "Book", "Candle", "Case (map/scroll)", "Chain (10 feet)", "Chalk", "Chest", "Climber's kit", 
-            "Clothes (common)", "Clothes (costume)", "Clothes (fine)", "Clothes (traveler's)", "Component pouch", "Crowbar", "Fishing tackle", "Flask", "Grappling hook", 
-            "Hammer", "Healer's kit", "Holy symbol", "Hourglass", "Ink (1 oz. bottle)", "Ink pen", "Ladder (10-foot)", "Lantern", "Lock", "Magnifying glass", "Manacles", 
-            "Mess kit", "Mirror (steel)", "Oil (flask)", "Paper (one sheet)", "Parchment (one sheet)", "Perfume (vial)", "Pick (miner's)", "Piton", "Pole (10-foot)", 
-            "Pot (iron)", "Potion of healing", "Pouch", "Quiver", "Ram (portable)", "Rations (1 day)", "Robes", "Rope (hempen, 50 feet)", "Rope (silk, 50 feet)", 
-            "Sack", "Scale (merchant's)", "Sealing wax", "Shovel", "Signal whistle", "Signet ring", "Soap", "Spellbook", "Spikes (iron)", "Spyglass", "Tent (two-person)", 
-            "Tinderbox", "Torch", "Vial", "Waterskin", "Whetstone"
+        // Social strata options
+        const socialStrata = [
+            "Rigid caste system",
+            "Fluid based on wealth",
+            "Nobility vs commoners",
+            "Guild hierarchy dominates",
+            "Religious hierarchy dominates",
+            "Military ranks determine status",
+            "Arcane power determines status",
+            "Meritocratic (skill determines rank)",
+            "Egalitarian (little formal hierarchy)",
+            "Oppressive (rulers vs oppressed)",
+            "Complex web of competing systems",
+            "Ancestry determines status",
+            "Foreigners have lower status",
+            "Magical ability grants status",
+            "Adventurers have special status"
         ];
         
-        // Utility functions
-        function getRandomInt(min, max) {
-            return Math.floor(Math.random() * (max - min + 1)) + min;
-        }
+        // Gender ratios
+        const genderRatios = [
+            "Balanced",
+            "Slightly more males",
+            "Slightly more females",
+            "Mostly males",
+            "Mostly females",
+            "Non-binary majority",
+            "Varies by district",
+            "Genderless society",
+            "Fluid concepts of gender",
+            "Strict gender roles"
+        ];
         
-        function getRandomItem(array) {
-            return array[Math.floor(Math.random() * array.length)];
-        }
+        // City founding eras
+        const foundingEras = [
+            "Ancient (before -1000 DR)",
+            "Old (-1000 DR to 0 DR)",
+            "Early (1 DR to 500 DR)",
+            "Middle (501 DR to 1000 DR)",
+            "Recent (1001 DR to 1350 DR)",
+            "Very recent (1351 DR to present)",
+            "Mythic (date unknown)",
+            "From another time",
+            "Multiple foundings",
+            "Always existed"
+        ];
         
-        function getRandomItems(array, count) {
-            const shuffled = [...array].sort(() => 0.5 - Math.random());
-            return shuffled.slice(0, count);
-        }
+        // Current ages
+        const currentAges = [
+            "Golden Age",
+            "Silver Age",
+            "Bronze Age",
+            "Iron Age",
+            "Age of Decline",
+            "Age of Rebirth",
+            "Age of Turmoil",
+            "Age of Expansion",
+            "Age of Isolation",
+            "Age of Innovation"
+        ];
         
-        function calculateModifier(score) {
-            return Math.floor((score - 10) / 2);
-        }
+        // Coinage types
+        const coinage = [
+            "Standard Faerûnian (gp, sp, cp)",
+            "Local variant with different weights",
+            "Foreign coins accepted",
+            "Commodity-based (barter system)",
+            "Magical credit system",
+            "Guild scrip",
+            "Gem-based economy",
+            "Multiple competing currencies",
+            "No formal currency",
+            "Exotic (platinum standard)"
+        ];
         
-        function rollStats() {
-            // Roll 4d6, drop lowest, sum remaining
-            const stats = [];
-            for (let i = 0; i < 6; i++) {
-                const rolls = [
-                    getRandomInt(1, 6),
-                    getRandomInt(1, 6),
-                    getRandomInt(1, 6),
-                    getRandomInt(1, 6)
-                ];
-                rolls.sort((a, b) => a - b);
-                const sum = rolls[1] + rolls[2] + rolls[3];
-                stats.push(sum);
-            }
-            return stats;
-        }
+        // Taxation systems
+        const taxation = [
+            "Heavy and oppressive",
+            "Reasonable and fair",
+            "Light and minimal",
+            "Nonexistent",
+            "Complex with many exceptions",
+            "Paid in goods or services",
+            "Magically enforced",
+            "Voluntary donations",
+            "Only on foreigners",
+            "Only on certain goods"
+        ];
         
-        function generateCharacter() {
-            // Add loading animation to generate button
-            const generateBtn = document.getElementById('generateAll');
-            generateBtn.innerHTML = '<span class="material-icons animate-spin">autorenew</span> Generating...';
-            generateBtn.classList.add('cursor-not-allowed');
-            
-            // Simulate loading with timeout
-            setTimeout(() => {
-                // Basic info
-                const race = getRandomItem(races);
-                const subrace = getRandomItem(subraces[race]);
-                const charClass = getRandomItem(classes);
-                const subclass = getRandomItem(subclasses[charClass]);
-                const background = getRandomItem(backgrounds);
-                const alignment = getRandomItem(alignments);
-                
-                // Generate unique name
-                const gender = Math.random() > 0.5 ? "male" : "female";
-                const name = generateCharacterName(gender);
-                
-                // Stats
-                const stats = rollStats();
-                const str = stats[0];
-                const dex = stats[1];
-                const con = stats[2];
-                const int = stats[3];
-                const wis = stats[4];
-                const cha = stats[5];
-                
-                // Modifiers
-                const strMod = calculateModifier(str);
-                const dexMod = calculateModifier(dex);
-                const conMod = calculateModifier(con);
-                const intMod = calculateModifier(int);
-                const wisMod = calculateModifier(wis);
-                const chaMod = calculateModifier(cha);
-                
-                // Background details
-                const personality = getRandomItem(personalityTraits);
-                const ideal = getRandomItem(ideals);
-                const bond = getRandomItem(bonds);
-                const flaw = getRandomItem(flaws);
-                
-                // Physical traits
-                const age = getRandomInt(16, 80);
-                const height = getRandomInt(48, 96); // in inches
-                const weight = getRandomInt(90, 300); // in pounds
-                const eyes = getRandomItem(eyeColors);
-                const skin = getRandomItem(skinColors);
-                const hair = `${getRandomItem(hairColors)}, ${getRandomItem(hairStyles)}`;
-                const distinctive = getRandomItem(distinctiveFeatures);
-                
-                // Generate backstory
-                const backstory = generateBackstory(name, race, subrace, charClass, background);
-                
-                // Generate equipment
-                const equipment = generateEquipment(charClass, background);
-                
-                // Generate proficiencies and features
-                const proficiencies = generateProficiencies(charClass, race, background);
-                const features = generateFeatures(charClass, race, background);
-                
-                // Generate spells if applicable
-                const spells = generateSpells(charClass);
-                
-                // Update the UI
-                updateCharacterSheet({
-                    name, race, subrace, charClass, subclass, background, alignment,
-                    str, dex, con, int, wis, cha,
-                    strMod, dexMod, conMod, intMod, wisMod, chaMod,
-                    personality, ideal, bond, flaw,
-                    age, height, weight, eyes, skin, hair, distinctive,
-                    backstory, equipment, proficiencies, features, spells
-                });
-                
-                // Reset generate button
-                generateBtn.innerHTML = '<span class="material-icons">casino</span> Generate Full Character';
-                generateBtn.classList.remove('cursor-not-allowed');
-                
-                // Add pulse animation to card
-                document.querySelector('.card').classList.add('animate-pulse');
-                setTimeout(() => {
-                    document.querySelector('.card').classList.remove('animate-pulse');
-                }, 500);
-                
-            }, 800); // Simulated loading time
-        }
+        // City layouts
+        const cityLayouts = [
+            "Concentric rings",
+            "Grid pattern",
+            "Organic growth",
+            "Spiral design",
+            "Radial from center",
+            "Divided districts",
+            "Vertical stacking",
+            "Underground layers",
+            "Floating platforms",
+            "No discernible pattern"
+        ];
         
-        function generateBackstory(name, race, subrace, charClass, background) {
-            const locations = [
-                "a small village", "a bustling city", "a remote monastery", "a nomadic tribe", 
-                "a coastal town", "a mountain fortress", "a forest settlement", "an underground city"
-            ];
-            
-            const events = [
-                "a terrible plague", "a devastating war", "a natural disaster", "a political upheaval",
-                "a magical catastrophe", "an economic collapse", "a religious schism", "a monster invasion"
-            ];
-            
-            const motivations = [
-                "seek revenge", "find redemption", "discover the truth", "protect the innocent",
-                "gain power", "explore the world", "fulfill a prophecy", "escape their past"
-            ];
-            
-            const location = getRandomItem(locations);
-            const event = getRandomItem(events);
-            const motivation = getRandomItem(motivations);
-            
-            return `${name} is a ${race} ${charClass.toLowerCase()} from ${location}. Growing up as ${subrace.toLowerCase()}, they witnessed ${event} which shaped their worldview. Now they adventure to ${motivation}.`;
-        }
+        // Natural resources
+        const naturalResources = [
+            "Fertile farmland",
+            "Rich mineral deposits",
+            "Abundant timber",
+            "Freshwater access",
+            "Strategic location",
+            "Magical ley lines",
+            "Unique flora/fauna",
+            "Gemstone mines",
+            "Hot springs",
+            "Nothing special"
+        ];
         
-        function generateEquipment(charClass, background) {
-            let equipment = [];
-            
-            // Add weapons based on class
-            if (["Fighter", "Paladin", "Ranger"].includes(charClass)) {
-                equipment.push(getRandomItem(weapons["Martial Melee"]));
-                equipment.push(getRandomItem(weapons["Martial Ranged"]));
-            } else if (["Barbarian", "Monk", "Rogue"].includes(charClass)) {
-                equipment.push(getRandomItem(weapons["Simple Melee"]));
-                equipment.push(getRandomItem(weapons["Simple Ranged"]));
-            } else if (["Wizard", "Sorcerer"].includes(charClass)) {
-                equipment.push(getRandomItem(weapons["Simple Melee"]));
-            } else {
-                // Bard, Cleric, Druid, Warlock
-                equipment.push(getRandomItem([...weapons["Simple Melee"], ...weapons["Simple Ranged"]]));
-            }
-            
-            // Add armor based on class
-            if (["Fighter", "Paladin"].includes(charClass)) {
-                equipment.push(getRandomItem(armor["Heavy"]));
-                equipment.push(getRandomItem(armor["Shields"]));
-            } else if (["Cleric", "Ranger"].includes(charClass)) {
-                equipment.push(getRandomItem(armor["Medium"]));
-            } else if (["Rogue", "Bard"].includes(charClass)) {
-                equipment.push(getRandomItem(armor["Light"]));
-            }
-            
-            // Add background equipment
-            if (background === "Acolyte") {
-                equipment.push("Holy symbol", "Prayer book", "Incense");
-            } else if (background === "Criminal") {
-                equipment.push("Crowbar", "Dark common clothes with hood");
-            } else if (background === "Folk Hero") {
-                equipment.push("Artisan's tools", "Shovel");
-            } else if (background === "Noble") {
-                equipment.push("Fine clothes", "Signet ring");
-            } else if (background === "Soldier") {
-                equipment.push("Insignia of rank", "Trophy from a fallen enemy");
-            }
-            
-            // Add some random adventuring gear
-            equipment = [...equipment, ...getRandomItems(adventuringGear, 3)];
-            
-            return equipment;
-        }
+        // Hazards
+        const hazards = [
+            "Frequent monster attacks",
+            "Natural disasters",
+            "Disease outbreaks",
+            "Political instability",
+            "Economic crashes",
+            "Magical anomalies",
+            "Undead incursions",
+            "Planar rifts",
+            "Criminal activity",
+            "Environmental decay"
+        ];
         
-        function generateProficiencies(charClass, race, background) {
-            let proficiencies = [];
-            
-            // Class proficiencies
-            if (["Fighter", "Paladin", "Ranger"].includes(charClass)) {
-                proficiencies.push("All armor", "Shields", "Simple weapons", "Martial weapons");
-            } else if (charClass === "Barbarian") {
-                proficiencies.push("Light armor", "Medium armor", "Shields", "Simple weapons", "Martial weapons");
-            } else if (charClass === "Bard") {
-                proficiencies.push("Light armor", "Simple weapons", "Hand crossbows", "Longswords", "Rapiers", "Shortswords");
-            } else if (charClass === "Cleric") {
-                proficiencies.push("Light armor", "Medium armor", "Shields", "Simple weapons");
-            } else if (charClass === "Druid") {
-                proficiencies.push("Light armor", "Medium armor", "Shields", "Clubs", "Daggers", "Darts", "Javelins", "Maces", "Quarterstaffs", "Scimitars", "Sickles", "Slings", "Spears");
-            } else if (charClass === "Monk") {
-                proficiencies.push("Simple weapons", "Shortswords");
-            } else if (charClass === "Rogue") {
-                proficiencies.push("Light armor", "Simple weapons", "Hand crossbows", "Longswords", "Rapiers", "Shortswords");
-            } else if (["Sorcerer", "Wizard"].includes(charClass)) {
-                proficiencies.push("Daggers", "Darts", "Slings", "Quarterstaffs", "Light crossbows");
-            } else if (charClass === "Warlock") {
-                proficiencies.push("Light armor", "Simple weapons");
-            }
-            
-            // Race proficiencies
-            if (race === "Dwarf") {
-                proficiencies.push("Battleaxe", "Handaxe", "Light hammer", "Warhammer");
-            } else if (race === "Elf") {
-                proficiencies.push("Longsword", "Shortsword", "Longbow", "Shortbow");
-            } else if (race === "Halfling") {
-                proficiencies.push("Lucky (reroll 1s on attack rolls, ability checks, saving throws)");
-            }
-            
-            // Background proficiencies
-            if (["Acolyte", "Sage"].includes(background)) {
-                proficiencies.push("Arcana", "Religion");
-            } else if (["Criminal", "Urchin"].includes(background)) {
-                proficiencies.push("Deception", "Stealth");
-            } else if (background === "Folk Hero") {
-                proficiencies.push("Animal Handling", "Survival");
-            } else if (background === "Noble") {
-                proficiencies.push("History", "Persuasion");
-            } else if (background === "Soldier") {
-                proficiencies.push("Athletics", "Intimidation");
-            }
-            
-            // Add 2 random skills based on class
-            const classSkills = {
-                "Barbarian": ["Animal Handling", "Athletics", "Intimidation", "Nature", "Perception", "Survival"],
-                "Bard": ["Acrobatics", "Animal Handling", "Arcana", "Athletics", "Deception", "History", "Insight", "Intimidation", "Investigation", "Medicine", "Nature", "Perception", "Performance", "Persuasion", "Religion", "Sleight of Hand", "Stealth"],
-                "Cleric": ["History", "Insight", "Medicine", "Persuasion", "Religion"],
-                "Druid": ["Arcana", "Animal Handling", "Insight", "Medicine", "Nature", "Perception", "Religion", "Survival"],
-                "Fighter": ["Acrobatics", "Animal Handling", "Athletics", "History", "Insight", "Intimidation", "Perception", "Survival"],
-                "Monk": ["Acrobatics", "Athletics", "History", "Insight", "Religion", "Stealth"],
-                "Paladin": ["Athletics", "Insight", "Intimidation", "Medicine", "Persuasion", "Religion"],
-                "Ranger": ["Animal Handling", "Athletics", "Insight", "Investigation", "Nature", "Perception", "Stealth", "Survival"],
-                "Rogue": ["Acrobatics", "Athletics", "Deception", "Insight", "Intimidation", "Investigation", "Perception", "Performance", "Persuasion", "Sleight of Hand", "Stealth"],
-                "Sorcerer": ["Arcana", "Deception", "Insight", "Intimidation", "Persuasion", "Religion"],
-                "Warlock": ["Arcana", "Deception", "History", "Intimidation", "Investigation", "Nature", "Religion"],
-                "Wizard": ["Arcana", "History", "Insight", "Investigation", "Medicine", "Religion"]
-            };
-            
-            if (classSkills[charClass]) {
-                proficiencies = [...proficiencies, ...getRandomItems(classSkills[charClass], 2)];
-            }
-            
-            return proficiencies;
-        }
+        // Education levels
+        const educationLevels = [
+            "Nonexistent",
+            "Basic for elites",
+            "Apprenticeship system",
+            "Guild training",
+            "Temple schools",
+            "Public education",
+            "Magical academies",
+            "University system",
+            "Oral tradition",
+            "Varied by district"
+        ];
         
-        function generateFeatures(charClass, race, background) {
-            let features = [];
-            
-            // Race features
-            if (race === "Dragonborn") {
-                features.push("Draconic Ancestry", "Breath Weapon");
-            } else if (race === "Dwarf") {
-                features.push("Darkvision", "Dwarven Resilience", "Stonecunning");
-            } else if (race === "Elf") {
-                features.push("Darkvision", "Keen Senses", "Fey Ancestry", "Trance");
-            } else if (race === "Gnome") {
-                features.push("Darkvision", "Gnome Cunning");
-            } else if (race === "Half-Elf") {
-                features.push("Darkvision", "Fey Ancestry", "Skill Versatility");
-            } else if (race === "Halfling") {
-                features.push("Lucky", "Brave", "Halfling Nimbleness");
-            } else if (race === "Half-Orc") {
-                features.push("Darkvision", "Relentless Endurance", "Savage Attacks");
-            } else if (race === "Tiefling") {
-                features.push("Darkvision", "Hellish Resistance", "Infernal Legacy");
-            }
-            
-            // Background features
-            if (background === "Acolyte") {
-                features.push("Shelter of the Faithful");
-            } else if (background === "Charlatan") {
-                features.push("False Identity");
-            } else if (background === "Criminal") {
-                features.push("Criminal Contact");
-            } else if (background === "Folk Hero") {
-                features.push("Rustic Hospitality");
-            } else if (background === "Noble") {
-                features.push("Position of Privilege");
-            } else if (background === "Soldier") {
-                features.push("Military Rank");
-            }
-            
-            return features;
-        }
+        // Cultural values
+        const culturalValues = [
+            "Honor and glory",
+            "Wealth and power",
+            "Knowledge and wisdom",
+            "Faith and devotion",
+            "Freedom and individuality",
+            "Tradition and stability",
+            "Innovation and progress",
+            "Community and cooperation",
+            "Strength and survival",
+            "Beauty and artistry"
+        ];
+        
+        // Notable location types
+        const notableLocationTypes = [
+            "Grand Temple",
+            "Wizard's Tower",
+            "Thieves' Guild",
+            "Merchant Exchange",
+            "Noble Estate",
+            "Ancient Ruins",
+            "Magical Academy",
+            "Underground Warrens",
+            "Floating Gardens",
+            "Coliseum",
+            "Great Library",
+            "Alchemist's Quarter",
+            "Docks District",
+            "Market Square",
+            "City Gates",
+            "Palace Complex",
+            "Artisan's Row",
+            "Slums",
+            "Military Barracks",
+            "Planar Gateway"
+        ];
+        
+        // Current event types
+        const currentEventTypes = [
+            "Festival",
+            "Political Unrest",
+            "Economic Boom",
+            "Plague",
+            "Invasion Threat",
+            "Religious Revival",
+            "Magical Phenomenon",
+            "Natural Disaster",
+            "Royal Wedding",
+            "Tournament",
+            "Trade Fair",
+            "Assassination Plot",
+            "Prophetic Vision",
+            "Dragon Sighting",
+            "Undead Rising",
+            "Artistic Renaissance",
+            "Scandal",
+            "Exploration Opportunity",
+            "Mysterious Disappearances",
+            "Divine Omen"
+        ];
         
-        function generateSpells(charClass) {
-            if (!["Bard", "Cleric", "Druid", "Paladin", "Ranger", "Sorcerer", "Warlock", "Wizard"].includes(charClass)) {
-                return [];
+        // Generate a random city name
+        function generateCityName() {
+            // 30% chance for a standalone name
+            if (Math.random() < 0.3) {
+                return standalone[Math.floor(Math.random() * standalone.length)].name || standalone[Math.floor(Math.random() * standalone.length)];
             }
             
-            const cantrips = [
-                "Acid Splash", "Blade Ward", "Booming Blade", "Chill Touch", "Control Flames", "Create Bonfire", 
-                "Dancing Lights", "Druidcraft", "Eldritch Blast", "Fire Bolt", "Friends", "Frostbite", 
-                "Green-Flame Blade", "Guidance", "Gust", "Infestation", "Light", "Lightning Lure", 
-                "Mage Hand", "Magic Stone", "Mending", "Message", "Mind Sliver", "Minor Illusion", 
-                "Mold Earth", "Poison Spray", "Prestidigitation", "Primal Savagery", "Produce Flame", 
-                "Ray of Frost", "Resistance", "Sacred Flame", "Shape Water", "Shillelagh", "Shocking Grasp", 
-                "Spare the Dying", "Sword Burst", "Thaumaturgy", "Thorn Whip", "Thunderclap", "Toll the Dead", 
-                "True Strike", "Vicious Mockery", "Word of Radiance"
-            ];
+            // 70% chance for a constructed name
+            const useMiddle = Math.random() < 0.5;
+            let name = prefixes[Math.floor(Math.random() * prefixes.length)];
             
-            const level1Spells = [
-                "Absorb Elements", "Alarm", "Animal Friendship", "Armor of Agathys", "Bane", "Bless", 
-                "Burning Hands", "Catapult", "Cause Fear", "Ceremony", "Charm Person", "Chromatic Orb", 
-                "Color Spray", "Command", "Compelled Duel", "Comprehend Languages", "Create or Destroy Water", 
-                "Cure Wounds", "Detect Evil and Good", "Detect Magic", "Detect Poison and Disease", 
-                "Disguise Self", "Dissonant Whispers", "Divine Favor", "Earth Tremor", "Ensnaring Strike", 
-                "Entangle", "Expeditious Retreat", "Faerie Fire", "False Life", "Feather Fall", 
-                "Find Familiar", "Fog Cloud", "Goodberry", "Grease", "Guiding Bolt", "Hail of Thorns", 
-                "Healing Word", "Hellish Rebuke", "Heroism", "Hex", "Hunter's Mark", "Identify", 
-                "Illusory Script", "Inflict Wounds", "Jump", "Longstrider", "Mage Armor", "Magic Missile", 
-                "Protection from Evil and Good", "Purify Food and Drink", "Ray of Sickness", "Sanctuary", 
-                "Searing Smite", "Shield", "Shield of Faith", "Silent Image", "Sleep", "Snare", 
-                "Speak with Animals", "Tasha's Hideous Laughter", "Tenser's Floating Disk", "Thunderous Smite", 
-                "Thunderwave", "Unseen Servant", "Witch Bolt", "Wrathful Smite", "Zephyr Strike"
-            ];
-            
-            let spells = [];
-            
-            // Add cantrips
-            if (["Bard", "Cleric", "Druid", "Sorcerer", "Warlock", "Wizard"].includes(charClass)) {
-                spells = [...spells, ...getRandomItems(cantrips, 2)];
+            if (useMiddle) {
+                name += middles[Math.floor(Math.random() * middles.length)];
             }
             
-            // Add level 1 spells
-            spells = [...spells, ...getRandomItems(level1Spells, 3)];
-            
-            return spells;
-        }
-        
-        function updateCharacterSheet(character) {
-            // Basic info
-            document.getElementById('charName').textContent = character.name;
-            document.getElementById('race').textContent = character.race;
-            document.getElementById('subrace').textContent = character.subrace;
-            document.getElementById('class').textContent = character.charClass;
-            document.getElementById('subclass').textContent = character.subclass;
-            
-            // Background
-            document.getElementById('background').textContent = character.background;
-            document.getElementById('alignment').textContent = character.alignment;
-            document.getElementById('personality').textContent = character.personality;
-            document.getElementById('ideal').textContent = character.ideal;
-            document.getElementById('bond').textContent = character.bond;
-            document.getElementById('flaw').textContent = character.flaw;
-            
-            // Stats
-            document.getElementById('str').textContent = character.str;
-            document.getElementById('dex').textContent = character.dex;
-            document.getElementById('con').textContent = character.con;
-            document.getElementById('int').textContent = character.int;
-            document.getElementById('wis').textContent = character.wis;
-            document.getElementById('cha').textContent = character.cha;
-            
-            // Modifiers
-            document.getElementById('strMod').textContent = character.strMod >= 0 ? `+${character.strMod}` : character.strMod;
-            document.getElementById('dexMod').textContent = character.dexMod >= 0 ? `+${character.dexMod}` : character.dexMod;
-            document.getElementById('conMod').textContent = character.conMod >= 0 ? `+${character.conMod}` : character.conMod;
-            document.getElementById('intMod').textContent = character.intMod >= 0 ? `+${character.intMod}` : character.intMod;
-            document.getElementById('wisMod').textContent = character.wisMod >= 0 ? `+${character.wisMod}` : character.wisMod;
-            document.getElementById('chaMod').textContent = character.chaMod >= 0 ? `+${character.chaMod}` : character.chaMod;
-            
-            // Physical traits
-            document.getElementById('age').textContent = character.age;
-            document.getElementById('height').textContent = `${Math.floor(character.height / 12)}'${character.height % 12}"`;
-            document.getElementById('weight').textContent = `${character.weight} lbs`;
-            document.getElementById('eyes').textContent = character.eyes;
-            document.getElementById('skin').textContent = character.skin;
-            document.getElementById('hair').textContent = character.hair;
-            document.getElementById('distinctive').textContent = character.distinctive;
-            
-            // Backstory
-            document.getElementById('backstory').textContent = character.backstory;
-            
-            // Proficiencies
-            const proficienciesList = document.getElementById('proficiencies');
-            proficienciesList.innerHTML = '';
-            character.proficiencies.forEach(prof => {
-                const li = document.createElement('li');
-                li.textContent = prof;
-                li.classList.add('animate-fade-in');
-                proficienciesList.appendChild(li);
-            });
-            
-            // Features
-            const featuresList = document.getElementById('features');
-            featuresList.innerHTML = '';
-            character.features.forEach(feat => {
-                const li = document.createElement('li');
-                li.textContent = feat;
-                li.classList.add('animate-fade-in');
-                featuresList.appendChild(li);
-            });
+            name += suffixes[Math.floor(Math.random() * suffixes.length)];
             
-            // Equipment
-            const equipmentList = document.getElementById('equipmentList');
-            equipmentList.innerHTML = '';
-            character.equipment.forEach(item => {
-                const li = document.createElement('li');
-                li.textContent = item;
-                li.classList.add('animate-fade-in');
-                equipmentList.appendChild(li);
-            });
-            
-            // Spells
-            const spellsList = document.getElementById('spellsList');
-            spellsList.innerHTML = '';
-            if (character.spells.length > 0) {
-                character.spells.forEach(spell => {
-                    const li = document.createElement('li');
-                    li.textContent = spell;
-                    li.classList.add('animate-fade-in');
-                    spellsList.appendChild(li);
-                });
-            } else {
-                const li = document.createElement('li');
-                li.textContent = "No spells for this character";
-                li.classList.add('animate-fade-in');
-                spellsList.appendChild(li);
+            // 20% chance to add a second word
+            if (Math.random() < 0.2) {
+                const secondWordType = Math.random();
+                if (secondWordType < 0.5) {
+                    // Add another constructed name
+                    let secondName = prefixes[Math.floor(Math.random() * prefixes.length)];
+                    if (Math.random() < 0.5) {
+                        secondName += middles[Math.floor(Math.random() * middles.length)];
+                    }
+                    secondName += suffixes[Math.floor(Math.random() * suffixes.length)];
+                    name += " " + secondName;
+                } else {
+                    // Add a descriptor
+                    const descriptors = ["Upper", "Lower", "New", "Old", "East", "West", 
+                                        "North", "South", "High", "Deep", "Far", "Near",
+                                        "Greater", "Lesser", "Inner", "Outer", "Free", "Royal"];
+                    name += " " + descriptors[Math.floor(Math.random() * descriptors.length)];
+                }
             }
             
-            // Add animation to updated elements
-            const elementsToAnimate = document.querySelectorAll('#charName, #race, #class, #background, #str, #dex, #con, #int, #wis, #cha');
-            elementsToAnimate.forEach(el => {
-                el.classList.add('animate-fade-in');
-                setTimeout(() => el.classList.remove('animate-fade-in'), 500);
-            });
+            return name;
         }
         
-        function generateVisuals() {
-            // Add loading animation to button
-            const btn = document.getElementById('generateVisuals');
-            btn.innerHTML = '<span class="material-icons animate-spin">autorenew</span> Generating...';
-            btn.classList.add('cursor-not-allowed');
+        // Generate random race percentages that add up to 100
+        function generateRacePercentages() {
+            const percentages = [];
+            let remaining = 100;
             
-            setTimeout(() => {
-                const gender = Math.random() > 0.5 ? "male" : "female";
-                const race = document.getElementById('race').textContent;
-                
-                // Physical traits
-                const age = getRandomInt(16, 80);
-                const height = getRandomInt(48, 96); // in inches
-                const weight = getRandomInt(90, 300); // in pounds
-                const eyes = getRandomItem(eyeColors);
-                const skin = getRandomItem(skinColors);
-                const hair = `${getRandomItem(hairColors)}, ${getRandomItem(hairStyles)}`;
-                const distinctive = getRandomItem(distinctiveFeatures);
-                
-                // Update the UI
-                document.getElementById('age').textContent = age;
-                document.getElementById('height').textContent = `${Math.floor(height / 12)}'${height % 12}"`;
-                document.getElementById('weight').textContent = `${weight} lbs`;
-                document.getElementById('eyes').textContent = eyes;
-                document.getElementById('skin').textContent = skin;
-                document.getElementById('hair').textContent = hair;
-                document.getElementById('distinctive').textContent = distinctive;
-                
-                // Reset button
-                btn.innerHTML = '<span class="material-icons">palette</span> Reroll Appearance';
-                btn.classList.remove('cursor-not-allowed');
+            // Generate percentages for all races except "Other"
+            for (let i = 0; i < races.length - 1; i++) {
+                if (remaining <= 0) {
+                    percentages.push(0);
+                    continue;
+                }
                 
-                // Add animation to updated elements
-                const elementsToAnimate = document.querySelectorAll('#age, #height, #weight, #eyes, #skin, #hair, #distinctive');
-                elementsToAnimate.forEach(el => {
-                    el.classList.add('animate-fade-in');
-                    setTimeout(() => el.classList.remove('animate-fade-in'), 500);
-                });
+                // The first few races get larger percentages
+                let max;
+                if (i < 3) {
+                    max = Math.min(remaining, 40);
+                } else {
+                    max = Math.min(remaining, 20);
+                }
                 
-            }, 500);
-        }
-        
-        function generateStats() {
-            // Add loading animation to button
-            const btn = document.getElementById('generateStats');
-            btn.innerHTML = '<span class="material-icons animate-spin">autorenew</span> Rolling...';
-            btn.classList.add('cursor-not-allowed');
+                const min = i < 3 ? 5 : 0;
+                const percent = Math.floor(Math.random() * (max - min + 1)) + min;
+                percentages.push(percent);
+                remaining -= percent;
+            }
             
-            setTimeout(() => {
-                const stats = rollStats();
-                const str = stats[0];
-                const dex = stats[1];
-                const con = stats[2];
-                const int = stats[3];
-                const wis = stats[4];
-                const cha = stats[5];
-                
-                // Modifiers
-                const strMod = calculateModifier(str);
-                const dexMod = calculateModifier(dex);
-                const conMod = calculateModifier(con);
-                const intMod = calculateModifier(int);
-                const wisMod = calculateModifier(wis);
-                const chaMod = calculateModifier(cha);
-                
-                // Update the UI
-                document.getElementById('str').textContent = str;
-                document.getElementById('dex').textContent = dex;
-                document.getElementById('con').textContent = con;
-                document.getElementById('int').textContent = int;
-                document.getElementById('wis').textContent = wis;
-                document.getElementById('cha').textContent = cha;
-                
-                document.getElementById('strMod').textContent = strMod >= 0 ? `+${strMod}` : strMod;
-                document.getElementById('dexMod').textContent = dexMod >= 0 ? `+${dexMod}` : dexMod;
-                document.getElementById('conMod').textContent = conMod >= 0 ? `+${conMod}` : conMod;
-                document.getElementById('intMod').textContent = intMod >= 0 ? `+${intMod}` : intMod;
-                document.getElementById('wisMod').textContent = wisMod >= 0 ? `+${wisMod}` : wisMod;
-                document.getElementById('chaMod').textContent = chaMod >= 0 ? `+${chaMod}` : chaMod;
-                
-                // Reset button
-                btn.innerHTML = '<span class="material-icons">swap_vert</span> Reroll Stats';
-                btn.classList.remove('cursor-not-allowed');
-                
-                // Add animation to updated elements
-                const elementsToAnimate = document.querySelectorAll('#str, #dex, #con, #int, #wis, #cha, #strMod, #dexMod, #conMod, #intMod, #wisMod, #chaMod');
-                elementsToAnimate.forEach(el => {
-                    el.classList.add('animate-fade-in');
-                    setTimeout(() => el.classList.remove('animate-fade-in'), 500);
-                });
-                
-            }, 500);
+            // Add "Other" with whatever is left
+            percentages.push(remaining);
+            
+            // Shuffle the array (except "Other" which should stay last)
+            for (let i = races.length - 2; i > 0; i--) {
+                const j = Math.floor(Math.random() * (i + 1));
+                [percentages[i], percentages[j]] = [percentages[j], percentages[i]];
+            }
+            
+            return percentages;
         }
         
-        function saveCharacter() {
-            const btn = document.getElementById('saveCharacter');
-            btn.innerHTML = '<span class="material-icons">check</span> Saved!';
-            
-            setTimeout(() => {
-                btn.innerHTML = '<span class="material-icons">save</span> Save Character';
-            }, 2000);
+        // Generate a random selection from an array with 1-4 items
+        function generateRandomSelection(array, min = 1, max = 4) {
+            const count = Math.floor(Math.random() * (max - min + 1)) + min;
+            const shuffled = [...array].sort(() => 0.5 - Math.random());
+            const selected = shuffled.slice(0, count);
             
-            // In a real app, this would save to a database or local storage
-            console.log("Character saved!");
+            // If objects have a 'name' property, use that, otherwise use the item directly
+            return selected.map(item => item.name || item).join(", ");
         }
         
-        // Tab switching
-        function setupTabs() {
-            const tabs = document.querySelectorAll('.tab');
-            const tabContents = document.querySelectorAll('.tab-content');
+        // Generate notable locations
+        function generateNotableLocations() {
+            const count = Math.floor(Math.random() * 5) + 3; // 3-7 locations
+            const shuffled = [...notableLocationTypes].sort(() => 0.5 - Math.random());
+            const selected = shuffled.slice(0, count);
             
-            tabs.forEach(tab => {
-                tab.addEventListener('click', () => {
-                    // Remove active class from all tabs
-                    tabs.forEach(t => t.classList.remove('tab-active'));
-                    // Add active class to clicked tab
-                    tab.classList.add('tab-active');
-                    
-                    // Hide all tab contents
-                    tabContents.forEach(content => content.classList.add('hidden'));
-                    // Show the selected tab content
-                    const tabId = tab.getAttribute('data-tab');
-                    document.getElementById(`${tabId}Tab`).classList.remove('hidden');
-                });
+            return selected.map(location => {
+                return {
+                    type: location,
+                    name: generateLocationName(location),
+                    description: generateLocationDescription(location)
+                };
             });
         }
         
-        // Event listeners
-        document.getElementById('generateAll').addEventListener('click', generateCharacter);
-        document.getElementById('generateVisuals').addEventListener('click', generateVisuals);
-        document.getElementById('generateStats').addEventListener('click', generateStats);
-        document.getElementById('saveCharacter').addEventListener('click', saveCharacter);
-        
-        // Initialize
-        setupTabs();
-        
-        // Generate a character on first load
-        generateCharacter();
-    </script>
-<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=IsaiahSouf/dnd-5e-character-creator" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+        // Generate a name for a notable location
+        function generateLocationName(type) {
+            const prefixes = ["
 </html>
\ No newline at end of file
