@riverbankcms/sdk 0.60.0 → 0.60.1

package/dist/client/rendering.mjs

@@ -5857,6 +5857,34 @@ var init_accordion_server = __esm({
   }
 });
 
+// ../theme-core/src/responsiveDisplay.ts
+function mobileOnlyDisplay(display) {
+  return `${BASE_DISPLAY_CLASSES[display]} rb-lg-hidden`;
+}
+function desktopOnlyDisplay(display) {
+  return `rb-hidden ${LARGE_DISPLAY_CLASSES[display]}`;
+}
+var BASE_DISPLAY_CLASSES, LARGE_DISPLAY_CLASSES;
+var init_responsiveDisplay = __esm({
+  "../theme-core/src/responsiveDisplay.ts"() {
+    "use strict";
+    BASE_DISPLAY_CLASSES = {
+      block: "rb-block",
+      flex: "rb-flex",
+      "inline-block": "rb-inline-block",
+      "inline-flex": "rb-inline-flex",
+      grid: "rb-grid"
+    };
+    LARGE_DISPLAY_CLASSES = {
+      block: "rb-lg-block",
+      flex: "rb-lg-flex",
+      "inline-block": "rb-lg-inline-block",
+      "inline-flex": "rb-lg-inline-flex",
+      grid: "rb-lg-grid"
+    };
+  }
+});
+
 // ../blocks/src/system/runtime/header/shared.ts
 function splitPositioningClasses(className) {
   if (!className) return { wrapperClasses: "", sectionClasses: "" };
@@ -5879,6 +5907,7 @@ var POSITIONING_CLASSES;
 var init_shared = __esm({
   "../blocks/src/system/runtime/header/shared.ts"() {
     "use strict";
+    init_responsiveDisplay();
     POSITIONING_CLASSES = [
       "rb-sticky",
       "rb-fixed",
@@ -7336,6 +7365,23 @@ var init_shared2 = __esm({
   }
 });
 
+// ../blocks/src/system/runtime/nodes/events/shared/eventCapacity.ts
+function getEventAvailability(event) {
+  if (event.capacity == null) {
+    return { available: null, isFull: false };
+  }
+  const available = event.availableSpots ?? event.capacity - event.registeredCount;
+  if (available <= 0) {
+    return { available: 0, isFull: true };
+  }
+  return { available, isFull: false };
+}
+var init_eventCapacity = __esm({
+  "../blocks/src/system/runtime/nodes/events/shared/eventCapacity.ts"() {
+    "use strict";
+  }
+});
+
 // ../blocks/src/system/runtime/nodes/events/shared/utils.ts
 function getContainerClass(layout, columns) {
   if (layout === "compact") {
@@ -7560,7 +7606,7 @@ function formatEventPrice(event) {
   }
 }
 function resolveEventCta(event, buttonText) {
-  const isSoldOut = event.capacity !== null && event.availableSpots === 0;
+  const { isFull: isSoldOut } = getEventAvailability(event);
   const defaultButtonText = event.kind === "course_session" ? "View course" : "View event";
   const effectiveButtonText = buttonText ?? defaultButtonText;
   if (isSoldOut) {
@@ -7576,6 +7622,7 @@ var init_utils = __esm({
     "use strict";
     init_src();
     init_shared2();
+    init_eventCapacity();
     COLUMN_CLASSES = {
       "2": "rb-sm-grid-cols-2",
       "3": "rb-sm-grid-cols-2 rb-lg-grid-cols-3",
@@ -8744,6 +8791,7 @@ var init_EventCard = __esm({
     init_media();
     init_media_server();
     init_EventCardIcons();
+    init_eventCapacity();
     init_utils();
     EventCard = ({
       event,
@@ -8768,7 +8816,7 @@ var init_EventCard = __esm({
       )}`;
       const cta = resolveEventCta(event, buttonText);
       const isSoldOut = cta.hidden;
-      const spotsLeft = event.availableSpots;
+      const { available: spotsLeft } = getEventAvailability(event);
       const cardClass = `card-${cardVariant}`;
       const buttonClass = `${buttonVariant} button-${buttonVariant}`;
       const title = event.title;
@@ -18943,6 +18991,21 @@ var init_event_calendar = __esm({
             visibleWhen: { field: "displayMode", oneOf: ["combined", "list", "timetable"] }
           }
         },
+        {
+          id: "showCapacity",
+          type: "boolean",
+          label: "Show available spots",
+          description: "Display remaining capacity on event cards and timetable cells",
+          required: false,
+          defaultValue: true,
+          ui: {
+            intent: "display",
+            visibleWhen: {
+              field: "displayMode",
+              oneOf: ["combined", "list", "week", "timetable"]
+            }
+          }
+        },
         // Block-level pre-filtering
         {
           id: "eventSurface",
@@ -19134,6 +19197,9 @@ var init_event_calendar = __esm({
                   showStaffFilter: {
                     $bind: { from: "content.showStaffFilter", fallback: true }
                   },
+                  showCapacity: {
+                    $bind: { from: "content.showCapacity", fallback: true }
+                  },
                   kind: { $bind: { from: "content.kind", fallback: "all" } },
                   eventSurface: {
                     $bind: { from: "content.eventSurface", fallback: "all" }
@@ -20978,21 +21044,26 @@ function buildTimetableModel(input) {
   for (const [dateKey, dayDrafts] of groupDraftsByDate(drafts)) {
     cellsByDate.set(
       dateKey,
-      assignTimetableLanes(dayDrafts).map((draft) => ({
-        event: draft.event,
-        startsAtMinutes: draft.startsAtMinutes,
-        endsAtMinutes: draft.endsAtMinutes,
-        topPercent: toRangePercent(draft.startsAtMinutes - rangeStartMinutes, rangeMinutes),
-        heightPercent: Math.max(
-          MIN_EVENT_HEIGHT_PERCENT,
-          toRangePercent(draft.endsAtMinutes - draft.startsAtMinutes, rangeMinutes)
-        ),
-        laneIndex: draft.laneIndex,
-        laneCount: draft.laneCount,
-        categoryColor: draft.event.eventCategory?.color || "rgb(var(--tb-accent))",
-        timeLabel: formatEventTimeRange(draft.event),
-        teacherLine: formatEventTeacherLine(draft.event)
-      }))
+      assignTimetableLanes(dayDrafts).map((draft) => {
+        const capacity = formatTimetableCapacity(draft.event);
+        return {
+          event: draft.event,
+          startsAtMinutes: draft.startsAtMinutes,
+          endsAtMinutes: draft.endsAtMinutes,
+          topPercent: toRangePercent(draft.startsAtMinutes - rangeStartMinutes, rangeMinutes),
+          heightPercent: Math.max(
+            MIN_EVENT_HEIGHT_PERCENT,
+            toRangePercent(draft.endsAtMinutes - draft.startsAtMinutes, rangeMinutes)
+          ),
+          laneIndex: draft.laneIndex,
+          laneCount: draft.laneCount,
+          categoryColor: draft.event.eventCategory?.color || "rgb(var(--tb-accent))",
+          timeLabel: formatEventTimeRange(draft.event),
+          teacherLine: formatEventTeacherLine(draft.event),
+          capacityLabel: capacity.label,
+          isFull: capacity.isFull
+        };
+      })
     );
   }
   return {
@@ -21125,6 +21196,12 @@ function formatShortDayLabel(date) {
   const dayName = FULL_DAY_NAMES[date.getDay()] ?? "";
   return `${dayName.slice(0, 3)} ${date.getDate()}`;
 }
+function formatTimetableCapacity(event) {
+  const { available, isFull } = getEventAvailability(event);
+  if (available == null) return { label: null, isFull: false };
+  if (isFull) return { label: "Full", isFull: true };
+  return { label: `${available} spots left`, isFull: false };
+}
 function formatEventTimeRange(event) {
   const timeZone = event.timeZone ?? null;
   return `${formatTime(event.startsAt, { timeZone })} - ${formatTime(event.endsAt, { timeZone })}`;
@@ -21137,6 +21214,7 @@ var init_timetableModel = __esm({
   "../blocks/src/system/runtime/nodes/events/shared/timetableModel.ts"() {
     "use strict";
     init_src();
+    init_eventCapacity();
     init_utils();
     DEFAULT_START_HOUR = 6;
     DEFAULT_END_HOUR = 21;
@@ -21395,7 +21473,17 @@ function renderTimetableSsr(display) {
                           /* @__PURE__ */ jsx43("span", { className: "event-timetable-event-time", children: cell.timeLabel }),
                           /* @__PURE__ */ jsx43("span", { className: "event-timetable-event-title", children: cell.event.title }),
                           cell.teacherLine ? /* @__PURE__ */ jsx43("span", { className: "event-timetable-event-teacher", children: cell.teacherLine }) : null,
-                          cell.event.venue ? /* @__PURE__ */ jsx43("span", { className: "event-timetable-event-meta", children: cell.event.venue.name }) : null
+                          cell.event.venue ? /* @__PURE__ */ jsx43("span", { className: "event-timetable-event-meta", children: cell.event.venue.name }) : null,
+                          display.showCapacity && cell.capacityLabel ? /* @__PURE__ */ jsx43(
+                            "span",
+                            {
+                              className: clsx_default(
+                                "event-timetable-event-capacity",
+                                cell.isFull && "event-timetable-event-capacity--full"
+                              ),
+                              children: cell.capacityLabel
+                            }
+                          ) : null
                         ]
                       },
                       cell.event.occurrenceId || cell.event.id
@@ -39388,30 +39476,22 @@ var init_CalendarDayCell = __esm({
 
 // ../blocks/src/system/runtime/nodes/events/shared/AgendaEventCard.tsx
 import { Fragment as Fragment22, jsx as jsx129, jsxs as jsxs92 } from "react/jsx-runtime";
-function formatCapacity(event) {
-  if (event.capacity == null) {
-    return null;
-  }
-  const available = event.availableSpots ?? event.capacity - event.registeredCount;
-  if (available <= 0) {
-    return "Full";
-  }
-  return `${available} spots left`;
-}
 var AgendaEventCard;
 var init_AgendaEventCard = __esm({
   "../blocks/src/system/runtime/nodes/events/shared/AgendaEventCard.tsx"() {
     "use strict";
+    init_eventCapacity();
     init_utils();
     AgendaEventCard = ({
       event,
+      showCapacity,
       onClick
     }) => {
       const eventUrl = event.path;
       const categoryColor = event.eventCategory?.color || "rgb(var(--tb-accent))";
       const price = formatEventPrice(event);
-      const capacity = formatCapacity(event);
-      const isFull = capacity === "Full";
+      const { available, isFull } = getEventAvailability(event);
+      const capacity = showCapacity && available != null ? isFull ? "Full" : `${available} spots left` : null;
       const title = event.title;
       const timeZone = event.timeZone ?? null;
       const teacherLine = formatEventTeacherLine(event);
@@ -39491,6 +39571,7 @@ var init_WeekAgendaView = __esm({
       viewDate,
       events,
       startOfWeek,
+      showCapacity,
       emptyMessage = "No events scheduled"
     }) => {
       const weekDays = getWeekCalendarDays(viewDate, startOfWeek);
@@ -39511,7 +39592,8 @@ var init_WeekAgendaView = __esm({
               /* @__PURE__ */ jsx130("div", { className: "event-agenda-day-content", children: dayEvents.length === 0 ? /* @__PURE__ */ jsx130("p", { className: "event-agenda-day-empty", children: emptyMessage }) : /* @__PURE__ */ jsx130("div", { className: "event-agenda-day-events", children: dayEvents.map((event) => /* @__PURE__ */ jsx130(
                 AgendaEventCard,
                 {
-                  event
+                  event,
+                  showCapacity
                 },
                 event.occurrenceId || event.id
               )) }) })
@@ -39528,6 +39610,7 @@ var init_WeekAgendaView = __esm({
 import { jsx as jsx131 } from "react/jsx-runtime";
 function EventDetailModal({
   event,
+  showCapacity,
   onClose,
   cardVariant = "default",
   buttonVariant = "primary",
@@ -39568,7 +39651,7 @@ function EventDetailModal({
           showVenue: true,
           showMap,
           allowMap: true,
-          showCapacity: true
+          showCapacity
         }
       ) })
     }
@@ -39588,6 +39671,7 @@ import { jsx as jsx132, jsxs as jsxs94 } from "react/jsx-runtime";
 function DayEventsModal({
   date,
   events,
+  showCapacity,
   onClose,
   onSelectEvent
 }) {
@@ -39624,7 +39708,8 @@ function DayEventsModal({
           AgendaEventCard,
           {
             event,
-            onClick: onSelectEvent
+            onClick: onSelectEvent,
+            showCapacity
           },
           event.occurrenceId || event.id
         )) })
@@ -39645,6 +39730,7 @@ var init_DayEventsModal = __esm({
 // ../blocks/src/system/runtime/nodes/events/shared/EventModals.tsx
 import { jsx as jsx133 } from "react/jsx-runtime";
 function EventModals({
+  showCapacity,
   cardVariant,
   buttonVariant,
   buttonText
@@ -39661,7 +39747,8 @@ function EventModals({
         onClose: closeModal,
         cardVariant,
         buttonVariant,
-        buttonText
+        buttonText,
+        showCapacity
       }
     );
   }
@@ -39674,7 +39761,8 @@ function EventModals({
         onClose: closeModal,
         onSelectEvent: (event) => {
           openEventModal(event);
-        }
+        },
+        showCapacity
       }
     );
   }
@@ -40077,7 +40165,8 @@ var init_EventCombined_client = __esm({
                     viewDate,
                     events: calendarEventsRaw,
                     startOfWeek,
-                    emptyMessage: "No events scheduled"
+                    emptyMessage: "No events scheduled",
+                    showCapacity: resolvedShowCapacity
                   }
                 ) : /* @__PURE__ */ jsxs95("div", { className: "event-calendar-container", children: [
                   /* @__PURE__ */ jsx134("div", { className: "event-calendar-day-headers", children: dayNames.map((day) => /* @__PURE__ */ jsx134("div", { className: "event-calendar-day-header", children: day }, day)) }),
@@ -40097,7 +40186,14 @@ var init_EventCombined_client = __esm({
                 ] }),
                 calendarEventsRaw.length === 0 && !calendarLoading && /* @__PURE__ */ jsx134("p", { className: "event-calendar-empty", children: emptyMessage })
               ] }),
-              /* @__PURE__ */ jsx134(EventModals, { buttonVariant, buttonText })
+              /* @__PURE__ */ jsx134(
+                EventModals,
+                {
+                  buttonVariant,
+                  buttonText,
+                  showCapacity: resolvedShowCapacity
+                }
+              )
             ] })
           ]
         }
@@ -40132,6 +40228,7 @@ var init_WeekTimetableView = __esm({
       viewDate,
       events,
       startOfWeek,
+      showCapacity,
       emptyMessage = "No classes scheduled"
     }) => {
       const { openEventModal } = useEventModal();
@@ -40164,7 +40261,8 @@ var init_WeekTimetableView = __esm({
               hours: model.hourTicks,
               rangeMinutes: model.rangeMinutes,
               selected: day.dateKey === selectedDayKey,
-              onEventClick: openEventModal
+              onEventClick: openEventModal,
+              showCapacity
             },
             day.dateKey
           ))
@@ -40184,7 +40282,7 @@ var init_WeekTimetableView = __esm({
         hour
       )) })
     ] });
-    TimetableDayColumn = ({ day, hours, rangeMinutes, selected, onEventClick }) => /* @__PURE__ */ jsxs96(
+    TimetableDayColumn = ({ day, hours, rangeMinutes, selected, onEventClick, showCapacity }) => /* @__PURE__ */ jsxs96(
       "section",
       {
         className: `event-timetable-day ${day.isToday ? "event-timetable-day--today" : ""}`,
@@ -40213,7 +40311,8 @@ var init_WeekTimetableView = __esm({
                   TimetableEventButton,
                   {
                     cell,
-                    onClick: onEventClick
+                    onClick: onEventClick,
+                    showCapacity
                   },
                   cell.event.occurrenceId || cell.event.id
                 ))
@@ -40223,7 +40322,7 @@ var init_WeekTimetableView = __esm({
         ]
       }
     );
-    TimetableEventButton = ({ cell, onClick }) => /* @__PURE__ */ jsxs96(
+    TimetableEventButton = ({ cell, onClick, showCapacity }) => /* @__PURE__ */ jsxs96(
       "button",
       {
         type: "button",
@@ -40241,7 +40340,14 @@ var init_WeekTimetableView = __esm({
           /* @__PURE__ */ jsx135("span", { className: "event-timetable-event-time", children: cell.timeLabel }),
           /* @__PURE__ */ jsx135("span", { className: "event-timetable-event-title", children: cell.event.title }),
           cell.teacherLine ? /* @__PURE__ */ jsx135("span", { className: "event-timetable-event-teacher", children: cell.teacherLine }) : null,
-          cell.event.venue ? /* @__PURE__ */ jsx135("span", { className: "event-timetable-event-meta", children: cell.event.venue.name }) : null
+          cell.event.venue ? /* @__PURE__ */ jsx135("span", { className: "event-timetable-event-meta", children: cell.event.venue.name }) : null,
+          showCapacity && cell.capacityLabel ? /* @__PURE__ */ jsx135(
+            "span",
+            {
+              className: cell.isFull ? "event-timetable-event-capacity event-timetable-event-capacity--full" : "event-timetable-event-capacity",
+              children: cell.capacityLabel
+            }
+          ) : null
         ]
       }
     );
@@ -40463,7 +40569,8 @@ var init_EventCalendar_client = __esm({
                 viewDate,
                 events,
                 startOfWeek: display.startOfWeek,
-                emptyMessage: display.emptyMessage
+                emptyMessage: display.emptyMessage,
+                showCapacity: display.showCapacity
               }
             )
           }
@@ -40472,7 +40579,8 @@ var init_EventCalendar_client = __esm({
           EventModals,
           {
             buttonVariant: display.buttonVariant,
-            buttonText: display.buttonText
+            buttonText: display.buttonText,
+            showCapacity: display.showCapacity
           }
         )
       ] });
@@ -40554,7 +40662,8 @@ var init_EventCalendar_client = __esm({
           EventModals,
           {
             buttonVariant: display.buttonVariant,
-            buttonText: display.buttonText
+            buttonText: display.buttonText,
+            showCapacity: display.showCapacity
           }
         )
       ] });
@@ -46723,12 +46832,50 @@ var init_compile = __esm({
 });
 
 // ../theme-core/src/responsiveMode.ts
-var DEFAULT_THEME_RESPONSIVE_MODE, THEME_RESPONSIVE_CONTAINER_NAME;
+function getResponsiveScopeSpec(mode = DEFAULT_THEME_RESPONSIVE_MODE) {
+  if (mode === "container") {
+    return {
+      kind: "container",
+      selector: `[${THEME_RESPONSIVE_MODE_ATTR}="container"]`,
+      containerName: THEME_RESPONSIVE_CONTAINER_NAME
+    };
+  }
+  return {
+    kind: "viewport",
+    selector: `[${THEME_RESPONSIVE_MODE_ATTR}="viewport"]`
+  };
+}
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function buildResponsiveScopeRulePatternSource() {
+  return [
+    "@scope",
+    "\\(\\[",
+    escapeRegExp(THEME_RESPONSIVE_MODE_ATTR),
+    '="(?:viewport|container)"\\]\\)',
+    "to",
+    "\\((?::scope )?\\[",
+    escapeRegExp(THEME_RESPONSIVE_MODE_ATTR),
+    "\\]\\)",
+    "\\{"
+  ].join("\\s*");
+}
+var DEFAULT_THEME_RESPONSIVE_MODE, THEME_RESPONSIVE_CONTAINER_NAME, THEME_RESPONSIVE_MODE_ATTR, RESPONSIVE_SCOPE_RULE_PATTERN, RESPONSIVE_SCOPE_RULE_AT_PATTERN;
 var init_responsiveMode = __esm({
   "../theme-core/src/responsiveMode.ts"() {
     "use strict";
     DEFAULT_THEME_RESPONSIVE_MODE = "viewport";
     THEME_RESPONSIVE_CONTAINER_NAME = "rb-site";
+    THEME_RESPONSIVE_MODE_ATTR = "data-rb-responsive-mode";
+    RESPONSIVE_SCOPE_RULE_PATTERN = new RegExp(
+      buildResponsiveScopeRulePatternSource(),
+      "g"
+    );
+    RESPONSIVE_SCOPE_RULE_AT_PATTERN = new RegExp(
+      buildResponsiveScopeRulePatternSource(),
+      "y"
+    );
   }
 });
 
@@ -47777,45 +47924,53 @@ var init_containerResponsiveThemeCss = __esm({
     flex-basis: 16.666667%;
   }
   @container rb-site (min-width: 768px) {
-    .rb-md-basis-full {
-      flex-basis: 100%;
-    }
-    .rb-md-basis-1-2 {
-      flex-basis: 50%;
-    }
-    .rb-md-basis-1-3 {
-      flex-basis: 33.333333%;
-    }
-    .rb-md-basis-1-4 {
-      flex-basis: 25%;
-    }
-    .rb-md-basis-1-5 {
-      flex-basis: 20%;
-    }
-    .rb-md-basis-1-6 {
-      flex-basis: 16.666667%;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-md-basis-full {
+        flex-basis: 100%;
+      }
+      .rb-md-basis-1-2 {
+        flex-basis: 50%;
+      }
+      .rb-md-basis-1-3 {
+        flex-basis: 33.333333%;
+      }
+      .rb-md-basis-1-4 {
+        flex-basis: 25%;
+      }
+      .rb-md-basis-1-5 {
+        flex-basis: 20%;
+      }
+      .rb-md-basis-1-6 {
+        flex-basis: 16.666667%;
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 1024px) {
-    .rb-lg-basis-full {
-      flex-basis: 100%;
-    }
-    .rb-lg-basis-1-2 {
-      flex-basis: 50%;
-    }
-    .rb-lg-basis-1-3 {
-      flex-basis: 33.333333%;
-    }
-    .rb-lg-basis-1-4 {
-      flex-basis: 25%;
-    }
-    .rb-lg-basis-1-5 {
-      flex-basis: 20%;
-    }
-    .rb-lg-basis-1-6 {
-      flex-basis: 16.666667%;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-lg-basis-full {
+        flex-basis: 100%;
+      }
+      .rb-lg-basis-1-2 {
+        flex-basis: 50%;
+      }
+      .rb-lg-basis-1-3 {
+        flex-basis: 33.333333%;
+      }
+      .rb-lg-basis-1-4 {
+        flex-basis: 25%;
+      }
+      .rb-lg-basis-1-5 {
+        flex-basis: 20%;
+      }
+      .rb-lg-basis-1-6 {
+        flex-basis: 16.666667%;
+      }
     }
-  }
+
+}
   .rb-shrink-0 {
     flex-shrink: 0;
   }
@@ -47837,64 +47992,80 @@ var init_containerResponsiveThemeCss = __esm({
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
   @container rb-site (min-width: 640px) {
-    .rb-sm-grid-cols-2 {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-    .rb-sm-grid-cols-3 {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-    .rb-sm-grid-cols-4 {
-      grid-template-columns: repeat(4, minmax(0, 1fr));
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-sm-grid-cols-2 {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+      .rb-sm-grid-cols-3 {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+      }
+      .rb-sm-grid-cols-4 {
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 768px) {
-    .rb-md-grid-cols-2 {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-    .rb-md-grid-cols-3 {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-    .rb-md-grid-cols-4 {
-      grid-template-columns: repeat(4, minmax(0, 1fr));
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-md-grid-cols-2 {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+      .rb-md-grid-cols-3 {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+      }
+      .rb-md-grid-cols-4 {
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 1024px) {
-    .rb-lg-grid-cols-2 {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-    .rb-lg-grid-cols-3 {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-    .rb-lg-grid-cols-4 {
-      grid-template-columns: repeat(4, minmax(0, 1fr));
-    }
-    .rb-lg-w-3\\/4 {
-      width: 75%;
-    }
-    .rb-lg-col-span-1 {
-      grid-column: span 1 / span 1;
-    }
-    .rb-lg-col-span-2 {
-      grid-column: span 2 / span 2;
-    }
-    .rb-lg-col-span-3 {
-      grid-column: span 3 / span 3;
-    }
-    .rb-lg-col-span-4 {
-      grid-column: span 4 / span 4;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-lg-grid-cols-2 {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+      .rb-lg-grid-cols-3 {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+      }
+      .rb-lg-grid-cols-4 {
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+      }
+      .rb-lg-w-3\\/4 {
+        width: 75%;
+      }
+      .rb-lg-col-span-1 {
+        grid-column: span 1 / span 1;
+      }
+      .rb-lg-col-span-2 {
+        grid-column: span 2 / span 2;
+      }
+      .rb-lg-col-span-3 {
+        grid-column: span 3 / span 3;
+      }
+      .rb-lg-col-span-4 {
+        grid-column: span 4 / span 4;
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 1280px) {
-    .rb-xl-grid-cols-2 {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-    .rb-xl-grid-cols-3 {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-    .rb-xl-grid-cols-4 {
-      grid-template-columns: repeat(4, minmax(0, 1fr));
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-xl-grid-cols-2 {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+      .rb-xl-grid-cols-3 {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+      }
+      .rb-xl-grid-cols-4 {
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+      }
     }
-  }
+
+}
 
   /* Alignment */
   .rb-items-start {
@@ -47963,13 +48134,17 @@ var init_containerResponsiveThemeCss = __esm({
     row-gap: 0.75rem;
   }
   @container rb-site (min-width: 768px) {
-    .rb-md-gap-0 {
-      gap: 0;
-    }
-    .rb-md-gap-10 {
-      gap: 2.5rem;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-md-gap-0 {
+        gap: 0;
+      }
+      .rb-md-gap-10 {
+        gap: 2.5rem;
+      }
     }
-  }
+
+}
 
   .rb-space-y-1 > :not([hidden]) ~ :not([hidden]) {
     margin-top: 0.25rem;
@@ -48071,137 +48246,149 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (min-width: 640px) {
-    .rb-sm-py-16 {
-      padding-top: 4rem;
-      padding-bottom: 4rem;
-    }
-    .rb-sm-py-20 {
-      padding-top: 5rem;
-      padding-bottom: 5rem;
-    }
-    .rb-sm-p-6 {
-      padding: 1.5rem;
-    }
-    .rb-sm-flex {
-      display: flex;
-    }
-    .rb-sm-block {
-      display: block;
-    }
-    .rb-sm-inline {
-      display: inline;
-    }
-    .rb-sm-inline-block {
-      display: inline-block;
-    }
-    .rb-sm-inline-flex {
-      display: inline-flex;
-    }
-    .rb-sm-grid {
-      display: grid;
-    }
-    .rb-sm-hidden {
-      display: none;
-    }
-    .rb-sm-flex-row {
-      flex-direction: row;
-    }
-    .rb-sm-items-start {
-      align-items: flex-start;
-    }
-    .rb-sm-items-center {
-      align-items: center;
-    }
-    .rb-sm-justify-between {
-      justify-content: space-between;
-    }
-    .rb-sm-p-8 {
-      padding: 2rem;
-    }
-    .rb-sm-text-lg {
-      font-size: 1.125rem;
-      line-height: 1.75rem;
-    }
-    .rb-sm-text-xl {
-      font-size: 1.25rem;
-      line-height: 1.75rem;
-    }
-    .rb-sm-text-4xl {
-      font-size: 2.25rem;
-      line-height: 2.5rem;
-    }
 
-    .rb-sm-w-auto {
-      width: auto;
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-sm-py-16 {
+        padding-top: 4rem;
+        padding-bottom: 4rem;
+      }
+      .rb-sm-py-20 {
+        padding-top: 5rem;
+        padding-bottom: 5rem;
+      }
+      .rb-sm-p-6 {
+        padding: 1.5rem;
+      }
+      .rb-sm-flex {
+        display: flex;
+      }
+      .rb-sm-block {
+        display: block;
+      }
+      .rb-sm-inline {
+        display: inline;
+      }
+      .rb-sm-inline-block {
+        display: inline-block;
+      }
+      .rb-sm-inline-flex {
+        display: inline-flex;
+      }
+      .rb-sm-grid {
+        display: grid;
+      }
+      .rb-sm-hidden {
+        display: none;
+      }
+      .rb-sm-flex-row {
+        flex-direction: row;
+      }
+      .rb-sm-items-start {
+        align-items: flex-start;
+      }
+      .rb-sm-items-center {
+        align-items: center;
+      }
+      .rb-sm-justify-between {
+        justify-content: space-between;
+      }
+      .rb-sm-p-8 {
+        padding: 2rem;
+      }
+      .rb-sm-text-lg {
+        font-size: 1.125rem;
+        line-height: 1.75rem;
+      }
+      .rb-sm-text-xl {
+        font-size: 1.25rem;
+        line-height: 1.75rem;
+      }
+      .rb-sm-text-4xl {
+        font-size: 2.25rem;
+        line-height: 2.5rem;
+      }
+
+      .rb-sm-w-auto {
+        width: auto;
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 768px) {
-    .rb-md-py-20 {
-      padding-top: 5rem;
-      padding-bottom: 5rem;
-    }
-    .rb-md-py-24 {
-      padding-top: 6rem;
-      padding-bottom: 6rem;
-    }
-    .rb-md-w-1\\/3 {
-      width: 33.333333%;
-    }
 
-    .rb-md-flex {
-      display: flex;
-    }
-    .rb-md-block {
-      display: block;
-    }
-    .rb-md-inline {
-      display: inline;
-    }
-    .rb-md-inline-block {
-      display: inline-block;
-    }
-    .rb-md-inline-flex {
-      display: inline-flex;
-    }
-    .rb-md-grid {
-      display: grid;
-    }
-    .rb-md-hidden {
-      display: none;
-    }
-    .rb-md-flex-row {
-      flex-direction: row;
-    }
-    .rb-md-flex-row-reverse {
-      flex-direction: row-reverse;
-    }
-    .rb-md-items-start {
-      align-items: flex-start;
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-md-py-20 {
+        padding-top: 5rem;
+        padding-bottom: 5rem;
+      }
+      .rb-md-py-24 {
+        padding-top: 6rem;
+        padding-bottom: 6rem;
+      }
+      .rb-md-w-1\\/3 {
+        width: 33.333333%;
+      }
+
+      .rb-md-flex {
+        display: flex;
+      }
+      .rb-md-block {
+        display: block;
+      }
+      .rb-md-inline {
+        display: inline;
+      }
+      .rb-md-inline-block {
+        display: inline-block;
+      }
+      .rb-md-inline-flex {
+        display: inline-flex;
+      }
+      .rb-md-grid {
+        display: grid;
+      }
+      .rb-md-hidden {
+        display: none;
+      }
+      .rb-md-flex-row {
+        flex-direction: row;
+      }
+      .rb-md-flex-row-reverse {
+        flex-direction: row-reverse;
+      }
+      .rb-md-items-start {
+        align-items: flex-start;
+      }
     }
-  }
+
+}
   @container rb-site (min-width: 1024px) {
-    .rb-lg-flex {
-      display: flex;
-    }
-    .rb-lg-block {
-      display: block;
-    }
-    .rb-lg-inline {
-      display: inline;
-    }
-    .rb-lg-inline-block {
-      display: inline-block;
-    }
-    .rb-lg-inline-flex {
-      display: inline-flex;
-    }
-    .rb-lg-grid {
-      display: grid;
-    }
-    .rb-lg-hidden {
-      display: none;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-lg-flex {
+        display: flex;
+      }
+      .rb-lg-block {
+        display: block;
+      }
+      .rb-lg-inline {
+        display: inline;
+      }
+      .rb-lg-inline-block {
+        display: inline-block;
+      }
+      .rb-lg-inline-flex {
+        display: inline-flex;
+      }
+      .rb-lg-grid {
+        display: grid;
+      }
+      .rb-lg-hidden {
+        display: none;
+      }
     }
-  }
+
+}
 
   /* Margin */
   .rb-m-0 {
@@ -48458,8 +48645,9 @@ var init_containerResponsiveThemeCss = __esm({
     font-weight: 700;
   }
   .rb-font-mono {
-    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
-      "Liberation Mono", "Courier New", monospace;
+    font-family:
+      ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+      "Courier New", monospace;
   }
   .rb-leading-relaxed {
     line-height: 1.625;
@@ -48677,39 +48865,44 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (max-width: 639px) {
-    .rb-image-gallery-marquee {
-      overflow-x: auto;
-      overflow-y: hidden;
-      -webkit-overflow-scrolling: touch;
-      touch-action: pan-x;
-      scrollbar-width: none;
-    }
 
-    .rb-image-gallery-marquee::-webkit-scrollbar {
-      display: none;
-    }
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-image-gallery-marquee {
+        overflow-x: auto;
+        overflow-y: hidden;
+        -webkit-overflow-scrolling: touch;
+        touch-action: pan-x;
+        scrollbar-width: none;
+      }
 
-    /* Let users swipe smoothly without fighting autoplay while interacting. */
-    .rb-image-gallery-marquee:active .rb-animate-marquee,
-    .rb-image-gallery-marquee:focus-within .rb-animate-marquee {
-      animation-play-state: paused;
-    }
+      .rb-image-gallery-marquee::-webkit-scrollbar {
+        display: none;
+      }
 
-    .rb-container-full.rb-image-gallery-marquee-container {
-      padding-left: 0;
-      padding-right: 0;
-    }
+      /* Let users swipe smoothly without fighting autoplay while interacting. */
+      .rb-image-gallery-marquee:active .rb-animate-marquee,
+      .rb-image-gallery-marquee:focus-within .rb-animate-marquee {
+        animation-play-state: paused;
+      }
 
-    /* Marquee variant: keep images in color on mobile for legibility. */
-    .rb-image-gallery-marquee-container .rb-filter-grayscale,
-    .rb-image-gallery-marquee-container .rb-filter-grayscale-hover-reveal {
-      filter: none;
-    }
+      .rb-container-full.rb-image-gallery-marquee-container {
+        padding-left: 0;
+        padding-right: 0;
+      }
+
+      /* Marquee variant: keep images in color on mobile for legibility. */
+      .rb-image-gallery-marquee-container .rb-filter-grayscale,
+      .rb-image-gallery-marquee-container .rb-filter-grayscale-hover-reveal {
+        filter: none;
+      }
 
-    .rb-image-gallery-marquee-container .rb-filter-grayscale-hover-reveal:hover {
-      filter: none;
+      .rb-image-gallery-marquee-container
+        .rb-filter-grayscale-hover-reveal:hover {
+        filter: none;
+      }
     }
-  }
+
+}
 
   @media (prefers-reduced-motion: reduce) {
     .rb-animate-marquee {
@@ -48814,12 +49007,16 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (min-width: 640px) {
-    .rb-container,
-    .rb-container-full {
-      padding-left: 1.5rem;
-      padding-right: 1.5rem;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-container,
+      .rb-container-full {
+        padding-left: 1.5rem;
+        padding-right: 1.5rem;
+      }
     }
-  }
+
+}
 
   /* Flex alignment */
   .rb-self-start {
@@ -48853,27 +49050,31 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (min-width: 640px) {
-    .rb-section-pad-compact {
-      padding-top: 2rem;
-      padding-bottom: 2rem;
-    }
-    .rb-section-pad-cozy {
-      padding-top: 3.5rem;
-      padding-bottom: 3.5rem;
-    }
-    .rb-section-pad-medium {
-      padding-top: 4rem;
-      padding-bottom: 4rem;
-    }
-    .rb-section-pad-comfortable {
-      padding-top: 5rem;
-      padding-bottom: 5rem;
-    }
-    .rb-section-pad-spacious {
-      padding-top: 7rem;
-      padding-bottom: 7rem;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-section-pad-compact {
+        padding-top: 2rem;
+        padding-bottom: 2rem;
+      }
+      .rb-section-pad-cozy {
+        padding-top: 3.5rem;
+        padding-bottom: 3.5rem;
+      }
+      .rb-section-pad-medium {
+        padding-top: 4rem;
+        padding-bottom: 4rem;
+      }
+      .rb-section-pad-comfortable {
+        padding-top: 5rem;
+        padding-bottom: 5rem;
+      }
+      .rb-section-pad-spacious {
+        padding-top: 7rem;
+        padding-bottom: 7rem;
+      }
     }
-  }
+
+}
 
   .rb-container-pad-none {
     padding: 0;
@@ -48895,22 +49096,26 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (min-width: 640px) {
-    .rb-container-pad-compact {
-      padding: 1.5rem;
-    }
-    .rb-container-pad-cozy {
-      padding: 2rem;
-    }
-    .rb-container-pad-medium {
-      padding: 2rem;
-    }
-    .rb-container-pad-comfortable {
-      padding: 2.5rem;
-    }
-    .rb-container-pad-spacious {
-      padding: 3.5rem;
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-container-pad-compact {
+        padding: 1.5rem;
+      }
+      .rb-container-pad-cozy {
+        padding: 2rem;
+      }
+      .rb-container-pad-medium {
+        padding: 2rem;
+      }
+      .rb-container-pad-comfortable {
+        padding: 2.5rem;
+      }
+      .rb-container-pad-spacious {
+        padding: 3.5rem;
+      }
     }
-  }
+
+}
 
   /* Semantic gap tokens (theme-aware via --space-mult) */
   .rb-gap-semantic-none {
@@ -48939,27 +49144,31 @@ var init_containerResponsiveThemeCss = __esm({
   }
 
   @container rb-site (min-width: 768px) {
-    .rb-gap-semantic-compact {
-      --rb-semantic-gap: calc(1.25rem * var(--space-mult, 1));
-      gap: calc(1.25rem * var(--space-mult, 1));
-    }
-    .rb-gap-semantic-cozy {
-      --rb-semantic-gap: calc(2.25rem * var(--space-mult, 1));
-      gap: calc(2.25rem * var(--space-mult, 1));
-    }
-    .rb-gap-semantic-medium {
-      --rb-semantic-gap: calc(3.5rem * var(--space-mult, 1));
-      gap: calc(3.5rem * var(--space-mult, 1));
-    }
-    .rb-gap-semantic-comfortable {
-      --rb-semantic-gap: calc(5.75rem * var(--space-mult, 1));
-      gap: calc(5.75rem * var(--space-mult, 1));
-    }
-    .rb-gap-semantic-spacious {
-      --rb-semantic-gap: calc(8.75rem * var(--space-mult, 1));
-      gap: calc(8.75rem * var(--space-mult, 1));
+
+    @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-gap-semantic-compact {
+        --rb-semantic-gap: calc(1.25rem * var(--space-mult, 1));
+        gap: calc(1.25rem * var(--space-mult, 1));
+      }
+      .rb-gap-semantic-cozy {
+        --rb-semantic-gap: calc(2.25rem * var(--space-mult, 1));
+        gap: calc(2.25rem * var(--space-mult, 1));
+      }
+      .rb-gap-semantic-medium {
+        --rb-semantic-gap: calc(3.5rem * var(--space-mult, 1));
+        gap: calc(3.5rem * var(--space-mult, 1));
+      }
+      .rb-gap-semantic-comfortable {
+        --rb-semantic-gap: calc(5.75rem * var(--space-mult, 1));
+        gap: calc(5.75rem * var(--space-mult, 1));
+      }
+      .rb-gap-semantic-spacious {
+        --rb-semantic-gap: calc(8.75rem * var(--space-mult, 1));
+        gap: calc(8.75rem * var(--space-mult, 1));
+      }
     }
-  }
+
+}
 
   /* Backdrop blur helpers */
   .rb-backdrop-blur {
@@ -49313,11 +49522,13 @@ var init_containerResponsiveThemeCss = __esm({
   line-height: var(--rb-prose-lg-line-height);
 }
 @container rb-site (min-width: 640px) {
-  :where(.theme-scope) .rb-prose-xl-sm {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-prose-xl-sm {
     font-size: var(--rb-prose-xl-sm-font-size);
     line-height: var(--rb-prose-xl-sm-line-height);
   }
 }
+}
 
 /* Neutral prose uses theme text color by default */
 :where(.theme-scope) .rb-prose-neutral {
@@ -49401,22 +49612,28 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) .rb-columns-equal-height {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-columns-equal-height {
     --rb-columns-cols: var(--rb-columns-cols-md, var(--rb-columns-cols));
   }
 }
+}
 
 @container rb-site (min-width: 1024px) {
-  :where(.theme-scope) .rb-columns-equal-height {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-columns-equal-height {
     --rb-columns-cols: var(--rb-columns-cols-lg, var(--rb-columns-cols));
   }
 }
+}
 
 @container rb-site (min-width: 1280px) {
-  :where(.theme-scope) .rb-columns-equal-height {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-columns-equal-height {
     --rb-columns-cols: var(--rb-columns-cols-xl, var(--rb-columns-cols));
   }
 }
+}
 
 :where(.theme-scope) .rb-columns-equal-height > * {
   height: var(--rb-columns-tile-h);
@@ -50038,7 +50255,8 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Mobile: reduce site title size (~30%) to keep header compact */
 @container rb-site (max-width: 767px) {
-  :where(.theme-scope) .header-logo-text {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .header-logo-text {
     font-size: 0.8rem;
     line-height: 1.25rem;
   }
@@ -50049,6 +50267,7 @@ var init_containerResponsiveThemeCss = __esm({
     line-height: 1.25rem;
   }
 }
+}
 
 /* Centered/editorial variants use larger title */
 :where(.theme-scope) .header-variant-centered .header-logo-text,
@@ -50072,10 +50291,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (max-width: 767px) {
-  :where(.theme-scope) .rb-header-shrink.header-scrolled .header-logo-text {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-header-shrink.header-scrolled .header-logo-text {
     font-size: 0.75rem;
   }
 }
+}
 
 /* =================================================================
    Accessibility: Reduced Motion
@@ -50519,10 +50740,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-event-grid {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-event-grid {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="event-registration"]) .er-row {
   display: flex;
@@ -50755,12 +50978,14 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-layout {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-layout {
     /* Desktop: main + sidebar */
     grid-template-columns: 1fr 300px;
     grid-template-areas: "main summary";
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="event-registration"]) .er-layout-main {
   grid-area: main;
@@ -50842,10 +51067,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 640px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-step-label {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-step-label {
     display: inline;
   }
 }
+}
 
 /* Sticky order summary */
 :where(.theme-scope) :where([data-block="event-registration"]) .er-summary {
@@ -50862,11 +51089,13 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-summary {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-summary {
     position: sticky;
     top: 1rem;
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="event-registration"]) .er-summary-event {
   font-weight: 600;
@@ -50936,12 +51165,14 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-guest-card {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-guest-card {
     grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
     column-gap: 1rem;
     align-items: start;
   }
 }
+}
 
 /* Shake animation for validation errors */
 @keyframes er-shake {
@@ -51086,7 +51317,8 @@ var init_containerResponsiveThemeCss = __esm({
  * ============================================================================= */
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope)
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope)
     :where([data-block="event-listing"], [data-block="event-spotlight"], [data-block="event-calendar"], [data-block="event-combined"])
     .event-card[data-orientation="horizontal"] {
     display: flex;
@@ -51137,6 +51369,7 @@ var init_containerResponsiveThemeCss = __esm({
     text-align: right;
   }
 }
+}
 
 /* Keep token list in sync with \`EVENT_CATEGORY_BADGE_TOKENS\` in \`packages/blocks/src/system/constants/events.ts\`. */
 :where(.theme-scope)
@@ -51216,7 +51449,8 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="event-registration"]) .er-payment-layout {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-registration"]) .er-payment-layout {
     grid-template-columns: 1fr 260px;
     grid-template-areas:
       "main sidebar"
@@ -51231,6 +51465,7 @@ var init_containerResponsiveThemeCss = __esm({
       "footer";
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="event-registration"]) .er-payment-layout-main {
   grid-area: main;
@@ -52510,7 +52745,8 @@ var init_containerResponsiveThemeCss = __esm({
 :where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-time,
 :where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-title,
 :where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-teacher,
-:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-meta {
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-meta,
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-capacity {
   display: block;
   min-width: 0;
   overflow: hidden;
@@ -52536,6 +52772,17 @@ var init_containerResponsiveThemeCss = __esm({
   opacity: 0.72;
 }
 
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-capacity {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  opacity: 0.85;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-event-capacity--full {
+  color: rgb(var(--tb-danger, 220 38 38));
+  opacity: 1;
+}
+
 :where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-day-empty {
   margin: 0;
   padding: 1rem 0.5rem;
@@ -52552,7 +52799,8 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (max-width: 767px) {
-  :where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-day-selector {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-timetable-day-selector {
     display: flex;
   }
 
@@ -52582,6 +52830,7 @@ var init_containerResponsiveThemeCss = __esm({
     padding-inline: 0.75rem;
   }
 }
+}
 
 /* -----------------------------------------------------------------------------
  * Event Calendar Modals
@@ -52720,7 +52969,8 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Responsive adjustments */
 @container rb-site (max-width: 640px) {
-  :where(.theme-scope) :where([data-block="event-calendar"]) .event-calendar-container {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-calendar-container {
     margin-left: -1.5rem;
     margin-right: -1.5rem;
     border-left: none;
@@ -52781,6 +53031,7 @@ var init_containerResponsiveThemeCss = __esm({
     margin: 0 0.5rem;
   }
 }
+}
 
 /*
  * Shared: Tab bar (underline style)
@@ -53143,10 +53394,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="form"]) .fb-row-2 {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="form"]) .fb-row-2 {
     grid-template-columns: 1fr 1fr;
   }
 }
+}
 
 /* Field wrapper */
 :where(.theme-scope) :where([data-block="form"]) .fb-field {
@@ -53227,10 +53480,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 640px) {
-  :where(.theme-scope) :where([data-block="hero"]) .hero-subheadline {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="hero"]) .hero-subheadline {
     font-size: 1.25rem;
   }
 }
+}
 
 /* =============================================================================
  * Shared: Heading Group (used by CTA, single-button, etc.)
@@ -53444,16 +53699,19 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) .carousel-root {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .carousel-root {
     --rb-carousel-slides-to-show: var(
       --rb-carousel-slides-to-show-tablet,
       var(--rb-carousel-slides-to-show-mobile, 1)
     );
   }
 }
+}
 
 @container rb-site (min-width: 1024px) {
-  :where(.theme-scope) .carousel-root {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .carousel-root {
     --rb-carousel-slides-to-show: var(
       --rb-carousel-slides-to-show-desktop,
       var(
@@ -53463,6 +53721,7 @@ var init_containerResponsiveThemeCss = __esm({
     );
   }
 }
+}
 
 /* Slides take exact percentage width with internal padding for gaps.
  * Padding is more reliable than margin (no collapsing, consistent on all slides). */
@@ -53736,10 +53995,12 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Responsive grid */
 @container rb-site (max-width: 768px) {
-  :where(.theme-scope) .shop__products--grid {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .shop__products--grid {
     grid-template-columns: 1fr;
   }
 }
+}
 
 :where(.theme-scope) .shop__modal-product {
   font-size: 0.9375rem;
@@ -53841,11 +54102,13 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Mobile: full-width CTA buttons inside cards */
 @container rb-site (max-width: 640px) {
-  :where(.theme-scope) .shop__cta {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .shop__cta {
     align-self: stretch;
     width: 100%;
   }
 }
+}
 
 /* =============================================================================
  * Block: Customer Portal
@@ -54551,7 +54814,8 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Responsive: show everything without horizontal scrolling */
 @container rb-site (max-width: 640px) {
-  :where(.theme-scope) :where([data-block="customer-portal"]) .cp-only-mobile {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="customer-portal"]) .cp-only-mobile {
     display: flex;
   }
 
@@ -54591,6 +54855,7 @@ var init_containerResponsiveThemeCss = __esm({
     align-self: stretch;
   }
 }
+}
 
 /* Placeholder (SSR) */
 :where(.theme-scope) :where([data-block="customer-portal"]) .cp-placeholder {
@@ -54680,7 +54945,8 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Position arrows outside the carousel content area */
 @container rb-site (max-width: 639px) {
-  :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn--prev {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn--prev {
     /* Move arrows closer to viewport edge than container edge on mobile. */
     left: calc(0.5rem - 1.5rem);
   }
@@ -54690,10 +54956,12 @@ var init_containerResponsiveThemeCss = __esm({
     right: calc(0.5rem - 1.5rem);
   }
 }
+}
 
 /* Position arrows further out on larger breakpoints */
 @container rb-site (min-width: 640px) {
-  :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn--prev {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn--prev {
     left: calc(-1 * (var(--rb-testimonial-carousel-arrow-size) / 2 + var(--rb-testimonial-carousel-arrow-gap)));
   }
 
@@ -54701,6 +54969,7 @@ var init_containerResponsiveThemeCss = __esm({
     right: calc(-1 * (var(--rb-testimonial-carousel-arrow-size) / 2 + var(--rb-testimonial-carousel-arrow-gap)));
   }
 }
+}
 
 /*
  * Event Details (runtime node)
@@ -54752,10 +55021,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) .rb-tiles-grid {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .rb-tiles-grid {
     grid-template-columns: repeat(var(--rb-tiles-grid-cols-md, var(--rb-tiles-grid-cols-sm, 2)), minmax(0, 1fr));
   }
 }
+}
 
 :where(.theme-scope) :where(.rb-tile--interactive, .er-event-card) {
   cursor: pointer;
@@ -54860,10 +55131,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="course-registration"]) .cr-layout--with-sidebar {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="course-registration"]) .cr-layout--with-sidebar {
     grid-template-columns: 1fr 280px;
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="course-registration"]) .cr-layout__main {
   min-width: 0;
@@ -54874,10 +55147,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  :where(.theme-scope) :where([data-block="course-registration"]) .cr-layout__sidebar {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="course-registration"]) .cr-layout__sidebar {
     display: block;
   }
 }
+}
 
 /* =============================================================================
  * Step Indicator
@@ -54928,10 +55203,12 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 640px) {
-  :where(.theme-scope) :where([data-block="course-registration"]) .cr-step-label {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="course-registration"]) .cr-step-label {
     display: block;
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="course-registration"]) .cr-step-label--active {
   color: var(--cr-on-surface);
@@ -55814,7 +56091,8 @@ var init_containerResponsiveThemeCss = __esm({
 
 /* Mobile fallback for inline variant */
 @container rb-site (max-width: 640px) {
-  :where(.theme-scope) .newsletter-inline .newsletter-form-fields {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) .newsletter-inline .newsletter-form-fields {
     flex-direction: column;
   }
 
@@ -55822,6 +56100,7 @@ var init_containerResponsiveThemeCss = __esm({
     min-width: 100%;
   }
 }
+}
 
 /* =============================================================================
  * Success State
@@ -55859,12 +56138,14 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 1024px) {
-  :where(.theme-scope) :where([data-block="team-members"]) :where(.rb-team-members[data-layout-width="lg-3-4-left"]) {
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+:where(.theme-scope) :where([data-block="team-members"]) :where(.rb-team-members[data-layout-width="lg-3-4-left"]) {
     width: 75%;
     margin-left: 0;
     margin-right: auto;
   }
 }
+}
 
 :where(.theme-scope) :where([data-block="team-members"]) .rb-team-member-photo {
   display: block;
@@ -55939,7 +56220,8 @@ var init_containerResponsiveThemeCss = __esm({
 }
 
 @container rb-site (min-width: 768px) {
-  /* Stack variant: enforce real column ratio at md+ (fixes transform/fallback pitfalls). */
+@scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
+/* Stack variant: enforce real column ratio at md+ (fixes transform/fallback pitfalls). */
   :where(.theme-scope) :where([data-block="team-members"][data-block-variant="stack"]) :where(.rb-team-member-photo-col) {
     flex: 0 0 var(--rb-team-image-basis);
   }
@@ -55963,6 +56245,7 @@ var init_containerResponsiveThemeCss = __esm({
     flex-direction: row-reverse;
   }
 }
+}
 
 /* Thumbnail padding (space around image inside the item) */
 :where(.theme-scope) :where([data-block="team-members"]) .rb-team-members[data-thumb-pad="sm"] .rb-team-member-photo-wrap {
@@ -56167,18 +56450,19 @@ function ThemeScopeCore({
   children,
   className
 }) {
-  const isContainerResponsive = responsiveMode === "container";
+  const responsiveScope = getResponsiveScopeSpec(responsiveMode);
+  const isContainerResponsive = responsiveScope.kind === "container";
   const wrapperStyle = isContainerResponsive ? {
     ...cssVars,
     containerType: "inline-size",
-    containerName: THEME_RESPONSIVE_CONTAINER_NAME
+    containerName: responsiveScope.containerName
   } : cssVars;
   return /* @__PURE__ */ jsxs100(
     "div",
     {
       className: className ? `theme-scope ${className}` : "theme-scope",
       style: wrapperStyle,
-      "data-rb-responsive-mode": responsiveMode,
+      "data-rb-responsive-mode": responsiveScope.kind,
       ...dataAttrs,
       suppressHydrationWarning,
       children: [
@@ -56186,25 +56470,131 @@ function ThemeScopeCore({
           "style",
           {
             "data-container-responsive-overrides": true,
-            dangerouslySetInnerHTML: { __html: escapeStyleContent(containerResponsiveThemeCss) }
+            dangerouslySetInnerHTML: {
+              __html: escapeStyleContent(containerResponsiveThemeCss)
+            }
+          }
+        ),
+        layoutCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-layout-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(layoutCss) }
+          }
+        ),
+        buttonCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-button-effects": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(buttonCss) }
+          }
+        ),
+        headerCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-header-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(headerCss) }
+          }
+        ),
+        footerCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-footer-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(footerCss) }
+          }
+        ),
+        cardCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-card-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(cardCss) }
+          }
+        ),
+        accordionCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-accordion-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(accordionCss) }
+          }
+        ),
+        inputCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-input-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(inputCss) }
+          }
+        ),
+        statusCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-status-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(statusCss) }
+          }
+        ),
+        progressCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-progress-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(progressCss) }
+          }
+        ),
+        typographyCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-typography-styles": true,
+            dangerouslySetInnerHTML: {
+              __html: escapeStyleContent(typographyCss)
+            }
+          }
+        ),
+        eventCalendarCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-event-calendar-styles": true,
+            dangerouslySetInnerHTML: {
+              __html: escapeStyleContent(eventCalendarCss)
+            }
+          }
+        ),
+        blockVarsCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-block-vars-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(blockVarsCss) }
+          }
+        ),
+        blockCustomVarsCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-block-custom-vars-styles": true,
+            dangerouslySetInnerHTML: {
+              __html: escapeStyleContent(blockCustomVarsCss)
+            }
+          }
+        ),
+        blockCustomCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-block-custom-styles": true,
+            dangerouslySetInnerHTML: {
+              __html: escapeStyleContent(blockCustomCss)
+            }
+          }
+        ),
+        atRulesCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-at-rules-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(atRulesCss) }
+          }
+        ),
+        customCss && /* @__PURE__ */ jsx139(
+          "style",
+          {
+            "data-custom-theme-styles": true,
+            dangerouslySetInnerHTML: { __html: escapeStyleContent(customCss) }
           }
         ),
-        layoutCss && /* @__PURE__ */ jsx139("style", { "data-layout-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(layoutCss) } }),
-        buttonCss && /* @__PURE__ */ jsx139("style", { "data-button-effects": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(buttonCss) } }),
-        headerCss && /* @__PURE__ */ jsx139("style", { "data-header-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(headerCss) } }),
-        footerCss && /* @__PURE__ */ jsx139("style", { "data-footer-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(footerCss) } }),
-        cardCss && /* @__PURE__ */ jsx139("style", { "data-card-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(cardCss) } }),
-        accordionCss && /* @__PURE__ */ jsx139("style", { "data-accordion-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(accordionCss) } }),
-        inputCss && /* @__PURE__ */ jsx139("style", { "data-input-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(inputCss) } }),
-        statusCss && /* @__PURE__ */ jsx139("style", { "data-status-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(statusCss) } }),
-        progressCss && /* @__PURE__ */ jsx139("style", { "data-progress-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(progressCss) } }),
-        typographyCss && /* @__PURE__ */ jsx139("style", { "data-typography-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(typographyCss) } }),
-        eventCalendarCss && /* @__PURE__ */ jsx139("style", { "data-event-calendar-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(eventCalendarCss) } }),
-        blockVarsCss && /* @__PURE__ */ jsx139("style", { "data-block-vars-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(blockVarsCss) } }),
-        blockCustomVarsCss && /* @__PURE__ */ jsx139("style", { "data-block-custom-vars-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(blockCustomVarsCss) } }),
-        blockCustomCss && /* @__PURE__ */ jsx139("style", { "data-block-custom-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(blockCustomCss) } }),
-        atRulesCss && /* @__PURE__ */ jsx139("style", { "data-at-rules-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(atRulesCss) } }),
-        customCss && /* @__PURE__ */ jsx139("style", { "data-custom-theme-styles": true, dangerouslySetInnerHTML: { __html: escapeStyleContent(customCss) } }),
         children
       ]
     }
@@ -61633,6 +62023,7 @@ function bindProp(from, opts) {
 
 // ../blocks/src/system/blocks/site-header.ts
 init_defineBlock();
+init_shared();
 init_colorStyles();
 var logoRow = link(
   {
@@ -61713,7 +62104,7 @@ var headerCta = ctaButton({
   whenPath: "menu.ctaItem.label",
   variantPath: "menu.ctaItem.variant",
   linkPath: "menu.ctaItem.link",
-  className: "header-cta btn-sm rb-hidden rb-lg-inline-flex rb-ml-6"
+  className: `header-cta btn-sm ${desktopOnlyDisplay("inline-flex")} rb-ml-6`
 });
 var mobileCta = ctaButton({
   basePath: "menu.ctaItem",
@@ -61741,7 +62132,7 @@ var mobileToggleButton = {
   props: {
     type: "button",
     variantId: "",
-    className: "nav-mobile-toggle rb-inline-flex rb-h-10 rb-w-10 rb-items-center rb-justify-center rb-rounded-md transition-theme-standard rb-lg-hidden",
+    className: `nav-mobile-toggle ${mobileOnlyDisplay("inline-flex")} rb-h-10 rb-w-10 rb-items-center rb-justify-center rb-rounded-md transition-theme-standard`,
     "aria-label": "Open menu",
     "aria-expanded": "false",
     "aria-controls": "nav-mobile-overlay",
@@ -61796,7 +62187,7 @@ var mobileOverlay = {
   type: "div",
   props: {
     id: "nav-mobile-overlay",
-    className: "nav-mobile-overlay rb-fixed rb-inset-0 rb-z-50 rb-lg-hidden",
+    className: `nav-mobile-overlay ${mobileOnlyDisplay("block")} rb-fixed rb-inset-0 rb-z-50`,
     role: "dialog",
     "aria-modal": "true",
     "aria-label": "Main menu",
@@ -61825,10 +62216,10 @@ var mobileHeaderBar = inline(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout rb-flex rb-w-full rb-items-center rb-justify-between rb-lg-hidden"
+          base: `rb-header-layout ${mobileOnlyDisplay("flex")} rb-w-full rb-items-center rb-justify-between`
         })
       ),
-      fallback: "rb-container rb-header-layout rb-flex rb-w-full rb-items-center rb-justify-between rb-lg-hidden"
+      fallback: `rb-container rb-header-layout ${mobileOnlyDisplay("flex")} rb-w-full rb-items-center rb-justify-between`
     }),
     align: "center",
     justify: "between"
@@ -61840,16 +62231,16 @@ var classicLayout2 = inline(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-items-center rb-gap-6"
+          base: `rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-items-center rb-gap-6`
         })
       ),
-      fallback: "rb-container rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-items-center rb-gap-6"
+      fallback: `rb-container rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-items-center rb-gap-6`
     }),
     align: "center"
   },
   [
     logoRow,
-    createNavRow("rb-ml-auto rb-hidden rb-lg-flex rb-gap-6"),
+    createNavRow(`rb-ml-auto ${desktopOnlyDisplay("flex")} rb-gap-6`),
     headerCta
   ],
   when("$root.theme.header.variant", { equals: "classic" })
@@ -61861,16 +62252,16 @@ var centeredLayout = stack(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-flex-col rb-items-center rb-gap-5 rb-text-center"
+          base: `rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-flex-col rb-items-center rb-gap-5 rb-text-center`
         })
       ),
-      fallback: "rb-container rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-flex-col rb-items-center rb-gap-5 rb-text-center"
+      fallback: `rb-container rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-flex-col rb-items-center rb-gap-5 rb-text-center`
     })
   },
   [
     centeredLogoRow,
     createNavRow(
-      "rb-hidden rb-lg-flex rb-flex-wrap rb-justify-center rb-gap-x-6 rb-gap-y-3",
+      `${desktopOnlyDisplay("flex")} rb-flex-wrap rb-justify-center rb-gap-x-6 rb-gap-y-3`,
       "center"
     )
   ],
@@ -61881,16 +62272,16 @@ var transparentLayout = inline(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-items-center rb-gap-6"
+          base: `rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-items-center rb-gap-6`
         })
       ),
-      fallback: "rb-container rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-items-center rb-gap-6"
+      fallback: `rb-container rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-items-center rb-gap-6`
     }),
     align: "center"
   },
   [
     logoRow,
-    createNavRow("rb-ml-auto rb-hidden rb-lg-flex rb-gap-6"),
+    createNavRow(`rb-ml-auto ${desktopOnlyDisplay("flex")} rb-gap-6`),
     headerCta
   ],
   when("$root.theme.header.variant", { equals: "transparent" })
@@ -61900,18 +62291,18 @@ var floatingLayout = inline(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout header-floating-container rb-absolute rb-left-1/2 rb-top-4 rb-hidden rb-w-calc-100-minus-2rem rb-max-w-7xl rb-translate-x-neg-1/2 rb-items-center rb-gap-6 rb-px-6 rb-lg-flex",
+          base: `rb-header-layout header-floating-container rb-absolute rb-left-1/2 rb-top-4 ${desktopOnlyDisplay("flex")} rb-w-calc-100-minus-2rem rb-max-w-7xl rb-translate-x-neg-1/2 rb-items-center rb-gap-6 rb-px-6`,
           container: "",
           full: ""
         })
       ),
-      fallback: "rb-header-layout header-floating-container rb-absolute rb-left-1/2 rb-top-4 rb-hidden rb-w-calc-100-minus-2rem rb-max-w-7xl rb-translate-x-neg-1/2 rb-items-center rb-gap-6 rb-px-6 rb-lg-flex"
+      fallback: `rb-header-layout header-floating-container rb-absolute rb-left-1/2 rb-top-4 ${desktopOnlyDisplay("flex")} rb-w-calc-100-minus-2rem rb-max-w-7xl rb-translate-x-neg-1/2 rb-items-center rb-gap-6 rb-px-6`
     }),
     align: "center"
   },
   [
     logoRow,
-    createNavRow("rb-ml-auto rb-hidden rb-lg-flex rb-gap-6"),
+    createNavRow(`rb-ml-auto ${desktopOnlyDisplay("flex")} rb-gap-6`),
     headerCta
   ],
   when("$root.theme.header.variant", { equals: "floating" })
@@ -61923,16 +62314,16 @@ var editorialLayout = stack(
     className: bindProp("$root.theme.header.maxWidth", {
       transforms: pipe(
         tx("layout.maxWidthClass", {
-          base: "rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-flex-col rb-items-center rb-gap-6 rb-text-center"
+          base: `rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-flex-col rb-items-center rb-gap-6 rb-text-center`
         })
       ),
-      fallback: "rb-container rb-header-layout rb-hidden rb-lg-flex rb-w-full rb-flex-col rb-items-center rb-gap-6 rb-text-center"
+      fallback: `rb-container rb-header-layout ${desktopOnlyDisplay("flex")} rb-w-full rb-flex-col rb-items-center rb-gap-6 rb-text-center`
     })
   },
   [
     centeredLogoRow,
     createNavRow(
-      "rb-hidden rb-lg-flex rb-flex-wrap rb-justify-center rb-gap-x-8 rb-gap-y-3",
+      `${desktopOnlyDisplay("flex")} rb-flex-wrap rb-justify-center rb-gap-x-8 rb-gap-y-3`,
       "center"
     )
   ],
@@ -69812,6 +70203,7 @@ init_schema2();
 
 // ../theme-core/src/index.ts
 init_responsiveMode();
+init_responsiveDisplay();
 init_breakpoints();
 init_ThemeScopeCore();
 init_buildThemeRuntime();
@@ -71604,7 +71996,7 @@ var ENDPOINT_DEFINITIONS = {
     responseKind: "void"
   },
   googleCalendarCallback: {
-    path: "/sites/{siteId}/bookings/calendar/google/callback",
+    path: "/bookings/calendar/google/callback",
     method: "GET",
     auth: "user",
     responseKind: "void"
@@ -77280,83 +77672,164 @@ async function prefetchBlockData2(page, context, client, options) {
   });
 }
 
-// src/rendering/components/Block.tsx
+// src/rendering/components/Block.shared.tsx
 import { jsx as jsx161, jsxs as jsxs106 } from "react/jsx-runtime";
-async function Block({
+function toBlockHydrationBootstrapConfig(props2) {
+  return {
+    siteId: props2.siteId,
+    supabaseUrl: props2.supabaseUrl,
+    mediaAssets: props2.mediaAssets
+  };
+}
+function renderUnknownBlock(blockKind) {
+  return /* @__PURE__ */ jsx161("div", { className: "p-4 border border-red-300 bg-red-50 rounded", children: /* @__PURE__ */ jsxs106("p", { className: "text-red-800 font-semibold", children: [
+    "Unknown block type: ",
+    blockKind
+  ] }) });
+}
+function buildBlockContentRuntime({
+  theme,
+  siteId,
+  supabaseUrl,
+  mediaAssets
+}) {
+  const themeRuntime = buildThemeRuntime2(theme);
+  const blocksTheme = parseBlocksTheme(theme);
+  const imageResolveContext = siteId || supabaseUrl || mediaAssets?.length ? { siteId, supabaseUrl, mediaAssets } : void 0;
+  if (imageResolveContext) {
+    setContextResolveImageUrlContext(buildResolveImageUrlContext(imageResolveContext));
+  }
+  return { themeRuntime, blocksTheme, imageResolveContext };
+}
+function buildSingleBlockPageOutline({
+  blockId,
+  blockKind
+}) {
+  return {
+    name: "Single Block",
+    path: "/block",
+    purpose: "Block preview",
+    blocks: [{
+      id: blockId,
+      kind: blockKind,
+      purpose: "preview"
+    }]
+  };
+}
+async function loadStandaloneBlockData({
   blockKind,
   blockId,
-  content,
-  theme,
   siteId,
   pageId,
   previewStage,
   client,
-  usePlaceholders: _usePlaceholders = false,
-  override: OverrideComponent
+  hasDefinition
+}) {
+  if (!client || !blockId || !siteId || !hasDefinition) return void 0;
+  const allResolvedData = await prefetchBlockData2(
+    buildSingleBlockPageOutline({ blockId, blockKind }),
+    { siteId, pageId, previewStage },
+    client
+  );
+  return allResolvedData[blockId];
+}
+function buildStandaloneBlockViewModel({
+  siteId,
+  pageId,
+  previewStage,
+  apiBaseUrl,
+  portalToken,
+  routeMap,
+  pagesByIdentifier,
+  entriesByIdentifier
+}) {
+  return {
+    $root: {
+      siteId: siteId ?? null,
+      pageId: pageId ?? null,
+      previewStage: previewStage ?? "published",
+      apiBaseUrl: apiBaseUrl ?? null,
+      portalToken: portalToken ?? null,
+      ...routeMap ? { routes: routeMap } : {},
+      ...pagesByIdentifier ? { pagesByIdentifier } : {},
+      ...entriesByIdentifier ? { entriesByIdentifier } : {}
+    }
+  };
+}
+function renderBlockOverride({
+  OverrideComponent,
+  props: props2,
+  runtime,
+  resolvedData
+}) {
+  return /* @__PURE__ */ jsx161(
+    OverrideComponent,
+    {
+      content: props2.content,
+      theme: runtime.themeRuntime.tokens,
+      themeConfig: props2.theme,
+      data: resolvedData,
+      siteId: props2.siteId,
+      supabaseUrl: props2.supabaseUrl,
+      imageResolveContext: runtime.imageResolveContext,
+      blockId: props2.blockId ?? null,
+      blockKind: props2.blockKind
+    }
+  );
+}
+function renderManifestBlock({
+  definition,
+  props: props2,
+  runtime,
+  resolvedData
 }) {
-  const definition = getBlockDefinition(blockKind);
-  if (!definition && !OverrideComponent) {
-    return /* @__PURE__ */ jsx161("div", { className: "p-4 border border-red-300 bg-red-50 rounded", children: /* @__PURE__ */ jsxs106("p", { className: "text-red-800 font-semibold", children: [
-      "Unknown block type: ",
-      blockKind
-    ] }) });
-  }
-  const themeRuntime = buildThemeRuntime2(theme);
-  const blocksTheme = parseBlocksTheme(theme);
-  let resolvedData;
-  if (client && blockId && definition) {
-    const pageOutline = {
-      name: "Single Block",
-      path: "/block",
-      purpose: "Block preview",
-      blocks: [{
-        id: blockId,
-        kind: blockKind,
-        purpose: "preview"
-      }]
-    };
-    const allResolvedData = await prefetchBlockData2(
-      pageOutline,
-      { siteId, pageId, previewStage },
-      client
-    );
-    resolvedData = allResolvedData[blockId];
-  }
-  if (OverrideComponent) {
-    return /* @__PURE__ */ jsx161(
-      OverrideComponent,
-      {
-        content,
-        theme: themeRuntime.tokens,
-        themeConfig: theme,
-        data: resolvedData,
-        blockId: blockId ?? null,
-        blockKind
-      }
-    );
-  }
-  if (!definition) {
-    return /* @__PURE__ */ jsx161("div", { className: "p-4 border border-red-300 bg-red-50 rounded", children: /* @__PURE__ */ jsxs106("p", { className: "text-red-800 font-semibold", children: [
-      "Unknown block type: ",
-      blockKind
-    ] }) });
-  }
   const BlockComponent = makeDefaultBlockComponent({ manifest: definition.manifest });
   const registry = getDefaultComponentRegistry();
-  const blocksThemeConfig = blocksTheme;
+  const blocksThemeConfig = runtime.blocksTheme;
   return /* @__PURE__ */ jsx161(
     BlockComponent,
     {
-      blockId: blockId ?? void 0,
-      blockKind,
-      theme: themeRuntime.tokens,
+      blockId: props2.blockId ?? void 0,
+      blockKind: props2.blockKind,
+      theme: runtime.themeRuntime.tokens,
       themeConfig: blocksThemeConfig,
-      content,
+      content: props2.content,
       data: resolvedData,
-      registry
+      registry,
+      viewModelOverrides: buildStandaloneBlockViewModel(props2)
     }
   );
 }
+async function BlockContent(props2) {
+  const definition = getBlockDefinition(props2.blockKind);
+  const OverrideComponent = props2.override;
+  if (!definition && !OverrideComponent) {
+    return renderUnknownBlock(props2.blockKind);
+  }
+  const runtime = buildBlockContentRuntime(props2);
+  const resolvedData = await loadStandaloneBlockData({
+    ...props2,
+    hasDefinition: Boolean(definition)
+  });
+  if (OverrideComponent) {
+    return renderBlockOverride({ OverrideComponent, props: props2, runtime, resolvedData });
+  }
+  return renderManifestBlock({
+    definition,
+    props: props2,
+    runtime,
+    resolvedData
+  });
+}
+
+// src/rendering/components/Block.tsx
+import { Fragment as Fragment27, jsx as jsx162, jsxs as jsxs107 } from "react/jsx-runtime";
+function Block(props2) {
+  return /* @__PURE__ */ jsxs107(Fragment27, { children: [
+    /* @__PURE__ */ jsx162(BlocksIslandsHydrator, { ...toBlockHydrationBootstrapConfig(props2) }),
+    /* @__PURE__ */ jsx162(BlockContent, { ...props2 })
+  ] });
+}
 
 // src/data/executeCodeLoaders.ts
 async function executeCodeLoaders(page, context, overrides) {
@@ -77955,9 +78428,9 @@ var ImagePresets2 = {
 };
 
 // src/rendering/primitives/RichText.tsx
-import { jsx as jsx162 } from "react/jsx-runtime";
+import { jsx as jsx163 } from "react/jsx-runtime";
 function RichText3(props2) {
-  return /* @__PURE__ */ jsx162(RichText2, { ...props2 });
+  return /* @__PURE__ */ jsx163(RichText2, { ...props2 });
 }
 
 // src/rendering/image.ts