@eintrek/erp-shell 0.1.61 → 0.1.63

package/dist/index.js

@@ -14,6 +14,7 @@ var Link = require('next/link');
 var reactDom = require('react-dom');
 var nextThemes = require('next-themes');
 var axios = require('axios');
+var dom = require('@floating-ui/dom');
 var reactQueryDevtools = require('@tanstack/react-query-devtools');
 
 function _interopNamespaceDefault(e) {
@@ -752,7 +753,7 @@ function SidebarFooter({ children, className }) {
  */
 function SidebarTrigger({ className }) {
     const { open, toggle } = useSidebar();
-    return (jsxRuntime.jsx("button", { onClick: toggle, className: erpTheme.cn("inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 md:h-9 md:w-9 -ml-1", className), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", children: open ? (jsxRuntime.jsx(lucideReact.PanelLeftClose, { className: "h-4 w-4 text-primary-foreground" })) : (jsxRuntime.jsx(lucideReact.Menu, { className: "h-4 w-4 text-primary-foreground" })) }));
+    return (jsxRuntime.jsx("button", { onClick: toggle, className: erpTheme.cn("inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 md:h-9 md:w-9 -ml-1", className), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", "data-guide": "shell.menu-toggle", children: open ? (jsxRuntime.jsx(lucideReact.PanelLeftClose, { className: "h-4 w-4 text-primary-foreground" })) : (jsxRuntime.jsx(lucideReact.Menu, { className: "h-4 w-4 text-primary-foreground" })) }));
 }
 
 /**
@@ -1277,35 +1278,35 @@ let declaredApp = null;
 // The message the dialog should open on (the ตอบกลับ link's ?help=H1004),
 // until it is closed or left.
 let pendingRef = null;
-const listeners = new Set();
-function emit() {
-    listeners.forEach(l => l());
+const listeners$1 = new Set();
+function emit$1() {
+    listeners$1.forEach(l => l());
 }
-function subscribe(l) {
-    listeners.add(l);
+function subscribe$1(l) {
+    listeners$1.add(l);
     return () => {
-        listeners.delete(l);
+        listeners$1.delete(l);
     };
 }
 /** Opens the dialog — a no-op when no layout has mounted one. */
 function openHelp() {
     if (!open) {
         open = true;
-        emit();
+        emit$1();
     }
 }
 function closeHelp() {
     pendingRef = null;
     if (open) {
         open = false;
-        emit();
+        emit$1();
     }
 }
 /** Opens the dialog on one of the person's messages, by id or "H1004". */
 function openHelpOn(ref) {
     pendingRef = ref;
     open = true;
-    emit();
+    emit$1();
 }
 /** The message the dialog was asked to open on, if it has not been left. */
 function pendingHelpRef() {
@@ -1324,22 +1325,22 @@ function registerHelpHost() {
     hosts += 1;
     if (pendingRef)
         open = true;
-    emit();
+    emit$1();
     return () => {
         hosts -= 1;
         if (hosts <= 0) {
             hosts = 0;
             open = false;
         }
-        emit();
+        emit$1();
     };
 }
 function useHelpOpen() {
-    return React.useSyncExternalStore(subscribe, () => open, () => false);
+    return React.useSyncExternalStore(subscribe$1, () => open, () => false);
 }
 /** True while a dialog host is mounted, i.e. the ช่วยเหลือ entry works. */
 function useHelpAvailable() {
-    return React.useSyncExternalStore(subscribe, () => hosts > 0, () => false);
+    return React.useSyncExternalStore(subscribe$1, () => hosts > 0, () => false);
 }
 /**
  * Every app names itself when it builds its app-switcher links
@@ -1363,17 +1364,17 @@ function declaredHelpApp() {
 const OWNER_CHIP = "เจ้าของ";
 /** How many role names the card spells out before counting the rest. */
 const CARD_ROLE_LIMIT = 2;
-const isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+const isRecord$2 = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
 /**
  * The answer, checked. Anything that is not the shape the card needs — an
  * older API, a proxy's error page, another organisation's answer — is null,
  * and the card shows no role line.
  */
 function parseMyRoles(payload, organizationId) {
-    if (!isRecord(payload))
+    if (!isRecord$2(payload))
         return null;
     // Envelope { success, data } or the bare data.
-    const data = isRecord(payload.data) ? payload.data : payload;
+    const data = isRecord$2(payload.data) ? payload.data : payload;
     if (!Array.isArray(data.roles))
         return null;
     if (typeof data.organization_id === "string" && data.organization_id !== organizationId) {
@@ -1382,7 +1383,7 @@ function parseMyRoles(payload, organizationId) {
     const roles = [];
     const seen = new Set();
     for (const r of data.roles) {
-        if (!isRecord(r))
+        if (!isRecord$2(r))
             continue;
         const name = typeof r.name_th === "string" ? r.name_th.trim() : "";
         const key = typeof r.key === "string" ? r.key : "";
@@ -1603,6 +1604,242 @@ async function retryWithStoredOrganizations(config, status, send) {
     return undefined;
 }
 
+/**
+ * Route and API-path patterns for tour steps.
+ *
+ * No runtime imports: the tests run this file in Node as it is.
+ */
+const trimSlash = (p) => (p.length > 1 ? p.replace(/\/+$/, "") : p);
+function splitPattern(pattern) {
+    const q = pattern.indexOf("?");
+    if (q < 0)
+        return { path: pattern, query: new URLSearchParams() };
+    return { path: pattern.slice(0, q), query: new URLSearchParams(pattern.slice(q + 1)) };
+}
+function paramName(segment) {
+    const bracket = /^\[([A-Za-z0-9_]+)\]$/.exec(segment);
+    if (bracket)
+        return bracket[1];
+    const colon = /^:([A-Za-z0-9_]+)$/.exec(segment);
+    return colon ? colon[1] : null;
+}
+function safeDecode(s) {
+    try {
+        return decodeURIComponent(s);
+    }
+    catch {
+        return s;
+    }
+}
+/**
+ * Matches a Next-style page pattern ("/[code]/employee/[id]", optionally
+ * "?tab=job") against a path and query. `[code]`, when given, must be the
+ * organisation code. Returns the params, or null.
+ */
+function matchRoute(pattern, pathname, search, code) {
+    const { path, query } = splitPattern(pattern);
+    const want = trimSlash(path).split("/");
+    const have = trimSlash(pathname || "/").split("/");
+    if (want.length !== have.length)
+        return null;
+    const params = {};
+    for (let i = 0; i < want.length; i++) {
+        const name = paramName(want[i]);
+        if (name) {
+            if (!have[i])
+                return null;
+            params[name] = safeDecode(have[i]);
+            continue;
+        }
+        if (want[i] !== have[i])
+            return null;
+    }
+    if (code !== undefined && params.code !== undefined && params.code !== code) {
+        return null;
+    }
+    if ([...query.keys()].length > 0) {
+        const s = search instanceof URLSearchParams ? search : new URLSearchParams(search ?? "");
+        for (const [k, v] of query.entries()) {
+            if (s.get(k) !== v)
+                return null;
+        }
+    }
+    return params;
+}
+/** Fills a page pattern's params ("/[code]/x/[id]" → "/O1/x/42"); null if one is missing. */
+function fillRoute(pattern, params) {
+    const { path, query } = splitPattern(pattern);
+    const out = [];
+    for (const seg of path.split("/")) {
+        const name = paramName(seg);
+        if (!name) {
+            out.push(seg);
+            continue;
+        }
+        const v = params[name];
+        if (!v)
+            return null;
+        out.push(encodeURIComponent(v));
+    }
+    const qs = query.toString();
+    return out.join("/") + (qs ? `?${qs}` : "");
+}
+/**
+ * The path of a request, without origin, base URL query or hash:
+ * ("/shifts/4", "https://hr-api/api/v1") → "/api/v1/shifts/4".
+ */
+function requestPath(url, baseURL) {
+    const raw = url ?? "";
+    let full = raw;
+    if (!/^[a-z][a-z0-9+.-]*:\/\//i.test(raw) && baseURL) {
+        full = baseURL.replace(/\/+$/, "") + "/" + raw.replace(/^\/+/, "");
+    }
+    try {
+        return trimSlash(new URL(full, "http://local.invalid").pathname);
+    }
+    catch {
+        return trimSlash(full.split(/[?#]/)[0] || "/");
+    }
+}
+/**
+ * Whether a request path matches a step's API path: the pattern's segments
+ * must be the END of the path ("/shifts/[id]" matches "/api/v1/shifts/42");
+ * `[x]`/`:x` is one segment, `*` any number (including none). A RegExp is
+ * tested against the whole path.
+ */
+function matchApiPath(pattern, path) {
+    if (pattern instanceof RegExp)
+        return pattern.test(path);
+    const want = trimSlash(pattern).split("/").filter(Boolean);
+    const have = trimSlash(path).split("/").filter(Boolean);
+    // Try every suffix of the path as the place the pattern starts.
+    for (let start = 0; start <= have.length; start++) {
+        if (matchSegments(want, 0, have, start))
+            return true;
+    }
+    return false;
+}
+function matchSegments(want, wi, have, hi) {
+    if (wi === want.length)
+        return hi === have.length;
+    const seg = want[wi];
+    if (seg === "*") {
+        for (let k = hi; k <= have.length; k++) {
+            if (matchSegments(want, wi + 1, have, k))
+                return true;
+        }
+        return false;
+    }
+    if (hi >= have.length)
+        return false;
+    if (paramName(seg) || seg === have[hi])
+        return matchSegments(want, wi + 1, have, hi + 1);
+    return false;
+}
+/** "2xx" or an exact status. */
+function matchStatus(want, status) {
+    if (want === undefined || want === "2xx")
+        return status >= 200 && status < 300;
+    return status === want;
+}
+
+/**
+ * The tour's event bus and anchor helper — the parts an app calls.
+ *
+ * - `guideAnchor(key, id?)` → `{ "data-guide": key, "data-guide-id"?: id }`
+ * - `emitGuideEvent(name, detail?)` → window CustomEvent `erp:guide:<name>`
+ * - `reportApiEvent(responseOrError)` → window CustomEvent `erp:api`, which
+ *   the shell's own axios instance already sends for every answer. An app
+ *   with a second axios instance calls it from that instance's interceptor.
+ *
+ * Only method, path, status, the saved record's id and (on a refusal) the
+ * server's message go on the bus — never a request or response body.
+ *
+ * No runtime imports beyond sibling pure modules.
+ */
+const GUIDE_ATTRIBUTE = "data-guide";
+const GUIDE_ID_ATTRIBUTE = "data-guide-id";
+const GUIDE_LAYER_ATTRIBUTE = "data-erp-guide-layer";
+const API_EVENT = "erp:api";
+const GUIDE_EVENT_PREFIX = "erp:guide:";
+/** Spread onto the element a tour step points at. */
+function guideAnchor(key, id) {
+    return id === undefined || id === null || id === ""
+        ? { [GUIDE_ATTRIBUTE]: key }
+        : { [GUIDE_ATTRIBUTE]: key, [GUIDE_ID_ATTRIBUTE]: String(id) };
+}
+/** Announces an app event a step can wait for (`advanceOn: { event: name }`). */
+function emitGuideEvent(name, detail) {
+    if (typeof window === "undefined" || !name)
+        return;
+    const clean = {};
+    for (const [k, v] of Object.entries(detail ?? {})) {
+        if (typeof v === "string" || typeof v === "number")
+            clean[k] = String(v);
+    }
+    try {
+        window.dispatchEvent(new CustomEvent(GUIDE_EVENT_PREFIX + name, { detail: clean }));
+    }
+    catch {
+        /* never let the tour break the app */
+    }
+}
+const isRecord$1 = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+function idOf(data) {
+    const pick = (v) => typeof v === "string" && v ? v : typeof v === "number" ? String(v) : undefined;
+    if (!isRecord$1(data))
+        return undefined;
+    return pick(data.id) ?? (isRecord$1(data.data) ? pick(data.data.id) : undefined);
+}
+function messageOf(data) {
+    if (!isRecord$1(data))
+        return undefined;
+    const m = data.message ?? (isRecord$1(data.error) ? data.error.message : data.error);
+    return typeof m === "string" && m.trim() ? m.trim().slice(0, 200) : undefined;
+}
+/** The bus detail for an axios answer or error; null when it is neither. */
+function apiEventDetail(responseOrError) {
+    if (!isRecord$1(responseOrError))
+        return null;
+    const err = responseOrError;
+    // An AxiosError has .response (or none: network failure) and .config.
+    const isError = "isAxiosError" in responseOrError || ("response" in responseOrError && !("data" in responseOrError));
+    const res = isError ? err.response : responseOrError;
+    const config = (res?.config ?? err.config);
+    if (!config)
+        return null;
+    const status = typeof res?.status === "number" ? res.status : 0;
+    const detail = {
+        method: (config.method ?? "get").toUpperCase(),
+        path: requestPath(config.url, config.baseURL),
+        status,
+    };
+    if (status >= 200 && status < 300) {
+        const id = idOf(res?.data);
+        if (id)
+            detail.id = id;
+    }
+    else {
+        const msg = messageOf(res?.data);
+        if (msg)
+            detail.message = msg;
+    }
+    return detail;
+}
+/** Puts an axios answer (or error) on the bus. Safe to call with anything. */
+function reportApiEvent(responseOrError) {
+    if (typeof window === "undefined")
+        return;
+    try {
+        const detail = apiEventDetail(responseOrError);
+        if (detail)
+            window.dispatchEvent(new CustomEvent(API_EVENT, { detail }));
+    }
+    catch {
+        /* never let the tour break the app */
+    }
+}
+
 const isBrowser = () => typeof window !== "undefined";
 const isAuthEndpoint = (url) => !!url && url.includes("/api/auth/");
 const isAuthPage = () => isBrowser() && window.location.pathname.startsWith("/auth/");
@@ -1676,6 +1913,9 @@ instance.interceptors.response.use(response => {
     if (typeof window !== "undefined") {
         window.dispatchEvent(new CustomEvent("erp:employee-record-ok"));
     }
+    // The guided tour advances on saves that succeeded (method, path, status
+    // and the record's id only; never the body).
+    reportApiEvent(response);
     return response;
 }, async (error) => {
     const originalRequest = error.config;
@@ -1692,6 +1932,7 @@ instance.interceptors.response.use(response => {
             return instance(originalRequest);
         }
         await redirectToLogout();
+        reportApiEvent(error);
         return Promise.reject(toApiError(error));
     }
     // The server refuses every organisation-scoped call when the account has
@@ -1706,6 +1947,8 @@ instance.interceptors.response.use(response => {
     const listed = await retryWithStoredOrganizations(originalRequest, error.response?.status, config => instance(config));
     if (listed !== undefined)
         return listed;
+    // A refused save keeps the tour's step and shows the server's message.
+    reportApiEvent(error);
     return Promise.reject(toApiError(error));
 });
 
@@ -1732,7 +1975,7 @@ function platformApiBase(app) {
  * This package's version, attached to help messages so the back office can
  * tell which shell a report came from. Keep in step with package.json.
  */
-const SHELL_VERSION = "0.1.61";
+const SHELL_VERSION = "0.1.63";
 
 const HELP_APP_LABEL = {
     platform: "แพลตฟอร์ม",
@@ -1925,13 +2168,13 @@ function describeAttached(app, ctx, email) {
 const myRolesQueryKey = (organizationId) => ["erp-shell", "my-roles", organizationId];
 // Only for a host that renders NavUser outside a QueryClientProvider: the
 // card still works there instead of throwing.
-let fallbackClient = null;
-function useShellQueryClient() {
+let fallbackClient$1 = null;
+function useShellQueryClient$1() {
     const provided = React.useContext(reactQuery.QueryClientContext);
     if (provided)
         return provided;
-    fallbackClient ?? (fallbackClient = new reactQuery.QueryClient());
-    return fallbackClient;
+    fallbackClient$1 ?? (fallbackClient$1 = new reactQuery.QueryClient());
+    return fallbackClient$1;
 }
 function subscribeStorage(onChange) {
     window.addEventListener("storage", onChange);
@@ -1957,7 +2200,7 @@ function useMyRoles(organizationId, enabled = true) {
         String(organizationId).trim() !== ""
         ? String(organizationId).trim()
         : null;
-    const client = useShellQueryClient();
+    const client = useShellQueryClient$1();
     return reactQuery.useQuery({
         queryKey: myRolesQueryKey(orgId),
         queryFn: async ({ signal }) => {
@@ -2075,8 +2318,15 @@ function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref
     };
     const handleProfile = () => {
         setIsOpen(false);
-        if (profileHref)
-            router.push(profileHref);
+        if (!profileHref)
+            return;
+        // Account settings live on Platform, so from any other app this is a
+        // full page load, the same as the apps menu.
+        if (isExternalHref(profileHref)) {
+            window.location.assign(profileHref);
+            return;
+        }
+        router.push(profileHref);
     };
     const handleSystemLink = (href) => {
         setIsOpen(false);
@@ -2143,7 +2393,7 @@ function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref
                                     { code: "en", label: "English" },
                                     { code: "zh", label: "中文" },
                                     { code: "ja", label: "日本語" },
-                                ].map(({ code, label }) => (jsxRuntime.jsxs("button", { onClick: () => handleLanguageChange(code), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (jsxRuntime.jsxs("button", { onClick: handleProfile, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27" })] })), showSelectOrganization && (jsxRuntime.jsxs("button", { onClick: handleSelectOrganization, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
+                                ].map(({ code, label }) => (jsxRuntime.jsxs("button", { onClick: () => handleLanguageChange(code), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (jsxRuntime.jsxs("button", { onClick: handleProfile, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.UserCog, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E15\u0E31\u0E49\u0E07\u0E04\u0E48\u0E32\u0E1A\u0E31\u0E0D\u0E0A\u0E35" })] })), showSelectOrganization && (jsxRuntime.jsxs("button", { onClick: handleSelectOrganization, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
                                     setShowAppsMenu(!showAppsMenu);
                                     setShowThemeMenu(false);
                                     setShowLanguageMenu(false);
@@ -2223,6 +2473,32 @@ function hasPlanFeature(features, feature) {
     return false;
 }
 
+/**
+ * Where Platform lives, and the pages every app sends people to on it.
+ *
+ * Personal settings — profile, password, signature, LINE — exist once, on
+ * Platform. Every other app links there instead of keeping its own copy.
+ *
+ * Plain .ts (no JSX) so node --test can import it; app-registry.tsx reads the
+ * base from here too, so the app switcher and the account link never disagree.
+ */
+const DEFAULT_PLATFORM_URL = "https://platform.antniti.com";
+/** Read per call: Next inlines NEXT_PUBLIC_* at the consuming app's build. */
+function platformBaseUrl() {
+    return (process.env.NEXT_PUBLIC_PLATFORM_URL || DEFAULT_PLATFORM_URL).replace(/\/+$/, "");
+}
+/**
+ * ตั้งค่าบัญชี for an organisation: `/{code}/account/settings` on Platform.
+ * Undefined without an organisation code — there is no page to open then.
+ */
+function accountSettingsHref(orgCode, { activeApp } = {}) {
+    const code = orgCode?.trim();
+    if (!code)
+        return undefined;
+    const path = `/${encodeURIComponent(code)}/account/settings`;
+    return activeApp === "platform" ? path : `${platformBaseUrl()}${path}`;
+}
+
 function normaliseBase(value, fallback) {
     return (value ?? fallback).replace(/\/$/, "");
 }
@@ -2239,7 +2515,7 @@ const APPS = [
         label: "แพลตฟอร์ม",
         icon: jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4 shrink-0" }),
         features: null,
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_PLATFORM_URL, "https://platform.antniti.com"),
+        baseUrl: platformBaseUrl,
     },
     {
         id: "accounx",
@@ -2371,11 +2647,11 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                     // A one-line row: a link, lit on its own page only. No open
                     // state, no title tooltip.
                     return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(SidebarMenuItem, { children: jsxRuntime.jsx(SidebarMenuButton, { asChild: true, isActive: isItemActive, className: workspaceButton, children: jsxRuntime.jsxs(Link, { href: itemUrl, prefetch: false, className: "flex items-center w-full min-w-0 flex-1 " +
-                                            (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate", children: item.titleTh }), badge] }) }) })] }, item.id));
+                                            (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, ...guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate", children: item.titleTh }), badge] }) }) })] }, item.id));
                 }
                 // A group: its header opens and shuts it (the chevron says which).
                 // An open group is not the current page — only a row in it is.
-                return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: isOpen => setItemOpen(item.id, isOpen), className: "group/collapsible", children: jsxRuntime.jsxs(SidebarMenuItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuButton, { isActive: isItemActive, className: workspaceButton, children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate text-left", children: item.titleTh }), jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] }) }), item.subModules && (jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: workspace
+                return (jsxRuntime.jsxs(React__namespace.Fragment, { children: [groupHeading, jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: isOpen => setItemOpen(item.id, isOpen), className: "group/collapsible", children: jsxRuntime.jsxs(SidebarMenuItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuButton, { isActive: isItemActive, className: workspaceButton, ...guideAnchor(`nav.${item.id}`), children: [icon, jsxRuntime.jsx("span", { id: item.id, className: "flex-1 truncate text-left", children: item.titleTh }), jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] }) }), item.subModules && (jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: workspace
                                                 ? "mx-0 mt-1 mb-3 ml-[21px] gap-0.5 border-l border-sidebar-border pl-2.5 [&_a]:h-auto [&_a]:gap-[11px] [&_a]:px-3 [&_a]:py-2 [&_a]:text-xs [&_svg]:!size-[17px]"
                                                 : undefined, children: item.subModules.map((subItem, subIndex) => {
                                                 const subItemUrl = buildUrlWithCode(code, subItem.url);
@@ -2388,7 +2664,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                     subItem.subPages &&
                                                     subItem.subPages.length > 0) {
                                                     return (jsxRuntime.jsx(erpTheme.Collapsible, { asChild: true, defaultOpen: isSubItemActive || openSub === subIndex, className: "group/sub-collapsible", children: jsxRuntime.jsxs(SidebarMenuSubItem, { children: [jsxRuntime.jsx(erpTheme.CollapsibleTrigger, { asChild: true, children: jsxRuntime.jsxs(SidebarMenuSubButton, { className: "w-full", isActive: isSubItemActive &&
-                                                                            activeSubPage === null, children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), jsxRuntime.jsx(lucideReact.ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map((subPage, subPageIndex) => {
+                                                                            activeSubPage === null, ...guideAnchor(`nav.${subItem.id}`), children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), jsxRuntime.jsx(lucideReact.ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsxRuntime.jsx(erpTheme.CollapsibleContent, { children: jsxRuntime.jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map((subPage, subPageIndex) => {
                                                                             const subPageUrl = buildUrlWithCode(code, subPage.url);
                                                                             const isSubPageActive = isSubItemActive &&
                                                                                 activeSubPage === subPageIndex;
@@ -2396,7 +2672,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                                             return (jsxRuntime.jsx(SidebarMenuSubItem, { children: jsxRuntime.jsx(SidebarMenuSubButton, { asChild: true, className: "font-thai w-full text-sm" +
                                                                                         (isSubPageActive
                                                                                             ? " font-medium"
-                                                                                            : ""), isActive: isSubPageActive, children: jsxRuntime.jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, "aria-current": isSubPageActive
+                                                                                            : ""), isActive: isSubPageActive, children: jsxRuntime.jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", ...guideAnchor(`nav.${subPage.id}`), onClick: handleNavLinkClick, "aria-current": isSubPageActive
                                                                                             ? "page"
                                                                                             : undefined, children: [SubPageIcon && (jsxRuntime.jsx(SubPageIcon, { className: "sidebar-subpage-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subPage.titleTh })] }) }) }, subPage.id));
                                                                         }) }) })] }) }, subItem.id));
@@ -2404,7 +2680,7 @@ function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, ch
                                                 return (jsxRuntime.jsx(SidebarMenuSubItem, { children: jsxRuntime.jsx(SidebarMenuSubButton, { asChild: true, className: "w-full" +
                                                             (workspace && isSubItemActive
                                                                 ? " font-semibold"
-                                                                : ""), isActive: isSubItemActive, children: jsxRuntime.jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, "aria-current": isSubItemActive ? "page" : undefined, children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), approvalCount > 0 && (jsxRuntime.jsx(erpTheme.Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
+                                                                : ""), isActive: isSubItemActive, children: jsxRuntime.jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", ...guideAnchor(`nav.${subItem.id}`), onClick: handleNavLinkClick, "aria-current": isSubItemActive ? "page" : undefined, children: [SubIcon && (jsxRuntime.jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsxRuntime.jsx("span", { className: "flex-1 truncate", children: subItem.titleTh }), approvalCount > 0 && (jsxRuntime.jsx(erpTheme.Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
                                                                         ? "99+"
                                                                         : approvalCount }))] }) }) }, subItem.id));
                                             }) }) }))] }) })] }, item.id));
@@ -2526,13 +2802,63 @@ const WORKSPACE_LIGHT_HEADER_VARS = {
     "--header-title-py": "0px",
 };
 
+let entry = null;
+let openPanelImpl = null;
+const listeners = new Set();
+function emit() {
+    listeners.forEach(l => l());
+}
+function subscribe(l) {
+    listeners.add(l);
+    return () => {
+        listeners.delete(l);
+    };
+}
+/** Called by the host: the entry to show (null: none), and how to open the panel. */
+function publishGuideEntry(next, openPanel) {
+    const same = (next === null && entry === null) ||
+        (next !== null && entry !== null && next.done === entry.done && next.total === entry.total);
+    openPanelImpl = openPanel;
+    if (!same) {
+        entry = next;
+        emit();
+    }
+}
+/** Opens the tour's quest panel, when this user has a tour here. */
+function openGuidePanel() {
+    openPanelImpl?.();
+}
+/** The "?" menu's entry, or null when there is no tour for this user. */
+function useGuideEntry() {
+    return React.useSyncExternalStore(subscribe, () => entry, () => null);
+}
+
+const BUTTON_CLASS = "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted,#ffffffc7)] transition-colors hover:bg-[var(--header-hover,#ffffff1f)] hover:text-[var(--header-fg,#ffffff)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,#ffffffc7)]";
 /**
  * The ช่วยเหลือ button in the top bar. Drawn in the header's ink (the
  * --header-* variables of the workspace chrome, white on the brand chrome).
+ *
+ * When this user has a guided tour in this app, it opens a small menu:
+ * "ไกด์เริ่มต้น n/N" (the quest panel) and "ติดต่อทีมช่วยเหลือ" (the help
+ * dialog). Otherwise one press opens the help dialog, as before.
  */
 function HelpButton({ className }) {
-    return (jsxRuntime.jsx("button", { type: "button", onClick: openHelp, "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted,#ffffffc7)] transition-colors hover:bg-[var(--header-hover,#ffffff1f)] hover:text-[var(--header-fg,#ffffff)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,#ffffffc7)]" +
-            (className ? ` ${className}` : ""), children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
+    const guide = useGuideEntry();
+    const toGuide = React.useRef(false);
+    const cls = BUTTON_CLASS + (className ? ` ${className}` : "");
+    if (!guide) {
+        return (jsxRuntime.jsx("button", { type: "button", onClick: openHelp, "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: cls, "data-guide": "shell.help", children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
+    }
+    return (jsxRuntime.jsxs(erpTheme.DropdownMenu, { children: [jsxRuntime.jsx(erpTheme.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: cls, "data-guide": "shell.help", children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }) }), jsxRuntime.jsxs(erpTheme.DropdownMenuContent, { align: "end", sideOffset: 8, className: "w-64", onCloseAutoFocus: e => {
+                    // The quest panel takes focus; the button must not take it back.
+                    if (toGuide.current) {
+                        e.preventDefault();
+                        toGuide.current = false;
+                    }
+                }, children: [jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: () => {
+                            toGuide.current = true;
+                            setTimeout(openGuidePanel, 0);
+                        }, className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.Flag, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E44\u0E01\u0E14\u0E4C\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsxs("span", { className: "text-xs font-semibold text-primary tabular-nums", children: [guide.done, "/", guide.total] })] }), jsxRuntime.jsxs(erpTheme.DropdownMenuItem, { onSelect: () => setTimeout(openHelp, 0), className: "gap-2.5", children: [jsxRuntime.jsx(lucideReact.MessageCircle, { className: "size-4" }), jsxRuntime.jsx("span", { className: "flex-1", children: "\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E17\u0E35\u0E21\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })] })] }));
 }
 
 const hasPaginationShape = (payload) => {
@@ -3477,88 +3803,2744 @@ function resolveStaleOrganization({ code, organizations, organizationsStatus, or
     return { action: "forget" };
 }
 
-/**
- * Top-level app chrome: sticky header, sidebar slot, content gutter and the
- * session/org-context plumbing that both Accounting and HR need. Apps wrap
- * it inside their `SidebarProvider` (server-rendered with the cookie-backed
- * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
- * props.
- *
- * The padding contract is deliberately owned here so future style tweaks
- * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
- * an erp-shell bump — domain components must NOT add their own root padding
- * or content gets indented twice.
- */
-function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, organizationsStatus, notMemberComponent, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, showHelp = true, helpApp, }) {
-    const { data: session, status } = react.useSession();
-    const { open, setOpen } = useSidebar();
-    const router = navigation.useRouter();
-    const params = navigation.useParams();
-    const code = params?.code;
-    const extendedSession = session;
-    // Track once-authenticated so a transient accessToken drop during the
-    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
-    // blank the whole page. The initial-load gate below still handles cold
-    // start; once we've seen a real token we render children optimistically
-    // and let the API layer surface a real 401 if the token actually died.
-    const hasSeenAccessTokenRef = React.useRef(false);
-    React.useEffect(() => {
-        if (extendedSession?.accessToken)
-            hasSeenAccessTokenRef.current = true;
-    }, [extendedSession?.accessToken]);
-    // The URL's `[code]` is authoritative: the page mounts only once the active
-    // organisation is the one it names (see url-org-gate.ts).
-    //
-    // The gate used to start only when the code had resolved AND an active id
-    // existed, which left two holes. While the organisation list loaded, the
-    // page mounted at once and its first requests carried the previous
-    // organisation — /O26000021/procurement/purchase-requisition/<id> fetched
-    // the document from O26000019 before the switch. And a code naming none of
-    // the user's organisations never resolved, so the page rendered the
-    // previous organisation's data under it.
-    const urlOrgGate = resolveUrlOrgGate({
-        code,
-        organizations,
-        organizationsStatus,
-        organizationId,
-    });
-    const switchTargetId = urlOrgGate.state === "switching" ? urlOrgGate.targetId : null;
-    // Switch the active organisation to the URL's. Once per target: the setter
-    // writes the cookie through a server action, and re-firing it on every
-    // render while that round trip is in flight only queues duplicates.
-    const requestedSwitchRef = React.useRef(null);
-    React.useEffect(() => {
-        if (!switchTargetId) {
-            requestedSwitchRef.current = null;
-            return;
+/* ------------------------------------------------------------------ */
+/* Copy                                                                 */
+/* ------------------------------------------------------------------ */
+const COPY = {
+    fieldFix: "แก้ในช่องที่ไฮไลต์ แล้วกด ถัดไป",
+    saveFailed: "บันทึกไม่สำเร็จ",
+    blank: "ยังไม่ได้พิมพ์",
+    exitToast: "ออกจากไกด์แล้ว",
+    replayDone: "ทบทวนภารกิจเสร็จแล้ว",
+    replayEnded: "จบการทบทวนแล้ว",
+    hiddenToast: "ซ่อนแล้ว",
+    aborted: "ไกด์ไปต่อไม่ได้ ลองอีกครั้งภายหลัง",
+    bridgeTitle: "กดปุ่มเมนู",
+    bridgeWhy: (app) => `เมนูทั้งหมดของ ${app} อยู่ในนี้`,
+};
+/* ------------------------------------------------------------------ */
+/* Helpers                                                              */
+/* ------------------------------------------------------------------ */
+const BRIDGE_TARGET = "shell.menu-toggle";
+function initialGuideState(audience, progress) {
+    return {
+        audience,
+        progress,
+        screen: { name: "idle" },
+        panelOpen: false,
+        justDone: null,
+        chipPulse: 0,
+        nudge: 0,
+        gateDismissed: false,
+    };
+}
+function findMission(suite, key) {
+    return key ? suite.missions.find(m => m.key === key) : undefined;
+}
+function guideContext(env, data, params = {}) {
+    return {
+        code: env.code,
+        pathname: env.pathname,
+        search: env.search,
+        params: { code: env.code, ...params },
+        data,
+        facts: env.facts,
+        can: env.can,
+        visible: (anchor) => env.isVisible(anchor),
+    };
+}
+function resolveText(t, ctx) {
+    if (t === undefined)
+        return "";
+    try {
+        return typeof t === "function" ? t(ctx) : t;
+    }
+    catch {
+        return "";
+    }
+}
+/** Runs an app predicate; a throw counts as `fallback`. */
+function safe(fn, fallback) {
+    try {
+        return fn();
+    }
+    catch {
+        return fallback;
+    }
+}
+function triggersOf(step) {
+    if (!step.advanceOn)
+        return [];
+    return Array.isArray(step.advanceOn) ? step.advanceOn : [step.advanceOn];
+}
+function stepKind(step) {
+    return step.kind ?? "click";
+}
+/** The last checkpoint at or before `index` (a mission's first step always is one). */
+function checkpointAtOrBefore(steps, index) {
+    for (let i = Math.min(index, steps.length - 1); i > 0; i--) {
+        if (steps[i].checkpoint)
+            return i;
+    }
+    return 0;
+}
+function targetIdOf(step, ctx) {
+    if (typeof step.targetId === "function")
+        return safe(() => step.targetId(ctx), undefined);
+    return step.targetId;
+}
+/** Whether the step's target (or the bridge's) is on screen. */
+function stepTargetVisible(step, env, ctx, bridge) {
+    if (bridge)
+        return env.isVisible(BRIDGE_TARGET);
+    if (!step.target)
+        return true;
+    return env.isVisible(step.target, targetIdOf(step, ctx));
+}
+/** The anchor the spotlight is on for the current step. */
+function spotlightTarget(step, ctx, bridge) {
+    if (bridge)
+        return { anchor: BRIDGE_TARGET };
+    if (!step.target)
+        return null;
+    return { anchor: step.target, id: targetIdOf(step, ctx) };
+}
+function needsBridge(step, env, ctx) {
+    return (!!step.target &&
+        step.target.startsWith("nav.") &&
+        !env.sidebarOpen &&
+        !env.isVisible(step.target, targetIdOf(step, ctx)));
+}
+function routeParamsFor(step, env) {
+    if (!step.route)
+        return {};
+    return matchRoute(step.route, env.pathname, env.search, env.code) ?? {};
+}
+/** A state trigger (route, visible) that holds now; the capture event for it. */
+function stateTriggerHolds(step, env) {
+    for (const t of triggersOf(step)) {
+        if ("route" in t) {
+            const params = matchRoute(t.route, env.pathname, env.search, env.code);
+            if (params)
+                return { route: { pathname: env.pathname, params } };
         }
-        if (requestedSwitchRef.current === switchTargetId)
-            return;
-        requestedSwitchRef.current = switchTargetId;
-        void setOrganizationId(switchTargetId);
-    }, [switchTargetId, setOrganizationId]);
-    // Once the user's organisations are known, requests prefer a stored
-    // organisation that is one of them (getRequestOrganizationId).
-    const organizationsLoaded = (organizationsStatus ??
-        (organizations.length > 0 ? "success" : undefined)) === "success";
-    React.useEffect(() => {
-        if (organizationsLoaded) {
-            setKnownOrganizationIds(organizations.map(org => org.id));
+        else if ("visible" in t) {
+            if (env.isVisible(t.visible))
+                return {};
         }
-    }, [organizationsLoaded, organizations]);
-    // An active organisation that is not one of the user's — deleted, or left —
-    // is replaced, so it stops being sent with every request. The URL's
-    // organisation, when the user is a member, is the gate's switch above;
-    // otherwise the user's only organisation, or none (they pick one: the
-    // refusal below offers it, and a path without a code goes to the picker).
-    // Once per stale id and target, so a setter that does not take cannot loop.
-    const staleRecovery = resolveStaleOrganization({
-        code,
-        organizations,
-        organizationsStatus,
-        organizationId,
+    }
+    return null;
+}
+/** Any trigger that holds on a sync (route, visible, and — once armed — hidden). */
+function syncTriggerHolds(step, env, armed) {
+    const held = stateTriggerHolds(step, env);
+    if (held)
+        return held;
+    if (!armed)
+        return null;
+    for (const t of triggersOf(step)) {
+        if ("hidden" in t && !env.isVisible(t.hidden))
+            return {};
+    }
+    return null;
+}
+/** Whether any of the step's `hidden` anchors is on screen now. */
+function hiddenAnchorShown(step, env) {
+    return triggersOf(step).some(t => "hidden" in t && env.isVisible(t.hidden));
+}
+function missionCount(suite) {
+    return suite.missions.length;
+}
+function missionSettled(m, entry, ctx) {
+    if (entry?.status === "done")
+        return true;
+    if (m.optional && entry?.status === "skipped")
+        return true;
+    return safe(() => m.alreadyDone?.(ctx) === true, false);
+}
+function settledCount(suite, progress, ctx) {
+    return suite.missions.filter(m => missionSettled(m, progress.missions[m.key], ctx)).length;
+}
+function gateState(suite, ctx) {
+    if (!suite.gate)
+        return true;
+    return safe(() => suite.gate.ready(ctx), undefined);
+}
+function missionViews(suite, progress, ctx) {
+    const gate = gateState(suite, ctx);
+    const settled = (key) => {
+        const m = findMission(suite, key);
+        return !!m && missionSettled(m, progress.missions[key], ctx);
+    };
+    let nextMarked = false;
+    return suite.missions.map(mission => {
+        const entry = progress.missions[mission.key];
+        let view;
+        if (entry?.status === "done")
+            view = "done";
+        else if (safe(() => mission.alreadyDone?.(ctx) === true, false))
+            view = "already";
+        else if (entry?.status === "skipped")
+            view = "skipped";
+        else if (entry?.status === "active")
+            view = "active";
+        else if (gate === false)
+            view = "waiting";
+        else if ((mission.after ?? []).some(k => !settled(k)))
+            view = "locked";
+        else
+            view = "todo";
+        if (!nextMarked && (view === "todo" || view === "active" || view === "skipped")) {
+            nextMarked = true;
+            if (view === "todo")
+                view = "next";
+        }
+        return { mission, view, entry };
     });
-    const staleRecoveryTarget = staleRecovery.action === "forget"
+}
+/** The mission the celebration offers next: the first one not settled and not locked. */
+function nextMissionKey(suite, progress, ctx) {
+    for (const v of missionViews(suite, progress, ctx)) {
+        if (v.view === "next" || v.view === "todo" || v.view === "active" || v.view === "skipped") {
+            return v.mission.key;
+        }
+    }
+    return null;
+}
+/** Whether the welcome should open by itself. */
+function welcomeDue(state, suite) {
+    return (state.audience === "forced" &&
+        state.progress.welcome === "not_seen" &&
+        state.progress.status === "in_progress" &&
+        !state.progress.mission_key &&
+        state.screen.name === "idle" &&
+        suite.missions.length > 0);
+}
+/** Whether the floating "ภารกิจ n/N" chip shows. */
+function chipVisible(state, suite, ctx) {
+    return (state.audience !== "none" &&
+        state.progress.welcome !== "not_seen" &&
+        state.progress.status !== "completed" &&
+        !state.progress.chip_hidden &&
+        state.screen.name === "idle" &&
+        !state.panelOpen &&
+        settledCount(suite, state.progress, ctx) < missionCount(suite));
+}
+function withProgress(d, patch) {
+    d.state = { ...d.state, progress: { ...d.state.progress, ...patch } };
+}
+function setMission(d, key, entry) {
+    withProgress(d, { missions: { ...d.state.progress.missions, [key]: entry } });
+}
+function setScreen(d, screen) {
+    d.state = { ...d.state, screen };
+}
+function save(d, immediate = false) {
+    const existing = d.effects.find(e => e.type === "save");
+    if (existing)
+        existing.immediate = existing.immediate || immediate;
+    else
+        d.effects.push({ type: "save", immediate });
+}
+function announceStep(d, suite, env) {
+    const s = d.state.screen;
+    if (s.name !== "step")
+        return;
+    const mission = findMission(suite, s.mission);
+    if (!mission)
+        return;
+    const step = mission.steps[s.index];
+    const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+    const title = s.bridge ? COPY.bridgeTitle : plainTitle(resolveText(step.title, ctx));
+    const why = s.bridge ? COPY.bridgeWhy(suite.appName) : resolveText(step.why, ctx);
+    d.effects.push({
+        type: "announce",
+        text: `ขั้นที่ ${s.index + 1} จาก ${mission.steps.length}. ${title}${why ? `. ${why}` : ""}`,
+    });
+}
+/** "กด [บันทึก]" → "กด บันทึก" (for screen readers). */
+function plainTitle(t) {
+    return t.replace(/\[([^\]]+)\]/g, "$1");
+}
+/**
+ * Enter step `index` of the mission (or the first one after it that is not
+ * skipped, forbidden or already passed). Past the end, the mission is over.
+ */
+function enterStep(d, suite, env, mission, index, opts) {
+    const steps = mission.steps;
+    let i = Math.max(0, index);
+    let firstPass = true;
+    while (i < steps.length) {
+        const step = steps[i];
+        const params = routeParamsFor(step, env);
+        const ctx = guideContext(env, d.state.progress.context, params);
+        if (step.requires && !safe(() => env.can(step.requires), true)) {
+            withProgress(d, { last_error: `forbidden:${step.requires}`.slice(0, 128) });
+            i++;
+            continue;
+        }
+        if (step.skipIf && safe(() => step.skipIf(ctx), false)) {
+            i++;
+            continue;
+        }
+        const autoPass = step.autoPass !== false && !(firstPass && opts.noAutoPass);
+        firstPass = false;
+        if (autoPass && stepKind(step) !== "input" && stepKind(step) !== "view") {
+            const held = stateTriggerHolds(step, env);
+            if (held) {
+                captureInto(d, step, held, ctx);
+                i++;
+                continue;
+            }
+        }
+        break;
+    }
+    if (i >= steps.length) {
+        finishMission(d, suite, env, mission, opts.replay);
+        return;
+    }
+    const step = steps[i];
+    const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+    const away = !!step.route && !matchRoute(step.route, env.pathname, env.search, env.code);
+    const bridge = !away && needsBridge(step, env, ctx);
+    setScreen(d, {
+        name: "step",
+        mission: mission.key,
+        index: i,
+        replay: opts.replay,
+        bridge,
+        phase: away ? "away" : "waiting",
+        error: opts.error ?? null,
+        confirmExit: false,
+        misses: 0,
+        armed: hiddenAnchorShown(step, env),
+    });
+    if (!opts.replay) {
+        const cp = checkpointAtOrBefore(steps, i);
+        setMission(d, mission.key, { status: "active", step_key: step.key });
+        withProgress(d, {
+            mission_key: mission.key,
+            step_key: step.key,
+            step_index: i,
+            checkpoint_key: steps[cp].key,
+        });
+        save(d);
+    }
+    if (!away) {
+        // The target may already be there.
+        markReadyIfVisible(d, suite, env);
+    }
+}
+function markReadyIfVisible(d, suite, env) {
+    const s = d.state.screen;
+    if (s.name !== "step" || s.phase !== "waiting")
+        return;
+    const mission = findMission(suite, s.mission);
+    if (!mission)
+        return;
+    const step = mission.steps[s.index];
+    const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+    if (stepTargetVisible(step, env, ctx, s.bridge)) {
+        setScreen(d, { ...s, phase: "ready" });
+        announceStep(d, suite, env);
+        if (s.error)
+            d.effects.push({ type: "announce", text: s.error.title });
+    }
+}
+function captureInto(d, step, e, ctx) {
+    if (!step.capture)
+        return;
+    const got = safe(() => step.capture(e, ctx), undefined);
+    if (!got)
+        return;
+    const clean = {};
+    for (const [k, v] of Object.entries(got)) {
+        if (typeof v === "string" && v)
+            clean[k] = v;
+    }
+    if (Object.keys(clean).length) {
+        withProgress(d, { context: { ...d.state.progress.context, ...clean } });
+    }
+}
+function advance(d, suite, env, capture) {
+    const s = d.state.screen;
+    if (s.name !== "step")
+        return;
+    const mission = findMission(suite, s.mission);
+    if (!mission)
+        return;
+    const step = mission.steps[s.index];
+    if (capture) {
+        captureInto(d, step, capture, guideContext(env, d.state.progress.context, routeParamsFor(step, env)));
+    }
+    enterStep(d, suite, env, mission, s.index + 1, { replay: s.replay });
+}
+function finishMission(d, suite, env, mission, replay) {
+    if (replay) {
+        setScreen(d, { name: "idle" });
+        d.effects.push({ type: "toast", text: COPY.replayDone });
+        return;
+    }
+    setMission(d, mission.key, { status: "done", step_key: null, skipped_step: null });
+    withProgress(d, {
+        mission_key: null,
+        step_key: null,
+        step_index: 0,
+        checkpoint_key: null,
+        context: {},
+        last_error: null,
+    });
+    const ctx = guideContext(env, {});
+    const all = settledCount(suite, d.state.progress, ctx) >= missionCount(suite);
+    if (all)
+        withProgress(d, { status: "completed" });
+    setScreen(d, all ? { name: "complete" } : { name: "celebrate", mission: mission.key });
+    d.state = { ...d.state, justDone: mission.key };
+    save(d, true);
+    const n = settledCount(suite, d.state.progress, ctx);
+    const N = missionCount(suite);
+    const title = resolveText(mission.done?.title, ctx) || `${mission.title}แล้ว`;
+    d.effects.push({
+        type: "announce",
+        text: all
+            ? `ครบ ${N} ภารกิจ ${resolveText(suite.complete.title, ctx) || "บริษัทพร้อมใช้งานแล้ว"}`
+            : `ภารกิจสำเร็จ ${title} เสร็จ ${n} จาก ${N} ภารกิจ`,
+    });
+}
+function startMission(d, suite, env, key, replay) {
+    const mission = findMission(suite, key);
+    if (!mission || mission.steps.length === 0)
+        return;
+    const entry = d.state.progress.missions[key];
+    // A mission already done is only ever replayed; its done status stays.
+    const isReplay = replay || entry?.status === "done";
+    d.state = { ...d.state, panelOpen: false, justDone: null };
+    if (d.state.progress.welcome === "not_seen")
+        withProgress(d, { welcome: "started" });
+    if (!isReplay && d.state.progress.mission_key !== key)
+        withProgress(d, { context: {} });
+    if (!isReplay && d.state.progress.status !== "in_progress") {
+        // Picking up an optional mission after the tour completed.
+        withProgress(d, { status: "in_progress" });
+    }
+    // Resume where it was left: back to the checkpoint at or before it.
+    let index = 0;
+    if (!isReplay && entry && (entry.status === "active" || entry.status === "skipped")) {
+        const at = mission.steps.findIndex(s => s.key === (entry.step_key ?? entry.skipped_step));
+        if (at > 0)
+            index = checkpointAtOrBefore(mission.steps, at);
+    }
+    enterStep(d, suite, env, mission, index, { replay: isReplay });
+    if (isReplay)
+        save(d);
+}
+function exitMission(d) {
+    const s = d.state.screen;
+    if (s.name !== "step")
+        return;
+    if (!s.replay) {
+        const prev = d.state.progress.missions[s.mission];
+        if (prev?.status !== "done") {
+            setMission(d, s.mission, {
+                status: "skipped",
+                step_key: d.state.progress.step_key,
+                skipped_step: d.state.progress.step_key,
+            });
+        }
+        withProgress(d, { mission_key: null });
+        save(d, true);
+    }
+    d.state = { ...d.state, chipPulse: d.state.chipPulse + 1 };
+    setScreen(d, { name: "idle" });
+}
+function triggerMatchesSignal(t, sig, env, ctx) {
+    if ("api" in t && sig.kind === "api") {
+        if (t.api.method && t.api.method.toUpperCase() !== sig.method.toUpperCase())
+            return null;
+        if (!matchApiPath(t.api.path, sig.path))
+            return null;
+        if (!matchStatus(t.api.status, sig.status))
+            return null;
+        return { api: { method: sig.method.toUpperCase(), path: sig.path, status: sig.status, id: sig.id } };
+    }
+    if ("event" in t && sig.kind === "event") {
+        return t.event === sig.name ? { event: { name: sig.name, detail: sig.detail } } : null;
+    }
+    if ("activate" in t && sig.kind === "activate")
+        return {};
+    if ("value" in t && sig.kind === "value") {
+        return safe(() => t.value(sig.value, ctx), false) ? {} : null;
+    }
+    return null;
+}
+/** A refused save that a commit step listens for. */
+function apiFailureFor(step, sig) {
+    if (sig.kind !== "api" || sig.status < 400)
+        return false;
+    return triggersOf(step).some(t => "api" in t &&
+        (!t.api.method || t.api.method.toUpperCase() === sig.method.toUpperCase()) &&
+        matchApiPath(t.api.path, sig.path));
+}
+function reduceGuide(state, action, suite, env) {
+    const d = { state, effects: [] };
+    const s = state.screen;
+    const ctxNow = () => guideContext(env, d.state.progress.context);
+    switch (action.type) {
+        case "welcome": {
+            if (!welcomeDue(state, suite))
+                break;
+            const gate = gateState(suite, ctxNow());
+            if (gate === undefined)
+                break;
+            if (gate === false) {
+                if (!state.gateDismissed)
+                    setScreen(d, { name: "gate" });
+                break;
+            }
+            setScreen(d, { name: "welcome", confirm: false });
+            break;
+        }
+        case "welcomeSkip":
+            if (s.name === "welcome")
+                setScreen(d, { name: "welcome", confirm: true });
+            break;
+        case "welcomeStart":
+        case "welcomeSkipCancel": {
+            if (s.name !== "welcome")
+                break;
+            const first = nextMissionKey(suite, d.state.progress, ctxNow());
+            if (first)
+                startMission(d, suite, env, first, false);
+            else
+                setScreen(d, { name: "idle" });
+            break;
+        }
+        case "welcomeSkipConfirm":
+            if (s.name !== "welcome")
+                break;
+            withProgress(d, { welcome: "skipped" });
+            d.state = { ...d.state, chipPulse: d.state.chipPulse + 1 };
+            setScreen(d, { name: "idle" });
+            save(d, true);
+            break;
+        case "gateLater":
+            if (s.name === "gate") {
+                d.state = { ...d.state, gateDismissed: true };
+                setScreen(d, { name: "idle" });
+            }
+            break;
+        case "start":
+            if (state.audience === "none")
+                break;
+            if (s.name === "step" && !s.replay && s.mission !== action.mission) {
+                // Leaving one mission for another: the first is set aside.
+                exitMission(d);
+            }
+            startMission(d, suite, env, action.mission, !!action.replay);
+            break;
+        case "resume": {
+            if (state.audience === "none" || s.name !== "idle")
+                break;
+            const mission = findMission(suite, d.state.progress.mission_key);
+            if (!mission || d.state.progress.missions[mission.key]?.status !== "active")
+                break;
+            // Back to the last checkpoint at or before the step reached; the saved
+            // checkpoint when the step is no longer in the tour.
+            const stepAt = mission.steps.findIndex(st => st.key === d.state.progress.step_key);
+            const cpAt = mission.steps.findIndex(st => st.key === d.state.progress.checkpoint_key);
+            const index = stepAt >= 0 ? checkpointAtOrBefore(mission.steps, stepAt) : Math.max(cpAt, 0);
+            enterStep(d, suite, env, mission, index, { replay: false });
+            break;
+        }
+        case "sync": {
+            if (s.name !== "step")
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+            if (s.phase === "away") {
+                if (!step.route || matchRoute(step.route, env.pathname, env.search, env.code)) {
+                    // Arrived: run the step again from here (it may already be passed).
+                    enterStep(d, suite, env, mission, s.index, { replay: s.replay, error: s.error });
+                }
+                break;
+            }
+            if (s.confirmExit)
+                break;
+            const kind = stepKind(step);
+            const armed = s.armed || hiddenAnchorShown(step, env);
+            if (kind !== "input" && kind !== "view") {
+                const held = syncTriggerHolds(step, env, armed);
+                if (held) {
+                    advance(d, suite, env, held);
+                    break;
+                }
+            }
+            if (armed !== s.armed)
+                setScreen(d, { ...s, armed });
+            const cur = d.state.screen;
+            // The menu step: done once the sidebar is open; needed again if shut.
+            if (cur.bridge && (env.sidebarOpen || stepTargetVisible(step, env, ctx, false))) {
+                setScreen(d, { ...cur, bridge: false, phase: "waiting" });
+            }
+            else if (!cur.bridge && needsBridge(step, env, ctx)) {
+                setScreen(d, { ...cur, bridge: true, phase: "waiting" });
+            }
+            markReadyIfVisible(d, suite, env);
+            break;
+        }
+        case "signal": {
+            if (s.name !== "step" || s.phase === "away" || s.confirmExit)
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+            const sig = action.signal;
+            if (sig.kind === "typing") {
+                if (s.error)
+                    setScreen(d, { ...s, error: null });
+                break;
+            }
+            if (s.bridge)
+                break;
+            for (const t of triggersOf(step)) {
+                const hit = triggerMatchesSignal(t, sig, env, ctx);
+                if (hit) {
+                    advance(d, suite, env, hit);
+                    return { state: d.state, effects: d.effects };
+                }
+            }
+            if (sig.kind === "api" && stepKind(step) === "commit" && apiFailureFor(step, sig)) {
+                const mapped = safe(() => step.onApiError?.({ status: sig.status, message: sig.message }, ctx), undefined);
+                if (mapped && mapped.step) {
+                    const to = mission.steps.findIndex(st => st.key === mapped.step);
+                    if (to >= 0) {
+                        enterStep(d, suite, env, mission, to, {
+                            replay: s.replay,
+                            noAutoPass: true,
+                            error: { title: mapped.message ?? sig.message ?? COPY.saveFailed, detail: COPY.fieldFix },
+                        });
+                        break;
+                    }
+                }
+                const error = mapped?.message
+                    ? { title: mapped.message, detail: undefined }
+                    : { title: COPY.saveFailed, detail: sig.message };
+                setScreen(d, { ...s, error });
+                d.effects.push({ type: "announce", text: [error.title, error.detail].filter(Boolean).join(". ") });
+                withProgress(d, { last_error: `api_${sig.status}:${step.key}`.slice(0, 128) });
+            }
+            break;
+        }
+        case "next": {
+            if (s.name !== "step" || s.phase !== "ready" || s.confirmExit || s.bridge)
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const kind = stepKind(step);
+            if (kind === "view") {
+                advance(d, suite, env);
+                break;
+            }
+            if (kind !== "input")
+                break;
+            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+            const value = safe(() => env.targetValue(), "");
+            const problem = step.validate
+                ? safe(() => step.validate(value, ctx), null)
+                : value.trim()
+                    ? null
+                    : COPY.blank;
+            if (problem) {
+                setScreen(d, { ...s, error: { title: problem, detail: COPY.fieldFix } });
+                d.state = { ...d.state, nudge: d.state.nudge + 1 };
+                d.effects.push({ type: "announce", text: problem });
+            }
+            else {
+                advance(d, suite, env);
+            }
+            break;
+        }
+        case "targetLost": {
+            if (s.name !== "step" || s.phase !== "ready" || s.confirmExit)
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const ctx = guideContext(env, d.state.progress.context, routeParamsFor(step, env));
+            if (stepTargetVisible(step, env, ctx, s.bridge))
+                break;
+            const cp = checkpointAtOrBefore(mission.steps, s.index);
+            if (cp < s.index && !s.bridge) {
+                // A dialog or a menu closed under the step: back to what opens it.
+                enterStep(d, suite, env, mission, cp, { replay: s.replay, noAutoPass: false });
+            }
+            else {
+                setScreen(d, { ...s, phase: "waiting" });
+            }
+            break;
+        }
+        case "timeout": {
+            if (s.name !== "step" || s.phase !== "waiting")
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const anchor = s.bridge ? BRIDGE_TARGET : (step.target ?? step.key);
+            withProgress(d, { last_error: `target_missing:${anchor}`.slice(0, 128) });
+            save(d);
+            const misses = s.misses + 1;
+            const policy = step.onMissing ?? "retry";
+            const cp = checkpointAtOrBefore(mission.steps, s.index);
+            if (policy === "skip") {
+                advance(d, suite, env);
+            }
+            else if (policy === "abort") {
+                exitMission(d);
+                d.effects.push({ type: "toast", text: COPY.aborted });
+            }
+            else if ((policy === "rewind" || (policy === "retry" && misses >= 2)) && cp < s.index) {
+                enterStep(d, suite, env, mission, cp, { replay: s.replay });
+                const now = d.state.screen;
+                if (now.name === "step" && now.index === s.index) {
+                    // The checkpoint passed straight back to this step (its dialog is
+                    // still open): going back cannot help, so say so.
+                    setScreen(d, { ...now, phase: "missing", misses });
+                    d.effects.push({ type: "announce", text: "ไม่พบส่วนนี้บนหน้า" });
+                }
+            }
+            else {
+                setScreen(d, { ...s, phase: "missing", misses });
+                d.effects.push({ type: "announce", text: "ไม่พบส่วนนี้บนหน้า" });
+            }
+            break;
+        }
+        case "retry":
+            if (s.name === "step" && s.phase === "missing") {
+                setScreen(d, { ...s, phase: "waiting" });
+                markReadyIfVisible(d, suite, env);
+            }
+            break;
+        case "blocked":
+            if (s.name === "step")
+                d.state = { ...d.state, nudge: d.state.nudge + 1 };
+            break;
+        case "exit":
+            if (s.name !== "step")
+                break;
+            if (s.replay) {
+                setScreen(d, { name: "idle" });
+                d.effects.push({ type: "toast", text: COPY.replayEnded });
+            }
+            else {
+                setScreen(d, { ...s, confirmExit: true });
+            }
+            break;
+        case "exitCancel":
+            if (s.name === "step" && s.confirmExit)
+                setScreen(d, { ...s, confirmExit: false });
+            break;
+        case "exitConfirm":
+            if (s.name !== "step")
+                break;
+            exitMission(d);
+            d.effects.push({ type: "toast", text: COPY.exitToast });
+            break;
+        case "endWithoutSave":
+            if (s.name !== "step" || !s.replay)
+                break;
+            setScreen(d, { name: "idle" });
+            d.effects.push({ type: "closeAppDialog" }, { type: "toast", text: COPY.replayEnded });
+            break;
+        case "goResume": {
+            if (s.name !== "step" || s.phase !== "away")
+                break;
+            const mission = findMission(suite, s.mission);
+            if (!mission)
+                break;
+            const step = mission.steps[s.index];
+            const ctx = guideContext(env, d.state.progress.context);
+            const href = safe(() => step.resumeUrl?.(ctx), undefined) ??
+                (step.route ? fillRoute(step.route, { ...d.state.progress.context, code: env.code }) : null);
+            if (href)
+                d.effects.push({ type: "navigate", href });
+            break;
+        }
+        case "celebrateNext": {
+            if (s.name !== "celebrate")
+                break;
+            const next = nextMissionKey(suite, d.state.progress, ctxNow());
+            if (next)
+                startMission(d, suite, env, next, false);
+            else
+                setScreen(d, { name: "idle" });
+            break;
+        }
+        case "rest":
+            if (s.name !== "celebrate")
+                break;
+            setScreen(d, { name: "idle" });
+            d.state = { ...d.state, panelOpen: true, justDone: s.mission };
+            break;
+        case "finish": {
+            if (s.name !== "complete")
+                break;
+            setScreen(d, { name: "idle" });
+            const href = resolveText(suite.complete.action.href, ctxNow());
+            const filled = href ? (fillRoute(href, { code: env.code }) ?? href) : "";
+            if (filled)
+                d.effects.push({ type: "navigate", href: filled });
+            break;
+        }
+        case "openPanel":
+            if (state.audience !== "none" && s.name === "idle") {
+                d.state = { ...d.state, panelOpen: true };
+            }
+            break;
+        case "closePanel":
+            d.state = { ...d.state, panelOpen: false, justDone: null };
+            break;
+        case "hideChip":
+            withProgress(d, { chip_hidden: true });
+            d.state = { ...d.state, panelOpen: false };
+            d.effects.push({ type: "toast", text: COPY.hiddenToast });
+            save(d, true);
+            break;
+        case "dismissMission": {
+            const m = findMission(suite, action.mission);
+            if (!m?.optional)
+                break;
+            setMission(d, m.key, { status: "skipped", step_key: null, skipped_step: null });
+            const all = settledCount(suite, d.state.progress, ctxNow()) >= missionCount(suite);
+            if (all) {
+                withProgress(d, { status: "completed" });
+                d.state = { ...d.state, panelOpen: false };
+                setScreen(d, { name: "complete" });
+            }
+            save(d, true);
+            break;
+        }
+        case "serverRow": {
+            // A saved row came back: its rev, the server's status, and the dates
+            // the server stamps on missions ("เสร็จ 26 ต.ค. 2569 13:04").
+            const missions = { ...d.state.progress.missions };
+            for (const [k, m] of Object.entries(missions)) {
+                const r = action.progress.missions[k];
+                if (r && r.status === m.status) {
+                    missions[k] = { ...m, completed_at: r.completed_at ?? m.completed_at, skipped_at: r.skipped_at ?? m.skipped_at };
+                }
+            }
+            withProgress(d, { rev: action.progress.rev, server_status: action.progress.server_status, missions });
+            break;
+        }
+    }
+    return { state: d.state, effects: d.effects };
+}
+
+/**
+ * A tour's progress as platform-api stores it (one row per user, org and
+ * suite: GET/PUT /organizations/:id/guides/me), and the rules for reading,
+ * writing and merging it. See _claude-work/peoplx-guide/API.md.
+ *
+ * No runtime imports: the tests run this file in Node as it is.
+ */
+const KEY_RE = /^[a-z0-9][a-z0-9._-]{0,63}$/;
+const isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+const str = (v) => (typeof v === "string" && v !== "" ? v : null);
+function freshProgress(version, rev = 0) {
+    return {
+        guide_version: version,
+        rev,
+        status: "in_progress",
+        mission_key: null,
+        step_key: null,
+        step_index: 0,
+        checkpoint_key: null,
+        missions: {},
+        context: {},
+        welcome: "not_seen",
+        chip_hidden: false,
+        last_error: null,
+        skipped_step: null,
+        server_status: null,
+    };
+}
+const ROW_STATUSES = ["in_progress", "completed", "skipped", "aborted"];
+const MISSION_STATUSES = ["todo", "active", "done", "skipped"];
+const WELCOMES = ["not_seen", "started", "skipped"];
+/** One row (a GET `guides[]` entry, a PUT answer, a 409's `current`). Null when off-shape. */
+function parseRow(raw) {
+    if (!isRecord(raw))
+        return null;
+    const version = Number(raw.guide_version);
+    const rev = Number(raw.rev);
+    if (!Number.isInteger(version) || version < 1 || !Number.isInteger(rev) || rev < 0)
+        return null;
+    const status = ROW_STATUSES.includes(raw.status)
+        ? raw.status
+        : "in_progress";
+    const missions = {};
+    if (isRecord(raw.missions)) {
+        for (const [k, v] of Object.entries(raw.missions)) {
+            if (!isRecord(v) || !MISSION_STATUSES.includes(v.status))
+                continue;
+            missions[k] = {
+                status: v.status,
+                step_key: str(v.step_key),
+                skipped_step: str(v.skipped_step),
+                completed_at: str(v.completed_at),
+                skipped_at: str(v.skipped_at),
+            };
+        }
+    }
+    const context = {};
+    if (isRecord(raw.context)) {
+        for (const [k, v] of Object.entries(raw.context)) {
+            if (typeof v === "string")
+                context[k] = v;
+            else if (typeof v === "number")
+                context[k] = String(v);
+        }
+    }
+    return {
+        guide_version: version,
+        rev,
+        status,
+        mission_key: str(raw.mission_key),
+        step_key: str(raw.step_key),
+        step_index: Number.isInteger(raw.step_index) ? raw.step_index : 0,
+        checkpoint_key: str(raw.checkpoint_key),
+        missions,
+        context,
+        welcome: WELCOMES.includes(raw.welcome) ? raw.welcome : "not_seen",
+        chip_hidden: raw.chip_hidden === true,
+        last_error: str(raw.last_error),
+        skipped_step: str(raw.skipped_step),
+        server_status: status,
+    };
+}
+/**
+ * The GET answer for one suite. Null — show nothing — for anything that is
+ * not the expected shape (an older API, a proxy's page, another app's answer).
+ */
+function parseGuidesAnswer(payload, suite) {
+    if (!isRecord(payload))
+        return null;
+    const data = isRecord(payload.data) ? payload.data : payload;
+    const mode = data.mode;
+    const audience = data.audience;
+    if (mode !== "off" && mode !== "invite" && mode !== "forced")
+        return null;
+    if (audience !== "forced" && audience !== "optional" && audience !== "none")
+        return null;
+    if (typeof data.app === "string" && data.app !== suite.app)
+        return null;
+    const rows = Array.isArray(data.guides) ? data.guides : [];
+    let row = null;
+    for (const r of rows) {
+        if (isRecord(r) && r.guide_key === suite.key) {
+            row = parseRow(r);
+            break;
+        }
+    }
+    let progress;
+    let newerOnServer = false;
+    if (!row)
+        progress = freshProgress(suite.version);
+    else if (row.guide_version < suite.version) {
+        // A new version of the tour: start over (the server resets the row on the
+        // PUT); keep the rev the server will check.
+        progress = { ...freshProgress(suite.version, row.rev), server_status: row.server_status };
+    }
+    else {
+        progress = row;
+        newerOnServer = row.guide_version > suite.version;
+    }
+    return { mode, audience: mode === "off" ? "none" : audience, progress, newerOnServer };
+}
+const TERMINAL = ["completed", "skipped", "aborted"];
+/** The PUT body for the client's state. Drops keys the server would refuse. */
+function putBody(p, app) {
+    const key = (k) => (k && KEY_RE.test(k) ? k : null);
+    const missions = {};
+    for (const [k, m] of Object.entries(p.missions)) {
+        if (!KEY_RE.test(k))
+            continue;
+        missions[k] = {
+            status: m.status,
+            step_key: key(m.step_key ?? null),
+            skipped_step: key(m.skipped_step ?? null),
+        };
+    }
+    const context = {};
+    for (const [k, v] of Object.entries(p.context)) {
+        if (typeof v === "string" && v.length <= 200)
+            context[k] = v;
+    }
+    return {
+        app,
+        guide_version: p.guide_version,
+        rev: p.rev,
+        status: p.status,
+        mission_key: key(p.mission_key),
+        step_key: key(p.step_key),
+        step_index: Math.max(0, Math.min(1000, Math.floor(p.step_index || 0))),
+        checkpoint_key: key(p.checkpoint_key),
+        missions,
+        context,
+        welcome: p.welcome,
+        chip_hidden: p.chip_hidden,
+        last_error: p.last_error ? p.last_error.slice(0, 128) : null,
+        skipped_step: key(p.skipped_step),
+        restart: p.status === "in_progress" &&
+            p.server_status !== null &&
+            TERMINAL.includes(p.server_status),
+    };
+}
+const MISSION_RANK = { todo: 0, skipped: 1, active: 1, done: 3 };
+const WELCOME_RANK = { not_seen: 0, skipped: 1, started: 1 };
+/**
+ * After a 409: this tab's state laid over the server's, keeping whatever is
+ * further along — a mission done anywhere stays done, the welcome once seen
+ * stays seen, a hidden chip stays hidden. Otherwise this tab's own choice
+ * wins. The rev is the server's.
+ */
+function mergeProgress(local, remote) {
+    const missions = { ...remote.missions };
+    for (const [k, m] of Object.entries(local.missions)) {
+        const r = remote.missions[k];
+        missions[k] = !r || MISSION_RANK[m.status] >= MISSION_RANK[r.status] ? { ...r, ...m } : r;
+    }
+    const welcome = WELCOME_RANK[local.welcome] >= WELCOME_RANK[remote.welcome] ? local.welcome : remote.welcome;
+    const completed = local.status === "completed" || remote.status === "completed";
+    const mission_key = local.mission_key && missions[local.mission_key]?.status === "active"
+        ? local.mission_key
+        : remote.mission_key && missions[remote.mission_key]?.status === "active"
+            ? remote.mission_key
+            : null;
+    const fromLocal = mission_key !== null && mission_key === local.mission_key;
+    return {
+        ...local,
+        rev: remote.rev,
+        server_status: remote.server_status,
+        status: completed ? "completed" : local.status,
+        missions,
+        welcome,
+        chip_hidden: local.chip_hidden || remote.chip_hidden,
+        mission_key,
+        step_key: fromLocal ? local.step_key : mission_key ? remote.step_key : null,
+        step_index: fromLocal ? local.step_index : mission_key ? remote.step_index : 0,
+        checkpoint_key: fromLocal ? local.checkpoint_key : mission_key ? remote.checkpoint_key : null,
+        context: fromLocal ? local.context : mission_key ? remote.context : {},
+    };
+}
+/**
+ * Which of two copies (sessionStorage after F5, the server) to resume from:
+ * the one further along for the same version; the server's on a tie.
+ */
+function furtherProgress(a, b) {
+    const score = (p) => Object.values(p.missions).reduce((s, m) => s + MISSION_RANK[m.status] * 1000, 0) +
+        (p.mission_key ? 100 + p.step_index : 0) +
+        WELCOME_RANK[p.welcome];
+    return score(a) > score(b) ? a : b;
+}
+
+/**
+ * Talking to platform-api about tour progress (API.md): the GET that says
+ * who sees what, and the PUT that saves, with its rev check.
+ */
+function base(app) {
+    return platformApiBase(app);
+}
+/** GET …/guides/me?app=…; null (show nothing) on any failure or odd answer. */
+async function fetchGuides(organizationId, suite, signal) {
+    try {
+        const res = await instance.get(`${base(suite.app)}/organizations/${encodeURIComponent(organizationId)}/guides/me`, { params: { app: suite.app }, signal, erpOrganizationId: organizationId });
+        return parseGuidesAnswer(res.data, suite);
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * PUT the whole state. On 409 the server's row comes back: merge (keeping
+ * whatever is further along) and try once more with its rev. Returns the
+ * stored row, or null when it could not be saved (the tour goes on; the
+ * session copy keeps the place).
+ */
+async function saveGuides(organizationId, suite, progress) {
+    const url = `${base(suite.app)}/organizations/${encodeURIComponent(organizationId)}/guides/me/${encodeURIComponent(suite.key)}`;
+    let body = progress;
+    for (let attempt = 0; attempt < 2; attempt++) {
+        let res;
+        try {
+            res = await instance.put(url, putBody(body, suite.app), {
+                validateStatus: s => (s >= 200 && s < 300) || s === 409,
+                erpOrganizationId: organizationId,
+            });
+        }
+        catch {
+            return null;
+        }
+        const payload = res.data;
+        if (res.status !== 409) {
+            return parseRow(payload?.data ?? payload);
+        }
+        const current = parseRow(payload?.current);
+        if (current && current.guide_version > body.guide_version) {
+            // Another app build is ahead of this one: stop writing.
+            return null;
+        }
+        if (!current)
+            body = { ...body, rev: 0, server_status: null };
+        else if (current.guide_version < body.guide_version) {
+            // The server's row is the previous version: this one replaces it.
+            body = { ...body, rev: current.rev, server_status: current.server_status };
+        }
+        else
+            body = mergeProgress(body, current);
+    }
+    return null;
+}
+
+/**
+ * The tour's DOM side: finding anchors, deciding whether one is really on
+ * screen, and the rectangles the spotlight cuts out. Browser only; every
+ * function tolerates a missing document.
+ */
+const hasDocument = () => typeof document !== "undefined";
+function cssString(value) {
+    return `"${value.replace(/["\\]/g, "\\$&")}"`;
+}
+function anchorSelector(anchor, id) {
+    return (`[${GUIDE_ATTRIBUTE}=${cssString(anchor)}]` +
+        (id ? `[${GUIDE_ID_ATTRIBUTE}=${cssString(id)}]` : ""));
+}
+/**
+ * On screen: connected, with a size, not hidden by style, not inside
+ * aria-hidden or inert (other than the guide's own), not a closed Radix part.
+ *
+ * aria-hidden that Radix put there (data-aria-hidden: everything outside an
+ * open dialog, select or menu is hidden from screen readers) does not count:
+ * a dialog's field is still on screen while its select's list is open.
+ */
+function isPresent(el) {
+    if (!el || !el.isConnected)
+        return false;
+    const r = el.getBoundingClientRect();
+    if (r.width <= 0 || r.height <= 0)
+        return false;
+    // Slid off the side (a closed drawer); off the top or bottom is only
+    // scrolled away, and the tour scrolls it back.
+    if (r.right <= 0 || r.left >= window.innerWidth)
+        return false;
+    if (el.getAttribute("data-state") === "closed")
+        return false;
+    const style = getComputedStyle(el);
+    if (style.visibility === "hidden" || style.display === "none")
+        return false;
+    for (let n = el; n; n = n.parentElement) {
+        if (n.hasAttribute(GUIDE_LAYER_ATTRIBUTE))
+            break;
+        if (n.hasAttribute("inert"))
+            return false;
+        if (n.getAttribute("aria-hidden") === "true" && !n.hasAttribute("data-aria-hidden"))
+            return false;
+    }
+    return true;
+}
+/** The first matching anchor that is on screen. */
+function findAnchor(anchor, id) {
+    if (!hasDocument() || !anchor)
+        return null;
+    let list;
+    try {
+        list = document.querySelectorAll(anchorSelector(anchor, id));
+    }
+    catch {
+        return null;
+    }
+    for (const el of Array.from(list)) {
+        if (isPresent(el))
+            return el;
+    }
+    return null;
+}
+function anchorVisible(anchor, id) {
+    return findAnchor(anchor, id) !== null;
+}
+const FIELD = "input:not([type=hidden]),textarea,select,[contenteditable=''],[contenteditable=true]";
+/** The field to type into: the anchor itself, or the first field inside it. */
+function fieldOf(el) {
+    if (!el)
+        return null;
+    if (el.matches(FIELD))
+        return el;
+    return el.querySelector(FIELD);
+}
+function fieldValue(el) {
+    const f = fieldOf(el);
+    if (!f)
+        return "";
+    if ("value" in f && typeof f.value === "string")
+        return f.value;
+    return f.textContent ?? "";
+}
+const FOCUSABLE = "a[href],button:not([disabled]),input:not([disabled]):not([type=hidden]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex='-1']),[contenteditable=''],[contenteditable=true]";
+function focusablesIn(root) {
+    if (!root)
+        return [];
+    const own = root.matches(FOCUSABLE) ? [root] : [];
+    return own.concat(Array.from(root.querySelectorAll(FOCUSABLE)).filter(isPresent));
+}
+function rectOf(el) {
+    const r = el.getBoundingClientRect();
+    return { x: r.left, y: r.top, width: r.width, height: r.height };
+}
+function padRect(r, pad) {
+    return { x: r.x - pad, y: r.y - pad, width: r.width + pad * 2, height: r.height + pad * 2 };
+}
+function sameRect(a, b) {
+    if (!a || !b)
+        return a === b;
+    return (Math.abs(a.x - b.x) < 0.5 &&
+        Math.abs(a.y - b.y) < 0.5 &&
+        Math.abs(a.width - b.width) < 0.5 &&
+        Math.abs(a.height - b.height) < 0.5);
+}
+/** Open Radix poppers (a select's list, a menu): usable while a step runs. */
+const POPPER_SELECTOR = "[data-radix-popper-content-wrapper]";
+/** Toasts stay usable above the tour. */
+const TOASTER_SELECTOR = "[data-sonner-toaster]";
+function openPoppers() {
+    if (!hasDocument())
+        return [];
+    return Array.from(document.querySelectorAll(POPPER_SELECTOR)).filter(isPresent);
+}
+function inGuideLayer(node) {
+    if (!node || typeof Node === "undefined" || !(node instanceof Node))
+        return false;
+    const el = node instanceof Element ? node : node.parentElement;
+    return !!el?.closest(`[${GUIDE_LAYER_ATTRIBUTE}]`);
+}
+function prefersReducedMotion() {
+    return typeof window !== "undefined" && !!window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+}
+function isPhoneWidth() {
+    return typeof window !== "undefined" && window.innerWidth < 768;
+}
+/** Scrolls the target to the middle when it is out of view (instant under reduced motion). */
+function revealTarget(el) {
+    const r = el.getBoundingClientRect();
+    const vh = window.visualViewport?.height ?? window.innerHeight;
+    if (r.top < 70 || r.bottom > vh - 20) {
+        try {
+            el.scrollIntoView({ block: "center", behavior: prefersReducedMotion() ? "auto" : "smooth" });
+        }
+        catch {
+            el.scrollIntoView();
+        }
+    }
+}
+
+/**
+ * The tour's stylesheet. The shell has no CSS pipeline and the apps only scan
+ * its dist for Tailwind classes, which cannot carry keyframes; so the layer
+ * brings its own sheet, namespaced `eg-`, drawn from the theme's tokens
+ * (--primary carries each app's brand accent; light and dark follow).
+ */
+const GUIDE_CSS = `
+[data-erp-guide-layer]{position:fixed;inset:0;z-index:1000;pointer-events:none;font-family:inherit;color:var(--popover-foreground,#1c2634);
+  --eg-scrim:rgba(12,20,34,.64);--eg-card:var(--popover,#fff);--eg-fg:var(--popover-foreground,#1c2634);
+  --eg-muted:var(--muted-foreground,#6d7886);--eg-soft:var(--muted,#eef3f9);--eg-line:var(--border,#e8ecf1);
+  --eg-primary:var(--primary,#3280dd);--eg-on-primary:var(--primary-foreground,#fff);
+  --eg-tint:color-mix(in oklab,var(--eg-primary) 13%,var(--eg-card));--eg-strong:color-mix(in oklab,var(--eg-primary) 82%,#000);
+  --eg-danger:var(--destructive,#d23b4b);--eg-ok:#1d9a5f;--eg-gold:#e6a417;
+  --eg-shadow:0 18px 50px -12px rgba(16,32,64,.35),0 4px 12px rgba(16,32,64,.08);line-height:1.5;font-size:14px}
+[data-erp-guide-layer] *{box-sizing:border-box}
+[data-erp-guide-layer] button{font:inherit;color:inherit;cursor:pointer}
+.eg-i{pointer-events:auto}
+.eg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
+.eg-scrim-svg{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
+.eg-scrim-svg path{fill:var(--eg-scrim);pointer-events:visiblePainted;fill-rule:evenodd}
+.eg-scrim{position:fixed;inset:0;background:var(--eg-scrim);pointer-events:auto}
+.eg-scrim.eg-light{background:rgba(12,20,34,.45)}
+.eg-scrim.eg-faint{background:rgba(12,20,34,.35)}
+.eg-ring{position:fixed;border-radius:12px;pointer-events:none;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--eg-primary)}
+.eg-ring.eg-move{transition:left .26s ease,top .26s ease,width .26s ease,height .26s ease}
+.eg-ring::after{content:"";position:absolute;inset:-6px;border-radius:15px;border:3px solid var(--eg-primary);animation:eg-pulse 1.6s ease-out infinite}
+.eg-ring.eg-flash::after{animation:eg-flash .5s ease 1}
+@keyframes eg-pulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.12)}}
+@keyframes eg-flash{0%,100%{opacity:1;transform:none}50%{opacity:.2}}
+.eg-hand{position:fixed;width:46px;height:46px;pointer-events:none;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35));animation:eg-tap 1.1s ease-in-out infinite}
+.eg-hand svg{width:46px;height:46px;fill:#fff;stroke:#1c2634;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
+.eg-hand.eg-flip svg{transform:scaleY(-1)}
+@keyframes eg-tap{0%,100%{transform:translate(6px,8px)}50%{transform:translate(0,0)}}
+.eg-bubble{position:fixed;left:0;top:0;width:320px;background:var(--eg-card);color:var(--eg-fg);border-radius:14px;box-shadow:var(--eg-shadow);padding:14px 16px 12px;border-top:4px solid var(--eg-primary);outline:none;pointer-events:auto}
+.eg-bubble.eg-err{border-top-color:var(--eg-danger)}
+.eg-bubble.eg-nudge{animation:eg-nudge .38s ease}
+@keyframes eg-nudge{0%,100%{translate:0}20%{translate:-7px}40%{translate:6px}60%{translate:-4px}80%{translate:2px}}
+.eg-b-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--eg-muted)}
+.eg-b-top .eg-mis{font-weight:600;color:var(--eg-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.eg-b-top .eg-cnt{white-space:nowrap;font-weight:600}
+.eg-pips{display:flex;gap:4px;margin:8px 0 10px}
+.eg-pips i{flex:1;height:4px;border-radius:2px;background:var(--eg-soft)}
+.eg-pips i.eg-d{background:var(--eg-primary)}
+.eg-pips i.eg-c{background:color-mix(in oklab,var(--eg-primary) 45%,var(--eg-card))}
+.eg-b-t{margin:0;font-size:16px;font-weight:600;line-height:1.45}
+.eg-b-w{margin:2px 0 0;font-size:13.5px;color:var(--eg-muted)}
+.eg-bubble.eg-err .eg-b-t{color:var(--eg-danger)}
+.eg-k{display:inline-block;background:var(--eg-tint);color:var(--eg-strong);border-radius:7px;padding:0 7px;font-weight:600}
+.eg-b-f{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:8px}
+.eg-b-f .eg-btn{height:34px;padding:0 14px;font-size:13.5px}
+.eg-exit{border:0;background:none;color:var(--eg-muted);font-size:12.5px;padding:4px 0;text-decoration:underline;text-underline-offset:3px}
+.eg-exit:hover{color:var(--eg-fg)}
+.eg-arrow{position:absolute;width:14px;height:14px;background:var(--eg-card);transform:rotate(45deg);border-radius:2px}
+.eg-arrow.eg-top{background:var(--eg-primary)}
+.eg-bubble.eg-err .eg-arrow.eg-top{background:var(--eg-danger)}
+.eg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:10px;border:1px solid transparent;font-size:14px;font-weight:600;white-space:nowrap}
+.eg-btn:focus-visible,.eg-exit:focus-visible,.eg-chip:focus-visible,.eg-x:focus-visible{outline:2px solid var(--eg-primary);outline-offset:2px}
+.eg-primary{background:var(--eg-primary);color:var(--eg-on-primary)!important}
+.eg-primary:hover{background:var(--eg-strong)}
+.eg-primary[disabled]{opacity:.55;cursor:default}
+.eg-ghost{background:var(--eg-card);border-color:var(--eg-line)}
+.eg-ghost:hover{background:var(--eg-soft)}
+.eg-ghost[disabled]{opacity:.55;cursor:default}
+.eg-link{background:none;border:0;color:var(--eg-muted);font-weight:500;padding:0 6px;height:32px}
+.eg-link:hover{color:var(--eg-fg);text-decoration:underline}
+.eg-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(440px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;background:var(--eg-card);color:var(--eg-fg);border-radius:20px;box-shadow:var(--eg-shadow);padding:28px 28px 22px;text-align:center;outline:none;pointer-events:auto}
+.eg-modal.eg-pop{animation:eg-pop .32s cubic-bezier(.2,.9,.3,1.3)}
+@keyframes eg-pop{from{opacity:0;transform:translate(-50%,-46%) scale(.94)}}
+.eg-modal h2{margin:6px 0 4px;font-size:22px;font-weight:700;letter-spacing:-.2px;line-height:1.3}
+.eg-modal .eg-sub{margin:0;color:var(--eg-muted);font-size:14.5px}
+.eg-eyebrow{margin:0;font-size:12.5px;font-weight:600;letter-spacing:.3px;color:var(--eg-strong)}
+.eg-actions{display:grid;gap:6px;margin-top:20px}
+.eg-actions .eg-btn{height:44px}
+.eg-badge{width:64px;height:64px;border-radius:18px;margin:0 auto 12px;display:grid;place-items:center;background:var(--eg-tint);color:var(--eg-strong)}
+.eg-badge svg.eg-ic{width:30px;height:30px}
+.eg-quests{list-style:none;padding:0;margin:18px 0 0;text-align:left;display:grid;gap:6px}
+.eg-quests li{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:11px;background:var(--eg-soft);font-size:14px}
+.eg-quests li .eg-n{width:26px;height:26px;border-radius:50%;background:var(--eg-card);border:1.5px solid var(--eg-line);display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--eg-muted);flex:none}
+.eg-quests li.eg-first{background:var(--eg-tint)}
+.eg-quests li.eg-first .eg-n{border-color:var(--eg-primary);color:var(--eg-strong)}
+.eg-quests li.eg-ok .eg-n{background:var(--eg-ok);border-color:var(--eg-ok);color:#fff}
+.eg-quests li .eg-n svg.eg-ic{width:15px;height:15px;stroke-width:3}
+.eg-quests li .eg-t{flex:1}
+.eg-quests li small{color:var(--eg-muted);font-size:12px;white-space:nowrap}
+.eg-modal.eg-confirm{text-align:left;width:min(380px,calc(100vw - 32px));padding:22px}
+.eg-modal.eg-confirm h2{font-size:18px;margin-top:0}
+.eg-modal.eg-confirm .eg-actions{grid-template-columns:1fr 1fr}
+.eg-medal{width:84px;height:84px;border-radius:50%;margin:4px auto 10px;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 35% 30%,#ffd666,var(--eg-gold));box-shadow:0 0 0 8px #fff4d6;animation:eg-stamp .5s cubic-bezier(.2,.9,.3,1.4) .1s both}
+.eg-medal svg.eg-ic{width:42px;height:42px;stroke-width:2.6}
+@keyframes eg-stamp{from{transform:scale(.3) rotate(-25deg);opacity:0}}
+.eg-prog{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:13px;color:var(--eg-muted);font-weight:600}
+.eg-prog .eg-bar{flex:1;height:8px;border-radius:4px;background:var(--eg-soft);overflow:hidden}
+.eg-prog .eg-bar i{display:block;height:100%;background:var(--eg-primary);border-radius:4px;transition:width .9s cubic-bezier(.2,.8,.2,1) .35s}
+.eg-burst{position:absolute;left:50%;top:70px;width:0;height:0;pointer-events:none}
+.eg-burst span{position:absolute;width:8px;height:12px;border-radius:2px;opacity:0;animation:eg-conf 1.1s cubic-bezier(.15,.7,.3,1) forwards}
+@keyframes eg-conf{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r))}}
+.eg-card{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);width:min(360px,calc(100vw - 32px));background:var(--eg-card);color:var(--eg-fg);border-radius:14px;box-shadow:var(--eg-shadow);padding:14px 16px;border-top:4px solid var(--eg-primary);pointer-events:auto;outline:none}
+.eg-card .eg-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
+.eg-loading{display:flex;align-items:center;gap:10px;font-weight:600}
+.eg-spin{width:18px;height:18px;border-radius:50%;border:2.5px solid var(--eg-soft);border-top-color:var(--eg-primary);animation:eg-spin .8s linear infinite;flex:none}
+@keyframes eg-spin{to{transform:rotate(360deg)}}
+.eg-chip{position:fixed;right:22px;bottom:22px;display:flex;align-items:center;gap:10px;height:48px;padding:0 18px 0 8px;border-radius:24px;border:1px solid var(--eg-line);background:var(--eg-card);color:var(--eg-fg);box-shadow:0 8px 24px -8px rgba(16,32,64,.3);font-weight:600;font-size:14px;pointer-events:auto}
+.eg-chip svg{width:34px;height:34px}
+.eg-chip.eg-hi{animation:eg-hi 1.2s ease 2}
+@keyframes eg-hi{50%{box-shadow:0 0 0 6px color-mix(in oklab,var(--eg-primary) 35%,transparent),0 8px 24px -8px rgba(16,32,64,.3)}}
+.eg-panel{position:fixed;right:22px;bottom:82px;width:360px;max-height:calc(100vh - 110px);overflow:auto;background:var(--eg-card);color:var(--eg-fg);border:1px solid var(--eg-line);border-radius:16px;box-shadow:var(--eg-shadow);outline:none;pointer-events:auto}
+.eg-panel-bd{display:none}
+.eg-q-h{display:flex;align-items:center;gap:10px;padding:16px 12px 4px 18px}
+.eg-q-h h2{margin:0;font-size:16px;font-weight:700;flex:1}
+.eg-q-h .eg-n{font-size:13px;color:var(--eg-muted);font-weight:600}
+.eg-x{width:34px;height:34px;border-radius:10px;border:0;background:none;display:grid;place-items:center;color:var(--eg-muted)}
+.eg-x:hover{background:var(--eg-soft)}
+.eg-x svg.eg-ic{width:18px;height:18px}
+.eg-panel .eg-prog{margin:6px 18px 8px}
+.eg-q-list{list-style:none;margin:0;padding:4px 10px 6px;display:grid;gap:2px}
+.eg-q-item{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:11px}
+.eg-q-item.eg-next{background:var(--eg-tint)}
+.eg-q-item .eg-n{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--eg-line);display:grid;place-items:center;font-size:12.5px;font-weight:700;color:var(--eg-muted);flex:none;background:var(--eg-card)}
+.eg-q-item.eg-next .eg-n{border-color:var(--eg-primary);color:var(--eg-strong)}
+.eg-q-item.eg-done .eg-n{background:var(--eg-ok);border-color:var(--eg-ok);color:#fff}
+.eg-q-item.eg-done .eg-n svg.eg-ic{width:16px;height:16px;stroke-width:3}
+.eg-q-item.eg-dim .eg-n{opacity:.55}
+.eg-q-item.eg-just .eg-n{animation:eg-stamp .55s cubic-bezier(.2,.9,.3,1.4) .2s both}
+.eg-q-item .eg-t{flex:1;min-width:0}
+.eg-q-item .eg-t b{display:block;font-size:14px;font-weight:600}
+.eg-q-item.eg-done .eg-t b{color:var(--eg-muted)}
+.eg-q-item .eg-t small{display:block;font-size:12px;color:var(--eg-muted)}
+.eg-q-item .eg-t small.eg-sk{color:#b06a00}
+.eg-q-item .eg-btn{height:32px;padding:0 12px;font-size:13px}
+.eg-q-acts{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
+.eg-q-acts .eg-link{height:22px;font-size:12px;padding:0 2px}
+.eg-q-f{border-top:1px solid var(--eg-line);padding:8px 12px;display:flex;justify-content:flex-end}
+.eg-toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);background:#1c2634;color:#fff;padding:10px 16px;border-radius:10px;font-size:13.5px;box-shadow:var(--eg-shadow);max-width:calc(100vw - 32px);pointer-events:none}
+svg.eg-ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
+@media (max-width:767px){
+  .eg-bubble{width:auto}
+  .eg-arrow{display:none}
+  .eg-modal{top:auto;bottom:12px;transform:translateX(-50%);width:calc(100vw - 24px);padding:24px 20px 18px}
+  .eg-modal.eg-pop{animation:eg-up .3s cubic-bezier(.2,.9,.3,1.1)}
+  .eg-modal .eg-actions .eg-btn{height:46px}
+  .eg-chip{right:16px;bottom:calc(16px + env(safe-area-inset-bottom))}
+  .eg-panel-bd{display:block;position:fixed;inset:0;background:rgba(15,23,42,.38);pointer-events:auto}
+  .eg-panel{left:0;right:0;bottom:0;width:100%;max-height:85vh;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom)}
+  .eg-q-item{padding:12px 8px}
+  .eg-card{bottom:calc(12px + env(safe-area-inset-bottom))}
+  .eg-toast{bottom:calc(76px + env(safe-area-inset-bottom))}
+}
+@keyframes eg-up{from{opacity:0;transform:translate(-50%,30px)}}
+@media (prefers-reduced-motion:reduce){
+  [data-erp-guide-layer] *,[data-erp-guide-layer] *::before,[data-erp-guide-layer] *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
+  .eg-ring::after{animation:none!important;opacity:1;transform:none}
+  .eg-ring.eg-flash::after{animation:eg-flash .5s ease 1!important;animation-duration:.5s!important}
+  .eg-hand{animation:none!important;transform:translate(4px,6px)}
+  .eg-burst{display:none}
+  .eg-bubble.eg-nudge{animation:none!important;border-top-color:var(--eg-danger)}
+}
+`;
+
+/* ------------------------------------------------------------------ */
+/* Bits                                                                 */
+/* ------------------------------------------------------------------ */
+const TH_MONTHS = ["ม.ค.", "ก.พ.", "มี.ค.", "เม.ย.", "พ.ค.", "มิ.ย.", "ก.ค.", "ส.ค.", "ก.ย.", "ต.ค.", "พ.ย.", "ธ.ค."];
+const pad2 = (n) => String(n).padStart(2, "0");
+/** "26 ต.ค. 2569 13:04" — day, month, Buddhist year, 24 h. */
+function formatThaiDateTime(iso) {
+    if (!iso)
+        return "";
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return "";
+    return `${d.getDate()} ${TH_MONTHS[d.getMonth()]} ${d.getFullYear() + 543} ${pad2(d.getHours())}:${pad2(d.getMinutes())}`;
+}
+/** "กด [บันทึก]": the bracketed word is a chip in the brand colour. */
+function GuideTitle({ text }) {
+    const parts = text.split(/(\[[^\]]+\])/g).filter(Boolean);
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: parts.map((p, i) => p.startsWith("[") && p.endsWith("]") ? (jsxRuntime.jsx("span", { className: "eg-k", children: p.slice(1, -1) }, i)) : (jsxRuntime.jsx(React__namespace.Fragment, { children: p }, i))) }));
+}
+const Svg = ({ children, className = "eg-ic" }) => (jsxRuntime.jsx("svg", { className: className, viewBox: "0 0 24 24", "aria-hidden": "true", children: children }));
+const IconCheck = () => (jsxRuntime.jsx(Svg, { children: jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" }) }));
+const IconX = () => (jsxRuntime.jsx(Svg, { children: jsxRuntime.jsx("path", { d: "M18 6 6 18M6 6l12 12" }) }));
+const IconFlag = () => (jsxRuntime.jsxs(Svg, { children: [jsxRuntime.jsx("path", { d: "M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z" }), jsxRuntime.jsx("path", { d: "M4 22v-7" })] }));
+const IconTrophy = () => (jsxRuntime.jsx(Svg, { children: jsxRuntime.jsx("path", { d: "M6 9H4.5a2.5 2.5 0 0 1 0-5H6M18 9h1.5a2.5 2.5 0 0 0 0-5H18M4 22h16M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22M18 2H6v7a6 6 0 0 0 12 0V2Z" }) }));
+const HAND_PATH = "M18 11V9.5a2 2 0 0 0-4 0V9a2 2 0 0 0-4 0v.5V4a2 2 0 0 0-4 0v10l-1.6-1.6a2 2 0 0 0-2.83 2.83l3.6 3.6C6.66 20.3 8.6 22 11.5 22H14a8 8 0 0 0 8-8v-3a2 2 0 0 0-4 0z";
+/** Rounded-rectangle subpath for the scrim's holes. */
+function roundRect(r, radius) {
+    const rad = Math.max(0, Math.min(radius, r.width / 2, r.height / 2));
+    const { x, y, width: w, height: h } = r;
+    return (`M${x + rad} ${y}H${x + w - rad}A${rad} ${rad} 0 0 1 ${x + w} ${y + rad}` +
+        `V${y + h - rad}A${rad} ${rad} 0 0 1 ${x + w - rad} ${y + h}` +
+        `H${x + rad}A${rad} ${rad} 0 0 1 ${x} ${y + h - rad}` +
+        `V${y + rad}A${rad} ${rad} 0 0 1 ${x + rad} ${y}Z`);
+}
+/**
+ * The dim layer that eats every press outside the holes. One SVG path with
+ * even-odd holes: a press inside a hole reaches the page underneath, any
+ * other lands on the path (marked data-eg-block) and is cancelled.
+ */
+function Scrim({ holes, width, height }) {
+    const outer = `M-10 -10H${width + 10}V${height + 10}H-10Z`;
+    const d = outer + holes.map(h => roundRect(h, 12)).join("");
+    return (jsxRuntime.jsx("svg", { className: "eg-scrim-svg", width: width, height: height, "aria-hidden": "true", children: jsxRuntime.jsx("path", { d: d, "data-eg-block": "" }) }));
+}
+const BUBBLE_TITLE_ID = "eg-bubble-title";
+const BUBBLE_WHY_ID = "eg-bubble-why";
+function useNudge(nudge, ref) {
+    const first = React.useRef(nudge);
+    React.useEffect(() => {
+        if (nudge === first.current)
+            return;
+        const el = ref.current;
+        if (!el)
+            return;
+        el.classList.remove("eg-nudge");
+        void el.offsetWidth;
+        el.classList.add("eg-nudge");
+    }, [nudge, ref]);
+}
+function StepLayer(p) {
+    const { spot, phone, viewport } = p;
+    const bubbleRef = React.useRef(null);
+    const arrowRef = React.useRef(null);
+    const ringRef = React.useRef(null);
+    const [pos, setPos] = React.useState(null);
+    useNudge(p.nudge, bubbleRef);
+    // Flash the ring with each nudge too (a press outside the hole).
+    const firstNudge = React.useRef(p.nudge);
+    React.useEffect(() => {
+        if (p.nudge === firstNudge.current)
+            return;
+        const el = ringRef.current;
+        if (!el)
+            return;
+        el.classList.remove("eg-flash");
+        void el.offsetWidth;
+        el.classList.add("eg-flash");
+    }, [p.nudge]);
+    const showBubble = p.phase === "ready" && (!!spot || !p.hasTarget);
+    const gap = p.showHand ? 34 : 14;
+    const spotKey = spot ? `${spot.x}|${spot.y}|${spot.width}|${spot.height}` : "";
+    const contentKey = `${p.bubble.title}|${p.bubble.why}|${p.bubble.error?.title ?? ""}|${p.bubble.showNext}`;
+    React.useLayoutEffect(() => {
+        const el = bubbleRef.current;
+        if (!el || !showBubble)
+            return;
+        const m = 16;
+        if (!spot) {
+            // Nothing to point at: the middle of the screen (the bottom on a phone).
+            const bw = el.offsetWidth;
+            const bh = el.offsetHeight;
+            setPos(phone
+                ? { left: m, top: viewport.offsetTop + viewport.height - bh - m, side: "dock" }
+                : { left: (window.innerWidth - bw) / 2, top: viewport.offsetTop + (viewport.height - bh) / 2, side: "dock" });
+            return;
+        }
+        if (phone) {
+            // Docked to the top or the bottom of the screen, whichever covers less
+            // of the target (target in the lower half: top).
+            const vh = viewport.height;
+            const oy = viewport.offsetTop;
+            const bh = el.offsetHeight;
+            const topT = oy + m + 4;
+            const botT = oy + vh - bh - m;
+            const { y, height: h } = spot;
+            const overlapTop = Math.max(0, topT + bh + 8 - y);
+            const overlapBot = Math.max(0, y + h + gap - botT);
+            const top = y + h / 2 > vh / 2
+                ? overlapTop <= overlapBot
+                    ? topT
+                    : botT
+                : overlapBot <= overlapTop
+                    ? botT
+                    : topT;
+            setPos({ left: m, top, side: "dock" });
+            return;
+        }
+        let cancelled = false;
+        const ref = {
+            getBoundingClientRect: () => ({
+                x: spot.x,
+                y: spot.y,
+                left: spot.x,
+                top: spot.y,
+                width: spot.width,
+                height: spot.height,
+                right: spot.x + spot.width,
+                bottom: spot.y + spot.height,
+            }),
+        };
+        dom.computePosition(ref, el, {
+            strategy: "fixed",
+            placement: "right",
+            middleware: [
+                dom.offset(({ placement }) => (placement.startsWith("bottom") ? gap : 14)),
+                dom.flip({ fallbackPlacements: ["bottom", "top", "left"], padding: m }),
+                dom.shift({ padding: m }),
+                ...(arrowRef.current ? [dom.arrow({ element: arrowRef.current, padding: 14 })] : []),
+            ],
+        })
+            .then(({ x, y, placement, middlewareData }) => {
+            if (cancelled)
+                return;
+            const bw = el.offsetWidth;
+            const bh = el.offsetHeight;
+            const fits = x >= m - 1 && y >= m - 1 && x + bw <= window.innerWidth - m + 1 && y + bh <= viewport.height + viewport.offsetTop - m + 1;
+            const overlaps = x < spot.x + spot.width && x + bw > spot.x && y < spot.y + spot.height && y + bh > spot.y;
+            if (!fits || overlaps) {
+                // Nowhere beside it: the bottom-right corner.
+                setPos({ left: window.innerWidth - bw - m, top: viewport.height + viewport.offsetTop - bh - m, side: "dock" });
+                return;
+            }
+            const side = placement.split("-")[0];
+            setPos({ left: x, top: y, side, ax: middlewareData.arrow?.x, ay: middlewareData.arrow?.y });
+        })
+            .catch(() => {
+            if (!cancelled)
+                setPos({ left: m, top: m, side: "dock" });
+        });
+        return () => {
+            cancelled = true;
+        };
+        // spotKey/contentKey stand for spot and the bubble's size.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [spotKey, contentKey, phone, showBubble, gap, viewport.height, viewport.offsetTop]);
+    const holes = [...(spot ? [spot] : []), ...p.holes];
+    const hand = spot && p.showHand && p.phase === "ready" ? handPosition(spot, viewport.height) : null;
+    let arrowStyle;
+    if (pos && pos.side !== "dock") {
+        if (pos.side === "right")
+            arrowStyle = { left: -7, top: pos.ay };
+        else if (pos.side === "left")
+            arrowStyle = { right: -7, top: pos.ay };
+        else if (pos.side === "bottom")
+            arrowStyle = { top: -9, left: pos.ax };
+        else
+            arrowStyle = { bottom: -7, left: pos.ax };
+    }
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Scrim, { holes: p.phase === "ready" ? holes : [], width: viewport.width, height: Math.max(viewport.height + viewport.offsetTop, 0) }), spot && p.phase === "ready" ? (jsxRuntime.jsx("div", { ref: ringRef, className: "eg-ring" + (p.moving ? " eg-move" : ""), style: { left: spot.x, top: spot.y, width: spot.width, height: spot.height }, "aria-hidden": "true" })) : null, hand ? (jsxRuntime.jsx("div", { className: "eg-hand" + (hand.flip ? " eg-flip" : ""), style: { left: hand.left, top: hand.top }, "aria-hidden": "true", children: jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { d: HAND_PATH }) }) })) : null, showBubble ? (jsxRuntime.jsxs("div", { ref: bubbleRef, className: "eg-bubble" + (p.bubble.error ? " eg-err" : ""), role: "dialog", "aria-modal": "false", "aria-labelledby": BUBBLE_TITLE_ID, "aria-describedby": BUBBLE_WHY_ID, tabIndex: -1, "data-eg-bubble": "", style: {
+                    left: pos?.left ?? 0,
+                    top: pos?.top ?? 0,
+                    width: phone ? viewport.width - 32 : undefined,
+                    visibility: pos ? "visible" : "hidden",
+                }, children: [jsxRuntime.jsx(BubbleBody, { ...p }), jsxRuntime.jsx("span", { ref: arrowRef, className: "eg-arrow" + (pos?.side === "bottom" ? " eg-top" : ""), style: arrowStyle ?? { display: "none" }, "aria-hidden": "true" })] })) : null, p.phase === "waiting" ? (jsxRuntime.jsxs("div", { className: "eg-card", role: "status", "data-eg-card": "", children: [jsxRuntime.jsxs("div", { className: "eg-loading", children: [jsxRuntime.jsx("span", { className: "eg-spin", "aria-hidden": "true" }), "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14\u2026"] }), jsxRuntime.jsx("div", { className: "eg-row", children: jsxRuntime.jsx("button", { type: "button", className: "eg-exit", onClick: p.onExit, children: p.bubble.replay ? "จบการทบทวน" : "ออกจากไกด์" }) })] })) : null, p.phase === "missing" ? (jsxRuntime.jsxs("div", { className: "eg-card eg-err", role: "alertdialog", "aria-labelledby": "eg-missing-t", "data-eg-card": "", tabIndex: -1, children: [jsxRuntime.jsx("p", { className: "eg-b-t", id: "eg-missing-t", children: "\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E2A\u0E48\u0E27\u0E19\u0E19\u0E35\u0E49\u0E1A\u0E19\u0E2B\u0E19\u0E49\u0E32" }), jsxRuntime.jsxs("div", { className: "eg-row", children: [jsxRuntime.jsx("button", { type: "button", className: "eg-exit", onClick: p.onExit, children: p.bubble.replay ? "จบการทบทวน" : "ออกจากไกด์" }), jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-primary", onClick: p.onRetry, children: "\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07" })] })] })) : null, p.phase === "away" ? (jsxRuntime.jsxs("div", { className: "eg-card", role: "dialog", "aria-modal": "false", "aria-labelledby": "eg-away-t", "data-eg-card": "", tabIndex: -1, children: [jsxRuntime.jsxs("div", { className: "eg-b-top", children: [jsxRuntime.jsxs("span", { className: "eg-mis", children: ["\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08 ", p.bubble.missionNo, " \u00B7 ", p.bubble.missionTitle, p.bubble.replay ? " (ทบทวน)" : ""] }), jsxRuntime.jsxs("span", { className: "eg-cnt", children: ["\u0E02\u0E31\u0E49\u0E19\u0E17\u0E35\u0E48 ", p.bubble.index + 1, "/", p.bubble.total] })] }), jsxRuntime.jsx("p", { className: "eg-b-t", id: "eg-away-t", style: { marginTop: 8 }, children: jsxRuntime.jsx(GuideTitle, { text: p.bubble.title }) }), jsxRuntime.jsxs("div", { className: "eg-row", children: [jsxRuntime.jsx("button", { type: "button", className: "eg-exit", onClick: p.onExit, children: p.bubble.replay ? "จบการทบทวน" : "ออกจากไกด์" }), jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-primary", onClick: p.onGoResume, children: "\u0E17\u0E33\u0E15\u0E48\u0E2D" })] })] })) : null, p.confirmExit ? (jsxRuntime.jsx(ConfirmModal, { title: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E44\u0E01\u0E14\u0E4C\u0E15\u0E2D\u0E19\u0E19\u0E35\u0E49?", line: "\u0E40\u0E1B\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E44\u0E14\u0E49\u0E17\u0E35\u0E48\u0E1B\u0E38\u0E48\u0E21 ? \u0E21\u0E38\u0E21\u0E02\u0E27\u0E32\u0E1A\u0E19", leaveLabel: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E44\u0E01\u0E14\u0E4C", stayLabel: "\u0E17\u0E33\u0E15\u0E48\u0E2D", onLeave: p.onExitConfirm, onStay: p.onExitCancel })) : null] }));
+}
+function BubbleBody(p) {
+    const b = p.bubble;
+    const title = b.error ? b.error.title : b.title;
+    const why = b.error ? (b.error.detail ?? "") : b.why;
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "eg-b-top", children: [jsxRuntime.jsxs("span", { className: "eg-mis", children: ["\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08 ", b.missionNo, " \u00B7 ", b.missionTitle, b.replay ? " (ทบทวน)" : ""] }), jsxRuntime.jsxs("span", { className: "eg-cnt", children: ["\u0E02\u0E31\u0E49\u0E19\u0E17\u0E35\u0E48 ", b.index + 1, "/", b.total] })] }), jsxRuntime.jsx("div", { className: "eg-pips", "aria-hidden": "true", children: Array.from({ length: b.total }, (_, i) => (jsxRuntime.jsx("i", { className: i < b.index ? "eg-d" : i === b.index ? "eg-c" : undefined }, i))) }), jsxRuntime.jsx("p", { className: "eg-b-t", id: BUBBLE_TITLE_ID, children: jsxRuntime.jsx(GuideTitle, { text: title }) }), jsxRuntime.jsx("p", { className: "eg-b-w", id: BUBBLE_WHY_ID, hidden: !why, children: why }), jsxRuntime.jsxs("div", { className: "eg-b-f", children: [jsxRuntime.jsx("button", { type: "button", className: "eg-exit", onClick: p.onExit, children: b.replay ? "จบการทบทวน" : "ออกจากไกด์" }), jsxRuntime.jsxs("span", { style: { display: "flex", gap: 6 }, children: [b.showEndWithoutSave ? (jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-ghost", onClick: p.onEndWithoutSave, children: "\u0E08\u0E1A\u0E42\u0E14\u0E22\u0E44\u0E21\u0E48\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01" })) : null, b.showNext ? (jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-primary", onClick: p.onNext, children: "\u0E16\u0E31\u0E14\u0E44\u0E1B" })) : null] })] })] }));
+}
+/** The fingertip at ≈62% across and down the target; upside down near the bottom. */
+function handPosition(spot, viewportHeight) {
+    const { x, y, width: w, height: h } = spot;
+    const px = x + Math.min(w * 0.62, w - 14);
+    const py = y + h * 0.62;
+    const flip = py + 50 > viewportHeight;
+    return { left: px - 11.5, top: flip ? py - h * 0.3 - 42 : py - 4, flip };
+}
+/* ------------------------------------------------------------------ */
+/* Modals                                                               */
+/* ------------------------------------------------------------------ */
+function useAutoFocus() {
+    const ref = React.useRef(null);
+    React.useEffect(() => {
+        ref.current?.focus({ preventScroll: true });
+    }, []);
+    return ref;
+}
+function ConfirmModal(p) {
+    const stay = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-scrim eg-faint", "data-eg-block": "", onClick: p.onStay }), jsxRuntime.jsxs("div", { className: "eg-modal eg-confirm eg-pop", role: "alertdialog", "aria-modal": "true", "aria-labelledby": "eg-c-t", "aria-describedby": "eg-c-d", "data-eg-modal": "", children: [jsxRuntime.jsx("h2", { id: "eg-c-t", children: p.title }), jsxRuntime.jsx("p", { className: "eg-sub", id: "eg-c-d", style: { fontSize: 14 }, children: p.line }), jsxRuntime.jsxs("div", { className: "eg-actions", children: [jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-ghost", onClick: p.onLeave, children: p.leaveLabel }), jsxRuntime.jsx("button", { type: "button", ref: stay, className: "eg-btn eg-primary", onClick: p.onStay, children: p.stayLabel })] })] })] }));
+}
+function WelcomeModal(p) {
+    const start = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-scrim", "data-eg-block": "" }), jsxRuntime.jsxs("div", { className: "eg-modal eg-pop", role: "dialog", "aria-modal": "true", "aria-labelledby": "eg-w-t", "data-eg-modal": "", tabIndex: -1, children: [jsxRuntime.jsx("div", { className: "eg-badge", children: jsxRuntime.jsx(IconFlag, {}) }), jsxRuntime.jsx("p", { className: "eg-eyebrow", children: "\u0E44\u0E01\u0E14\u0E4C\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsx("h2", { id: "eg-w-t", children: p.title }), p.subtitle ? jsxRuntime.jsx("p", { className: "eg-sub", children: p.subtitle }) : null, jsxRuntime.jsx("ol", { className: "eg-quests", children: p.missions.map((m, i) => (jsxRuntime.jsxs("li", { className: i === 0 ? "eg-first" : undefined, children: [jsxRuntime.jsx("span", { className: "eg-n", children: i + 1 }), jsxRuntime.jsx("span", { className: "eg-t", children: m.title }), jsxRuntime.jsxs("small", { children: [m.minutes, " \u0E19\u0E32\u0E17\u0E35"] })] }, i))) }), jsxRuntime.jsxs("div", { className: "eg-actions", children: [jsxRuntime.jsx("button", { type: "button", ref: start, className: "eg-btn eg-primary", onClick: p.onStart, children: "\u0E40\u0E23\u0E34\u0E48\u0E21\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08\u0E41\u0E23\u0E01" }), jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-link", onClick: p.onSkip, children: "\u0E02\u0E49\u0E32\u0E21\u0E44\u0E1B\u0E01\u0E48\u0E2D\u0E19" })] })] }), p.confirm ? (jsxRuntime.jsx(ConfirmModal, { title: "\u0E02\u0E49\u0E32\u0E21\u0E44\u0E01\u0E14\u0E4C\u0E44\u0E1B\u0E01\u0E48\u0E2D\u0E19?", line: "\u0E40\u0E1B\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E44\u0E14\u0E49\u0E17\u0E35\u0E48\u0E1B\u0E38\u0E48\u0E21 ? \u0E21\u0E38\u0E21\u0E02\u0E27\u0E32\u0E1A\u0E19", leaveLabel: "\u0E02\u0E49\u0E32\u0E21\u0E44\u0E1B\u0E01\u0E48\u0E2D\u0E19", stayLabel: "\u0E40\u0E23\u0E34\u0E48\u0E21\u0E40\u0E25\u0E22", onLeave: p.onSkipConfirm, onStay: p.onSkipCancel })) : null] }));
+}
+function GateModal(p) {
+    const go = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-scrim", "data-eg-block": "" }), jsxRuntime.jsxs("div", { className: "eg-modal eg-pop", role: "dialog", "aria-modal": "true", "aria-labelledby": "eg-g-t", "data-eg-modal": "", tabIndex: -1, children: [jsxRuntime.jsx("div", { className: "eg-badge", children: jsxRuntime.jsx(IconFlag, {}) }), jsxRuntime.jsx("p", { className: "eg-eyebrow", children: "\u0E44\u0E01\u0E14\u0E4C\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsx("h2", { id: "eg-g-t", children: p.title }), p.subtitle ? jsxRuntime.jsx("p", { className: "eg-sub", children: p.subtitle }) : null, jsxRuntime.jsxs("div", { className: "eg-actions", children: [jsxRuntime.jsx("a", { ref: go, className: "eg-btn eg-primary", href: p.href, style: { textDecoration: "none" }, children: p.actionLabel }), jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-link", onClick: p.onLater, children: "\u0E44\u0E27\u0E49\u0E17\u0E35\u0E2B\u0E25\u0E31\u0E07" })] })] })] }));
+}
+const CONFETTI_COLOURS = ["#3b82f6", "#7db7ff", "#e6a417", "#ff7a6b", "#1d9a5f", "#b0d2ff"];
+function Confetti({ reduced }) {
+    // Fixed per mount, so a re-render does not throw new pieces.
+    const [pieces] = React.useState(() => Array.from({ length: 26 }, (_, i) => {
+        const a = (Math.PI * 2 * i) / 26 + Math.random() * 0.3;
+        const dist = 90 + Math.random() * 90;
+        return {
+            background: CONFETTI_COLOURS[i % CONFETTI_COLOURS.length],
+            "--x": `${Math.cos(a) * dist}px`,
+            "--y": `${Math.sin(a) * dist + 40}px`,
+            "--r": `${Math.random() * 540 - 270}deg`,
+            animationDelay: `${Math.random() * 0.12}s`,
+        };
+    }));
+    if (reduced)
+        return null;
+    return (jsxRuntime.jsx("div", { className: "eg-burst", "aria-hidden": "true", children: pieces.map((s, i) => (jsxRuntime.jsx("span", { style: s }, i))) }));
+}
+function ProgressBar({ from, to, total, label }) {
+    const [width, setWidth] = React.useState(total ? (from / total) * 100 : 0);
+    React.useEffect(() => {
+        // Two frames so the bar is drawn at `from` before it runs to `to`.
+        let raf2 = 0;
+        const raf1 = requestAnimationFrame(() => {
+            raf2 = requestAnimationFrame(() => setWidth(total ? (to / total) * 100 : 0));
+        });
+        return () => {
+            cancelAnimationFrame(raf1);
+            cancelAnimationFrame(raf2);
+        };
+    }, [to, total]);
+    return (jsxRuntime.jsxs("div", { className: "eg-prog", children: [jsxRuntime.jsx("div", { className: "eg-bar", children: jsxRuntime.jsx("i", { style: { width: `${width}%` } }) }), jsxRuntime.jsx("span", { children: label })] }));
+}
+function CelebrateModal(p) {
+    const primary = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-scrim eg-light", "data-eg-block": "" }), jsxRuntime.jsxs("div", { className: "eg-modal eg-pop", role: "dialog", "aria-modal": "true", "aria-labelledby": "eg-cel-t", "data-eg-modal": "", tabIndex: -1, children: [jsxRuntime.jsx(Confetti, { reduced: p.reduced }), jsxRuntime.jsx("div", { className: "eg-medal", children: jsxRuntime.jsx(IconCheck, {}) }), jsxRuntime.jsxs("p", { className: "eg-eyebrow", children: ["\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08 ", p.missionNo, " \u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08"] }), jsxRuntime.jsx("h2", { id: "eg-cel-t", children: p.title }), p.subtitle ? jsxRuntime.jsx("p", { className: "eg-sub", children: p.subtitle }) : null, jsxRuntime.jsx(ProgressBar, { from: p.reduced ? p.done : Math.max(0, p.done - 1), to: p.done, total: p.total, label: `${p.done}/${p.total} ภารกิจ` }), jsxRuntime.jsxs("div", { className: "eg-actions", children: [p.nextTitle ? (jsxRuntime.jsxs("button", { type: "button", ref: primary, className: "eg-btn eg-primary", onClick: p.onNext, children: ["\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08\u0E16\u0E31\u0E14\u0E44\u0E1B: ", p.nextTitle] })) : null, jsxRuntime.jsx("button", { type: "button", ref: p.nextTitle ? undefined : primary, className: "eg-btn eg-link", onClick: p.onRest, children: "\u0E1E\u0E31\u0E01\u0E01\u0E48\u0E2D\u0E19" })] })] })] }));
+}
+function CompleteModal(p) {
+    const primary = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-scrim", "data-eg-block": "" }), jsxRuntime.jsxs("div", { className: "eg-modal eg-pop", role: "dialog", "aria-modal": "true", "aria-labelledby": "eg-f-t", "data-eg-modal": "", tabIndex: -1, children: [jsxRuntime.jsx(Confetti, { reduced: p.reduced }), jsxRuntime.jsx("div", { className: "eg-medal", children: jsxRuntime.jsx(IconTrophy, {}) }), jsxRuntime.jsxs("p", { className: "eg-eyebrow", children: ["\u0E04\u0E23\u0E1A ", p.total, " \u0E20\u0E32\u0E23\u0E01\u0E34\u0E08"] }), jsxRuntime.jsx("h2", { id: "eg-f-t", children: p.title }), p.subtitle ? jsxRuntime.jsx("p", { className: "eg-sub", children: p.subtitle }) : null, jsxRuntime.jsx("ol", { className: "eg-quests", children: p.missions.map((m, i) => (jsxRuntime.jsxs("li", { className: "eg-ok", children: [jsxRuntime.jsx("span", { className: "eg-n", children: jsxRuntime.jsx(IconCheck, {}) }), jsxRuntime.jsx("span", { className: "eg-t", children: m })] }, i))) }), jsxRuntime.jsxs("div", { className: "eg-actions", children: [jsxRuntime.jsx("button", { type: "button", ref: primary, className: "eg-btn eg-primary", onClick: p.onFinish, children: p.actionLabel }), p.secondary ? (jsxRuntime.jsx("a", { className: "eg-btn eg-ghost", href: p.secondary.href, style: { textDecoration: "none" }, children: p.secondary.label })) : null] })] })] }));
+}
+/* ------------------------------------------------------------------ */
+/* Quest chip and panel                                                 */
+/* ------------------------------------------------------------------ */
+function QuestChip({ done, total, pulse, onOpen }) {
+    const ref = React.useRef(null);
+    const first = React.useRef(pulse);
+    React.useEffect(() => {
+        if (pulse === first.current)
+            return;
+        const el = ref.current;
+        if (!el)
+            return;
+        el.classList.remove("eg-hi");
+        void el.offsetWidth;
+        el.classList.add("eg-hi");
+    }, [pulse]);
+    const C = 2 * Math.PI * 14;
+    const pct = total ? done / total : 0;
+    return (jsxRuntime.jsxs("button", { ref: ref, type: "button", className: "eg-chip", onClick: onOpen, "aria-label": `ภารกิจเริ่มต้น เสร็จ ${done} จาก ${total}`, children: [jsxRuntime.jsxs("svg", { viewBox: "0 0 34 34", "aria-hidden": "true", children: [jsxRuntime.jsx("circle", { cx: "17", cy: "17", r: "14", fill: "none", stroke: "var(--eg-soft)", strokeWidth: "4" }), done ? (jsxRuntime.jsx("circle", { cx: "17", cy: "17", r: "14", fill: "none", stroke: "var(--eg-primary)", strokeWidth: "4", strokeLinecap: "round", strokeDasharray: `${C * pct} ${C}`, transform: "rotate(-90 17 17)" })) : null] }), "\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08 ", done, "/", total] }));
+}
+function QuestPanel(p) {
+    const ref = useAutoFocus();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "eg-panel-bd", onClick: p.onClose }), jsxRuntime.jsxs("section", { ref: ref, className: "eg-panel", role: "dialog", "aria-labelledby": "eg-q-t", tabIndex: -1, "data-eg-panel": "", children: [jsxRuntime.jsxs("div", { className: "eg-q-h", children: [jsxRuntime.jsx("h2", { id: "eg-q-t", children: "\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19" }), jsxRuntime.jsxs("span", { className: "eg-n", children: [p.done, "/", p.total] }), jsxRuntime.jsx("button", { type: "button", className: "eg-x", onClick: p.onClose, "aria-label": "\u0E1B\u0E34\u0E14", children: jsxRuntime.jsx(IconX, {}) })] }), jsxRuntime.jsx("div", { className: "eg-prog", children: jsxRuntime.jsx("div", { className: "eg-bar", children: jsxRuntime.jsx("i", { style: { width: `${p.total ? (p.done / p.total) * 100 : 0}%` } }) }) }), jsxRuntime.jsx("ol", { className: "eg-q-list", children: p.items.map((it, i) => (jsxRuntime.jsx(QuestRow, { item: it, n: i + 1, just: p.justDone === it.key, gate: p.gate, onStart: p.onStart, onDismiss: p.onDismiss }, it.key))) }), p.canHideChip ? (jsxRuntime.jsx("div", { className: "eg-q-f", children: jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-link", onClick: p.onHideChip, children: "\u0E0B\u0E48\u0E2D\u0E19\u0E1B\u0E38\u0E48\u0E21\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08" }) })) : null] })] }));
+}
+function QuestRow({ item, n, just, gate, onStart, onDismiss, }) {
+    const v = item.view;
+    const ticked = v === "done" || v === "already";
+    const cls = "eg-q-item" +
+        (ticked ? " eg-done" : v === "next" ? " eg-next" : "") +
+        (v === "locked" || v === "waiting" ? " eg-dim" : "") +
+        (just ? " eg-just" : "");
+    let meta = `ประมาณ ${item.minutes} นาที`;
+    if (v === "done")
+        meta = item.completedAt ? `เสร็จ ${formatThaiDateTime(item.completedAt)}` : "เสร็จแล้ว";
+    else if (v === "already")
+        meta = "ทำไว้แล้ว";
+    else if (v === "skipped")
+        meta = jsxRuntime.jsx("span", { children: "\u0E02\u0E49\u0E32\u0E21\u0E44\u0E27\u0E49" });
+    else if (v === "waiting" && gate)
+        meta = gate.pending;
+    let button;
+    if (v === "done")
+        button = jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-ghost", onClick: () => onStart(item.key, true), children: "\u0E17\u0E33\u0E0B\u0E49\u0E33" });
+    else if (v === "already")
+        button = jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-ghost", onClick: () => onStart(item.key, true), children: "\u0E14\u0E39\u0E27\u0E34\u0E18\u0E35\u0E17\u0E33" });
+    else if (v === "waiting" && gate)
+        button = (jsxRuntime.jsx("a", { className: "eg-btn eg-ghost", href: gate.href, style: { textDecoration: "none" }, children: gate.label }));
+    else if (v === "locked")
+        button = (jsxRuntime.jsxs("button", { type: "button", className: "eg-btn eg-ghost", disabled: true, children: ["\u0E17\u0E33 ", item.lockedBy, " \u0E01\u0E48\u0E2D\u0E19"] }));
+    else
+        button = (jsxRuntime.jsx("button", { type: "button", className: "eg-btn " + (v === "next" ? "eg-primary" : "eg-ghost"), onClick: () => onStart(item.key, false), children: v === "skipped" || v === "active" ? "ทำต่อ" : "เริ่ม" }));
+    const dismissable = item.optional && (v === "todo" || v === "next");
+    return (jsxRuntime.jsxs("li", { className: cls, children: [jsxRuntime.jsx("span", { className: "eg-n", children: ticked ? jsxRuntime.jsx(IconCheck, {}) : n }), jsxRuntime.jsxs("div", { className: "eg-t", children: [jsxRuntime.jsx("b", { children: item.title }), jsxRuntime.jsx("small", { className: v === "skipped" ? "eg-sk" : undefined, children: meta })] }), dismissable ? (jsxRuntime.jsxs("span", { className: "eg-q-acts", children: [button, jsxRuntime.jsx("button", { type: "button", className: "eg-btn eg-link", onClick: () => onDismiss(item.key), children: "\u0E44\u0E21\u0E48\u0E43\u0E0A\u0E49\u0E20\u0E32\u0E23\u0E01\u0E34\u0E08\u0E19\u0E35\u0E49" })] })) : (button)] }));
+}
+function GuideToast({ text }) {
+    return (jsxRuntime.jsx("div", { className: "eg-toast", role: "status", children: text }));
+}
+
+const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
+const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
+const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
+/**
+ * Shown when the API refuses every request because the signed-in account has
+ * no employee record in this organisation.
+ *
+ * A gate rather than a banner. Leave, attendance, approvals and payslips all
+ * identify a person by that record, so once the server started enforcing it
+ * every call fails — and without something that says so, the app becomes a
+ * screen of error toasts with no explanation and no way forward.
+ */
+function EmployeeRequiredGate({ platformBaseUrl, }) {
+    const [blocked, setBlocked] = React.useState(false);
+    const params = navigation.useParams();
+    const code = params?.code ?? "";
+    React.useEffect(() => {
+        const onBlocked = () => setBlocked(true);
+        const onOk = () => setBlocked(false);
+        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        return () => {
+            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        };
+    }, []);
+    if (!blocked)
+        return null;
+    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
+    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
+    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
+}
+
+/* ------------------------------------------------------------------ */
+/* Fail-open wrappers                                                   */
+/* ------------------------------------------------------------------ */
+class GuideErrorBoundary extends React__namespace.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: { failed: false }
+        });
+    }
+    static getDerivedStateFromError() {
+        return { failed: true };
+    }
+    componentDidCatch(error) {
+        if (typeof console !== "undefined")
+            console.warn("[erp-shell guide] hidden after an error", error);
+        try {
+            publishGuideEntry(null, null);
+        }
+        catch {
+            /* ignore */
+        }
+    }
+    render() {
+        return this.state.failed ? null : this.props.children;
+    }
+}
+function GuideHost(props) {
+    return (jsxRuntime.jsx(GuideErrorBoundary, { children: jsxRuntime.jsx(React.Suspense, { fallback: null, children: jsxRuntime.jsx(GuideHostInner, { ...props }) }) }));
+}
+let fallbackClient = null;
+function useShellQueryClient() {
+    const provided = React.useContext(reactQuery.QueryClientContext);
+    if (provided)
+        return provided;
+    fallbackClient ?? (fallbackClient = new reactQuery.QueryClient());
+    return fallbackClient;
+}
+/* ------------------------------------------------------------------ */
+/* Session mirror (instant resume after F5)                             */
+/* ------------------------------------------------------------------ */
+const mirrorKey = (orgId, suite) => `erp-guide:${orgId}:${suite.key}`;
+function readMirror(orgId, suite) {
+    try {
+        const raw = sessionStorage.getItem(mirrorKey(orgId, suite));
+        if (!raw)
+            return null;
+        const parsed = JSON.parse(raw);
+        const row = parseRow(parsed);
+        if (!row || row.guide_version !== suite.version)
+            return null;
+        return { ...row, server_status: parsed.server_status ?? null };
+    }
+    catch {
+        return null;
+    }
+}
+function writeMirror(orgId, suite, p) {
+    try {
+        sessionStorage.setItem(mirrorKey(orgId, suite), JSON.stringify(p));
+    }
+    catch {
+        /* private mode: the server copy is enough */
+    }
+}
+/* ------------------------------------------------------------------ */
+/* One tab at a time                                                    */
+/* ------------------------------------------------------------------ */
+/**
+ * Whether this tab runs the tour. With two tabs open, the first holds a Web
+ * Lock and the second shows nothing until the first goes away.
+ */
+function usePrimaryTab(name) {
+    const [primary, setPrimary] = React.useState(false);
+    React.useEffect(() => {
+        const locks = (typeof navigator !== "undefined" ? navigator.locks : undefined);
+        if (!locks?.request) {
+            setPrimary(true);
+            return;
+        }
+        const abort = new AbortController();
+        let release = null;
+        locks
+            .request(name, { signal: abort.signal }, () => {
+            setPrimary(true);
+            return new Promise(resolve => {
+                release = resolve;
+            });
+        })
+            .catch(() => {
+            /* aborted on unmount */
+        });
+        return () => {
+            abort.abort();
+            release?.();
+            setPrimary(false);
+        };
+    }, [name]);
+    return primary;
+}
+/* ------------------------------------------------------------------ */
+/* Host                                                                 */
+/* ------------------------------------------------------------------ */
+const TARGET_PAD = 6;
+const LOST_GRACE_MS = 350;
+const WAIT_MS = 8000;
+const WAIT_CAP_MS = 30000;
+const WELCOME_DELAY_MS = 500;
+const CELEBRATE_DELAY_MS = 450;
+const SAVE_DEBOUNCE_MS = 600;
+function GuideHostInner({ config, organizationId, code }) {
+    const suite = config.suite;
+    const client = useShellQueryClient();
+    const pathname = navigation.usePathname() ?? "/";
+    const searchParams = navigation.useSearchParams();
+    const search = searchParams?.toString() ?? "";
+    const router = navigation.useRouter();
+    const { open: sidebarOpen } = useSidebar();
+    const fetching = reactQuery.useIsFetching({ predicate: q => q.queryKey[0] !== "erp-shell" }, client);
+    const primary = usePrimaryTab(`erp-guide:${organizationId}:${suite.key}`);
+    // The shell's EmployeeRequiredGate is up: no tour over it.
+    const [employeeBlocked, setEmployeeBlocked] = React.useState(false);
+    React.useEffect(() => {
+        const on = () => setEmployeeBlocked(true);
+        const off = () => setEmployeeBlocked(false);
+        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, on);
+        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, off);
+        return () => {
+            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, on);
+            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, off);
+        };
+    }, []);
+    const query = reactQuery.useQuery({
+        queryKey: ["erp-shell", "guides", organizationId, suite.app, suite.key, suite.version],
+        queryFn: ({ signal }) => fetchGuides(organizationId, suite, signal),
+        enabled: primary && config.ready !== false,
+        staleTime: 5 * 60000,
+        gcTime: 30 * 60000,
+        retry: false,
+        refetchOnWindowFocus: false,
+    }, client);
+    const answer = query.data ?? null;
+    const live = !!answer && answer.audience !== "none" && !answer.newerOnServer && primary && config.ready !== false && !employeeBlocked;
+    /* ---------------- machine ---------------- */
+    const [state, setState] = React.useState(null);
+    const stateRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!answer || answer.audience === "none" || answer.newerOnServer) {
+            stateRef.current = null;
+            setState(null);
+            return;
+        }
+        if (stateRef.current)
+            return;
+        // Resume from whichever copy is further along: the server's, or this
+        // tab's session copy from before a refresh (its rev is the server's).
+        const mirror = readMirror(organizationId, suite);
+        let progress = answer.progress;
+        if (mirror && furtherProgress(mirror, progress) === mirror)
+            progress = mergeProgress(mirror, progress);
+        const s = initialGuideState(answer.audience, progress);
+        stateRef.current = s;
+        setState(s);
+    }, [answer, organizationId, suite]);
+    // The latest page facts, read by the machine through env.
+    const pageRef = React.useRef({ pathname, search, sidebarOpen, facts: config.facts ?? {}, can: config.can });
+    pageRef.current = { pathname, search, sidebarOpen, facts: config.facts ?? {}, can: config.can };
+    const targetElRef = React.useRef(null);
+    const env = React.useCallback(() => {
+        const pg = pageRef.current;
+        return {
+            code,
+            pathname: pg.pathname,
+            search: new URLSearchParams(pg.search),
+            facts: pg.facts,
+            can: (key) => {
+                try {
+                    return pg.can ? pg.can(key) : true;
+                }
+                catch {
+                    return true;
+                }
+            },
+            isVisible: (anchor, id) => anchorVisible(anchor, id),
+            sidebarOpen: pg.sidebarOpen,
+            targetValue: () => fieldValue(targetElRef.current),
+        };
+    }, [code]);
+    /* ---------------- effects: save, announce, toast, navigate ---------------- */
+    const [liveText, setLiveText] = React.useState("");
+    const [toast, setToast] = React.useState(null);
+    const toastTimer = React.useRef(null);
+    const saveTimer = React.useRef(null);
+    const saving = React.useRef(null);
+    const savePending = React.useRef(false);
+    const flushSave = React.useCallback(async () => {
+        if (saveTimer.current) {
+            clearTimeout(saveTimer.current);
+            saveTimer.current = null;
+        }
+        if (saving.current) {
+            savePending.current = true;
+            return;
+        }
+        const run = async () => {
+            do {
+                savePending.current = false;
+                const cur = stateRef.current;
+                if (!cur)
+                    return;
+                const row = await saveGuides(organizationId, suite, cur.progress);
+                if (row && stateRef.current) {
+                    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+                    dispatchRef.current({ type: "serverRow", progress: row });
+                }
+            } while (savePending.current);
+        };
+        saving.current = run().finally(() => {
+            saving.current = null;
+        });
+    }, [organizationId, suite]);
+    const runEffects = React.useCallback((effects) => {
+        for (const e of effects) {
+            try {
+                if (e.type === "save") {
+                    if (stateRef.current)
+                        writeMirror(organizationId, suite, stateRef.current.progress);
+                    if (e.immediate)
+                        void flushSave();
+                    else {
+                        if (saveTimer.current)
+                            clearTimeout(saveTimer.current);
+                        saveTimer.current = setTimeout(() => void flushSave(), SAVE_DEBOUNCE_MS);
+                    }
+                }
+                else if (e.type === "announce") {
+                    setLiveText("");
+                    setTimeout(() => setLiveText(e.text), 60);
+                }
+                else if (e.type === "toast") {
+                    setToast(e.text);
+                    if (toastTimer.current)
+                        clearTimeout(toastTimer.current);
+                    toastTimer.current = setTimeout(() => setToast(null), 3200);
+                }
+                else if (e.type === "navigate") {
+                    if (/^https?:\/\//i.test(e.href))
+                        window.location.assign(e.href);
+                    else
+                        router.push(e.href);
+                }
+                else if (e.type === "closeAppDialog") {
+                    // After this render takes the guard away, Escape to the app's
+                    // dialog (Radix listens on the document).
+                    setTimeout(() => {
+                        const t = document.activeElement ?? document.body;
+                        t.dispatchEvent(new KeyboardEvent("keydown", { key: "Escape", code: "Escape", bubbles: true, cancelable: true }));
+                    }, 60);
+                }
+            }
+            catch {
+                /* an effect never breaks the app */
+            }
+        }
+    }, [flushSave, organizationId, router, suite]);
+    const dispatch = React.useCallback((action) => {
+        const cur = stateRef.current;
+        if (!cur)
+            return;
+        let r;
+        try {
+            r = reduceGuide(cur, action, suite, env());
+        }
+        catch (err) {
+            if (typeof console !== "undefined")
+                console.warn("[erp-shell guide] stopped", err);
+            stateRef.current = null;
+            setState(null);
+            return;
+        }
+        if (r.state !== cur) {
+            stateRef.current = r.state;
+            setState(r.state);
+        }
+        if (r.effects.length)
+            runEffects(r.effects);
+    }, [env, runEffects, suite]);
+    const dispatchRef = React.useRef(dispatch);
+    dispatchRef.current = dispatch;
+    // Save what is pending when the page goes away.
+    React.useEffect(() => {
+        const flush = () => {
+            if (saveTimer.current)
+                void flushSave();
+        };
+        window.addEventListener("pagehide", flush);
+        return () => {
+            window.removeEventListener("pagehide", flush);
+            flush();
+            if (toastTimer.current)
+                clearTimeout(toastTimer.current);
+        };
+    }, [flushSave]);
+    /* ---------------- boot: resume, welcome ---------------- */
+    const screen = state?.screen ?? { name: "idle" };
+    const resumed = React.useRef(false);
+    React.useEffect(() => {
+        if (!live || !state || resumed.current)
+            return;
+        resumed.current = true;
+        dispatch({ type: "resume" });
+    }, [live, state, dispatch]);
+    const welcomeRoutes = suite.welcomeRoutes ?? ["/[code]"];
+    const onWelcomeRoute = welcomeRoutes.some(r => !!matchRoute(r, pathname, search, code));
+    const due = !!state && live && welcomeDue(state, suite) && onWelcomeRoute && fetching === 0;
+    const factsKey = useFactsKey(config.facts);
+    React.useEffect(() => {
+        if (!due)
+            return;
+        const t = setTimeout(() => dispatchRef.current({ type: "welcome" }), WELCOME_DELAY_MS);
+        return () => clearTimeout(t);
+    }, [due, factsKey]);
+    /* ---------------- sync on route, sidebar, facts, DOM ---------------- */
+    const inStep = live && screen.name === "step";
+    React.useEffect(() => {
+        if (inStep)
+            dispatch({ type: "sync" });
+    }, [inStep, pathname, search, sidebarOpen, factsKey, dispatch]);
+    React.useEffect(() => {
+        if (!inStep || typeof MutationObserver === "undefined")
+            return;
+        let raf = 0;
+        const obs = new MutationObserver(records => {
+            // Our own layer's changes are not the page's.
+            if (records.every(r => inGuideLayer(r.target)))
+                return;
+            if (raf)
+                return;
+            raf = requestAnimationFrame(() => {
+                raf = 0;
+                dispatchRef.current({ type: "sync" });
+            });
+        });
+        obs.observe(document.body, {
+            childList: true,
+            subtree: true,
+            attributes: true,
+            attributeFilter: ["data-state", "hidden", "aria-hidden", "class", "style", "open"],
+        });
+        return () => {
+            obs.disconnect();
+            if (raf)
+                cancelAnimationFrame(raf);
+        };
+    }, [inStep]);
+    /* ---------------- the current step ---------------- */
+    const stepInfo = React.useMemo(() => {
+        if (!state || screen.name !== "step")
+            return null;
+        const mission = findMission(suite, screen.mission);
+        if (!mission)
+            return null;
+        const step = mission.steps[screen.index];
+        if (!step)
+            return null;
+        const missionNo = suite.missions.indexOf(mission) + 1;
+        return { mission, step, missionNo };
+    }, [state, screen, suite]);
+    const stepCtx = React.useMemo(() => {
+        if (!state)
+            return null;
+        const e = env();
+        const params = stepInfo?.step.route ? (matchRoute(stepInfo.step.route, e.pathname, e.search, code) ?? {}) : {};
+        return guideContext(e, state.progress.context, params);
+        // pathname/search/factsKey make it current.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [state, stepInfo, env, code, pathname, search, factsKey]);
+    const target = stepInfo && stepCtx && screen.name === "step"
+        ? spotlightTarget(stepInfo.step, stepCtx, screen.bridge)
+        : null;
+    const targetKey = target ? `${target.anchor}|${target.id ?? ""}` : "";
+    const phase = screen.name === "step" ? screen.phase : null;
+    const stepId = screen.name === "step" ? `${screen.mission}:${screen.index}:${screen.bridge ? "b" : ""}` : "";
+    /* Measure every frame while a step is shown: the spotlight follows
+       scrolling, dialogs animating in, the drawer sliding, the keyboard. */
+    const [layout, setLayout] = React.useState({
+        spot: null,
+        holes: [],
+        vw: 0,
+        vh: 0,
+        oy: 0,
+    });
+    React.useEffect(() => {
+        if (!inStep) {
+            targetElRef.current = null;
+            return;
+        }
+        let raf = 0;
+        let lostSince = null;
+        let last = { spot: null, holes: [], vw: 0, vh: 0, oy: 0 };
+        targetElRef.current = target ? findAnchor(target.anchor, target.id) : null;
+        const allow = stepInfo?.step.allow ?? [];
+        const tick = () => {
+            raf = requestAnimationFrame(tick);
+            const vv = window.visualViewport;
+            const vw = window.innerWidth;
+            const vh = vv ? vv.height : window.innerHeight;
+            const oy = vv ? vv.offsetTop : 0;
+            let el = targetElRef.current;
+            if (target && (!el || !el.isConnected)) {
+                el = findAnchor(target.anchor, target.id);
+                targetElRef.current = el;
+            }
+            let spot = null;
+            if (target && el && isPresent(el)) {
+                lostSince = null;
+                spot = padRect(rectOf(el), TARGET_PAD);
+            }
+            else if (target) {
+                // Maybe re-rendered under another node.
+                const again = findAnchor(target.anchor, target.id);
+                if (again) {
+                    targetElRef.current = again;
+                    spot = padRect(rectOf(again), TARGET_PAD);
+                    lostSince = null;
+                }
+                else if (phase === "ready") {
+                    lostSince ?? (lostSince = performance.now());
+                    if (performance.now() - lostSince > LOST_GRACE_MS) {
+                        lostSince = null;
+                        dispatchRef.current({ type: "targetLost" });
+                    }
+                }
+            }
+            if (phase === "waiting" && spot)
+                dispatchRef.current({ type: "sync" });
+            const holes = [];
+            for (const p of openPoppers())
+                holes.push(padRect(rectOf(p), 2));
+            for (const a of allow) {
+                const ael = findAnchor(a);
+                if (ael)
+                    holes.push(padRect(rectOf(ael), TARGET_PAD));
+            }
+            const next = { spot, holes, vw, vh, oy };
+            if (!sameRect(next.spot, last.spot) ||
+                next.vw !== last.vw ||
+                next.vh !== last.vh ||
+                next.oy !== last.oy ||
+                next.holes.length !== last.holes.length ||
+                next.holes.some((h, i) => !sameRect(h, last.holes[i]))) {
+                last = next;
+                setLayout(next);
+            }
+        };
+        raf = requestAnimationFrame(tick);
+        return () => cancelAnimationFrame(raf);
+        // stepId/targetKey/phase restart the loop for a new step.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [inStep, stepId, targetKey, phase]);
+    /* Waiting for the target: 8 s of not-loading time (30 s at most). */
+    const fetchingRef = React.useRef(fetching);
+    fetchingRef.current = fetching;
+    React.useEffect(() => {
+        if (!inStep || phase !== "waiting")
+            return;
+        let idle = 0;
+        const started = Date.now();
+        const timeout = stepInfo?.step.timeoutMs ?? WAIT_MS;
+        const iv = setInterval(() => {
+            if (fetchingRef.current === 0 && document.visibilityState !== "hidden")
+                idle += 250;
+            if (idle >= timeout || Date.now() - started >= WAIT_CAP_MS) {
+                clearInterval(iv);
+                dispatchRef.current({ type: "timeout" });
+            }
+        }, 250);
+        return () => clearInterval(iv);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [inStep, stepId, phase, screen.name === "step" ? screen.misses : 0]);
+    /* On a step becoming ready: bring the target into view, focus, describe. */
+    const readyKey = inStep && phase === "ready" ? stepId : "";
+    React.useEffect(() => {
+        if (!readyKey || !stepInfo || screen.name !== "step")
+            return;
+        const el = targetElRef.current ?? (target ? findAnchor(target.anchor, target.id) : null);
+        if (el)
+            revealTarget(el);
+        const isInput = !screen.bridge && stepKind(stepInfo.step) === "input";
+        const t = setTimeout(() => {
+            if (isInput && el) {
+                const f = fieldOf(el);
+                f?.focus({ preventScroll: true });
+            }
+            else {
+                const b = document.querySelector(`[${GUIDE_LAYER_ATTRIBUTE}] [data-eg-bubble]`);
+                b?.focus({ preventScroll: true });
+            }
+        }, 30);
+        // The target is described by the bubble while the step lasts.
+        const described = el ? (isInput ? fieldOf(el) : el) : null;
+        const prev = described?.getAttribute("aria-describedby") ?? null;
+        if (described)
+            described.setAttribute("aria-describedby", [BUBBLE_TITLE_ID, BUBBLE_WHY_ID, prev].filter(Boolean).join(" "));
+        return () => {
+            clearTimeout(t);
+            if (!described)
+                return;
+            if (prev)
+                described.setAttribute("aria-describedby", prev);
+            else
+                described.removeAttribute("aria-describedby");
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [readyKey]);
+    /* Signals from the page: API answers, app events, presses, typing. */
+    React.useEffect(() => {
+        if (!inStep || !stepInfo)
+            return;
+        const onApi = (e) => {
+            const d = e.detail;
+            if (!d || typeof d.status !== "number")
+                return;
+            dispatchRef.current({ type: "signal", signal: { kind: "api", method: d.method, path: d.path, status: d.status, id: d.id, message: d.message } });
+        };
+        window.addEventListener(API_EVENT, onApi);
+        const names = triggersOf(stepInfo.step).flatMap(t => ("event" in t ? [t.event] : []));
+        const onApp = (name) => (e) => dispatchRef.current({ type: "signal", signal: { kind: "event", name, detail: e.detail ?? undefined } });
+        const appHandlers = names.map(n => [GUIDE_EVENT_PREFIX + n, onApp(n)]);
+        appHandlers.forEach(([n, h]) => window.addEventListener(n, h));
+        const inTarget = (node) => {
+            const el = targetElRef.current;
+            return !!el && node instanceof Node && el.contains(node);
+        };
+        // After the app has handled it, so what it does comes first.
+        const later = (a) => setTimeout(() => dispatchRef.current(a), 0);
+        const onPress = (e) => {
+            if (inTarget(e.target))
+                later({ type: "signal", signal: { kind: "activate" } });
+        };
+        const onKey = (e) => {
+            if ((e.key === "Enter" || e.key === " ") && inTarget(e.target) && stepKind(stepInfo.step) !== "input") {
+                later({ type: "signal", signal: { kind: "activate" } });
+            }
+        };
+        const onInput = (e) => {
+            if (!inTarget(e.target))
+                return;
+            dispatchRef.current({ type: "signal", signal: { kind: "typing" } });
+            later({ type: "signal", signal: { kind: "value", value: fieldValue(targetElRef.current) } });
+        };
+        document.addEventListener("pointerup", onPress, true);
+        document.addEventListener("keydown", onKey, true);
+        document.addEventListener("input", onInput, true);
+        document.addEventListener("change", onInput, true);
+        return () => {
+            window.removeEventListener(API_EVENT, onApi);
+            appHandlers.forEach(([n, h]) => window.removeEventListener(n, h));
+            document.removeEventListener("pointerup", onPress, true);
+            document.removeEventListener("keydown", onKey, true);
+            document.removeEventListener("input", onInput, true);
+            document.removeEventListener("change", onInput, true);
+        };
+    }, [inStep, stepInfo]);
+    /* ---------------- the guard ---------------- */
+    const modalScreen = live && (screen.name === "welcome" || screen.name === "gate" || screen.name === "celebrate" || screen.name === "complete");
+    const panelOpen = live && !!state?.panelOpen;
+    const guarding = inStep || modalScreen;
+    const guardingRef = React.useRef(guarding);
+    guardingRef.current = guarding;
+    const modalRef = React.useRef(false);
+    modalRef.current = modalScreen || (screen.name === "step" && (screen.confirmExit || screen.phase !== "ready"));
+    const stepInfoRef = React.useRef(stepInfo);
+    stepInfoRef.current = stepInfo;
+    React.useEffect(() => {
+        if (!live)
+            return;
+        const allowedTarget = (node) => {
+            if (!(node instanceof Node))
+                return false;
+            const el = targetElRef.current;
+            if (el && el.contains(node))
+                return true;
+            const elNode = node instanceof Element ? node : node.parentElement;
+            if (!elNode)
+                return false;
+            if (elNode.closest(POPPER_SELECTOR) || elNode.closest(TOASTER_SELECTOR))
+                return true;
+            for (const a of stepInfoRef.current?.step.allow ?? []) {
+                const ael = findAnchor(a);
+                if (ael && ael.contains(node))
+                    return true;
+            }
+            return false;
+        };
+        const onPointer = (e) => {
+            const t = e.target;
+            if (inGuideLayer(t)) {
+                // Our dim layer eats the press (and keeps focus where it is).
+                if (t instanceof Element && t.closest("[data-eg-block]")) {
+                    e.preventDefault();
+                    if (e.type === "pointerdown")
+                        dispatchRef.current({ type: "blocked" });
+                }
+                // The app's open dialog or menu never hears the press (the click
+                // itself goes on to our buttons).
+                if (e.type !== "click")
+                    e.stopPropagation();
+                return;
+            }
+            if (!guardingRef.current)
+                return;
+            if (modalRef.current || !allowedTarget(t)) {
+                e.preventDefault();
+                e.stopPropagation();
+                if (e.type === "pointerdown")
+                    dispatchRef.current({ type: "blocked" });
+            }
+        };
+        // Radix FocusScope pulls focus back into an open dialog; DismissableLayer
+        // closes on focus outside. Neither may see focus moving to the tour.
+        const onFocusIn = (e) => {
+            if (inGuideLayer(e.target))
+                e.stopPropagation();
+        };
+        const onFocusOut = (e) => {
+            if (inGuideLayer(e.relatedTarget))
+                e.stopPropagation();
+        };
+        const onKey = (e) => {
+            const s = stateRef.current;
+            if (!s)
+                return;
+            const sc = s.screen;
+            const stop = () => {
+                e.preventDefault();
+                e.stopImmediatePropagation();
+            };
+            if (e.key === "Escape") {
+                if (sc.name === "step") {
+                    stop();
+                    if (sc.confirmExit)
+                        dispatchRef.current({ type: "exitCancel" });
+                    else
+                        dispatchRef.current({ type: "exit" });
+                }
+                else if (sc.name === "welcome") {
+                    stop();
+                    dispatchRef.current({ type: sc.confirm ? "welcomeSkipCancel" : "welcomeSkip" });
+                }
+                else if (sc.name === "gate") {
+                    stop();
+                    dispatchRef.current({ type: "gateLater" });
+                }
+                else if (sc.name === "celebrate") {
+                    stop();
+                    dispatchRef.current({ type: "rest" });
+                }
+                else if (sc.name === "complete") {
+                    stop();
+                    dispatchRef.current({ type: "finish" });
+                }
+                else if (s.panelOpen) {
+                    stop();
+                    dispatchRef.current({ type: "closePanel" });
+                }
+                return;
+            }
+            if (!guardingRef.current)
+                return;
+            const layer = layerRef.current;
+            if (e.key === "Tab") {
+                // Tab stays on what the step is about: the target and the bubble, or
+                // the open card.
+                const modals = layer ? Array.from(layer.querySelectorAll("[data-eg-modal],[data-eg-card]")) : [];
+                let list;
+                if (sc.name === "step" && !sc.confirmExit && sc.phase === "ready") {
+                    const el = targetElRef.current;
+                    const step = stepInfoRef.current?.step;
+                    const isInput = !!step && !sc.bridge && stepKind(step) === "input";
+                    const inTargetList = el ? focusablesIn(isInput ? (fieldOf(el) ?? el) : el) : [];
+                    const bubble = layer?.querySelector("[data-eg-bubble]") ?? null;
+                    list = [...inTargetList, ...(bubble ? Array.from(bubble.querySelectorAll(FOCUSABLE)) : [])];
+                    for (const p of openPoppers())
+                        list.push(...focusablesIn(p));
+                }
+                else {
+                    const last = modals[modals.length - 1] ?? null;
+                    list = last ? Array.from(last.querySelectorAll(FOCUSABLE)) : [];
+                }
+                if (!list.length)
+                    return;
+                stop();
+                const i = list.indexOf(document.activeElement);
+                const n = e.shiftKey ? (i <= 0 ? list.length - 1 : i - 1) : i === -1 || i === list.length - 1 ? 0 : i + 1;
+                list[n].focus();
+                return;
+            }
+            if (e.key === "Enter" || e.key === " ") {
+                const active = document.activeElement;
+                if (inGuideLayer(active))
+                    return;
+                if (sc.name === "step" && sc.phase === "ready" && !sc.confirmExit && e.key === "Enter") {
+                    const step = stepInfoRef.current?.step;
+                    const el = targetElRef.current;
+                    if (step && stepKind(step) === "input" && el && active instanceof Node && el.contains(active) && !(active instanceof HTMLTextAreaElement)) {
+                        // During the tour Enter is ถัดไป, not "submit the form".
+                        stop();
+                        dispatchRef.current({ type: "next" });
+                        return;
+                    }
+                }
+                if (modalRef.current || !allowedTarget(active))
+                    stop();
+            }
+        };
+        window.addEventListener("pointerdown", onPointer, true);
+        window.addEventListener("mousedown", onPointer, true);
+        window.addEventListener("touchstart", onPointer, { capture: true, passive: false });
+        window.addEventListener("click", onPointer, true);
+        window.addEventListener("focusin", onFocusIn, true);
+        window.addEventListener("focusout", onFocusOut, true);
+        window.addEventListener("keydown", onKey, true);
+        return () => {
+            window.removeEventListener("pointerdown", onPointer, true);
+            window.removeEventListener("mousedown", onPointer, true);
+            window.removeEventListener("touchstart", onPointer, true);
+            window.removeEventListener("click", onPointer, true);
+            window.removeEventListener("focusin", onFocusIn, true);
+            window.removeEventListener("focusout", onFocusOut, true);
+            window.removeEventListener("keydown", onKey, true);
+        };
+    }, [live]);
+    /* Focus comes back to where it was when the tour lets go. */
+    const lastFocus = React.useRef(null);
+    const engaged = guarding || panelOpen;
+    React.useLayoutEffect(() => {
+        if (engaged) {
+            if (!lastFocus.current) {
+                const a = document.activeElement;
+                lastFocus.current = a instanceof HTMLElement && !inGuideLayer(a) ? a : null;
+            }
+            return;
+        }
+        const back = lastFocus.current;
+        lastFocus.current = null;
+        if (back && back.isConnected)
+            back.focus({ preventScroll: true });
+    }, [engaged]);
+    /* ---------------- the layer ---------------- */
+    const [layer, setLayer] = React.useState(null);
+    const layerRef = React.useRef(null);
+    React.useEffect(() => {
+        const el = document.createElement("div");
+        el.setAttribute(GUIDE_LAYER_ATTRIBUTE, "");
+        document.body.appendChild(el);
+        layerRef.current = el;
+        setLayer(el);
+        // A Radix modal hides everything else from screen readers; not us.
+        const obs = new MutationObserver(() => {
+            if (el.getAttribute("aria-hidden") === "true")
+                el.removeAttribute("aria-hidden");
+            if (el.hasAttribute("data-aria-hidden"))
+                el.removeAttribute("data-aria-hidden");
+            if (el.hasAttribute("inert"))
+                el.removeAttribute("inert");
+        });
+        obs.observe(el, { attributes: true, attributeFilter: ["aria-hidden", "data-aria-hidden", "inert"] });
+        return () => {
+            obs.disconnect();
+            el.remove();
+            layerRef.current = null;
+        };
+    }, []);
+    const [phone, setPhone] = React.useState(false);
+    const [reduced, setReduced] = React.useState(false);
+    React.useEffect(() => {
+        const sync = () => {
+            setPhone(isPhoneWidth());
+            setReduced(prefersReducedMotion());
+        };
+        sync();
+        window.addEventListener("resize", sync);
+        return () => window.removeEventListener("resize", sync);
+    }, []);
+    // The celebration waits a beat, so the new row can be seen first.
+    const [celebrateShown, setCelebrateShown] = React.useState(false);
+    const celebrateKey = screen.name === "celebrate" || screen.name === "complete" ? screen.name + (screen.name === "celebrate" ? screen.mission : "") : "";
+    React.useEffect(() => {
+        setCelebrateShown(false);
+        if (!celebrateKey)
+            return;
+        const t = setTimeout(() => setCelebrateShown(true), CELEBRATE_DELAY_MS);
+        return () => clearTimeout(t);
+    }, [celebrateKey]);
+    // Ring moves smoothly only right after a step change.
+    const [moving, setMoving] = React.useState(false);
+    React.useEffect(() => {
+        if (!stepId)
+            return;
+        setMoving(true);
+        const t = setTimeout(() => setMoving(false), 320);
+        return () => clearTimeout(t);
+    }, [stepId]);
+    /* ---------------- the "?" menu entry ---------------- */
+    const ctxIdle = React.useMemo(() => (state ? guideContext(env(), state.progress.context) : null), [state, env, factsKey, pathname]); // eslint-disable-line react-hooks/exhaustive-deps
+    const done = state && ctxIdle ? settledCount(suite, state.progress, ctxIdle) : 0;
+    const total = suite.missions.length;
+    React.useEffect(() => {
+        if (!live || !state) {
+            publishGuideEntry(null, null);
+            return;
+        }
+        publishGuideEntry({ done, total }, () => dispatchRef.current({ type: "openPanel" }));
+    }, [live, state, done, total]);
+    React.useEffect(() => () => publishGuideEntry(null, null), []);
+    if (!live || !state || !layer || !ctxIdle)
+        return null;
+    /* ---------------- render ---------------- */
+    const views = missionViews(suite, state.progress, ctxIdle);
+    const gate = suite.gate;
+    const gateHref = gate ? resolveText(gate.action.href, ctxIdle) : "";
+    const gateFailing = gate ? gateState(suite, ctxIdle) === false : false;
+    let content = null;
+    if (screen.name === "welcome") {
+        content = (jsxRuntime.jsx(WelcomeModal, { title: resolveText(suite.welcome.title, ctxIdle), subtitle: resolveText(suite.welcome.subtitle, ctxIdle) || `มาตั้งค่าบริษัทให้พร้อมใน ${total} ภารกิจ`, missions: suite.missions.map(m => ({ title: m.title, minutes: m.minutes })), confirm: screen.confirm, onStart: () => dispatch({ type: "welcomeStart" }), onSkip: () => dispatch({ type: "welcomeSkip" }), onSkipConfirm: () => dispatch({ type: "welcomeSkipConfirm" }), onSkipCancel: () => dispatch({ type: "welcomeSkipCancel" }) }));
+    }
+    else if (screen.name === "gate" && gate) {
+        content = (jsxRuntime.jsx(GateModal, { title: gate.title, subtitle: gate.subtitle, actionLabel: gate.action.label, href: gateHref, onLater: () => dispatch({ type: "gateLater" }) }));
+    }
+    else if (screen.name === "step" && stepInfo && stepCtx) {
+        const { mission, step, missionNo } = stepInfo;
+        const kind = stepKind(step);
+        const bridge = screen.bridge;
+        content = (jsxRuntime.jsx(StepLayer, { spot: layout.spot, holes: layout.holes, viewport: { width: layout.vw || window.innerWidth, height: layout.vh || window.innerHeight, offsetTop: layout.oy }, phone: phone, showHand: bridge || (kind !== "input" && kind !== "view"), bubble: {
+                missionNo,
+                missionTitle: mission.title,
+                replay: screen.replay,
+                index: screen.index,
+                total: mission.steps.length,
+                title: bridge ? "กดปุ่มเมนู" : resolveText(step.title, stepCtx),
+                why: bridge ? `เมนูทั้งหมดของ ${suite.appName} อยู่ในนี้` : resolveText(step.why, stepCtx),
+                error: screen.error,
+                showNext: !bridge && (kind === "input" || kind === "view"),
+                showEndWithoutSave: !bridge && screen.replay && kind === "commit",
+            }, hasTarget: bridge || !!step.target, phase: screen.phase, confirmExit: screen.confirmExit, nudge: state.nudge, moving: moving, onExit: () => dispatch({ type: "exit" }), onNext: () => dispatch({ type: "next" }), onEndWithoutSave: () => dispatch({ type: "endWithoutSave" }), onRetry: () => dispatch({ type: "retry" }), onGoResume: () => dispatch({ type: "goResume" }), onExitConfirm: () => dispatch({ type: "exitConfirm" }), onExitCancel: () => dispatch({ type: "exitCancel" }) }));
+    }
+    else if (screen.name === "celebrate" && celebrateShown) {
+        const mission = findMission(suite, screen.mission);
+        const next = findMission(suite, nextMissionKey(suite, state.progress, ctxIdle));
+        if (mission) {
+            content = (jsxRuntime.jsx(CelebrateModal, { missionNo: suite.missions.indexOf(mission) + 1, title: resolveText(mission.done?.title, ctxIdle) || `${mission.title}แล้ว`, subtitle: resolveText(mission.done?.subtitle, ctxIdle), done: done, total: total, nextTitle: next?.title ?? null, reduced: reduced, onNext: () => dispatch({ type: "celebrateNext" }), onRest: () => dispatch({ type: "rest" }) }));
+        }
+    }
+    else if (screen.name === "complete" && celebrateShown) {
+        const secondary = suite.complete.secondary;
+        let secondaryHref;
+        try {
+            secondaryHref = secondary ? (typeof secondary.href === "function" ? secondary.href(ctxIdle) : secondary.href) : undefined;
+        }
+        catch {
+            secondaryHref = undefined;
+        }
+        content = (jsxRuntime.jsx(CompleteModal, { total: total, title: resolveText(suite.complete.title, ctxIdle) || "บริษัทพร้อมใช้งานแล้ว", subtitle: resolveText(suite.complete.subtitle, ctxIdle), missions: suite.missions.map(m => m.title), actionLabel: suite.complete.action.label, secondary: secondary && secondaryHref ? { label: secondary.label, href: secondaryHref } : null, reduced: reduced, onFinish: () => dispatch({ type: "finish" }) }));
+    }
+    const items = views.map(v => ({
+        key: v.mission.key,
+        title: v.mission.title,
+        minutes: v.mission.minutes,
+        view: v.view,
+        optional: !!v.mission.optional,
+        completedAt: v.entry?.completed_at ?? null,
+        lockedBy: v.view === "locked"
+            ? (v.mission.after ?? [])
+                .map(k => findMission(suite, k)?.title)
+                .filter(Boolean)
+                .join(", ")
+            : undefined,
+    }));
+    const showChip = chipVisible(state, suite, ctxIdle);
+    return reactDom.createPortal(jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("style", { children: GUIDE_CSS }), jsxRuntime.jsx("div", { className: "eg-sr", "aria-live": "polite", role: "status", children: liveText }), content, showChip ? jsxRuntime.jsx(QuestChip, { done: done, total: total, pulse: state.chipPulse, onOpen: () => dispatch({ type: "openPanel" }) }) : null, state.panelOpen && screen.name === "idle" ? (jsxRuntime.jsx(QuestPanel, { items: items, done: done, total: total, justDone: state.justDone, gate: gate && gateFailing ? { label: gate.action.label, pending: gate.pending, href: gateHref } : null, canHideChip: !state.progress.chip_hidden && state.progress.status !== "completed", onClose: () => dispatch({ type: "closePanel" }), onStart: (key, replayIt) => dispatch({ type: "start", mission: key, replay: replayIt }), onDismiss: key => dispatch({ type: "dismissMission", mission: key }), onHideChip: () => dispatch({ type: "hideChip" }) })) : null, toast ? jsxRuntime.jsx(GuideToast, { text: toast }) : null] }), layer);
+}
+/** A stable key for the facts object, so effects re-run when they change. */
+function useFactsKey(facts) {
+    return React.useMemo(() => {
+        try {
+            return JSON.stringify(facts ?? {});
+        }
+        catch {
+            return String(Math.random());
+        }
+    }, [facts]);
+}
+
+/**
+ * Top-level app chrome: sticky header, sidebar slot, content gutter and the
+ * session/org-context plumbing that both Accounting and HR need. Apps wrap
+ * it inside their `SidebarProvider` (server-rendered with the cookie-backed
+ * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
+ * props.
+ *
+ * The padding contract is deliberately owned here so future style tweaks
+ * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
+ * an erp-shell bump — domain components must NOT add their own root padding
+ * or content gets indented twice.
+ */
+function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, organizationsStatus, notMemberComponent, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, showHelp = true, helpApp, guides, }) {
+    const { data: session, status } = react.useSession();
+    const { open, setOpen } = useSidebar();
+    const router = navigation.useRouter();
+    const params = navigation.useParams();
+    const code = params?.code;
+    const extendedSession = session;
+    // Track once-authenticated so a transient accessToken drop during the
+    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
+    // blank the whole page. The initial-load gate below still handles cold
+    // start; once we've seen a real token we render children optimistically
+    // and let the API layer surface a real 401 if the token actually died.
+    const hasSeenAccessTokenRef = React.useRef(false);
+    React.useEffect(() => {
+        if (extendedSession?.accessToken)
+            hasSeenAccessTokenRef.current = true;
+    }, [extendedSession?.accessToken]);
+    // The URL's `[code]` is authoritative: the page mounts only once the active
+    // organisation is the one it names (see url-org-gate.ts).
+    //
+    // The gate used to start only when the code had resolved AND an active id
+    // existed, which left two holes. While the organisation list loaded, the
+    // page mounted at once and its first requests carried the previous
+    // organisation — /O26000021/procurement/purchase-requisition/<id> fetched
+    // the document from O26000019 before the switch. And a code naming none of
+    // the user's organisations never resolved, so the page rendered the
+    // previous organisation's data under it.
+    const urlOrgGate = resolveUrlOrgGate({
+        code,
+        organizations,
+        organizationsStatus,
+        organizationId,
+    });
+    const switchTargetId = urlOrgGate.state === "switching" ? urlOrgGate.targetId : null;
+    // Switch the active organisation to the URL's. Once per target: the setter
+    // writes the cookie through a server action, and re-firing it on every
+    // render while that round trip is in flight only queues duplicates.
+    const requestedSwitchRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!switchTargetId) {
+            requestedSwitchRef.current = null;
+            return;
+        }
+        if (requestedSwitchRef.current === switchTargetId)
+            return;
+        requestedSwitchRef.current = switchTargetId;
+        void setOrganizationId(switchTargetId);
+    }, [switchTargetId, setOrganizationId]);
+    // Once the user's organisations are known, requests prefer a stored
+    // organisation that is one of them (getRequestOrganizationId).
+    const organizationsLoaded = (organizationsStatus ??
+        (organizations.length > 0 ? "success" : undefined)) === "success";
+    React.useEffect(() => {
+        if (organizationsLoaded) {
+            setKnownOrganizationIds(organizations.map(org => org.id));
+        }
+    }, [organizationsLoaded, organizations]);
+    // An active organisation that is not one of the user's — deleted, or left —
+    // is replaced, so it stops being sent with every request. The URL's
+    // organisation, when the user is a member, is the gate's switch above;
+    // otherwise the user's only organisation, or none (they pick one: the
+    // refusal below offers it, and a path without a code goes to the picker).
+    // Once per stale id and target, so a setter that does not take cannot loop.
+    const staleRecovery = resolveStaleOrganization({
+        code,
+        organizations,
+        organizationsStatus,
+        organizationId,
+    });
+    const staleRecoveryTarget = staleRecovery.action === "forget"
         ? null
         : staleRecovery.action === "use" && !staleRecovery.fromUrl
             ? staleRecovery.targetId
@@ -3683,11 +6665,11 @@ function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permi
                                         // As in the design: the mark, then a menu button, and the
                                         // organisation on the right — no trail, no title, so the
                                         // organisation's name has the room it needs on a phone.
-                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: trail }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: trail }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
+                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", ...guideAnchor("shell.menu-toggle"), className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: trail }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: trail }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
                                     ? "relative z-10 px-[18px] pt-[26px] pb-4 sm:px-6 lg:px-10 lg:pt-[38px]"
                                     : cx("relative z-10 pr-6", needsLeftGutter && "pl-6"), children: refusePage
                                     ? (notMemberComponent ?? (jsxRuntime.jsx(AccessDenied, { title: "\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49", message: `บัญชีนี้ไม่ได้เป็นสมาชิกขององค์กร ${code}`, homeHref: selectOrganizationUrl, homeLabel: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })))
-                                    : wrap(children) }, `org-${contentOrgKey}`) })] }) }), showHelp ? jsxRuntime.jsx(HelpDialogHost, { app: helpApp, orgCode: code }) : null] }));
+                                    : wrap(children) }, `org-${contentOrgKey}`) })] }) }), showHelp ? jsxRuntime.jsx(HelpDialogHost, { app: helpApp, orgCode: code }) : null, guides && !refusePage && urlOrgGate.state === "ready" && organizationId != null && String(organizationId).trim() !== "" ? (jsxRuntime.jsx(GuideHost, { config: guides, organizationId: String(organizationId), code: code }, `guide-${String(organizationId)}`)) : null] }));
 }
 /** Local tiny classnames helper — avoids pulling clsx/tailwind-merge into
  *  the shell just for the layout file. Falsy values are skipped. */
@@ -3726,39 +6708,6 @@ function SidebarHelpLink({ label, href, icon, className }) {
     return external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: cls, children: body })) : (jsxRuntime.jsx(Link, { href: href, className: cls, children: body }));
 }
 
-const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
-const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
-const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
-/**
- * Shown when the API refuses every request because the signed-in account has
- * no employee record in this organisation.
- *
- * A gate rather than a banner. Leave, attendance, approvals and payslips all
- * identify a person by that record, so once the server started enforcing it
- * every call fails — and without something that says so, the app becomes a
- * screen of error toasts with no explanation and no way forward.
- */
-function EmployeeRequiredGate({ platformBaseUrl, }) {
-    const [blocked, setBlocked] = React.useState(false);
-    const params = navigation.useParams();
-    const code = params?.code ?? "";
-    React.useEffect(() => {
-        const onBlocked = () => setBlocked(true);
-        const onOk = () => setBlocked(false);
-        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
-        return () => {
-            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
-        };
-    }, []);
-    if (!blocked)
-        return null;
-    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
-    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
-    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
-}
-
 const shellClassName = "flex min-w-0 flex-1 flex-col gap-6 overflow-x-hidden";
 /**
  * Shared layout for “กำลังตรวจสอบสิทธิ์” (skeleton) and “ไม่มีสิทธิ์” (message).
@@ -4300,6 +7249,10 @@ exports.EMPLOYEE_RECORD_REQUIRED_EVENT = EMPLOYEE_RECORD_REQUIRED_EVENT;
 exports.EmployeeRequiredGate = EmployeeRequiredGate;
 exports.FOR_ORGANIZATION_FIELD = FOR_ORGANIZATION_FIELD;
 exports.FeatureFlagsProvider = FeatureFlagsProvider;
+exports.GUIDE_API_EVENT = API_EVENT;
+exports.GUIDE_EVENT_PREFIX = GUIDE_EVENT_PREFIX;
+exports.GUIDE_LAYER_ATTRIBUTE = GUIDE_LAYER_ATTRIBUTE;
+exports.GuideHost = GuideHost;
 exports.HeaderBackground = HeaderBackground;
 exports.HelpButton = HelpButton;
 exports.HelpDialogHost = HelpDialogHost;
@@ -4329,6 +7282,7 @@ exports.WITHOUT_ORGANIZATION_FLAG = WITHOUT_ORGANIZATION_FLAG;
 exports.WORKSPACE_HEADER_VARS = WORKSPACE_HEADER_VARS;
 exports.WORKSPACE_LIGHT_HEADER_VARS = WORKSPACE_LIGHT_HEADER_VARS;
 exports.WorkspaceBrand = WorkspaceBrand;
+exports.accountSettingsHref = accountSettingsHref;
 exports.axiosInstance = instance;
 exports.buildSystemLinks = buildSystemLinks;
 exports.buildUrlWithCode = buildUrlWithCode;
@@ -4341,6 +7295,7 @@ exports.decodeJWT = decodeJWT;
 exports.describeAttached = describeAttached;
 exports.describeBrowser = describeBrowser;
 exports.detectHelpApp = detectHelpApp;
+exports.emitGuideEvent = emitGuideEvent;
 exports.filterNavigationModulesByPermission = filterNavigationModulesByPermission;
 exports.filterNavigationToolsByPermission = filterNavigationToolsByPermission;
 exports.findOrganizationForCode = findOrganizationForCode;
@@ -4354,15 +7309,19 @@ exports.getRequestOrganizationId = getRequestOrganizationId;
 exports.getRequiredChildGroups = getRequiredChildGroups;
 exports.getStoredOrganizationIds = getStoredOrganizationIds;
 exports.getTabOrganizationId = getTabOrganizationId;
+exports.guideAnchor = guideAnchor;
 exports.hasPlanFeature = hasPlanFeature;
 exports.isKnownStaleOrganizationId = isKnownStaleOrganizationId;
 exports.isLikelyTransientNetworkError = isLikelyTransientNetworkError;
 exports.isPathActive = isPathActive;
 exports.myRolesQueryKey = myRolesQueryKey;
 exports.normalizePathnameForPermissionRules = normalizePathnameForPermissionRules;
+exports.openGuidePanel = openGuidePanel;
 exports.openHelp = openHelp;
 exports.organizationScopedQueryHash = organizationScopedQueryHash;
 exports.parseMyRoles = parseMyRoles;
+exports.platformBaseUrl = platformBaseUrl;
+exports.reportApiEvent = reportApiEvent;
 exports.resolveActiveNav = resolveActiveNav;
 exports.resolveSidebarNav = resolveSidebarNav;
 exports.resolveStaleOrganization = resolveStaleOrganization;
@@ -4382,6 +7341,7 @@ exports.updateOrganizationId = updateOrganizationId;
 exports.useClearOrgOnUserChange = useClearOrgOnUserChange;
 exports.useFeatureFlag = useFeatureFlag;
 exports.useFeatureFlags = useFeatureFlags;
+exports.useGuideEntry = useGuideEntry;
 exports.useInvalidateQueriesOnOrgChange = useInvalidateQueriesOnOrgChange;
 exports.useKeycloakRoles = useKeycloakRoles;
 exports.useMyRoles = useMyRoles;