@bagdja/kumpul 1.1.0 → 1.2.2

package/README.md

@@ -15,11 +15,12 @@ direction and notes about the prototype's sample data and host-managed pages.
 ## Contract
 
 - Package: `@bagdja/kumpul`
-- Version: `1.1.0`
+- Version: `1.2.0`
 - Template slug: `kumpul`
 - `manifestVersion`: `1`, `rendererApiVersion`: `1`
 - Entry point: `dist/server.cjs` (wajib) dan `dist/client.js` (JavaScript browser), dinyatakan di `manifest.entry`
 - Halaman contoh untuk website baru: `manifest.defaultPages` (Beranda, Katalog Gathering, Cara Kerja, Tentang)
+- Data contoh website baru: `manifest.sampleData` (kategori, gathering, FAQ, dan tagline), dipakai untuk seed website serta preview package
 - Halaman sistem milik template (`manifest.pageOverrides`): header, keranjang, transaksi, detail transaksi, tagihan, invoice, kalender, rencana gathering
 
 ## Halaman sistem (`props.page`)

package/dist/client.js

@@ -2120,6 +2120,20 @@
             window.addEventListener("resize", updateHeaderHeight);
           }
         }
+        document.querySelectorAll("[data-plan-live]").forEach((workflow) => {
+          const tabs = Array.from(workflow.querySelectorAll("[data-plan-step-tab]"));
+          const panels = Array.from(workflow.querySelectorAll("[data-plan-step-panel]"));
+          tabs.forEach((tab) => {
+            tab.addEventListener("click", () => {
+              if (tab.disabled) return;
+              const step = tab.dataset.planStepTab;
+              tabs.forEach((item) => item.setAttribute("aria-pressed", String(item === tab)));
+              panels.forEach((panel) => {
+                panel.hidden = panel.dataset.planStepPanel !== step;
+              });
+            });
+          });
+        });
         document.querySelectorAll("[data-calendar-page]").forEach((calendar) => {
           const tabs = Array.from(calendar.querySelectorAll("[data-calendar-tab]"));
           const panels = Array.from(calendar.querySelectorAll("[data-calendar-panel]"));

package/dist/server.cjs

@@ -165,6 +165,8 @@ var require_page_adapter = __commonJS({
         workflow_step: plan.workflowStep,
         workflow_step_label: plan.workflowStepLabel,
         invite_policy: plan.invitePolicy,
+        can_cancel: plan.canCancel === true,
+        public_invitation_href: plan.publicInvitationHref,
         occurrence: {
           status: occurrence.status,
           status_label: occurrence.statusLabel,
@@ -193,6 +195,46 @@ var require_page_adapter = __commonJS({
         }
       };
     }
+    function adaptInvitations(page) {
+      return list2(page.invitations).map((invitation) => ({
+        key: invitation.key,
+        name: invitation.name,
+        status: invitation.status,
+        status_label: invitation.statusLabel,
+        channel: invitation.channel,
+        invite_href: invitation.inviteHref,
+        can_revoke: invitation.canRevoke === true
+      }));
+    }
+    function adaptRegistrations(page) {
+      return list2(page.registrations).map((registration) => ({
+        key: registration.key,
+        name: registration.name,
+        registration_status: registration.registrationStatus,
+        payment_status: registration.paymentStatus,
+        status_label: registration.statusLabel,
+        invoice_amount: registration.invoiceAmount,
+        selected_options: list2(registration.selectedOptions),
+        rejection_message: registration.rejectionMessage,
+        can_reject: registration.canReject === true,
+        can_checkout: registration.canCheckout === true,
+        can_cancel_checkout: registration.canCancelCheckout === true,
+        can_refund: registration.canRefund === true
+      }));
+    }
+    function adaptOperation(page) {
+      const operation = page.operation;
+      if (!operation || typeof operation !== "object") return null;
+      return {
+        kind: operation.kind,
+        status: operation.status,
+        label: operation.label,
+        processed: operation.processedCount,
+        total: operation.totalCount,
+        failed: operation.failedCount,
+        message: operation.message
+      };
+    }
     function adaptCalendar(page) {
       return {
         title: "Kalender Acara",
@@ -257,6 +299,10 @@ var require_page_adapter = __commonJS({
               rsvp_status: invitee.rsvpStatus,
               rsvp_label: invitee.rsvpLabel
             })),
+            // Kontrak v2: data pengelolaan initiator (tanpa kontak peserta).
+            invitations: adaptInvitations(page),
+            registrations: adaptRegistrations(page),
+            operation: adaptOperation(page),
             viewerRole: page.viewerRole
           };
         default:
@@ -1174,6 +1220,395 @@ function GatheringPlanSimulator({ plan, props }) {
     )
   );
 }
+function jakartaInputValue(value) {
+  const time = typeof value === "string" ? Date.parse(value) : Number.NaN;
+  return Number.isFinite(time) ? new Date(time + 7 * 3600 * 1e3).toISOString().slice(0, 16) : "";
+}
+function planDateTime(value) {
+  const date = formatCalendarDate(value);
+  const time = formatCalendarTime(value);
+  return date ? `${date}${time ? ` \xB7 ${time} WIB` : ""}` : "Belum ditentukan";
+}
+var invitationChannels = {
+  email: "Email",
+  whatsapp: "WhatsApp",
+  email_whatsapp: "Email & WhatsApp",
+  public: "Tautan terbuka"
+};
+function PlanOperationNotice({ operation, kinds }) {
+  if (!operation || !kinds.includes(operation.kind)) return null;
+  const failed = operation.status === "FAILED";
+  return h(
+    "p",
+    { className: `kumpul-plan-live-operation${failed ? " is-failed" : ""}`, role: "status" },
+    h("strong", null, failed ? `${operation.label} gagal` : `${operation.label}\u2026`),
+    ` ${Number(operation.processed) || 0}/${Number(operation.total) || 0} diproses`,
+    Number(operation.failed) ? ` \xB7 ${operation.failed} gagal` : "",
+    operation.message ? ` \xB7 ${operation.message}` : "",
+    failed ? null : " \xB7 muat ulang halaman untuk melihat progres terbaru."
+  );
+}
+function PlanSummaryFields({ plan, openedOptions }) {
+  const occurrence = plan.occurrence || {};
+  return h(
+    "div",
+    null,
+    h(
+      "dl",
+      { className: "kumpul-detail-fields" },
+      h("div", null, h("dt", null, "Nama rencana"), h("dd", null, text(plan.title, "Rencana gathering"))),
+      h("div", null, h("dt", null, "Akses peserta"), h("dd", null, plan.invite_policy === "INVITE_ONLY" ? "Khusus undangan" : "Terbuka")),
+      h("div", null, h("dt", null, "Batas reservasi"), h("dd", null, planDateTime(occurrence.rsvp_close_at))),
+      h("div", null, h("dt", null, "Batas pembayaran"), h("dd", null, planDateTime(occurrence.payment_deadline))),
+      h("div", null, h("dt", null, "Tanggal acara"), h("dd", null, planDateTime(occurrence.final_schedule))),
+      h("div", null, h("dt", null, "Pilihan dibuka"), h(
+        "dd",
+        null,
+        openedOptions.length ? openedOptions.map((option) => `${text(option.option_group_key, "Pilihan")} \xB7 ${text(option.label)}`).join(", ") : "Belum ada"
+      ))
+    )
+  );
+}
+function PlanPeopleList({ registrations, selectable, selectAction, props, rowActions }) {
+  if (!registrations.length) {
+    return h("p", { className: "kumpul-plan-sim-help" }, "Belum ada peserta yang mengonfirmasi kehadiran.");
+  }
+  return h(
+    "ul",
+    { className: "kumpul-plan-live-people" },
+    ...registrations.map((registration) => h(
+      "li",
+      { key: registration.key, className: "kumpul-plan-sim-person" },
+      h(
+        "div",
+        { className: "kumpul-plan-sim-person-heading" },
+        h(
+          "label",
+          { className: "kumpul-plan-live-person-name" },
+          selectable(registration) ? h("input", {
+            type: "checkbox",
+            "data-bagdja-selectable": "",
+            "data-bagdja-key": registration.key,
+            disabled: !intentEnabled(props, selectAction),
+            "aria-label": `Pilih ${text(registration.name, "peserta")}`
+          }) : null,
+          h("strong", null, text(registration.name, "Peserta"))
+        ),
+        h("span", null, [
+          registration.status_label,
+          list(registration.selected_options).join(", "),
+          Number.isFinite(Number(registration.invoice_amount)) ? formatCurrency(registration.invoice_amount) : ""
+        ].filter(Boolean).join(" \xB7 ")),
+        registration.rejection_message ? h("span", null, `Alasan: ${registration.rejection_message}`) : null
+      ),
+      rowActions ? h("div", { className: "kumpul-plan-live-row-actions" }, ...rowActions(registration)) : null
+    ))
+  );
+}
+function LivePlanWorkflow({ plan, props }) {
+  const page = props.kumpulPage || {};
+  const occurrence = plan.occurrence || {};
+  const options = list(occurrence.option_groups_snapshot);
+  const openedIds = new Set(list(occurrence.opened_option_ids_snapshot));
+  const openedOptions = options.filter((option) => openedIds.has(option.product_option_id));
+  const invitations = list(page.invitations);
+  const privateInvitations = invitations.filter((invitation) => invitation.channel !== "public");
+  const registrations = list(page.registrations);
+  const activeRegistrations = registrations.filter((registration) => registration.registration_status === "RSVP_CONFIRMED");
+  const paidRegistrations = activeRegistrations.filter((registration) => registration.payment_status === "PAID");
+  const operation = page.operation;
+  const stepIndex = gatheringWorkflowSteps.findIndex((step) => step.key === plan.workflow_step);
+  const finished = stepIndex < 0;
+  const currentIndex = finished ? gatheringWorkflowSteps.length - 1 : stepIndex;
+  const has = (action) => list(page.actions).includes(action);
+  const button = (action, label, extra = {}, className = "kumpul-plan-sim-primary") => h("button", {
+    type: "button",
+    className,
+    disabled: !intentEnabled(props, action),
+    ...intentAttributes(action, plan.key, extra)
+  }, label);
+  const minMax = `min. ${Number(occurrence.min_attendees) || 0} \xB7 maks. ${Number(occurrence.max_attendees) || 0}`;
+  const publicLink = plan.invite_policy === "OPEN" && plan.public_invitation_href ? h(
+    "p",
+    { className: "kumpul-plan-live-public" },
+    "Undangan terbuka: ",
+    h("a", { href: plan.public_invitation_href }, "Buka halaman undangan"),
+    " \u2014 bagikan tautan halaman tersebut ke calon peserta."
+  ) : null;
+  const planPanel = (editable) => editable && has("gathering.plan.save") ? h(
+    "div",
+    { "data-bagdja-scope": "" },
+    h("p", { className: "kumpul-plan-sim-help" }, "Tetapkan akses undangan, tenggat, tanggal acara, dan pilihan produk yang dibuka untuk peserta."),
+    h(
+      "div",
+      { className: "kumpul-plan-sim-form" },
+      h(
+        "label",
+        null,
+        "Nama rencana",
+        h("input", { type: "text", required: true, minLength: 3, maxLength: 255, defaultValue: text(plan.title), "data-bagdja-field": "title" })
+      ),
+      h(
+        "label",
+        null,
+        "Akses peserta",
+        h(
+          "select",
+          { defaultValue: plan.invite_policy === "INVITE_ONLY" ? "INVITE_ONLY" : "OPEN", "data-bagdja-field": "invitePolicy" },
+          h("option", { value: "OPEN" }, "Terbuka"),
+          h("option", { value: "INVITE_ONLY" }, "Khusus undangan")
+        )
+      )
+    ),
+    h(
+      "div",
+      { className: "kumpul-plan-sim-form kumpul-plan-live-dates" },
+      ...[
+        ["rsvpCloseAt", "Batas reservasi", occurrence.rsvp_close_at],
+        ["paymentDueAt", "Batas pembayaran", occurrence.payment_deadline],
+        ["scheduledAt", "Tanggal acara", occurrence.final_schedule]
+      ].map(([field, label, value]) => h(
+        "label",
+        { key: field },
+        `${label} (WIB)`,
+        h("input", { type: "datetime-local", defaultValue: jakartaInputValue(value), "data-bagdja-field": field })
+      ))
+    ),
+    h(
+      "fieldset",
+      { className: "kumpul-plan-sim-options" },
+      h("legend", null, "Pilihan dari produk yang dibuka"),
+      options.length ? options.map((option) => h(
+        "label",
+        { key: option.product_option_id, className: "kumpul-plan-sim-option" },
+        h("input", { type: "checkbox", value: option.product_option_id, defaultChecked: openedIds.has(option.product_option_id), "data-bagdja-field": "optionKeys" }),
+        h(
+          "span",
+          null,
+          h("strong", null, `${text(option.option_group_key, "Pilihan")} \xB7 ${text(option.label)}`),
+          option.venue_location || option.description ? h("small", null, [option.venue_location, option.description].filter(Boolean).join(" \xB7 ")) : null
+        )
+      )) : h("p", null, "Produk ini tidak memiliki pilihan.")
+    ),
+    h(
+      "div",
+      { className: "kumpul-plan-sim-actions" },
+      button("gathering.plan.save", "Simpan", {}, "kumpul-plan-sim-secondary"),
+      button("gathering.plan.save", "Submit & lanjut buat undangan", { "data-bagdja-submit": "true" })
+    )
+  ) : h(PlanSummaryFields, { plan, openedOptions });
+  const invitationsPanel = (editable) => h(
+    "div",
+    null,
+    h("p", { className: "kumpul-plan-sim-help" }, plan.invite_policy === "INVITE_ONLY" ? "Rencana khusus undangan: tambahkan calon peserta lewat email atau WhatsApp, lalu kirim undangan." : "Rencana terbuka: undangan publik dibuat saat undangan dikirim, lalu siapa pun dengan tautan bisa RSVP."),
+    publicLink,
+    editable && has("gathering.invitation.add") ? h(
+      "div",
+      { className: "kumpul-plan-sim-invite-form", "data-bagdja-scope": "" },
+      h("label", null, "Nama calon peserta", h("input", { type: "text", maxLength: 120, placeholder: "Nama peserta", "data-bagdja-field": "invitee.name" })),
+      h("label", null, "Email", h("input", { type: "email", maxLength: 254, placeholder: "nama@email.com", "data-bagdja-field": "invitee.email" })),
+      h("label", null, "WhatsApp", h("input", { type: "tel", maxLength: 20, placeholder: "+628123456789", "data-bagdja-field": "invitee.whatsapp" })),
+      button("gathering.invitation.add", "Tambah peserta", {}, "")
+    ) : null,
+    privateInvitations.length ? h(
+      "ul",
+      { className: "kumpul-plan-live-people" },
+      ...privateInvitations.map((invitation) => h(
+        "li",
+        { key: invitation.key, className: "kumpul-plan-sim-person" },
+        h(
+          "div",
+          { className: "kumpul-plan-sim-person-heading" },
+          h("strong", null, text(invitation.name, "Peserta")),
+          h("span", null, `${invitationChannels[invitation.channel] || "Undangan"} \xB7 ${text(invitation.status_label)}`)
+        ),
+        h(
+          "div",
+          { className: "kumpul-plan-live-row-actions" },
+          invitation.invite_href ? h("a", { href: invitation.invite_href }, "Lihat undangan") : null,
+          editable && invitation.can_revoke && has("gathering.invitation.revoke") ? h("button", {
+            type: "button",
+            disabled: !intentEnabled(props, "gathering.invitation.revoke"),
+            ...intentAttributes("gathering.invitation.revoke", plan.key, { "data-bagdja-target": invitation.key })
+          }, "Cabut") : null
+        )
+      ))
+    ) : plan.invite_policy === "INVITE_ONLY" ? h("p", { className: "kumpul-plan-sim-help" }, "Belum ada calon peserta.") : null,
+    h(PlanOperationNotice, { operation, kinds: ["INVITATION_DISPATCH", "INVITATION_REVOCATION"] }),
+    editable && has("gathering.invitations.submit") ? h("div", { className: "kumpul-plan-sim-actions" }, button("gathering.invitations.submit", "Kirim undangan")) : null
+  );
+  const confirmationPanel = (editable) => {
+    const canReject = editable && has("gathering.registrations.reject");
+    return h(
+      "div",
+      { "data-bagdja-scope": "" },
+      h("p", { className: "kumpul-plan-sim-help" }, `Peserta hadir ${activeRegistrations.length} (${minMax}). Jumlah harus memenuhi batas produk sebelum RSVP ditutup.`),
+      editable ? publicLink : null,
+      h(PlanPeopleList, {
+        registrations,
+        props,
+        selectAction: "gathering.registrations.reject",
+        selectable: (registration) => canReject && registration.can_reject
+      }),
+      canReject ? h(
+        "label",
+        { className: "kumpul-plan-live-reason" },
+        "Alasan penolakan untuk peserta terpilih",
+        h("textarea", { rows: 2, maxLength: 2e3, "data-bagdja-field": "message" })
+      ) : null,
+      editable && (canReject || has("gathering.reservations.confirm")) ? h(
+        "div",
+        { className: "kumpul-plan-sim-actions" },
+        canReject ? button("gathering.registrations.reject", "Tolak peserta terpilih", {}, "kumpul-plan-sim-secondary") : null,
+        has("gathering.reservations.confirm") ? button("gathering.reservations.confirm", "Tutup RSVP & buka pembayaran") : null
+      ) : null
+    );
+  };
+  const paymentPanel = (editable) => {
+    const canCheckout = editable && has("gathering.registrations.checkout");
+    const groups = [...new Set(openedOptions.map((option) => text(option.option_group_key, "Pilihan")))];
+    const deposit = Number(occurrence.deposit_amount_per_seat) || 0;
+    return h(
+      "div",
+      { "data-bagdja-scope": "" },
+      h(
+        "p",
+        { className: "kumpul-plan-sim-help" },
+        `Peserta lunas ${paidRegistrations.length} dari ${activeRegistrations.length} (${minMax}).`,
+        deposit ? ` DP ${formatCurrency(deposit * paidRegistrations.length)} dicairkan ke penyelenggara saat acara dikonfirmasi.` : ""
+      ),
+      h(PlanOperationNotice, { operation, kinds: ["INVOICE_ISSUANCE"] }),
+      h(PlanPeopleList, {
+        registrations: activeRegistrations,
+        props,
+        selectAction: "gathering.registrations.checkout",
+        selectable: (registration) => canCheckout && registration.can_checkout,
+        rowActions: editable ? (registration) => [
+          registration.can_cancel_checkout && has("gathering.registration.cancel_checkout") ? h("button", {
+            type: "button",
+            key: "cancel",
+            disabled: !intentEnabled(props, "gathering.registration.cancel_checkout"),
+            ...intentAttributes("gathering.registration.cancel_checkout", plan.key, { "data-bagdja-target": registration.key })
+          }, "Batalkan checkout") : null,
+          registration.can_refund && has("gathering.registration.refund") ? h("button", {
+            type: "button",
+            key: "refund",
+            disabled: !intentEnabled(props, "gathering.registration.refund"),
+            ...intentAttributes("gathering.registration.refund", plan.key, { "data-bagdja-target": registration.key })
+          }, "Refund") : null
+        ] : null
+      }),
+      editable && (canCheckout || has("gathering.invoices.resend")) ? h(
+        "div",
+        { className: "kumpul-plan-sim-actions" },
+        has("gathering.invoices.resend") ? button("gathering.invoices.resend", "Kirim ulang invoice", {}, "kumpul-plan-sim-secondary") : null,
+        canCheckout ? button("gathering.registrations.checkout", "Bayarkan peserta terpilih", {}, "kumpul-plan-sim-secondary") : null
+      ) : null,
+      h(
+        "fieldset",
+        { className: "kumpul-plan-sim-options" },
+        h("legend", null, "Opsi final gathering"),
+        groups.length ? groups.map((group) => h(
+          "div",
+          { key: group, className: "kumpul-plan-sim-final-group" },
+          h("strong", null, group),
+          ...openedOptions.filter((option) => text(option.option_group_key, "Pilihan") === group).map((option) => {
+            const votes = Number((occurrence.voting_results || {})[option.product_option_id]);
+            const voteLabel = Number.isFinite(votes) ? ` \xB7 ${votes} suara` : "";
+            return editable && has("gathering.event.confirm") ? h(
+              "label",
+              { key: option.product_option_id },
+              h("input", {
+                type: "radio",
+                name: `kumpul-final-${group}`,
+                value: option.product_option_id,
+                defaultChecked: option.is_final_selection === true,
+                "data-bagdja-field": "optionKeys"
+              }),
+              `${text(option.label)}${voteLabel}`
+            ) : h(
+              "p",
+              { key: option.product_option_id },
+              `${text(option.label)}${option.is_final_selection ? " \xB7 opsi final" : ""}${voteLabel}`
+            );
+          })
+        )) : h("p", null, "Tidak ada pilihan yang perlu ditetapkan.")
+      ),
+      editable && has("gathering.event.confirm") ? h("div", { className: "kumpul-plan-sim-actions" }, button("gathering.event.confirm", "Konfirmasi acara")) : null
+    );
+  };
+  const panels = [planPanel, invitationsPanel, confirmationPanel, paymentPanel];
+  return h(
+    "section",
+    {
+      className: "kumpul-plan-simulator kumpul-plan-live",
+      "aria-label": "Tahapan gathering",
+      "data-plan-live": "",
+      "data-current-step": finished ? "DONE" : plan.workflow_step
+    },
+    h(
+      "div",
+      { className: "kumpul-plan-simulator-heading" },
+      h(
+        "div",
+        null,
+        h("p", { className: "kumpul-eyebrow" }, "Kelola rencana"),
+        h("h2", null, finished ? "Rencana selesai diproses" : `Tahap ${currentIndex + 1}: ${gatheringWorkflowSteps[currentIndex].label}`),
+        h("p", null, "Klik tahap sebelumnya untuk melihat ringkasan yang sudah diisi.")
+      )
+    ),
+    h(
+      "ol",
+      { className: "kumpul-plan-sim-steps", "aria-label": "Tahapan gathering" },
+      ...gatheringWorkflowSteps.map((step, index) => h(
+        "li",
+        {
+          key: step.key,
+          className: finished || index < currentIndex ? "is-complete" : index === currentIndex ? "is-current" : ""
+        },
+        h(
+          "button",
+          {
+            type: "button",
+            "data-plan-step-tab": step.key,
+            "aria-current": index === currentIndex ? "step" : void 0,
+            "aria-pressed": index === currentIndex ? "true" : "false",
+            disabled: index > currentIndex
+          },
+          h("span", null, finished || index < currentIndex ? "\u2713" : String(index + 1)),
+          h("span", null, step.label)
+        )
+      ))
+    ),
+    ...gatheringWorkflowSteps.map((step, index) => {
+      const editable = !finished && index === currentIndex;
+      return h(
+        "div",
+        {
+          key: step.key,
+          className: "kumpul-plan-sim-panel",
+          "data-plan-step-panel": step.key,
+          hidden: index !== currentIndex
+        },
+        h("h3", null, `${index + 1}. ${step.label}`),
+        index < currentIndex || finished ? h("p", { className: "kumpul-plan-live-readonly" }, "Ringkasan tahap yang sudah dilewati \u2014 tidak dapat diubah.") : null,
+        panels[index](editable)
+      );
+    }),
+    has("gathering.cancel") ? h(
+      "details",
+      { className: "kumpul-plan-live-cancel", "data-bagdja-scope": "" },
+      h("summary", null, "Batalkan acara"),
+      h(
+        "label",
+        null,
+        "Alasan pembatalan (opsional)",
+        h("input", { type: "text", maxLength: 500, placeholder: "Dibatalkan oleh initiator", "data-bagdja-field": "reason" })
+      ),
+      button("gathering.cancel", "Batalkan acara", {}, "kumpul-plan-live-danger")
+    ) : null
+  );
+}
 function GatheringPlanDetailSection({ props, section }) {
   const sectionContent = section?.content || {};
   const plan = props.kumpulPage && props.kumpulPage.plan || sectionContent.gatheringPlan || {};
@@ -1221,26 +1656,7 @@ function GatheringPlanDetailSection({ props, section }) {
       "Preview desainer \xB7 data contoh saja. Status dan pengelolaan rencana dilakukan oleh host Bagdja."
     ) : null,
     props.isPreview === true ? h(GatheringPlanSimulator, { plan, props }) : null,
-    props.isPreview === true ? null : h(
-      "section",
-      { className: "kumpul-plan-workflow", "aria-label": "Tahapan gathering" },
-      h("p", { className: "kumpul-plan-current-step" }, "Tahap saat ini: ", h("strong", { "data-plan-current-step": "" }, currentStep)),
-      h(
-        "ol",
-        null,
-        ...gatheringWorkflowSteps.map((step, index) => h(
-          "li",
-          {
-            key: step.key,
-            className: index < currentStepIndex ? "is-complete" : index === currentStepIndex ? "is-current" : "",
-            "aria-current": index === currentStepIndex ? "step" : void 0
-          },
-          h("span", { className: "kumpul-plan-step-marker", "aria-hidden": "true" }, index < currentStepIndex ? "\u2713" : String(index + 1)),
-          h("span", null, step.label)
-        ))
-      ),
-      h("p", { className: "kumpul-plan-readonly" }, "Ringkasan ini hanya untuk melihat progres. Aksi rencana tersedia melalui host Bagdja.")
-    ),
+    props.isPreview === true ? null : h(LivePlanWorkflow, { plan, props }),
     h(
       "div",
       { className: "kumpul-plan-layout" },
@@ -1312,7 +1728,7 @@ function GatheringPlanDetailSection({ props, section }) {
         h("h2", null, "Status rencana"),
         h("span", { className: "kumpul-transaction-status kumpul-transaction-status-info" }, workflowStatus),
         h("p", null, "Tahap kerja \xB7 ", h("span", { "data-plan-aside-step": "" }, currentStep)),
-        h("p", null, "Rencana gathering dikelola terpisah dari keranjang. Pembayaran peserta hanya tersedia setelah tahap konfirmasi melalui host Bagdja."),
+        h("p", null, "Rencana gathering dikelola terpisah dari keranjang. Pembayaran peserta dibuka setelah RSVP ditutup di tahap Konfirmasi undangan."),
         order.id ? h("p", { className: "kumpul-plan-order-ref" }, `Referensi pesanan \xB7 ${order.id}`) : null,
         h("a", { className: "kumpul-plan-account-link", href: tenantPath(props, "/cart") }, "Kembali ke Keranjang")
       )
@@ -1395,10 +1811,11 @@ function BillingSection({ props }) {
           const title = text(isGathering ? invoice.gathering_title : invoice.productName, "Tagihan gathering");
           const reference = isGathering ? `${text(invoice.invoice_id, "Invoice")} \xB7 ${text(invoice.attendee_name, "Peserta")}` : `${text(invoice.label, "Termin pembayaran")} \xB7 ${text(invoice.anchorStepName, text(invoice.orderId, "Pesanan"))}`;
           const dueDate = invoice.payment_deadline || invoice.dueDate;
+          const cardHref = isGathering ? invoice.detail_href : invoice.transaction_href;
           return h(
             "article",
             {
-              className: `kumpul-billing-card kumpul-billing-card-${status}`,
+              className: `kumpul-billing-card kumpul-billing-card-${status}${cardHref ? " kumpul-billing-card-linked" : ""}`,
               "data-billing-item": "",
               "data-billing-status": status,
               key: invoice.id || index
@@ -1410,7 +1827,7 @@ function BillingSection({ props }) {
                 "div",
                 null,
                 h("span", { className: "kumpul-billing-kind" }, isGathering ? "Tagihan gathering" : `Termin ${invoice.sequence || ""}`.trim()),
-                h("h3", null, title),
+                h("h3", null, cardHref ? h("a", { className: "kumpul-billing-card-link", href: cardHref }, title) : title),
                 h("p", null, reference)
               ),
               h("span", { className: `kumpul-billing-status kumpul-billing-status-${statusInfo.tone}` }, statusInfo.label)
@@ -1898,7 +2315,8 @@ function CalendarSection({ props, section }) {
       title: text(plan.title, "Rencana gathering"),
       statusLabel: text(plan.status_label, calendarStatusLabels[plan.status] || "Status belum tersedia"),
       event_date: plan.event_date,
-      location: text(plan.event_location)
+      location: text(plan.event_location),
+      href: plan.detail_href
     })),
     ...invitations.filter((invitation) => calendarDateKey(invitation.event_date)).map((invitation) => ({
       id: invitation.id || invitation.plan_number,
@@ -1907,7 +2325,8 @@ function CalendarSection({ props, section }) {
       title: text(invitation.gathering_title, "Undangan gathering"),
       statusLabel: text(invitation.action_label, "Undangan diterima"),
       event_date: invitation.event_date,
-      location: text(invitation.event_location)
+      location: text(invitation.event_location),
+      href: invitation.detail_href
     }))
   ].sort((left, right) => new Date(left.event_date).getTime() - new Date(right.event_date).getTime());
   const initialMonth = calendarMonthKey(content.month, events[0]?.event_date);
@@ -2059,7 +2478,7 @@ function CalendarSection({ props, section }) {
             ...events.map((event, index) => h(
               "article",
               {
-                className: `kumpul-calendar-event kumpul-calendar-event-${event.type}`,
+                className: `kumpul-calendar-event kumpul-calendar-event-${event.type}${event.href ? " kumpul-calendar-event-linked" : ""}`,
                 "data-calendar-event": "",
                 "data-calendar-date": calendarDateKey(event.event_date),
                 hidden: calendarDateKey(event.event_date) !== selectedDate,
@@ -2070,7 +2489,7 @@ function CalendarSection({ props, section }) {
                 "div",
                 { className: "kumpul-calendar-event-copy" },
                 h("span", { className: "kumpul-calendar-event-kind" }, event.typeLabel),
-                h("h4", null, event.title),
+                h("h4", null, event.href ? h("a", { className: "kumpul-calendar-event-link", href: event.href }, event.title) : event.title),
                 h("p", null, `${event.statusLabel}${event.location ? ` \xB7 ${event.location}` : ""}`)
               )
             )),
@@ -2500,11 +2919,11 @@ function styles(colors) {
     @media(max-width:760px){.kumpul-cart-layout{grid-template-columns:1fr;gap:15px}.kumpul-cart-item{grid-template-columns:20px 52px minmax(0,1fr);gap:10px;padding:12px}.kumpul-cart-art{width:52px;height:52px;border-radius:12px;font-size:23px}.kumpul-cart-copy h2{font-size:11px}.kumpul-cart-item-controls{grid-column:3;min-width:0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px}.kumpul-cart-price{margin-right:auto;font-size:12px}.kumpul-cart-summary{position:static}.kumpul-cart-heading h1{font-size:32px}}
     .kumpul-transactions{max-width:980px;margin:0 auto}.kumpul-transactions-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.kumpul-transactions-heading h1{margin:0;color:var(--kt-text);font-size:clamp(30px,4vw,42px);line-height:1.15;letter-spacing:-.04em}.kumpul-transactions-heading>div:first-child>p:last-child{margin:9px 0 0;color:var(--kt-muted);font-size:13px}.kumpul-transactions-total{padding:13px 16px;display:grid;gap:2px;border:1px solid var(--kt-border);border-radius:15px;background:var(--kt-surface)}.kumpul-transactions-total strong{font-size:21px;line-height:1.1}.kumpul-transactions-total span{color:var(--kt-muted);font-size:10px}.kumpul-transactions-preview-note{margin:20px 0 0;padding:11px 14px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-surface);color:var(--kt-muted);font-size:11px}.kumpul-transactions-filters{margin:25px 0 22px;padding-bottom:7px;display:flex;gap:8px;overflow-x:auto;border-bottom:1px solid var(--kt-border);scrollbar-width:thin}.kumpul-transactions-filters button{padding:9px 12px;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:11px 11px 0 0;background:transparent;color:var(--kt-muted);font:inherit;font-size:11px;font-weight:700;white-space:nowrap;cursor:pointer}.kumpul-transactions-filters button[aria-pressed=true]{border-color:var(--kt-border);border-bottom-color:var(--kt-surface);background:var(--kt-surface);color:var(--kt-accent)}.kumpul-transactions-filters button span{min-width:20px;height:20px;padding:2px 6px;display:grid;place-items:center;border-radius:99px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px}.kumpul-transactions-list{display:grid;gap:12px}.kumpul-transaction-card{overflow:hidden;border:1px solid var(--kt-border);border-radius:16px;background:var(--kt-surface)}.kumpul-transaction-top{padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e8f0f2}.kumpul-transaction-top>div{display:flex;align-items:center;gap:8px;color:var(--kt-muted);font-size:10px}.kumpul-transaction-ref{color:var(--kt-text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:750}.kumpul-transaction-status{padding:6px 9px;flex:none;border-radius:99px;font-size:9px;font-weight:800}.kumpul-transaction-status-warning{background:#fff4da;color:#a15c00}.kumpul-transaction-status-info{background:#e8f2ff;color:#2563eb}.kumpul-transaction-status-success{background:#e5f7ef;color:#08734f}.kumpul-transaction-status-danger{background:#ffeded;color:#b91c1c}.kumpul-transaction-status-muted{background:#eef1f4;color:#64748b}.kumpul-transaction-body{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px}.kumpul-transaction-item{min-width:0;display:flex;align-items:center;gap:13px}.kumpul-transaction-art{width:58px;height:58px;flex:none;display:grid;place-items:center;border:1px solid var(--kt-border);border-radius:14px;background:var(--kt-bg);color:var(--kt-accent);font-size:26px}.kumpul-transaction-item>div{min-width:0}.kumpul-transaction-item h2{margin:0;font-size:13px}.kumpul-transaction-item p{margin:5px 0 0;color:var(--kt-muted);font-size:10px}.kumpul-transaction-total{flex:none;text-align:right}.kumpul-transaction-total span{display:block;color:var(--kt-muted);font-size:10px}.kumpul-transaction-total strong{display:block;margin-top:3px;font-size:16px}.kumpul-transaction-actions{padding:0 18px 15px;display:flex;justify-content:flex-end;gap:8px}.kumpul-transaction-actions button{min-height:34px;padding:7px 11px;border:1px solid var(--kt-border);border-radius:10px;background:var(--kt-surface);color:var(--kt-text);font:inherit;font-size:9px;font-weight:750;opacity:.62;cursor:not-allowed}.kumpul-transaction-actions button:disabled{opacity:.62}.kumpul-transactions-empty{margin:0;padding:32px 18px;border:1px dashed var(--kt-border);border-radius:15px;color:var(--kt-muted);font-size:12px;text-align:center}
     @media(max-width:700px){.kumpul-transactions-heading{align-items:flex-start;flex-direction:column;gap:16px}.kumpul-transactions-total{width:100%;padding:11px 13px}.kumpul-transactions-total strong{font-size:18px}.kumpul-transactions-filters{margin-top:20px}.kumpul-transaction-top{align-items:flex-start;padding:12px 14px}.kumpul-transaction-top>div{flex-wrap:wrap;gap:5px;font-size:9px}.kumpul-transaction-status{max-width:120px;white-space:normal;text-align:center}.kumpul-transaction-body{align-items:flex-start;padding:14px;gap:10px}.kumpul-transaction-art{width:44px;height:44px;border-radius:12px;font-size:20px}.kumpul-transaction-item{gap:9px}.kumpul-transaction-item h2{font-size:11px}.kumpul-transaction-total strong{font-size:13px}.kumpul-transaction-actions{padding:0 14px 13px;flex-wrap:wrap}.kumpul-transaction-actions button,.kumpul-transaction-actions .kumpul-transaction-action-link{flex:1;padding:7px 8px;font-size:8px}}
-    .kumpul-billing{max-width:980px;margin:0 auto}.kumpul-billing-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.kumpul-billing-heading h1{margin:0;color:var(--kt-text);font-size:clamp(30px,4vw,42px);line-height:1.15;letter-spacing:-.04em}.kumpul-billing-description{margin:9px 0 0;color:var(--kt-muted);font-size:13px}.kumpul-billing-summary{display:flex;gap:10px}.kumpul-billing-summary-card{min-width:132px;padding:13px 16px;display:grid;gap:2px;border:1px solid var(--kt-border);border-radius:15px;background:var(--kt-surface)}.kumpul-billing-summary-card strong{font-size:21px;line-height:1.1}.kumpul-billing-summary-card span{color:var(--kt-muted);font-size:10px}.kumpul-billing-preview-note{margin:20px 0 0;padding:11px 14px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-surface);color:var(--kt-muted);font-size:11px}.kumpul-billing-filters{margin:25px 0 22px;padding-bottom:7px;display:flex;gap:8px;overflow-x:auto;border-bottom:1px solid var(--kt-border);scrollbar-width:thin}.kumpul-billing-filters button{padding:9px 12px;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:11px 11px 0 0;background:transparent;color:var(--kt-muted);font:inherit;font-size:11px;font-weight:700;white-space:nowrap;cursor:pointer}.kumpul-billing-filters button[aria-pressed=true]{border-color:var(--kt-border);border-bottom-color:var(--kt-surface);background:var(--kt-surface);color:var(--kt-accent)}.kumpul-billing-filters button span{min-width:20px;height:20px;padding:2px 6px;display:grid;place-items:center;border-radius:99px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px}.kumpul-billing-results-heading{margin-bottom:12px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}.kumpul-billing-results-heading h2{margin:0;font-size:16px}.kumpul-billing-results-heading span{color:var(--kt-muted);font-size:11px}.kumpul-billing-list{display:grid;gap:12px}.kumpul-billing-card{overflow:hidden;border:1px solid var(--kt-border);border-radius:16px;background:var(--kt-surface)}.kumpul-billing-card-top{padding:17px 19px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-bottom:1px solid #e8f0f2}.kumpul-billing-kind{color:var(--kt-accent);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.kumpul-billing-card h3{margin:4px 0 0;font-size:14px}.kumpul-billing-card-top p{margin:5px 0 0;color:var(--kt-muted);font-size:10px}.kumpul-billing-status{padding:6px 9px;flex:none;border-radius:99px;font-size:9px;font-weight:800}.kumpul-billing-status-warning{background:#fff4da;color:#a15c00}.kumpul-billing-status-success{background:#e5f7ef;color:#08734f}.kumpul-billing-status-muted{background:#eef1f4;color:#64748b}.kumpul-billing-card-bottom{padding:14px 19px;display:flex;align-items:center;justify-content:space-between;gap:16px}.kumpul-billing-card-bottom strong{font-size:17px;color:var(--kt-accent)}.kumpul-billing-card-bottom p{margin:4px 0 0;color:var(--kt-muted);font-size:10px}.kumpul-billing-action{min-height:36px;padding:8px 13px;border:0;border-radius:10px;background:var(--kt-accent);color:#fff;font:inherit;font-size:10px;font-weight:750;opacity:.62;cursor:not-allowed}.kumpul-billing-empty{margin:0;padding:32px 18px;border:1px dashed var(--kt-border);border-radius:15px;color:var(--kt-muted);font-size:12px;text-align:center}
+    .kumpul-billing{max-width:980px;margin:0 auto}.kumpul-billing-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.kumpul-billing-heading h1{margin:0;color:var(--kt-text);font-size:clamp(30px,4vw,42px);line-height:1.15;letter-spacing:-.04em}.kumpul-billing-description{margin:9px 0 0;color:var(--kt-muted);font-size:13px}.kumpul-billing-summary{display:flex;gap:10px}.kumpul-billing-summary-card{min-width:132px;padding:13px 16px;display:grid;gap:2px;border:1px solid var(--kt-border);border-radius:15px;background:var(--kt-surface)}.kumpul-billing-summary-card strong{font-size:21px;line-height:1.1}.kumpul-billing-summary-card span{color:var(--kt-muted);font-size:10px}.kumpul-billing-preview-note{margin:20px 0 0;padding:11px 14px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-surface);color:var(--kt-muted);font-size:11px}.kumpul-billing-filters{margin:25px 0 22px;padding-bottom:7px;display:flex;gap:8px;overflow-x:auto;border-bottom:1px solid var(--kt-border);scrollbar-width:thin}.kumpul-billing-filters button{padding:9px 12px;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:11px 11px 0 0;background:transparent;color:var(--kt-muted);font:inherit;font-size:11px;font-weight:700;white-space:nowrap;cursor:pointer}.kumpul-billing-filters button[aria-pressed=true]{border-color:var(--kt-border);border-bottom-color:var(--kt-surface);background:var(--kt-surface);color:var(--kt-accent)}.kumpul-billing-filters button span{min-width:20px;height:20px;padding:2px 6px;display:grid;place-items:center;border-radius:99px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px}.kumpul-billing-results-heading{margin-bottom:12px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}.kumpul-billing-results-heading h2{margin:0;font-size:16px}.kumpul-billing-results-heading span{color:var(--kt-muted);font-size:11px}.kumpul-billing-list{display:grid;gap:12px}.kumpul-billing-card{overflow:hidden;border:1px solid var(--kt-border);border-radius:16px;background:var(--kt-surface)}.kumpul-billing-card-top{padding:17px 19px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-bottom:1px solid #e8f0f2}.kumpul-billing-kind{color:var(--kt-accent);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.kumpul-billing-card h3{margin:4px 0 0;font-size:14px}.kumpul-billing-card-linked{position:relative;transition:border-color .15s,box-shadow .15s}.kumpul-billing-card-linked:hover{border-color:var(--kt-accent);box-shadow:0 8px 22px rgba(15,23,42,.06)}.kumpul-billing-card-linked:focus-within{border-color:var(--kt-accent)}.kumpul-billing-card-link{color:inherit;text-decoration:none;outline:none}.kumpul-billing-card-link::after{content:'';position:absolute;inset:0;z-index:0;border-radius:inherit}.kumpul-billing-card-linked .kumpul-billing-status,.kumpul-billing-card-linked .kumpul-billing-action{position:relative;z-index:1}.kumpul-billing-card-top p{margin:5px 0 0;color:var(--kt-muted);font-size:10px}.kumpul-billing-status{padding:6px 9px;flex:none;border-radius:99px;font-size:9px;font-weight:800}.kumpul-billing-status-warning{background:#fff4da;color:#a15c00}.kumpul-billing-status-success{background:#e5f7ef;color:#08734f}.kumpul-billing-status-muted{background:#eef1f4;color:#64748b}.kumpul-billing-card-bottom{padding:14px 19px;display:flex;align-items:center;justify-content:space-between;gap:16px}.kumpul-billing-card-bottom strong{font-size:17px;color:var(--kt-accent)}.kumpul-billing-card-bottom p{margin:4px 0 0;color:var(--kt-muted);font-size:10px}.kumpul-billing-action{min-height:36px;padding:8px 13px;border:0;border-radius:10px;background:var(--kt-accent);color:#fff;font:inherit;font-size:10px;font-weight:750;opacity:.62;cursor:not-allowed}.kumpul-billing-empty{margin:0;padding:32px 18px;border:1px dashed var(--kt-border);border-radius:15px;color:var(--kt-muted);font-size:12px;text-align:center}
     @media(max-width:700px){.kumpul-billing-heading{align-items:flex-start;flex-direction:column;gap:16px}.kumpul-billing-summary{width:100%}.kumpul-billing-summary-card{min-width:0;flex:1;padding:11px 13px}.kumpul-billing-summary-card strong{font-size:18px}.kumpul-billing-filters{margin-top:20px}.kumpul-billing-card-top{padding:15px;gap:10px}.kumpul-billing-card h3{font-size:13px}.kumpul-billing-status{max-width:120px;white-space:normal;text-align:center}.kumpul-billing-card-bottom{padding:13px 15px}.kumpul-billing-card-bottom strong{font-size:15px}}
     .kumpul-calendar-agenda:not([open]){display:none}.kumpul-calendar-agenda[open]{position:fixed;inset:50% auto auto 50%;z-index:10;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 48px);margin:0;padding:0;display:flex;flex-direction:column;transform:translate(-50%,-50%);overflow:hidden;border:1px solid var(--kt-border);border-radius:22px;background:var(--kt-bg);color:var(--kt-text);box-shadow:0 24px 80px #0f172a45}.kumpul-calendar-agenda::backdrop{background:rgb(15 23 42 / 45%);backdrop-filter:blur(2px)}.kumpul-calendar-agenda-handle{display:none}.kumpul-calendar-agenda-heading{padding:22px 24px 16px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-bottom:1px solid var(--kt-border)}.kumpul-calendar-agenda-heading .kumpul-eyebrow{margin:0 0 4px}.kumpul-calendar-agenda-heading h2{margin:0;font-size:20px;text-transform:capitalize}.kumpul-calendar-agenda-close{width:36px;height:36px;flex:none;border:1px solid var(--kt-border);border-radius:50%;background:var(--kt-surface);color:var(--kt-text);font:inherit;font-size:22px;line-height:1;cursor:pointer}.kumpul-calendar-agenda-content{min-height:0;padding:18px 24px 24px;overflow:auto;overscroll-behavior:contain}.kumpul-calendar-agenda-list{display:grid;gap:10px}.kumpul-calendar-empty{margin:0;padding:18px;border:1px dashed var(--kt-border);border-radius:14px;color:var(--kt-muted);font-size:13px;text-align:center}
     @media(max-width:620px){.kumpul-calendar-agenda[open]{inset:auto 0 0;width:100%;max-width:none;max-height:min(84dvh,720px);padding-bottom:env(safe-area-inset-bottom);transform:none;border-right:0;border-bottom:0;border-left:0;border-radius:22px 22px 0 0}.kumpul-calendar-agenda-handle{width:38px;height:4px;margin:10px auto 0;display:block;border-radius:99px;background:#cbd5e1}.kumpul-calendar-agenda-heading{padding:14px 20px 14px}.kumpul-calendar-agenda-content{padding:16px 20px 22px}.kumpul-calendar-agenda-close{width:34px;height:34px}}
-    .kumpul-calendar-month-toolbar{margin:22px 0 14px;padding:17px 19px;display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--kt-border);border-radius:17px;background:var(--kt-surface)}.kumpul-calendar-month-title h2{margin:0;font-size:20px;line-height:1.2;text-transform:capitalize}.kumpul-calendar-month-title p{margin:5px 0 0;color:var(--kt-muted);font-size:11px}.kumpul-calendar-month-actions{display:flex;align-items:center;gap:7px}.kumpul-calendar-month-actions button{min-width:38px;height:38px;padding:7px 11px;border:1px solid var(--kt-border);border-radius:11px;background:var(--kt-surface);color:var(--kt-text);font:inherit;font-size:12px;font-weight:700;cursor:pointer}.kumpul-calendar-month-actions button[data-calendar-previous],.kumpul-calendar-month-actions button[data-calendar-next]{font-size:22px;line-height:1}.kumpul-calendar-month-view{overflow:hidden;border:1px solid var(--kt-border);border-radius:17px;background:var(--kt-surface)}.kumpul-calendar-weekdays,.kumpul-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.kumpul-calendar-weekdays{border-bottom:1px solid var(--kt-border);background:#f8fbfc}.kumpul-calendar-weekdays span{padding:10px 6px;color:var(--kt-muted);font-size:10px;font-weight:750;text-align:center}.kumpul-calendar-day{position:relative;min-width:0;min-height:77px;padding:9px;display:flex;align-items:flex-start;justify-content:space-between;gap:4px;border:0;border-right:1px solid #e8f0f2;border-bottom:1px solid #e8f0f2;background:var(--kt-surface);color:var(--kt-text);font:inherit;text-align:left;cursor:pointer}.kumpul-calendar-day:nth-child(7n){border-right:0}.kumpul-calendar-day:nth-last-child(-n+7){border-bottom:0}.kumpul-calendar-day:hover{background:#f4fafb}.kumpul-calendar-day[aria-pressed=true]{background:#e6f4f6;box-shadow:inset 0 0 0 2px var(--kt-accent)}.kumpul-calendar-day[data-outside-month=true]{color:#a7b3bd;background:#fbfcfd}.kumpul-calendar-day>span{font-size:11px;font-weight:700}.kumpul-calendar-day small{min-width:19px;height:19px;padding:2px 5px;display:grid;place-items:center;border-radius:999px;background:var(--kt-accent);color:#fff;font-size:9px;font-weight:800}.kumpul-calendar-day:focus-visible,.kumpul-calendar-month-actions button:focus-visible{position:relative;z-index:1;outline:3px solid var(--kt-success);outline-offset:-3px}.kumpul-calendar-agenda{margin-top:24px}.kumpul-calendar-agenda>h3{margin:0 0 12px;font-size:16px;text-transform:capitalize}.kumpul-calendar-event{padding:14px 16px;display:grid;grid-template-columns:76px 1fr;align-items:start;gap:14px;border:1px solid var(--kt-border);border-left:4px solid var(--kt-accent);border-radius:14px;background:var(--kt-surface)}.kumpul-calendar-event[hidden]{display:none}.kumpul-calendar-event-invitation{border-left-color:var(--kt-success)}.kumpul-calendar-event-time{padding-top:2px;color:var(--kt-accent);font-size:11px;font-weight:800}.kumpul-calendar-event-copy{min-width:0}.kumpul-calendar-event-kind{color:var(--kt-muted);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.kumpul-calendar-event-copy h4{margin:3px 0 0;font-size:13px}.kumpul-calendar-event-copy p{margin:4px 0 0;color:var(--kt-muted);font-size:10px}
+    .kumpul-calendar-month-toolbar{margin:22px 0 14px;padding:17px 19px;display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--kt-border);border-radius:17px;background:var(--kt-surface)}.kumpul-calendar-month-title h2{margin:0;font-size:20px;line-height:1.2;text-transform:capitalize}.kumpul-calendar-month-title p{margin:5px 0 0;color:var(--kt-muted);font-size:11px}.kumpul-calendar-month-actions{display:flex;align-items:center;gap:7px}.kumpul-calendar-month-actions button{min-width:38px;height:38px;padding:7px 11px;border:1px solid var(--kt-border);border-radius:11px;background:var(--kt-surface);color:var(--kt-text);font:inherit;font-size:12px;font-weight:700;cursor:pointer}.kumpul-calendar-month-actions button[data-calendar-previous],.kumpul-calendar-month-actions button[data-calendar-next]{font-size:22px;line-height:1}.kumpul-calendar-month-view{overflow:hidden;border:1px solid var(--kt-border);border-radius:17px;background:var(--kt-surface)}.kumpul-calendar-weekdays,.kumpul-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.kumpul-calendar-weekdays{border-bottom:1px solid var(--kt-border);background:#f8fbfc}.kumpul-calendar-weekdays span{padding:10px 6px;color:var(--kt-muted);font-size:10px;font-weight:750;text-align:center}.kumpul-calendar-day{position:relative;min-width:0;min-height:77px;padding:9px;display:flex;align-items:flex-start;justify-content:space-between;gap:4px;border:0;border-right:1px solid #e8f0f2;border-bottom:1px solid #e8f0f2;background:var(--kt-surface);color:var(--kt-text);font:inherit;text-align:left;cursor:pointer}.kumpul-calendar-day:nth-child(7n){border-right:0}.kumpul-calendar-day:nth-last-child(-n+7){border-bottom:0}.kumpul-calendar-day:hover{background:#f4fafb}.kumpul-calendar-day[aria-pressed=true]{background:#e6f4f6;box-shadow:inset 0 0 0 2px var(--kt-accent)}.kumpul-calendar-day[data-outside-month=true]{color:#a7b3bd;background:#fbfcfd}.kumpul-calendar-day>span{font-size:11px;font-weight:700}.kumpul-calendar-day small{min-width:19px;height:19px;padding:2px 5px;display:grid;place-items:center;border-radius:999px;background:var(--kt-accent);color:#fff;font-size:9px;font-weight:800}.kumpul-calendar-day:focus-visible,.kumpul-calendar-month-actions button:focus-visible{position:relative;z-index:1;outline:3px solid var(--kt-success);outline-offset:-3px}.kumpul-calendar-agenda{margin-top:24px}.kumpul-calendar-agenda>h3{margin:0 0 12px;font-size:16px;text-transform:capitalize}.kumpul-calendar-event{padding:14px 16px;display:grid;grid-template-columns:76px 1fr;align-items:start;gap:14px;border:1px solid var(--kt-border);border-left:4px solid var(--kt-accent);border-radius:14px;background:var(--kt-surface)}.kumpul-calendar-event[hidden]{display:none}.kumpul-calendar-event-linked{position:relative;transition:border-color .15s,box-shadow .15s}.kumpul-calendar-event-linked:hover,.kumpul-calendar-event-linked:focus-within{border-color:var(--kt-accent);box-shadow:0 8px 22px rgba(15,23,42,.06)}.kumpul-calendar-event-link{color:inherit;text-decoration:none;outline:none}.kumpul-calendar-event-link::after{content:'';position:absolute;inset:0;border-radius:inherit}.kumpul-calendar-event-invitation{border-left-color:var(--kt-success)}.kumpul-calendar-event-time{padding-top:2px;color:var(--kt-accent);font-size:11px;font-weight:800}.kumpul-calendar-event-copy{min-width:0}.kumpul-calendar-event-kind{color:var(--kt-muted);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.kumpul-calendar-event-copy h4{margin:3px 0 0;font-size:13px}.kumpul-calendar-event-copy p{margin:4px 0 0;color:var(--kt-muted);font-size:10px}
     @media(max-width:620px){.kumpul-calendar-month-toolbar{padding:13px;align-items:flex-start}.kumpul-calendar-month-title h2{font-size:17px}.kumpul-calendar-month-title p{max-width:170px;font-size:9px}.kumpul-calendar-month-actions{gap:4px}.kumpul-calendar-month-actions button{min-width:33px;height:34px;padding:5px 8px;font-size:10px}.kumpul-calendar-weekdays span{padding:8px 2px;font-size:9px}.kumpul-calendar-day{min-height:55px;padding:6px 5px}.kumpul-calendar-day>span{font-size:10px}.kumpul-calendar-day small{min-width:16px;height:16px;padding:1px 4px;font-size:8px}.kumpul-calendar-event{grid-template-columns:52px 1fr;gap:9px;padding:12px}.kumpul-calendar-event-time{font-size:10px}}
     @media(max-width:620px){.kumpul-calendar-tabs{overflow-x:auto}.kumpul-calendar-tabs button{flex:none;white-space:nowrap}}
     .kumpul-template{--kt-bg:${colors.background};--kt-surface:${colors.surface};--kt-text:${colors.text};--kt-muted:${colors.textMuted};--kt-accent:${colors.accent};--kt-hover:${colors.accentHover};--kt-border:${colors.border};--kt-success:${colors.success};--kt-warning:${colors.warning};min-height:100vh;background:var(--kt-bg);color:var(--kt-text);font:400 15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
@@ -2542,7 +2961,7 @@ function styles(colors) {
     .kumpul-footer{padding:26px 28px;display:flex;justify-content:space-between;gap:14px;border-top:1px solid var(--kt-border);color:var(--kt-muted);font-size:11px}.kumpul-footer strong{color:var(--kt-text)}.kumpul-mobile-dock{display:none}
     .kumpul-detail-page{max-width:980px;margin:0 auto}.kumpul-detail-back{display:inline-block;margin-bottom:20px;color:var(--kt-accent);font-size:11px;font-weight:750}.kumpul-detail-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.kumpul-detail-heading h1{margin:0;color:var(--kt-text);font-size:clamp(28px,4vw,40px);line-height:1.15;letter-spacing:-.04em}.kumpul-detail-heading .kumpul-eyebrow{margin-bottom:8px}.kumpul-detail-heading>div>p:last-child{margin:8px 0 0;color:var(--kt-muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.kumpul-detail-preview-note{margin:18px 0 0;padding:11px 14px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-surface);color:var(--kt-muted);font-size:10px}.kumpul-detail-layout{margin-top:22px;display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:start;gap:18px}.kumpul-detail-main{display:grid;gap:14px}.kumpul-detail-card{min-width:0;padding:20px;border:1px solid var(--kt-border);border-radius:17px;background:var(--kt-surface)}.kumpul-detail-card h2{margin:0 0 16px;font-size:14px}.kumpul-detail-fields{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.kumpul-detail-fields>div{min-width:0}.kumpul-detail-fields dt,.kumpul-detail-totals dt{color:var(--kt-muted);font-size:9px}.kumpul-detail-fields dd,.kumpul-detail-totals dd{margin:4px 0 0;font-size:11px;font-weight:700;overflow-wrap:anywhere}.kumpul-detail-total{margin-top:20px;padding-top:16px;display:flex;align-items:baseline;justify-content:space-between;gap:12px;border-top:1px solid var(--kt-border);color:var(--kt-muted);font-size:11px}.kumpul-detail-total strong{color:var(--kt-accent);font-size:22px}.kumpul-detail-aside{position:sticky;top:20px}.kumpul-detail-aside>p{margin:13px 0 0;color:var(--kt-muted);font-size:10px;line-height:1.6}.kumpul-detail-aside>button{width:100%;min-height:42px;margin-top:16px;padding:10px;border:0;border-radius:11px;background:var(--kt-accent);color:#fff;font:inherit;font-size:11px;font-weight:800;opacity:.55;cursor:not-allowed}.kumpul-detail-login-info{margin-top:15px;padding:13px;border-left:3px solid var(--kt-accent);background:var(--kt-bg)}.kumpul-detail-login-info h3{margin:0;font-size:11px}.kumpul-detail-login-info p{margin:7px 0 0;color:var(--kt-muted);font-size:10px;line-height:1.6}.kumpul-detail-items{display:grid}.kumpul-detail-item{padding:13px 0;display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;border-top:1px solid var(--kt-border)}.kumpul-detail-item-art{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--kt-border);border-radius:13px;background:var(--kt-bg);color:var(--kt-accent);font-size:20px;font-weight:800}.kumpul-detail-item-copy{min-width:0}.kumpul-detail-item h3{margin:0;font-size:11px}.kumpul-detail-item p{margin:5px 0 0;color:var(--kt-muted);font-size:9px}.kumpul-detail-item>strong{font-size:10px;white-space:nowrap}.kumpul-detail-escrow-note{display:block;margin-top:5px;color:var(--kt-accent);font-size:8px;line-height:1.5}.kumpul-detail-address{margin:0;color:var(--kt-muted);font-size:11px;line-height:1.6}.kumpul-detail-totals{margin:0;display:grid;gap:12px}.kumpul-detail-totals>div{display:flex;justify-content:space-between;gap:12px}.kumpul-detail-totals dd{margin:0;text-align:right}.kumpul-detail-grand-total{padding-top:13px;border-top:1px solid var(--kt-border)}.kumpul-detail-grand-total dt{color:var(--kt-text);font-weight:800}.kumpul-detail-grand-total dd{color:var(--kt-accent);font-size:16px}.kumpul-detail-payment-fields{margin-top:17px;padding-top:14px;border-top:1px solid var(--kt-border)}.kumpul-detail-fields .kumpul-detail-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px}.kumpul-detail-payment-note{padding:10px 12px;border:1px solid var(--kt-border);border-radius:11px;background:var(--kt-bg)}
     .kumpul-plan-detail{max-width:980px;margin:0 auto}.kumpul-plan-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.kumpul-plan-heading h1{margin:0;color:var(--kt-text);font-size:clamp(28px,4vw,40px);line-height:1.15;letter-spacing:-.04em}.kumpul-plan-heading .kumpul-eyebrow{margin-bottom:8px}.kumpul-plan-number{margin:9px 0 0;color:var(--kt-muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.kumpul-plan-workflow{margin-top:20px;padding:17px;border:1px solid var(--kt-border);border-radius:16px;background:var(--kt-surface)}.kumpul-plan-current-step{margin:0 0 14px;color:var(--kt-muted);font-size:10px}.kumpul-plan-current-step strong{color:var(--kt-text)}.kumpul-plan-workflow ol{margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none}.kumpul-plan-workflow li{min-width:0;padding:12px 9px 0;display:flex;align-items:center;gap:7px;border-top:2px solid var(--kt-border);color:var(--kt-muted);font-size:9px;font-weight:700}.kumpul-plan-workflow li.is-complete,.kumpul-plan-workflow li.is-current{border-color:var(--kt-accent);color:var(--kt-text)}.kumpul-plan-step-marker{width:21px;height:21px;flex:none;display:grid;place-items:center;border:1px solid var(--kt-border);border-radius:50%;font-size:9px}.kumpul-plan-workflow li.is-complete .kumpul-plan-step-marker,.kumpul-plan-workflow li.is-current .kumpul-plan-step-marker{border-color:var(--kt-accent);background:var(--kt-accent);color:#fff}.kumpul-plan-readonly{margin:12px 0 0;color:var(--kt-muted);font-size:9px;line-height:1.5}.kumpul-plan-layout{margin-top:16px;display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:16px}.kumpul-plan-main{display:grid;gap:14px}.kumpul-plan-options{margin:0;padding:0;display:grid;list-style:none}.kumpul-plan-options li{padding:13px 0;border-top:1px solid var(--kt-border)}.kumpul-plan-option-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.kumpul-plan-option-group{color:var(--kt-muted);font-size:8px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.kumpul-plan-option-heading h3{margin:3px 0 0;font-size:11px}.kumpul-plan-options li>p{margin:6px 0 0;color:var(--kt-muted);font-size:9px;line-height:1.5}.kumpul-plan-final-option{padding:5px 8px;border:1px solid var(--kt-accent);border-radius:99px;color:var(--kt-accent);font-size:8px;font-weight:800;white-space:nowrap}.kumpul-plan-votes{display:inline-block;margin-top:8px;color:var(--kt-accent);font-size:9px;font-weight:750}.kumpul-plan-empty-options{margin:0;color:var(--kt-muted);font-size:10px}.kumpul-plan-aside>p{margin:13px 0 0;color:var(--kt-muted);font-size:10px;line-height:1.6}.kumpul-plan-order-ref{overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8px!important}.kumpul-plan-account-link{margin-top:16px;padding:10px 12px;display:block;border:1px solid var(--kt-border);border-radius:10px;color:var(--kt-accent);font-size:10px;font-weight:800;text-align:center}
-    .kumpul-plan-simulator{margin-top:18px;padding:20px;border:1px solid var(--kt-border);border-radius:18px;background:var(--kt-surface);box-shadow:0 8px 26px #0f172a0a}.kumpul-plan-simulator-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.kumpul-plan-simulator-heading h2{margin:0;font-size:19px;letter-spacing:-.025em}.kumpul-plan-simulator-heading .kumpul-eyebrow{margin-bottom:7px}.kumpul-plan-simulator-heading>div>p:last-child{margin:7px 0 0;color:var(--kt-muted);font-size:10px;line-height:1.55}.kumpul-plan-simulation-badge{padding:6px 9px;flex:none;border-radius:99px;background:#e6f4f6;color:var(--kt-accent);font-size:8px;font-weight:800}.kumpul-plan-simulation-note{margin:15px 0;padding:10px 12px;border:1px solid var(--kt-border);border-radius:10px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px;line-height:1.55}.kumpul-plan-sim-steps{margin:17px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none}.kumpul-plan-sim-steps li{min-width:0;border-top:2px solid var(--kt-border)}.kumpul-plan-sim-steps li.is-current,.kumpul-plan-sim-steps li.is-complete{border-color:var(--kt-accent)}.kumpul-plan-sim-steps button{width:100%;padding:10px 5px 4px;display:flex;align-items:center;gap:6px;border:0;background:none;color:var(--kt-muted);font:inherit;font-size:8px;font-weight:750;text-align:left}.kumpul-plan-sim-steps li.is-current button,.kumpul-plan-sim-steps li.is-complete button{color:var(--kt-text)}.kumpul-plan-sim-steps button:disabled{cursor:not-allowed;opacity:.65}.kumpul-plan-sim-steps button:not(:disabled){cursor:pointer}.kumpul-plan-sim-steps button>span:first-child{width:20px;height:20px;flex:none;display:grid;place-items:center;border:1px solid var(--kt-border);border-radius:50%;font-size:8px}.kumpul-plan-sim-steps li.is-current button>span:first-child,.kumpul-plan-sim-steps li.is-complete button>span:first-child{border-color:var(--kt-accent);background:var(--kt-accent);color:#fff}.kumpul-plan-sim-panel{margin-top:17px}.kumpul-plan-sim-panel[hidden],.kumpul-plan-sim-complete[hidden]{display:none}.kumpul-plan-sim-panel h3,.kumpul-plan-sim-complete h3{margin:0;font-size:15px}.kumpul-plan-sim-help{margin:6px 0 14px;color:var(--kt-muted);font-size:9px;line-height:1.5}.kumpul-plan-sim-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.kumpul-plan-sim-form label,.kumpul-plan-sim-invite-form label,.kumpul-plan-sim-person>label{min-width:0;display:grid;gap:5px;color:var(--kt-muted);font-size:9px;font-weight:700}.kumpul-plan-sim-form input,.kumpul-plan-sim-form select,.kumpul-plan-sim-invite-form input,.kumpul-plan-sim-invitees input,.kumpul-plan-sim-person select{width:100%;min-width:0;min-height:37px;padding:8px 9px;border:1px solid var(--kt-border);border-radius:9px;background:#fff;color:var(--kt-text);font:inherit;font-size:10px}.kumpul-plan-sim-options{min-width:0;margin:15px 0 0;padding:11px;border:1px solid var(--kt-border);border-radius:11px}.kumpul-plan-sim-options legend{padding:0 5px;color:var(--kt-text);font-size:10px;font-weight:800}.kumpul-plan-sim-option{margin:5px 10px 5px 0;display:inline-flex;align-items:center;gap:6px;color:var(--kt-muted);font-size:9px}.kumpul-plan-sim-option input{accent-color:var(--kt-accent)}.kumpul-plan-sim-actions{margin-top:15px;display:flex;justify-content:flex-end;gap:8px}.kumpul-plan-sim-actions button,.kumpul-plan-sim-invite-form button,.kumpul-plan-sim-invitees button,.kumpul-plan-sim-payment button,.kumpul-plan-sim-complete button{min-height:36px;padding:8px 12px;border:1px solid var(--kt-border);border-radius:9px;background:#fff;color:var(--kt-text);font:inherit;font-size:9px;font-weight:800;cursor:pointer}.kumpul-plan-sim-actions .kumpul-plan-sim-primary{border-color:var(--kt-accent);background:var(--kt-accent);color:#fff}.kumpul-plan-sim-actions .kumpul-plan-sim-secondary{color:var(--kt-accent)}.kumpul-plan-sim-error{margin:12px 0 0;color:#b91c1c;font-size:9px;font-weight:700}.kumpul-plan-sim-invite-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:9px}.kumpul-plan-sim-invitees{margin:12px 0 0;padding:0;display:grid;gap:7px;list-style:none}.kumpul-plan-sim-invitees li{display:flex;align-items:center;gap:8px}.kumpul-plan-sim-invitees li>div{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.kumpul-plan-sim-invitees button,.kumpul-plan-sim-payment button{min-height:33px;padding:7px 9px;color:var(--kt-accent)}.kumpul-plan-sim-participants,.kumpul-plan-sim-payments{display:grid;gap:9px}.kumpul-plan-sim-person{padding:12px;display:grid;grid-template-columns:minmax(0,1fr) 170px;align-items:center;gap:11px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-bg)}.kumpul-plan-sim-person-heading{min-width:0;display:grid;gap:3px}.kumpul-plan-sim-person-heading strong{font-size:10px}.kumpul-plan-sim-person-heading span{overflow-wrap:anywhere;color:var(--kt-muted);font-size:8px}.kumpul-plan-sim-person-options{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.kumpul-plan-sim-payment{grid-template-columns:minmax(0,1fr) auto}.kumpul-plan-sim-payment[data-sim-paid=true]{border-color:var(--kt-success);background:#effaf5}.kumpul-plan-sim-final-group{margin:7px 0 0;padding:8px;border:1px solid var(--kt-border);border-radius:9px}.kumpul-plan-sim-final-group legend{padding:0 4px;font-size:9px;font-weight:800}.kumpul-plan-sim-final-group label{margin:5px 10px 5px 0;display:inline-flex;align-items:center;gap:6px;color:var(--kt-muted);font-size:9px}.kumpul-plan-sim-final-group input{accent-color:var(--kt-accent)}.kumpul-plan-sim-complete{margin-top:18px;padding:22px;border:1px solid #8bd1ae;border-radius:13px;background:#effaf5;text-align:center}.kumpul-plan-sim-complete>span{width:34px;height:34px;margin:0 auto 9px;display:grid;place-items:center;border-radius:50%;background:var(--kt-success);color:#fff;font-weight:900}.kumpul-plan-sim-complete p{margin:7px 0 13px;color:var(--kt-muted);font-size:9px;line-height:1.5}
+    .kumpul-plan-simulator{margin-top:18px;padding:20px;border:1px solid var(--kt-border);border-radius:18px;background:var(--kt-surface);box-shadow:0 8px 26px #0f172a0a}.kumpul-plan-simulator-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.kumpul-plan-simulator-heading h2{margin:0;font-size:19px;letter-spacing:-.025em}.kumpul-plan-simulator-heading .kumpul-eyebrow{margin-bottom:7px}.kumpul-plan-simulator-heading>div>p:last-child{margin:7px 0 0;color:var(--kt-muted);font-size:10px;line-height:1.55}.kumpul-plan-simulation-badge{padding:6px 9px;flex:none;border-radius:99px;background:#e6f4f6;color:var(--kt-accent);font-size:8px;font-weight:800}.kumpul-plan-simulation-note{margin:15px 0;padding:10px 12px;border:1px solid var(--kt-border);border-radius:10px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px;line-height:1.55}.kumpul-plan-sim-steps{margin:17px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none}.kumpul-plan-sim-steps li{min-width:0;border-top:2px solid var(--kt-border)}.kumpul-plan-sim-steps li.is-current,.kumpul-plan-sim-steps li.is-complete{border-color:var(--kt-accent)}.kumpul-plan-sim-steps button{width:100%;padding:10px 5px 4px;display:flex;align-items:center;gap:6px;border:0;background:none;color:var(--kt-muted);font:inherit;font-size:8px;font-weight:750;text-align:left}.kumpul-plan-sim-steps li.is-current button,.kumpul-plan-sim-steps li.is-complete button{color:var(--kt-text)}.kumpul-plan-sim-steps button:disabled{cursor:not-allowed;opacity:.65}.kumpul-plan-sim-steps button:not(:disabled){cursor:pointer}.kumpul-plan-sim-steps button>span:first-child{width:20px;height:20px;flex:none;display:grid;place-items:center;border:1px solid var(--kt-border);border-radius:50%;font-size:8px}.kumpul-plan-sim-steps li.is-current button>span:first-child,.kumpul-plan-sim-steps li.is-complete button>span:first-child{border-color:var(--kt-accent);background:var(--kt-accent);color:#fff}.kumpul-plan-sim-panel{margin-top:17px}.kumpul-plan-sim-panel[hidden],.kumpul-plan-sim-complete[hidden]{display:none}.kumpul-plan-sim-panel h3,.kumpul-plan-sim-complete h3{margin:0;font-size:15px}.kumpul-plan-sim-help{margin:6px 0 14px;color:var(--kt-muted);font-size:9px;line-height:1.5}.kumpul-plan-sim-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.kumpul-plan-sim-form label,.kumpul-plan-sim-invite-form label,.kumpul-plan-sim-person>label{min-width:0;display:grid;gap:5px;color:var(--kt-muted);font-size:9px;font-weight:700}.kumpul-plan-sim-form input,.kumpul-plan-sim-form select,.kumpul-plan-sim-invite-form input,.kumpul-plan-sim-invitees input,.kumpul-plan-sim-person select{width:100%;min-width:0;min-height:37px;padding:8px 9px;border:1px solid var(--kt-border);border-radius:9px;background:#fff;color:var(--kt-text);font:inherit;font-size:10px}.kumpul-plan-sim-options{min-width:0;margin:15px 0 0;padding:11px;border:1px solid var(--kt-border);border-radius:11px}.kumpul-plan-sim-options legend{padding:0 5px;color:var(--kt-text);font-size:10px;font-weight:800}.kumpul-plan-sim-option{margin:5px 10px 5px 0;display:inline-flex;align-items:center;gap:6px;color:var(--kt-muted);font-size:9px}.kumpul-plan-sim-option input{accent-color:var(--kt-accent)}.kumpul-plan-sim-actions{margin-top:15px;display:flex;justify-content:flex-end;gap:8px}.kumpul-plan-sim-actions button,.kumpul-plan-sim-invite-form button,.kumpul-plan-sim-invitees button,.kumpul-plan-sim-payment button,.kumpul-plan-sim-complete button{min-height:36px;padding:8px 12px;border:1px solid var(--kt-border);border-radius:9px;background:#fff;color:var(--kt-text);font:inherit;font-size:9px;font-weight:800;cursor:pointer}.kumpul-plan-sim-actions .kumpul-plan-sim-primary{border-color:var(--kt-accent);background:var(--kt-accent);color:#fff}.kumpul-plan-sim-actions .kumpul-plan-sim-secondary{color:var(--kt-accent)}.kumpul-plan-sim-error{margin:12px 0 0;color:#b91c1c;font-size:9px;font-weight:700}.kumpul-plan-sim-invite-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:9px}.kumpul-plan-sim-invitees{margin:12px 0 0;padding:0;display:grid;gap:7px;list-style:none}.kumpul-plan-sim-invitees li{display:flex;align-items:center;gap:8px}.kumpul-plan-sim-invitees li>div{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.kumpul-plan-sim-invitees button,.kumpul-plan-sim-payment button{min-height:33px;padding:7px 9px;color:var(--kt-accent)}.kumpul-plan-sim-participants,.kumpul-plan-sim-payments{display:grid;gap:9px}.kumpul-plan-sim-person{padding:12px;display:grid;grid-template-columns:minmax(0,1fr) 170px;align-items:center;gap:11px;border:1px solid var(--kt-border);border-radius:12px;background:var(--kt-bg)}.kumpul-plan-sim-person-heading{min-width:0;display:grid;gap:3px}.kumpul-plan-sim-person-heading strong{font-size:10px}.kumpul-plan-sim-person-heading span{overflow-wrap:anywhere;color:var(--kt-muted);font-size:8px}.kumpul-plan-sim-person-options{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.kumpul-plan-sim-payment{grid-template-columns:minmax(0,1fr) auto}.kumpul-plan-sim-payment[data-sim-paid=true]{border-color:var(--kt-success);background:#effaf5}.kumpul-plan-sim-final-group{margin:7px 0 0;padding:8px;border:1px solid var(--kt-border);border-radius:9px}.kumpul-plan-sim-final-group legend{padding:0 4px;font-size:9px;font-weight:800}.kumpul-plan-sim-final-group label{margin:5px 10px 5px 0;display:inline-flex;align-items:center;gap:6px;color:var(--kt-muted);font-size:9px}.kumpul-plan-sim-final-group input{accent-color:var(--kt-accent)}.kumpul-plan-sim-complete{margin-top:18px;padding:22px;border:1px solid #8bd1ae;border-radius:13px;background:#effaf5;text-align:center}.kumpul-plan-sim-complete>span{width:34px;height:34px;margin:0 auto 9px;display:grid;place-items:center;border-radius:50%;background:var(--kt-success);color:#fff;font-weight:900}.kumpul-plan-sim-complete p{margin:7px 0 13px;color:var(--kt-muted);font-size:9px;line-height:1.5}.kumpul-plan-live .kumpul-plan-sim-steps{position:sticky;top:var(--kumpul-header-height,0px);z-index:8;padding-top:10px;background:var(--kt-surface)}.kumpul-plan-live-dates{margin-top:11px;grid-template-columns:repeat(3,minmax(0,1fr))}.kumpul-plan-live .kumpul-plan-sim-option{width:100%;margin:7px 0;display:flex;align-items:flex-start}.kumpul-plan-live .kumpul-plan-sim-option>span{display:grid;gap:3px}.kumpul-plan-live .kumpul-plan-sim-option small{color:var(--kt-muted);font-size:8px;line-height:1.45}.kumpul-plan-live .kumpul-plan-sim-invite-form{margin-bottom:12px;grid-template-columns:repeat(3,minmax(0,1fr)) auto}.kumpul-plan-live-readonly{margin:6px 0 12px;padding:8px 10px;border-radius:9px;background:var(--kt-bg);color:var(--kt-muted);font-size:9px}.kumpul-plan-live-people{margin:12px 0 0;padding:0;display:grid;gap:8px;list-style:none}.kumpul-plan-live-people .kumpul-plan-sim-person{grid-template-columns:minmax(0,1fr) auto}.kumpul-plan-live-person-name{display:flex;align-items:center;gap:8px}.kumpul-plan-live-person-name input{accent-color:var(--kt-accent)}.kumpul-plan-live-row-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;font-size:9px;font-weight:800}.kumpul-plan-live-row-actions a{color:var(--kt-accent)}.kumpul-plan-live-row-actions button{min-height:32px;padding:6px 10px;border:1px solid var(--kt-border);border-radius:9px;background:#fff;color:var(--kt-accent);font:inherit;cursor:pointer}.kumpul-plan-live-public{margin:0 0 12px;padding:10px 12px;border:1px dashed var(--kt-accent);border-radius:11px;color:var(--kt-muted);font-size:9px}.kumpul-plan-live-public a{color:var(--kt-accent);font-weight:800}.kumpul-plan-live-operation{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#e6f4f6;color:var(--kt-text);font-size:9px}.kumpul-plan-live-operation.is-failed{background:#fdecec;color:#b91c1c}.kumpul-plan-live-reason{margin-top:12px;display:grid;gap:5px;color:var(--kt-muted);font-size:9px;font-weight:700}.kumpul-plan-live-reason textarea,.kumpul-plan-live-cancel input{width:100%;padding:8px 9px;border:1px solid var(--kt-border);border-radius:9px;font:inherit;font-size:10px}.kumpul-plan-live .kumpul-plan-sim-final-group{display:grid;gap:4px}.kumpul-plan-live .kumpul-plan-sim-final-group p{margin:0;color:var(--kt-muted);font-size:9px}.kumpul-plan-live-cancel{margin-top:18px;padding-top:12px;border-top:1px solid var(--kt-border);font-size:10px}.kumpul-plan-live-cancel summary{color:#b91c1c;font-weight:800;cursor:pointer}.kumpul-plan-live-cancel label{margin:10px 0;display:grid;gap:5px;color:var(--kt-muted);font-size:9px;font-weight:700}.kumpul-plan-live-danger{min-height:36px;padding:8px 12px;border:0;border-radius:9px;background:#b91c1c;color:#fff;font:inherit;font-size:9px;font-weight:800;cursor:pointer}.kumpul-plan-live button:disabled{cursor:not-allowed;opacity:.55}@media(max-width:760px){.kumpul-plan-live-dates,.kumpul-plan-live .kumpul-plan-sim-invite-form,.kumpul-plan-live-people .kumpul-plan-sim-person{grid-template-columns:1fr}.kumpul-plan-live-row-actions{justify-content:flex-start}}
     @media(max-width:760px){.kumpul-plan-heading{flex-direction:column;gap:12px}.kumpul-plan-workflow{padding:14px}.kumpul-plan-workflow ol{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kumpul-plan-workflow li{padding:9px 5px 0;font-size:8px}.kumpul-plan-layout{grid-template-columns:1fr;gap:13px}.kumpul-plan-aside{position:static}.kumpul-plan-simulator{padding:15px}.kumpul-plan-simulator-heading{flex-direction:column;gap:10px}.kumpul-plan-sim-form{grid-template-columns:1fr}.kumpul-plan-sim-invite-form{grid-template-columns:1fr}.kumpul-plan-sim-invite-form button{width:100%}.kumpul-plan-sim-invitees li{align-items:flex-start;flex-direction:column}.kumpul-plan-sim-invitees li>div{width:100%;grid-template-columns:1fr}.kumpul-plan-sim-invitees button{align-self:flex-end}.kumpul-plan-sim-person{grid-template-columns:1fr}.kumpul-plan-sim-person-options{grid-template-columns:1fr}.kumpul-plan-sim-payment{grid-template-columns:1fr}.kumpul-plan-sim-payment button{width:100%}.kumpul-plan-sim-steps button{align-items:flex-start;flex-direction:column;font-size:7px}.kumpul-plan-sim-actions{flex-wrap:wrap}.kumpul-plan-sim-actions button{flex:1}}
     @media(max-width:760px){.kumpul-detail-heading{align-items:flex-start;flex-direction:column}.kumpul-detail-layout{grid-template-columns:1fr;gap:13px}.kumpul-detail-aside{position:static}.kumpul-detail-card{padding:16px}.kumpul-detail-fields{gap:13px}.kumpul-detail-total strong{font-size:19px}.kumpul-detail-item{grid-template-columns:40px minmax(0,1fr);gap:10px}.kumpul-detail-item-art{width:40px;height:40px}.kumpul-detail-item>strong{grid-column:2}.kumpul-detail-page .kumpul-detail-preview-note{font-size:9px}}
     .kumpul-transaction-actions .kumpul-transaction-action-link{display:inline-flex;min-height:34px;align-items:center;justify-content:center;padding:7px 11px;border:1px solid var(--kt-border);border-radius:10px;background:var(--kt-surface);color:var(--kt-text);font-size:9px;font-weight:750;text-decoration:none}

package/manifest.json

@@ -2,7 +2,7 @@
   "manifestVersion": 1,
   "slug": "kumpul",
   "name": "Kumpul",
-  "version": "1.1.0",
+  "version": "1.2.2",
   "rendererApiVersion": 1,
   "businessProfiles": [
     "gathering"
@@ -307,5 +307,74 @@
         }
       ]
     }
-  ]
+  ],
+  "sampleData": {
+    "tagline": "Kumpul bareng jadi lebih mudah.",
+    "categories": [
+      {
+        "label": "Family"
+      },
+      {
+        "label": "Workshop"
+      },
+      {
+        "label": "Outdoor"
+      },
+      {
+        "label": "Komunitas"
+      }
+    ],
+    "products": [
+      {
+        "name": "Family Camp Lembang — Edisi Libur Sekolah",
+        "type": "gathering",
+        "price": 350000,
+        "category": "Family",
+        "description": "Gathering keluarga untuk menikmati waktu bersama di alam terbuka.",
+        "minAttendees": 4,
+        "maxAttendees": 40
+      },
+      {
+        "name": "Workshop Keramik & Kopi Slow Bar",
+        "type": "gathering",
+        "price": 185000,
+        "category": "Workshop",
+        "description": "Belajar membuat keramik sambil menikmati kopi pilihan.",
+        "minAttendees": 3,
+        "maxAttendees": 24
+      },
+      {
+        "name": "Trail Run Sentul — Sunrise Batch",
+        "type": "gathering",
+        "price": 125000,
+        "category": "Outdoor",
+        "description": "Mulai pagi dengan rute lari dan pemandangan perbukitan.",
+        "minAttendees": 5,
+        "maxAttendees": 80
+      },
+      {
+        "name": "Komunitas Baca: Diskusi Sore di Taman",
+        "type": "gathering",
+        "price": 0,
+        "category": "Komunitas",
+        "description": "Sesi baca dan diskusi santai terbuka untuk semua.",
+        "minAttendees": 1,
+        "maxAttendees": 30
+      }
+    ],
+    "faqs": [
+      {
+        "question": "Bagaimana cara ikut sebuah gathering?",
+        "answer": "Pilih gathering di katalog lalu buat rencana atau terima undangan dari penyelenggara. RSVP dan pembayaran dilakukan di website ini."
+      },
+      {
+        "question": "Kapan saya membayar?",
+        "answer": "Setelah penyelenggara menutup RSVP, tagihan peserta terbit. Batas pembayaran tertera di halaman Tagihan."
+      },
+      {
+        "question": "Bagaimana jika acara dibatalkan?",
+        "answer": "Dana yang sudah dibayar dikembalikan sesuai kebijakan pembatalan gathering tersebut."
+      }
+    ]
+  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bagdja/kumpul",
-  "version": "1.1.0",
+  "version": "1.2.2",
   "description": "Kumpul website template for Bagdja",
   "license": "UNLICENSED",
   "type": "commonjs",