Add the quiet calendar capsule

config/dot/quickshell/modules/bar/Bar.qml

@@ -104,6 +104,10 @@ PanelWindow {
             anchors.verticalCenter: parent.verticalCenter
             spacing: Theme.itemSpacing
 
+            CalendarIndicator {
+                anchors.verticalCenter: parent.verticalCenter
+            }
+
             ActivityIndicator {
                 anchors.verticalCenter: parent.verticalCenter
             }

config/dot/quickshell/modules/bar/CalendarIndicator.qml

@@ -0,0 +1,53 @@
+// A deliberately quiet appointment reminder. It only enters the bar during
+// the narrow window where an upcoming event is immediately useful.
+
+import QtQuick
+import QtQuick.Controls
+import qs.config
+import qs.services
+import qs.widgets
+
+Pill {
+    id: root
+
+    visible: CalendarAgenda.capsuleVisible
+    opacity: visible ? 1 : 0
+    horizontalPadding: 8
+    onActivated: ShellState.openDateMenu("agenda")
+
+    ToolTip.visible: root.hovered && root.visible
+    ToolTip.delay: 500
+    ToolTip.text: CalendarAgenda.nextEvent?.summary ?? "Upcoming event"
+
+    Behavior on opacity {
+        NumberAnimation {
+            duration: 120
+            easing.type: Easing.OutCubic
+        }
+    }
+
+    Behavior on implicitWidth {
+        NumberAnimation {
+            duration: 120
+            easing.type: Easing.OutCubic
+        }
+    }
+
+    Text {
+        anchors.verticalCenter: parent.verticalCenter
+        text: "\u{F00ED}"
+        color: Theme.accent
+        font.family: Theme.fontMono
+        font.pixelSize: 13
+    }
+
+    Text {
+        anchors.verticalCenter: parent.verticalCenter
+        text: CalendarAgenda.capsuleText
+        color: Theme.fg
+        font.family: Theme.fontFamily
+        font.features: Theme.tabularFigures
+        font.pixelSize: Theme.fontSizeSmall
+        font.weight: Font.DemiBold
+    }
+}

config/dot/quickshell/services/CalendarAgenda.qml

@@ -179,12 +179,37 @@ Singleton {
     }
 
     function applyFixture(name: string): void {
-        if (name !== "daybook")
+        if (name !== "daybook" && name !== "upcoming" && name !== "outside-window")
             return;
 
         root.watchWanted = false;
         root.fixtureMode = true;
         root.fixtureNow = Math.floor(new Date(2026, 7, 17, 11, 6).getTime() / 1000);
+
+        if (name === "upcoming" || name === "outside-window") {
+            const offset = name === "upcoming" ? 12 * 60 : 20 * 60;
+            root.sources = [{ id: "fixture-work", name: "Fixture Work", color: "#82aaff" }];
+            root.events = [
+                {
+                    id: "fixture-work:timed:1", sourceId: "fixture-work", uid: "fixture-timed",
+                    summary: "Fixture appointment", start: root.fixtureNow + offset,
+                    end: root.fixtureNow + offset + 30 * 60, allDay: false,
+                    location: "", joinUrl: ""
+                },
+                {
+                    id: "fixture-work:all-day:1", sourceId: "fixture-work", uid: "fixture-all-day",
+                    summary: "Fixture all day", start: Math.floor(new Date(2026, 7, 17).getTime() / 1000),
+                    end: Math.floor(new Date(2026, 7, 18).getTime() / 1000), allDay: true,
+                    location: "", joinUrl: ""
+                }
+            ];
+            root.errors = [];
+            root.generatedAt = root.fixtureNow;
+            root.phase = "ready";
+            root.selectIsoDate("2026-08-17");
+            return;
+        }
+
         root.sources = [
             { id: "fixture-work", name: "Fixture Work", color: "#82aaff" },
             { id: "fixture-cloud", name: "Fixture Cloud", color: "#c3e88d" },