/** * Funding Machine — After-Hours Concierge * -------------------------------------------------------------- * Custom help widget for docs.myfundingmachine.com. * Talks to a server-side proxy (/api/help-chat on marketplace-app.myfundingmachine.com) * which forwards to the GHL Agent Studio /execute endpoint. The Bearer token * never reaches the browser. * * Mounts inside a Shadow DOM so Mintlify's Tailwind cannot bleed in. * No external runtime deps. Persists conversation state in localStorage. */ (function () { if (typeof window === "undefined" || typeof document === "undefined") return; if (window.__fmConciergeMounted) return; window.__fmConciergeMounted = true; var PROXY_URL = "https://marketplace-app.myfundingmachine.com/api/help-chat"; var STORAGE_KEY = "fm-help-chat-v1"; var MAX_HISTORY = 50; var MAX_MESSAGE_LEN = 2000; var SUGGESTED_PROMPTS = [ "How do I submit a client?", "How does billing work?", "How do affiliates get paid?" ]; // ---------- font injection ---------- function injectFonts() { if (document.querySelector('link[data-fm-concierge-fonts="1"]')) return; var preconnect1 = document.createElement("link"); preconnect1.rel = "preconnect"; preconnect1.href = "https://fonts.googleapis.com"; preconnect1.setAttribute("data-fm-concierge-fonts", "1"); document.head.appendChild(preconnect1); var preconnect2 = document.createElement("link"); preconnect2.rel = "preconnect"; preconnect2.href = "https://fonts.gstatic.com"; preconnect2.crossOrigin = "anonymous"; preconnect2.setAttribute("data-fm-concierge-fonts", "1"); document.head.appendChild(preconnect2); var fontsLink = document.createElement("link"); fontsLink.rel = "stylesheet"; fontsLink.href = "https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700&family=DM+Sans:ital,wght@0,400;0,500;0,600;1,400&display=swap"; fontsLink.setAttribute("data-fm-concierge-fonts", "1"); document.head.appendChild(fontsLink); } // ---------- state ---------- /** @type {{ id: string, role: "user" | "assistant" | "error", text: string, ts: number }[]} */ var messages = []; /** @type {string | null} */ var interactionId = null; /** @type {string | null} */ var executionId = null; var sending = false; function loadState() { try { var raw = localStorage.getItem(STORAGE_KEY); if (!raw) return; var parsed = JSON.parse(raw); if (!parsed || typeof parsed !== "object") return; if (Array.isArray(parsed.messages)) { messages = parsed.messages.slice(-MAX_HISTORY); } if (typeof parsed.interactionId === "string") { interactionId = parsed.interactionId; } if (typeof parsed.executionId === "string") { executionId = parsed.executionId; } } catch { // localStorage unavailable (private mode, quota, etc.) — start fresh } } function persistState() { try { var trimmed = messages.slice(-MAX_HISTORY); localStorage.setItem( STORAGE_KEY, JSON.stringify({ messages: trimmed, interactionId: interactionId, executionId: executionId }) ); } catch { // localStorage may be full or disabled; non-fatal } } function clearState() { messages = []; interactionId = null; executionId = null; try { localStorage.removeItem(STORAGE_KEY); } catch { // ignore } } // ---------- markdown (tiny, escape-first) ---------- function escapeHtml(s) { return String(s) .replace(/&/g, "&") .replace(//g, ">") .replace(/"/g, """) .replace(/'/g, "'"); } function renderMarkdown(input) { var src = escapeHtml(input); // Code blocks (```...```) — render as

    src = src.replace(/```([\s\S]*?)```/g, function (_, code) {
      return '' + code.replace(/\n$/, "") + "";
    });

    // Inline code
    src = src.replace(/`([^`\n]+)`/g, '$1');

    // Bold **text** then italic *text*
    src = src.replace(/\*\*([^*\n]+)\*\*/g, "$1");
    src = src.replace(/(^|[^\*])\*([^*\n]+)\*/g, "$1$2");

    // Links [label](https://…) — http/https only.
    src = src.replace(
      /\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g,
      '$1'
    );

    // Bare URLs
    src = src.replace(
      /(^|\s)(https?:\/\/[^\s<]+)(?=\s|$)/g,
      '$1$2'
    );

    // Lists: convert "- item" lines to a styled list
    var lines = src.split("\n");
    var out = [];
    var listOpen = false;
    for (var i = 0; i < lines.length; i++) {
      var ln = lines[i];
      var listMatch = ln.match(/^\s*[-*]\s+(.*)$/);
      if (listMatch) {
        if (!listOpen) {
          out.push('');
          listOpen = true;
        }
        out.push("" + listMatch[1] + "");
      } else {
        if (listOpen) {
          out.push("");
          listOpen = false;
        }
        out.push(ln);
      }
    }
    if (listOpen) out.push("");

    var joined = out.join("\n");
    // Convert double newlines → paragraph breaks, single newlines → 

    var paragraphs = joined.split(/\n{2,}/).map(function (p) {
      return p.replace(/\n/g, "
");
    });
    return paragraphs
      .filter(function (p) {
        return p.trim().length > 0;
      })
      .map(function (p) {
        return p.indexOf("" + p + "";
      })
      .join("");
  }

  // ---------- response unwrapping ----------
  function pickString(obj, keys) {
    for (var i = 0; i < keys.length; i++) {
      var v = obj && obj[keys[i]];
      if (typeof v === "string" && v.length > 0) return v;
    }
    return null;
  }

  function extractAgentReply(data) {
    if (!data || typeof data !== "object") return null;

    // Try common shapes — GHL has shifted these around between API versions.
    var direct = pickString(data, ["response", "message", "output", "text", "reply", "answer"]);
    if (direct) return direct;

    if (data.data && typeof data.data === "object") {
      var nested = pickString(data.data, ["response", "message", "output", "text", "reply", "answer"]);
      if (nested) return nested;
    }

    if (data.result && typeof data.result === "object") {
      var resultText = pickString(data.result, ["response", "message", "output", "text"]);
      if (resultText) return resultText;
    }

    // Some agent runtimes return choices[].message.content
    if (Array.isArray(data.choices) && data.choices[0]) {
      var choice = data.choices[0];
      if (choice.message && typeof choice.message.content === "string") return choice.message.content;
      if (typeof choice.text === "string") return choice.text;
    }

    return null;
  }

  function extractIds(data) {
    var nextInteraction = null;
    var nextExecution = null;
    if (data && typeof data === "object") {
      if (typeof data.interactionId === "string") nextInteraction = data.interactionId;
      if (typeof data.executionId === "string") nextExecution = data.executionId;
      if (data.data && typeof data.data === "object") {
        if (!nextInteraction && typeof data.data.interactionId === "string") nextInteraction = data.data.interactionId;
        if (!nextExecution && typeof data.data.executionId === "string") nextExecution = data.data.executionId;
      }
    }
    return { interactionId: nextInteraction, executionId: nextExecution };
  }

  // ---------- DOM ----------
  var host;
  var shadow;
  var els = {};

  function pad2(n) {
    return n < 10 ? "0" + n : "" + n;
  }

  function formatClock(ts) {
    var d = new Date(ts);
    var h = d.getHours();
    var m = d.getMinutes();
    var ampm = h >= 12 ? "PM" : "AM";
    h = h % 12;
    if (h === 0) h = 12;
    return pad2(h) + ":" + pad2(m) + " " + ampm;
  }

  function build() {
    host = document.createElement("div");
    host.id = "fm-concierge-host";
    host.style.cssText = [
      "all:initial",
      "position:fixed",
      "right:24px",
      "bottom:24px",
      "z-index:2147483647"
    ].join(";");
    document.body.appendChild(host);

    shadow = host.attachShadow({ mode: "open" });

    var style = document.createElement("style");
    style.textContent = STYLES;
    shadow.appendChild(style);

    var root = document.createElement("div");
    root.className = "concierge";
    root.setAttribute("data-open", "false");
    shadow.appendChild(root);

    // Launcher
    var launcher = document.createElement("button");
    launcher.type = "button";
    launcher.className = "launcher";
    launcher.setAttribute("aria-label", "Open Funding Machine concierge chat");
    launcher.setAttribute("aria-haspopup", "dialog");
    launcher.setAttribute("aria-expanded", "false");
    launcher.innerHTML = [
      '',
      '',
      '',
      '',
      'FM',
      '',
      '01'
    ].join("");
    root.appendChild(launcher);

    // Panel
    var panel = document.createElement("section");
    panel.className = "panel";
    panel.setAttribute("role", "dialog");
    panel.setAttribute("aria-modal", "false");
    panel.setAttribute("aria-label", "Funding Machine concierge chat");
    panel.innerHTML = [
      '',
      '',
      '',
      '',
      '',
        '',
          '',
          'CONCIERGE — FUNDING MACHINE',
        '',
        'What can I help you find tonight?',
        '',
          '',
          '',
        '',
      '',
      '',
      '',
      '',
      '',
        '',
          '0 / ' + MAX_MESSAGE_LEN + '',
        '',
        '',
          '',
          '',
        '',
      ''
    ].join("");
    root.appendChild(panel);

    els.root = root;
    els.launcher = launcher;
    els.panel = panel;
    els.transcript = panel.querySelector(".js-transcript");
    els.composer = panel.querySelector(".js-composer");
    els.input = panel.querySelector(".js-input");
    els.send = panel.querySelector(".js-send");
    els.counter = panel.querySelector(".js-counter");
    els.clear = panel.querySelector(".js-clear");
    els.close = panel.querySelector(".js-close");

    bindEvents();
    renderTranscript();
  }

  function bindEvents() {
    els.launcher.addEventListener("click", function () {
      open();
    });
    els.close.addEventListener("click", function () {
      close();
    });
    els.clear.addEventListener("click", function () {
      if (sending) return;
      clearState();
      renderTranscript();
      els.input.focus();
    });

    els.composer.addEventListener("submit", function (e) {
      e.preventDefault();
      submit();
    });

    els.input.addEventListener("keydown", function (e) {
      if (e.key === "Enter" && !e.shiftKey) {
        e.preventDefault();
        submit();
      }
    });

    els.input.addEventListener("input", function () {
      autoGrow();
      updateCounter();
    });

    document.addEventListener("keydown", function (e) {
      if (e.key === "Escape" && els.root.getAttribute("data-open") === "true") {
        close();
      }
    });
  }

  function autoGrow() {
    var ta = els.input;
    ta.style.height = "auto";
    var max = 5 * 22; // ~5 lines at 22px line-height
    ta.style.height = Math.min(ta.scrollHeight, max) + "px";
  }

  function updateCounter() {
    var len = els.input.value.length;
    els.counter.textContent = len + " / " + MAX_MESSAGE_LEN;
    els.counter.classList.toggle("near-limit", len > MAX_MESSAGE_LEN * 0.9);
  }

  function open() {
    els.root.setAttribute("data-open", "true");
    els.launcher.setAttribute("aria-expanded", "true");
    setTimeout(function () {
      els.input.focus();
      scrollToBottom();
    }, 80);
  }

  function close() {
    els.root.setAttribute("data-open", "false");
    els.launcher.setAttribute("aria-expanded", "false");
    els.launcher.focus();
  }

  function scrollToBottom() {
    if (!els.transcript) return;
    els.transcript.scrollTop = els.transcript.scrollHeight;
  }

  // ---------- transcript rendering ----------
  function renderTranscript() {
    var t = els.transcript;
    t.innerHTML = "";

    if (messages.length === 0) {
      t.appendChild(buildEmptyState());
      return;
    }

    var pairIndex = 0;
    for (var i = 0; i < messages.length; i++) {
      var m = messages[i];
      if (m.role === "user") {
        pairIndex += 1;
      }
      t.appendChild(buildTurn(m, pairIndex));
    }
    scrollToBottom();
  }

  function buildEmptyState() {
    var wrap = document.createElement("div");
    wrap.className = "empty";
    wrap.innerHTML = [
      '00 · WELCOME',
      'Good evening.',
      'Ask anything about funding, the platform, billing, or your account. Replies arrive in seconds.',
      ''
    ].join("");
    var promptList = wrap.querySelector(".prompts");
    for (var i = 0; i < SUGGESTED_PROMPTS.length; i++) {
      (function (text) {
        var li = document.createElement("li");
        var btn = document.createElement("button");
        btn.type = "button";
        btn.className = "prompt-link";
        btn.innerHTML = '→' + escapeHtml(text) + "";
        btn.addEventListener("click", function () {
          if (sending) return;
          els.input.value = text;
          updateCounter();
          submit();
        });
        li.appendChild(btn);
        promptList.appendChild(li);
      })(SUGGESTED_PROMPTS[i]);
    }
    return wrap;
  }

  function buildTurn(m, pairIndex) {
    var turn = document.createElement("article");
    turn.className = "turn turn-" + m.role;
    turn.setAttribute("data-id", m.id);

    var label = m.role === "user" ? "YOU" : m.role === "error" ? "ERROR" : "CONCIERGE";
    var indexStr = pad2(pairIndex);

    var header = document.createElement("div");
    header.className = "turn-eyebrow";
    header.innerHTML =
      '' + indexStr + "" +
      '·' +
      '' + label + "" +
      '' + formatClock(m.ts) + "";
    turn.appendChild(header);

    var body = document.createElement("div");
    body.className = "turn-body";
    if (m.role === "assistant" || m.role === "error") {
      body.innerHTML = renderMarkdown(m.text);
    } else {
      body.innerHTML = "" + escapeHtml(m.text).replace(/\n/g, "
") + "";
    }
    turn.appendChild(body);

    return turn;
  }

  function buildPendingTurn(pairIndex) {
    var turn = document.createElement("article");
    turn.className = "turn turn-assistant turn-pending";

    var indexStr = pad2(pairIndex);

    var header = document.createElement("div");
    header.className = "turn-eyebrow";
    header.innerHTML =
      '' + indexStr + "" +
      '·' +
      'CONCIERGE';
    turn.appendChild(header);

    var body = document.createElement("div");
    body.className = "turn-body";
    body.innerHTML = '';
    turn.appendChild(body);

    return turn;
  }

  // ---------- send ----------
  function submit() {
    if (sending) return;
    var text = els.input.value.trim();
    if (!text) return;
    if (text.length > MAX_MESSAGE_LEN) return;

    sending = true;
    var emptyExisted = messages.length === 0;

    var userMsg = {
      id: cryptoId(),
      role: "user",
      text: text,
      ts: Date.now()
    };
    messages.push(userMsg);
    persistState();

    els.input.value = "";
    autoGrow();
    updateCounter();

    if (emptyExisted) {
      renderTranscript();
    } else {
      var pairIndex = countUserTurns();
      els.transcript.appendChild(buildTurn(userMsg, pairIndex));
    }

    var pendingTurn = buildPendingTurn(countUserTurns());
    els.transcript.appendChild(pendingTurn);
    scrollToBottom();

    els.send.classList.add("is-sending");
    els.input.disabled = true;

    fetch(PROXY_URL, {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        message: text,
        interactionId: interactionId || undefined
      })
    })
      .then(function (res) {
        return res
          .json()
          .catch(function () {
            return null;
          })
          .then(function (data) {
            return { ok: res.ok, status: res.status, data: data };
          });
      })
      .then(function (result) {
        pendingTurn.remove();

        if (!result.ok) {
          var errText =
            (result.data && typeof result.data === "object" && result.data.error) ||
            "Couldn't reach the concierge. Please try again — or email support@myfundingmachine.com.";
          var errorMsg = {
            id: cryptoId(),
            role: "error",
            text: errText,
            ts: Date.now()
          };
          messages.push(errorMsg);
          persistState();
          els.transcript.appendChild(buildTurn(errorMsg, countUserTurns()));
          scrollToBottom();
          return;
        }

        var ids = extractIds(result.data);
        if (ids.interactionId) interactionId = ids.interactionId;
        if (ids.executionId) executionId = ids.executionId;

        var reply = extractAgentReply(result.data) ||
          "I received your message, but the response was empty. Please try rephrasing.";
        var assistantMsg = {
          id: cryptoId(),
          role: "assistant",
          text: reply,
          ts: Date.now()
        };
        messages.push(assistantMsg);
        persistState();
        els.transcript.appendChild(buildTurn(assistantMsg, countUserTurns()));
        scrollToBottom();
      })
      .catch(function (err) {
        pendingTurn.remove();
        console.error("[concierge] send failed", err);
        var errorMsg = {
          id: cryptoId(),
          role: "error",
          text: "Couldn't reach the concierge. Please check your connection and try again.",
          ts: Date.now()
        };
        messages.push(errorMsg);
        persistState();
        els.transcript.appendChild(buildTurn(errorMsg, countUserTurns()));
        scrollToBottom();
      })
      .then(function () {
        sending = false;
        els.send.classList.remove("is-sending");
        els.input.disabled = false;
        if (els.root.getAttribute("data-open") === "true") {
          els.input.focus();
        }
      });
  }

  function countUserTurns() {
    var n = 0;
    for (var i = 0; i < messages.length; i++) {
      if (messages[i].role === "user") n += 1;
    }
    return n;
  }

  function cryptoId() {
    if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
      return crypto.randomUUID();
    }
    return "id-" + Date.now() + "-" + Math.random().toString(36).slice(2, 10);
  }

  // ---------- styles ----------
  // Single-source CSS lives entirely in the shadow root. No external dependencies, no Tailwind.
  var STYLES = [
    ":host, .concierge, .concierge * { box-sizing: border-box; }",
    ".concierge {",
    "  --ink: #0a1929;",
    "  --ink-2: #102a43;",
    "  --cream: #f5efe2;",
    "  --cream-soft: rgba(245, 239, 226, 0.7);",
    "  --cream-faint: rgba(245, 239, 226, 0.4);",
    "  --gold: hsl(42 92% 48%);",
    "  --gold-soft: hsl(42 92% 48% / 0.18);",
    "  --gold-mute: hsl(42 92% 48% / 0.08);",
    "  --rule: rgba(255, 255, 255, 0.08);",
    "  --shadow-amb: 0 30px 60px -20px rgba(10, 25, 41, 0.55), 0 12px 30px -12px rgba(10, 25, 41, 0.45);",
    "  --grain: url(\"data:image/svg+xml;utf8,\");",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  font-size: 14px;",
    "  line-height: 1.55;",
    "  color: var(--cream);",
    "  -webkit-font-smoothing: antialiased;",
    "  -moz-osx-font-smoothing: grayscale;",
    "}",

    /* ---------- launcher ---------- */
    ".launcher {",
    "  position: relative;",
    "  width: 64px;",
    "  height: 64px;",
    "  border: none;",
    "  background: var(--ink);",
    "  cursor: pointer;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  display: flex;",
    "  align-items: center;",
    "  justify-content: center;",
    "  box-shadow: var(--shadow-amb);",
    "  transition: transform 240ms cubic-bezier(0.2, 0.9, 0.25, 1);",
    "  outline: none;",
    "}",
    ".launcher::before {",
    "  content: '';",
    "  position: absolute;",
    "  inset: 0;",
    "  background-image: var(--grain);",
    "  opacity: 0.6;",
    "  mix-blend-mode: overlay;",
    "  pointer-events: none;",
    "}",
    ".launcher:hover {",
    "  transform: translateY(-2px);",
    "}",
    ".launcher:focus-visible {",
    "  box-shadow: var(--shadow-amb), 0 0 0 3px hsl(42 92% 48% / 0.35);",
    "}",
    ".launcher-bracket {",
    "  position: absolute;",
    "  width: 12px;",
    "  height: 12px;",
    "  pointer-events: none;",
    "  transition: width 220ms ease, height 220ms ease;",
    "}",
    ".launcher:hover .launcher-bracket { width: 14px; height: 14px; }",
    ".lb-tl { top: 6px; left: 6px; border-top: 1px solid var(--gold); border-left: 1px solid var(--gold); }",
    ".lb-tr { top: 6px; right: 6px; border-top: 1px solid var(--gold); border-right: 1px solid var(--gold); }",
    ".lb-bl { bottom: 6px; left: 6px; border-bottom: 1px solid var(--gold); border-left: 1px solid var(--gold); }",
    ".lb-br { bottom: 6px; right: 6px; border-bottom: 1px solid var(--gold); border-right: 1px solid var(--gold); }",
    ".launcher-monogram {",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 700;",
    "  font-size: 19px;",
    "  letter-spacing: -0.02em;",
    "  color: var(--gold);",
    "  position: relative;",
    "  z-index: 1;",
    "  transform: translateY(-1px);",
    "  transition: transform 220ms ease;",
    "}",
    ".launcher:hover .launcher-monogram { transform: translateY(-2px); }",
    ".launcher-rule {",
    "  position: absolute;",
    "  bottom: 18px;",
    "  left: 50%;",
    "  transform: translateX(-50%);",
    "  width: 18px;",
    "  height: 1px;",
    "  background: var(--gold);",
    "  opacity: 0.7;",
    "}",
    ".launcher-index {",
    "  position: absolute;",
    "  top: -10px;",
    "  right: -10px;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 9px;",
    "  letter-spacing: 0.18em;",
    "  color: var(--gold);",
    "  background: var(--ink);",
    "  padding: 3px 5px;",
    "  border: 1px solid var(--gold);",
    "}",

    /* ---------- panel ---------- */
    ".panel {",
    "  position: absolute;",
    "  bottom: 80px;",
    "  right: 0;",
    "  width: 400px;",
    "  height: min(620px, calc(100vh - 120px));",
    "  background: var(--ink);",
    "  display: none;",
    "  flex-direction: column;",
    "  box-shadow: var(--shadow-amb);",
    "  overflow: hidden;",
    "  transform-origin: bottom right;",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  color: var(--cream);",
    "  isolation: isolate;",
    "}",
    ".panel::before {",
    "  content: '';",
    "  position: absolute;",
    "  inset: 0;",
    "  background-image: var(--grain);",
    "  opacity: 0.6;",
    "  mix-blend-mode: overlay;",
    "  pointer-events: none;",
    "  z-index: 0;",
    "}",
    ".concierge[data-open='true'] .panel {",
    "  display: flex;",
    "  animation: panel-in 320ms cubic-bezier(0.2, 0.9, 0.25, 1) both;",
    "}",
    ".concierge[data-open='true'] .launcher {",
    "  display: none;",
    "}",
    "@keyframes panel-in {",
    "  from { opacity: 0; transform: translateY(16px) scale(0.98); }",
    "  to   { opacity: 1; transform: translateY(0)    scale(1); }",
    "}",
    ".bracket {",
    "  position: absolute;",
    "  width: 16px;",
    "  height: 16px;",
    "  pointer-events: none;",
    "  z-index: 5;",
    "}",
    ".b-tl { top: 8px; left: 8px; border-top: 1px solid var(--gold); border-left: 1px solid var(--gold); }",
    ".b-tr { top: 8px; right: 8px; border-top: 1px solid var(--gold); border-right: 1px solid var(--gold); }",
    ".b-bl { bottom: 8px; left: 8px; border-bottom: 1px solid var(--gold); border-left: 1px solid var(--gold); }",
    ".b-br { bottom: 8px; right: 8px; border-bottom: 1px solid var(--gold); border-right: 1px solid var(--gold); }",

    /* ---------- header ---------- */
    ".header {",
    "  position: relative;",
    "  z-index: 1;",
    "  padding: 24px 28px 18px;",
    "  display: grid;",
    "  grid-template-columns: 1fr auto;",
    "  grid-template-rows: auto auto;",
    "  gap: 6px 16px;",
    "}",
    ".header-eyebrow {",
    "  grid-column: 1 / 2;",
    "  display: flex;",
    "  align-items: center;",
    "  gap: 8px;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 10px;",
    "  letter-spacing: 0.22em;",
    "  color: var(--gold);",
    "  text-transform: uppercase;",
    "}",
    ".status-dot {",
    "  width: 5px;",
    "  height: 5px;",
    "  border-radius: 50%;",
    "  background: var(--gold);",
    "  animation: status-pulse 2.6s ease-in-out infinite;",
    "}",
    "@keyframes status-pulse {",
    "  0%, 100% { opacity: 0.4; }",
    "  50% { opacity: 1; }",
    "}",
    ".header-title {",
    "  grid-column: 1 / 2;",
    "  margin: 0;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 700;",
    "  font-size: 22px;",
    "  letter-spacing: -0.02em;",
    "  line-height: 1.15;",
    "  color: var(--cream);",
    "}",
    ".header-actions {",
    "  grid-column: 2 / 3;",
    "  grid-row: 1 / 3;",
    "  display: flex;",
    "  align-items: flex-start;",
    "  gap: 14px;",
    "}",
    ".link-btn {",
    "  background: none;",
    "  border: none;",
    "  cursor: pointer;",
    "  padding: 0;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 10px;",
    "  letter-spacing: 0.18em;",
    "  color: var(--cream-soft);",
    "  border-bottom: 1px solid transparent;",
    "  padding-bottom: 2px;",
    "  transition: color 160ms ease, border-color 160ms ease;",
    "}",
    ".link-btn:hover { color: var(--gold); border-bottom-color: var(--gold); }",
    ".link-btn:focus-visible { outline: none; color: var(--gold); border-bottom-color: var(--gold); }",

    /* ---------- rules ---------- */
    ".rule-gold {",
    "  position: relative;",
    "  z-index: 1;",
    "  height: 1px;",
    "  background: var(--gold-soft);",
    "  margin: 0 28px;",
    "}",

    /* ---------- transcript ---------- */
    ".transcript {",
    "  position: relative;",
    "  z-index: 1;",
    "  flex: 1 1 auto;",
    "  overflow-y: auto;",
    "  padding: 24px 28px;",
    "  scroll-behavior: smooth;",
    "  outline: none;",
    "}",
    ".transcript::-webkit-scrollbar { width: 4px; }",
    ".transcript::-webkit-scrollbar-track { background: transparent; }",
    ".transcript::-webkit-scrollbar-thumb { background: hsl(42 92% 48% / 0.3); }",
    ".transcript::-webkit-scrollbar-thumb:hover { background: hsl(42 92% 48% / 0.7); }",
    ".transcript { scrollbar-width: thin; scrollbar-color: hsl(42 92% 48% / 0.3) transparent; }",

    /* ---------- empty state ---------- */
    ".empty { padding: 4px 0 16px; }",
    ".empty-eyebrow {",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 10px;",
    "  letter-spacing: 0.22em;",
    "  color: var(--gold);",
    "  margin-bottom: 16px;",
    "}",
    ".empty-title {",
    "  margin: 0 0 12px;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 700;",
    "  font-size: 28px;",
    "  letter-spacing: -0.02em;",
    "  line-height: 1.05;",
    "  color: var(--cream);",
    "}",
    ".empty-body {",
    "  margin: 0 0 24px;",
    "  font-size: 14px;",
    "  line-height: 1.55;",
    "  color: var(--cream-soft);",
    "}",
    ".prompts { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }",
    ".prompt-link {",
    "  background: none;",
    "  border: none;",
    "  padding: 4px 0;",
    "  cursor: pointer;",
    "  display: inline-flex;",
    "  align-items: baseline;",
    "  gap: 10px;",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  font-size: 14px;",
    "  text-align: left;",
    "  color: var(--cream);",
    "  transition: color 160ms ease;",
    "}",
    ".prompt-arrow {",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  color: var(--gold);",
    "  transition: transform 220ms cubic-bezier(0.2, 0.9, 0.25, 1);",
    "}",
    ".prompt-text {",
    "  border-bottom: 1px solid var(--gold-soft);",
    "  padding-bottom: 1px;",
    "  transition: border-color 160ms ease;",
    "}",
    ".prompt-link:hover .prompt-arrow { transform: translateX(3px); }",
    ".prompt-link:hover .prompt-text { border-bottom-color: var(--gold); }",
    ".prompt-link:focus-visible { outline: none; }",
    ".prompt-link:focus-visible .prompt-text { border-bottom-color: var(--gold); border-bottom-width: 2px; }",

    /* ---------- turns ---------- */
    ".turn {",
    "  position: relative;",
    "  margin: 0 0 26px;",
    "  animation: turn-in 240ms cubic-bezier(0.2, 0.9, 0.25, 1) both;",
    "}",
    ".turn:last-child { margin-bottom: 0; }",
    "@keyframes turn-in {",
    "  from { opacity: 0; transform: translateY(8px); }",
    "  to   { opacity: 1; transform: translateY(0); }",
    "}",
    ".turn-eyebrow {",
    "  display: flex;",
    "  align-items: baseline;",
    "  gap: 8px;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 10px;",
    "  letter-spacing: 0.22em;",
    "  text-transform: uppercase;",
    "  color: var(--gold);",
    "  margin-bottom: 8px;",
    "}",
    ".turn-index { font-variant-numeric: tabular-nums; }",
    ".turn-dot { color: var(--cream-faint); }",
    ".turn-label { color: var(--cream-soft); }",
    ".turn-time {",
    "  margin-left: auto;",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  font-weight: 400;",
    "  font-size: 10px;",
    "  letter-spacing: 0.05em;",
    "  font-variant-numeric: tabular-nums;",
    "  color: var(--cream-faint);",
    "  text-transform: none;",
    "}",
    ".turn-body { font-size: 14px; line-height: 1.6; color: var(--cream); }",
    ".turn-body p { margin: 0 0 10px; }",
    ".turn-body p:last-child { margin-bottom: 0; }",
    ".turn-body a { color: var(--cream); border-bottom: 1px solid var(--gold); padding-bottom: 1px; text-decoration: none; transition: border-bottom-width 120ms ease; }",
    ".turn-body a:hover { border-bottom-width: 2px; }",
    ".turn-body strong { color: var(--cream); font-weight: 600; }",
    ".turn-body em { font-style: italic; color: var(--cream); }",
    ".turn-body .md-code { background: rgba(255,255,255,0.06); border: 1px solid var(--gold-soft); padding: 1px 6px; font-family: ui-monospace, 'Menlo', monospace; font-size: 12.5px; color: var(--cream); }",
    ".turn-body .md-pre { background: rgba(255,255,255,0.04); border: 1px solid var(--gold-soft); padding: 12px 14px; overflow-x: auto; margin: 8px 0; }",
    ".turn-body .md-pre code { font-family: ui-monospace, 'Menlo', monospace; font-size: 12.5px; color: var(--cream); }",
    ".turn-body .md-list { list-style: none; padding: 0; margin: 8px 0; }",
    ".turn-body .md-list li { position: relative; padding-left: 18px; margin-bottom: 4px; }",
    ".turn-body .md-list li::before { content: '→'; position: absolute; left: 0; color: var(--gold); font-family: 'Sora', system-ui, sans-serif; font-weight: 600; }",

    ".turn-user .turn-body { padding-left: 16px; border-left: 2px solid var(--gold); }",
    ".turn-error .turn-eyebrow { color: hsl(0 70% 60%); }",
    ".turn-error .turn-body {",
    "  border: 1px solid hsl(0 70% 60% / 0.4);",
    "  padding: 12px 14px;",
    "  background: hsl(0 70% 30% / 0.08);",
    "}",

    /* ---------- pending lamp ---------- */
    ".lamp {",
    "  display: inline-block;",
    "  width: 6px;",
    "  height: 6px;",
    "  border-radius: 50%;",
    "  background: var(--gold);",
    "  animation: lamp-pulse 1.4s ease-in-out infinite;",
    "}",
    "@keyframes lamp-pulse {",
    "  0%, 100% { opacity: 0.35; transform: scale(0.85); }",
    "  50% { opacity: 1; transform: scale(1.15); }",
    "}",

    /* ---------- composer ---------- */
    ".composer {",
    "  position: relative;",
    "  z-index: 1;",
    "  padding: 14px 28px 22px;",
    "  display: flex;",
    "  flex-direction: column;",
    "  gap: 6px;",
    "}",
    ".composer-meta {",
    "  display: flex;",
    "  justify-content: flex-end;",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  font-size: 10px;",
    "  font-variant-numeric: tabular-nums;",
    "  color: var(--cream-faint);",
    "  letter-spacing: 0.05em;",
    "}",
    ".char-counter.near-limit { color: var(--gold); }",
    ".composer-row {",
    "  display: flex;",
    "  align-items: flex-end;",
    "  gap: 12px;",
    "}",
    ".composer textarea {",
    "  flex: 1 1 auto;",
    "  resize: none;",
    "  border: none;",
    "  outline: none;",
    "  background: transparent;",
    "  color: var(--cream);",
    "  caret-color: var(--gold);",
    "  font-family: 'DM Sans', system-ui, sans-serif;",
    "  font-size: 14px;",
    "  line-height: 1.55;",
    "  min-height: 22px;",
    "  max-height: 110px;",
    "  padding: 6px 0;",
    "  overflow-y: auto;",
    "}",
    ".composer textarea::placeholder { color: var(--cream-faint); font-style: italic; }",
    ".composer textarea:disabled { opacity: 0.5; }",
    ".send-key {",
    "  flex: 0 0 auto;",
    "  position: relative;",
    "  min-width: 78px;",
    "  height: 32px;",
    "  padding: 0 12px;",
    "  display: inline-flex;",
    "  align-items: center;",
    "  justify-content: center;",
    "  gap: 6px;",
    "  background: transparent;",
    "  color: var(--cream);",
    "  border: 1px solid var(--gold-soft);",
    "  cursor: pointer;",
    "  font-family: 'Sora', system-ui, sans-serif;",
    "  font-weight: 600;",
    "  font-size: 10px;",
    "  letter-spacing: 0.18em;",
    "  text-transform: uppercase;",
    "  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 80ms ease;",
    "}",
    ".send-key::before {",
    "  content: '';",
    "  position: absolute;",
    "  inset: 1px;",
    "  border-top: 1px solid rgba(255,255,255,0.06);",
    "  pointer-events: none;",
    "}",
    ".send-key:hover { border-color: var(--gold); color: var(--gold); }",
    ".send-key:focus-visible { outline: none; border-color: var(--gold); color: var(--gold); box-shadow: 0 0 0 3px hsl(42 92% 48% / 0.25); }",
    ".send-key:active { transform: translateY(1px); }",
    ".send-key.is-sending, .send-key:active:not(:disabled) {",
    "  background: var(--gold);",
    "  color: var(--ink);",
    "  border-color: var(--gold);",
    "}",
    ".send-key-glyph { font-size: 11px; }",

    /* ---------- mobile ---------- */
    "@media (max-width: 640px) {",
    "  .panel {",
    "    position: fixed;",
    "    bottom: 0; right: 0; left: 0; top: 0;",
    "    width: 100vw;",
    "    height: 100vh;",
    "    height: 100dvh;",
    "  }",
    "  .launcher { width: 56px; height: 56px; }",
    "  .header { padding: 20px 22px 14px; }",
    "  .rule-gold { margin: 0 22px; }",
    "  .transcript { padding: 20px 22px; }",
    "  .composer { padding: 12px 22px 18px; }",
    "}",

    /* ---------- reduced motion ---------- */
    "@media (prefers-reduced-motion: reduce) {",
    "  .concierge[data-open='true'] .panel { animation: none; }",
    "  .turn { animation: none; }",
    "  .lamp { animation: none; opacity: 0.7; }",
    "  .status-dot { animation: none; opacity: 0.8; }",
    "  .launcher, .send-key, .prompt-arrow, .prompt-text { transition: none; }",
    "}"
  ].join("\n");

  // ---------- bootstrap ----------
  function start() {
    injectFonts();
    loadState();
    build();
    autoGrow();
    updateCounter();
  }

  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", start);
  } else {
    start();
  }
})();
​FM Workshop Learning Platform

FM Workshop Learning Platform
