diff --git a/plugin-designs/wall-of-people-groups/src/components/PeopleGroupsWall.vue b/plugin-designs/wall-of-people-groups/src/components/PeopleGroupsWall.vue
index 742b8b372..873df258b 100644
--- a/plugin-designs/wall-of-people-groups/src/components/PeopleGroupsWall.vue
+++ b/plugin-designs/wall-of-people-groups/src/components/PeopleGroupsWall.vue
@@ -18,6 +18,16 @@
                 <div class="spinner"></div>
                 <p>Loading people groups...</p>
             </div>
+
+            <!-- OFFLINE / BLOCKED: the live API could not be reached. Measured on a local dev server,
+                 where pray.doxa.life refuses a 127.0.0.1 origin (CORS): the wall used to sit at
+                 "0 Groups Loaded" with nothing saying why. Say what failed and offer a retry. -->
+            <div v-else-if="loadError && totalGroups === 0" class="wall-offline" role="status">
+                <p class="wall-offline-title">The live prayer data could not be reached.</p>
+                <p>The wall reads its people groups from pray.doxa.life. You may be offline, or, on a
+                   local development server, the API may not allow this page's address.</p>
+                <button type="button" class="control-btn" @click="fetchData">Try again</button>
+            </div>
         </div>
     
 </template>
@@ -50,6 +60,10 @@ export default {
         
         peopleGroups() {
             return this.$store?.peopleGroups || [];
+        },
+
+        loadError() {
+            return this.$store?.error || null;
         }
     },
     mounted() {
diff --git a/plugin-designs/wall-of-people-groups/src/components/SourceSelector.vue b/plugin-designs/wall-of-people-groups/src/components/SourceSelector.vue
index a84f28af8..13a84ff3e 100644
--- a/plugin-designs/wall-of-people-groups/src/components/SourceSelector.vue
+++ b/plugin-designs/wall-of-people-groups/src/components/SourceSelector.vue
@@ -1,5 +1,7 @@
 <template>
-    <div v-if="sources.length > 1">
+    <!-- availableSources, the computed below: the template read an undefined `sources`, so this
+         threw "reading 'length'" on EVERY render, online or not (Vue logs it; nothing crashes) -->
+    <div v-if="availableSources.length > 1">
         <div class="source-selector">
             <div class="source-header">
                 <h3>📊 Data Source</h3>
diff --git a/plugin-designs/wall-of-people-groups/src/stores/peopleGroupsStore.js b/plugin-designs/wall-of-people-groups/src/stores/peopleGroupsStore.js
index 033c36060..0c199d8bd 100644
--- a/plugin-designs/wall-of-people-groups/src/stores/peopleGroupsStore.js
+++ b/plugin-designs/wall-of-people-groups/src/stores/peopleGroupsStore.js
@@ -58,7 +58,9 @@ export const usePeopleGroupsStore = (pinia) => {
                     console.log('First 3 groups:', this.peopleGroups.slice(0, 3));
                     
                 } catch (error) {
-                    console.error(`❌ Error fetching people groups from ${this.dataSource}:`, error);
+                    // warn, not error: the wall now SAYS so on screen (PeopleGroupsWall's offline notice)
+                    // and offers a retry; an unreachable API is an expected state, not a crash.
+                    console.warn(`Could not fetch people groups from ${this.dataSource}:`, error && error.message);
                     this.error = error.message;
                     this.peopleGroups = [];
                 } finally {
diff --git a/plugin-designs/wall-of-people-groups/src/wall.css b/plugin-designs/wall-of-people-groups/src/wall.css
index d30512e44..14e9384c3 100644
--- a/plugin-designs/wall-of-people-groups/src/wall.css
+++ b/plugin-designs/wall-of-people-groups/src/wall.css
@@ -116,6 +116,28 @@ body {
     overflow: hidden;
 }
 
+/* Offline / blocked notice: the live API could not be reached. Sits over the empty canvas,
+   inside the wall (not position:fixed), so an embedded wall never covers its host page. */
+.wall-container { position: relative; }
+.wall-offline {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    max-width: min(440px, calc(100% - 32px));
+    padding: 20px 24px;
+    background: white;
+    border: 1px solid #dbdbdb;
+    border-radius: 12px;
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+    color: var(--text-color);
+    font-size: 14px;
+    line-height: 1.5;
+    text-align: center;
+}
+.wall-offline-title { font-weight: 600; font-size: 16px; margin-bottom: 6px; }
+.wall-offline p { margin: 0 0 12px; }
+
 /* Loading Overlay */
 .loading-overlay {
     position: fixed;