diff --git a/src/ui.js b/src/ui.js
index 4033406..ea0918f 100644
--- a/src/ui.js
+++ b/src/ui.js
@@ -317,27 +317,13 @@ export function addReadPageButton() {
 
 // File upload functionality moved to file-upload.js
 
-// Function to create floating AI button
-export function createFloatingAIButton() {
-	console.log("uncloseai.js: createFloatingAIButton() called.");
-
+// Helper function to create and append the floating button
+function createAndAppendFloatingButton() {
+	console.log("uncloseai.js: createAndAppendFloatingButton() called.");
+	
 	// Ensure ChunkFive font is loaded
 	initializeChunkFiveFont();
 
-	// Load CSS for floating button if not already loaded
-	const hasPicoCSS = document.querySelector('link[href*="pico"]') !== null;
-	const cssFile = hasPicoCSS ? 'uncloseai-modal-pico.css' : 'uncloseai-modal-builtin.css';
-	
-	let cssLoaded = false;
-	if (!document.querySelector(`link[href*="${cssFile}"]`)) {
-		const link = document.createElement('link');
-		link.rel = 'stylesheet';
-		link.href = `https://uncloseai.com/src/${cssFile}`;
-		document.head.appendChild(link);
-		console.log(`uncloseai.js: Loaded ${cssFile} for floating button styles.`);
-		cssLoaded = true;
-	}
-
 	// Remove any existing floating button first
 	const existingButton = document.getElementById("floating-ai-button");
 	if (existingButton) {
@@ -384,22 +370,45 @@ export function createFloatingAIButton() {
 			.addEventListener("change", updateButtonTheme);
 	}
 
-	// Hover effects
-	// Hover effects now handled by CSS
+	// Hover effects handled by CSS
 
 	// Set up self-contained click handler
 	setupFloatingButtonHandler(floatingButton);
 
-	// If we just loaded CSS, wait a bit before showing button
-	if (cssLoaded) {
-		setTimeout(() => {
-			document.body.appendChild(floatingButton);
-			console.log("uncloseai.js: Appended floating button to document.body after CSS load delay.");
-		}, 100);
-	} else {
-		document.body.appendChild(floatingButton);
-		console.log("uncloseai.js: Appended floating button to document.body.");
+	document.body.appendChild(floatingButton);
+	console.log("uncloseai.js: Appended floating button to document.body.");
+}
+
+// Function to create floating AI button
+export function createFloatingAIButton() {
+	console.log("uncloseai.js: createFloatingAIButton() called.");
+
+	// Load CSS for floating button if not already loaded
+	const hasPicoCSS = document.querySelector('link[href*="pico"]') !== null;
+	const cssFile = hasPicoCSS ? 'uncloseai-modal-pico.css' : 'uncloseai-modal-builtin.css';
+	
+	if (!document.querySelector(`link[href*="${cssFile}"]`)) {
+		const link = document.createElement('link');
+		link.rel = 'stylesheet';
+		link.href = `https://uncloseai.com/src/${cssFile}`;
+		
+		// Create button only after CSS loads
+		link.onload = () => {
+			console.log(`uncloseai.js: ${cssFile} loaded, creating floating button.`);
+			createAndAppendFloatingButton();
+		};
+		
+		link.onerror = () => {
+			console.error(`uncloseai.js: Failed to load ${cssFile}, creating button anyway.`);
+			createAndAppendFloatingButton();
+		};
+		
+		document.head.appendChild(link);
+		return; // Exit early, button will be created after CSS loads
 	}
+	
+	// CSS already loaded, create button immediately
+	createAndAppendFloatingButton();
 }
 
 // Set up click handler for floating button (self-contained)
@@ -448,10 +457,9 @@ function setupFloatingButtonHandler(floatingButton) {
 				console.log("Calling modal function");
 				await modalFunction();
 			} else {
-				console.error(
-					"toggleUncloseaiEmbeddedModal function not available in any form",
-				);
-				alert(getUIText("aiModalNotAvailable"));
+				// Fallback: directly open the modal
+				console.log("Using fallback to directly open modal");
+				await openUncloseaiEmbeddedModal();
 			}
 		} catch (error) {
 			console.error("Error opening modal:", error);