Added option for certain choices to force other choices on.

css/main.scss

@@ -122,6 +122,15 @@ html {
         }
     }
 
+}
+.forced {
+    background: rgb(20, 167, 101);
+    > div {
+        > .category-title {
+            text-shadow: rgb(255, 255, 255) 0 0 15px, rgb(255, 255, 255) 0 0 5px, rgb(122, 122, 122) 0 1px 3px;
+        }
+    }
+
 }
 .disabled-choice {
     filter: grayscale(70%) blur(1px);

index.html

@@ -41,7 +41,7 @@ <h1 class="category-title pt-2 px-5">Starting Karma Values</h1>
 			<div class="container-xl category-bg shadow-lg rounded p-4">
 				<div class="row row-cols-1 row-cols-sm-1 row-cols-md-2 row-cols-lg-5 justify-content-center g-2">
 					<div class="col">
-						<div class="card choice" id="uneventful" data-points-karma="-50" data-forces="earth">
+						<div class="card choice" id="uneventful" data-points-karma="-50">
 							<div class="card-header card-img-overlay">
 								<h3 class="category-title text-center">Uneventful Life</h3>
 								<h5 class="text-center points"></h5>
@@ -99,7 +99,7 @@ <h6 class="text-center conflicts"></h6>
 			</div>
 	</div>
 	<!-- World Section -->
-	<div class="category container-xl text-center mt-2 px-0 py-2 rounded d-none after-points" data-reveals="changed-world high-profile impactful average uneventful" data-limit="2">
+	<div class="category container-xl text-center mt-2 px-0 py-2 rounded d-none after-points" data-reveals="changed-world high-profile impactful average uneventful">
 		<div class= "category-header category-bg rounded-top mb-0 py-1 px-4">
 			<h1 class="category-title pt-2 px-5">World Selection</h1>
 			<span class="text-white fs-5">Now that we've assessed your Karma, it's time to present you with the realms available for your reincarnation. Each world offers its own unique challenges and opportunities, and the path you'll tread will be shaped by the choice you make. Remember, dear soul, that your journey will not only entertain me but also determine the course of your existence. So, choose wisely, and let your heart guide you to the world that calls your name.</span>

js/main.js

@@ -223,8 +223,7 @@ const hideHandler = () => {
 }
 
 const forceChoice = (element, on = true) => {
-	const forceON = element.dataset.forces ? element.dataset.forces.trim().split(/(?:\s+)/g) : undefined;
-	if (!forceON) return false;
+	const forceON = element.dataset.forces ? element.dataset.forces.trim().split(/(?:\s+)/g) : [];
 	for (let forced of forceON) {
 		const target = document.getElementById(forced);
 		if (!target) continue;
@@ -370,18 +369,29 @@ const setChoice = (element) => {
 		playSE('audio/click2.ogg', seVolume);
 	}
 	else {
-		let nephew
+		let nephew;
+		let forced = 0;
 		if (stop && activeSiblings.length >= limit) {
 			for (let sibling of siblings) {
 				nephew = sibling.firstElementChild
+				if (nephew.classList.contains("forced")){
+					forced++;
+					continue;
+				}
 				if (choiceDeactivator(nephew)) {
 					requireDeactivator(nephew);
 					break;
 				}
 			}
 		}
-		choiceActivator(element);
-		playSE('audio/click1.ogg', seVolume);
+		if (forced < limit) {
+			choiceActivator(element);
+			playSE('audio/click1.ogg', seVolume);
+		} else  {
+			playSE('audio/error.ogg', seVolume);
+			return;
+		}
+
 	}
 	choiceDisabler();
 	hideHandler();