Index: src/assets/css/ward.css
===================================================================
--- src/assets/css/ward.css	(revision 084b046d930ee79f779d73d05b08e90d00fd684f)
+++ src/assets/css/ward.css	(revision 52188632909b3b1b9120748844eed2779f7fc030)
@@ -100,2 +100,47 @@
 /* De kaarten vallen weg, de hemel blijft: dezelfde beweging als in de app. */
 body.messages-mode .help, body.messages-mode .cards { display: none; }
+
+/* ── De zwaai-hand ────────────────────────────────────────────────────── */
+/* Zelfde hoek als de boei; ze wisselen elkaar af met de stand. */
+#hand {
+  position: fixed; right: 18px; bottom: calc(18px + env(safe-area-inset-bottom));
+  width: 76px; height: 76px; border: 0; border-radius: 50%;
+  background: transparent; font-size: 52px; line-height: 1;
+  touch-action: none; cursor: grab; z-index: 50;
+}
+#hand.dragging { cursor: grabbing; transform: scale(1.1); }
+
+/* ── Het gesprek over de hemel ────────────────────────────────────────── */
+#thread {
+  position: fixed; inset: 0; z-index: 40;
+  display: flex; flex-direction: column;
+  /* Doorschijnend: de hemel eronder blijft zichtbaar draaien, net als de
+     glazen bubbels in de app. */
+  background: rgba(20, 26, 36, .72); backdrop-filter: blur(14px);
+}
+#thread header { display: flex; align-items: center; gap: 10px; padding: 12px 16px; }
+#thread header h2 { margin: 0; font-size: 1.05rem; }
+#thread-close { border: 0; background: #2a3342; color: var(--ink); border-radius: 10px; padding: 8px 12px; font-size: 1rem; }
+#thread-list { flex: 1; overflow-y: auto; padding: 8px 16px; display: flex; flex-direction: column; gap: 8px; }
+.bubble { max-width: 78%; padding: 10px 12px; border-radius: 14px; background: var(--card); }
+.bubble.out { align-self: flex-end; background: var(--accent); }
+.bubble.wave { font-size: 1.4rem; }
+.bubble .when { display: block; margin-top: 4px; font-size: .7rem; color: rgba(255,255,255,.55); }
+.bubble .body img { max-width: 100%; border-radius: 8px; }
+#thread-form { display: flex; gap: 8px; padding: 10px 16px calc(14px + env(safe-area-inset-bottom)); }
+#thread-form input {
+  flex: 1; border-radius: 999px; border: 1px solid #2a3342;
+  background: #131a25; color: var(--ink); padding: 10px 16px; font: inherit;
+}
+#thread-form button { border: 0; border-radius: 999px; padding: 10px 18px; background: var(--accent); color: #fff; font: inherit; font-weight: 600; }
+
+/* ── Het zwaai-paneel ─────────────────────────────────────────────────── */
+dialog#wave-dialog {
+  border: 0; border-radius: 16px; padding: 18px; max-width: 320px; width: calc(100% - 48px);
+  background: var(--card); color: var(--ink); text-align: center;
+}
+dialog#wave-dialog::backdrop { background: rgba(0,0,0,.4); }
+dialog#wave-dialog h2 { margin: 0 0 12px; font-size: 1.05rem; }
+.wave-answers { display: grid; gap: 8px; }
+.wave-answers button { border: 0; border-radius: 10px; padding: 12px; background: var(--accent); color: #fff; font: inherit; font-weight: 600; }
+#wave-cancel { margin-top: 10px; border: 0; background: none; color: var(--dim); font: inherit; }