diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css
index 9ed191020..f375a7c05 100644
--- a/apps/ai-game-creator-shell/src/styles.css
+++ b/apps/ai-game-creator-shell/src/styles.css
@@ -5163,6 +5163,10 @@ iframe.preview-frame {
   pointer-events: none;
 }
 
+.game-resource-book-scene.is-measuring {
+  opacity: 0;
+}
+
 .game-resource-book-scene::before {
   position: absolute;
   z-index: 0;
diff --git a/apps/ai-game-creator-shell/src/view/project-development/index.tsx b/apps/ai-game-creator-shell/src/view/project-development/index.tsx
index 0561b306d..ab85929d9 100644
--- a/apps/ai-game-creator-shell/src/view/project-development/index.tsx
+++ b/apps/ai-game-creator-shell/src/view/project-development/index.tsx
@@ -1014,7 +1014,7 @@ function ResourceBookScene({
 
   return (
     <div
-      className={`game-resource-book-scene game-resource-book-scene--${resourceBookView} game-resource-book-scene--${resourceBookTransition}`}
+      className={`game-resource-book-scene game-resource-book-scene--${resourceBookView} game-resource-book-scene--${resourceBookTransition}${overviewRects.size < visibleCategoryOrder.length ? ' is-measuring' : ''}`}
     >
       {visibleCategoryOrder.map((category) => {
         const rect = overviewRects.get(category);
@@ -1891,7 +1891,8 @@ export default function ProjectDevelopmentView({
     measureResourceBookOverview();
     const manager = resourceBookManagerRef.current;
     if (!manager || typeof ResizeObserver === 'undefined') {
-      return undefined;
+      const frame = window.requestAnimationFrame(measureResourceBookOverview);
+      return () => window.cancelAnimationFrame(frame);
     }
     const observer = new ResizeObserver(measureResourceBookOverview);
     observer.observe(manager);
@@ -1899,11 +1900,13 @@ export default function ProjectDevelopmentView({
       observer.observe(element),
     );
     window.addEventListener('resize', measureResourceBookOverview);
+    const frame = window.requestAnimationFrame(measureResourceBookOverview);
     return () => {
       observer.disconnect();
+      window.cancelAnimationFrame(frame);
       window.removeEventListener('resize', measureResourceBookOverview);
     };
-  }, [measureResourceBookOverview, resourceBookView]);
+  }, [measureResourceBookOverview, resourceBookView, canvasResources.length]);
   const viewedResourceCategory =
     mode === 'resources' ? activePageCategory : null;
   useEffect(() => {