(function () {
  "use strict";

  // ---- who are we showing? ------------------------------------------------
  function valid(id) { return typeof id === "string" && /^\d{5,25}$/.test(id); }
  function resolveUserId() {
    const path = location.pathname.match(/\/api\/(\d{5,25})(?:[\/?#]|$)/);
    if (path) return path[1];
    const qs = new URLSearchParams(location.search);
    const q = qs.get("u") || qs.get("id") || qs.get("user");
    if (valid(q)) return q;
    if (/^#\d{5,25}$/.test(location.hash)) return location.hash.slice(1);
    const script = document.currentScript || document.querySelector("script[data-user]");
    if (script && script.dataset && valid(script.dataset.user)) return script.dataset.user;
    const m = document.getElementById("discord");
    if (m && m.dataset && valid(m.dataset.user)) return m.dataset.user;
    if (valid(window.DISCORD_USER_ID)) return window.DISCORD_USER_ID;
    return null;
  }

  // Build one presence card. Used full-size on /discord, and as small clones
  // on /cool-people (opts.mini). Options:
  //   userId       Discord id to show (defaults to resolveUserId())
  //   mount        element to replace with the card (defaults to #discord)
  //   mini         true → adds .is-mini for smaller styling
  //   tier / link  friend tier class + optional website link on the name
  //   pollMs       presence refresh cadence (default 20s)
  //   fallbackName / fallbackImg
  //                shown immediately, and kept if the API has no data for them
  //                (lets ID-less / dead alts still render a card)
  function createPresenceCard(opts) {
    opts = opts || {};
    const DISCORD_USER_ID = opts.userId || resolveUserId();
    const mount = opts.mount || document.getElementById("discord");
    if (!mount) return null;
    if (!DISCORD_USER_ID && !opts.fallbackName) return null;

  // ---- theme: only on standalone api pages (homepage uses data-flavor) ----
  if (!document.documentElement.getAttribute("data-flavor")) {
    const t = new URLSearchParams(location.search).get("theme");
    const themes = ["mocha", "macchiato", "frappe", "latte"];
    if (!document.documentElement.getAttribute("data-theme")) {
      document.documentElement.setAttribute("data-theme", themes.indexOf(t) >= 0 ? t : "mocha");
    }
  }

  // ---- build the card -----------------------------------------------------
  const card = document.createElement("div");
  // Only the single owner card claims id="discord" (core.js + the gold-cat
  // observer key off it). Mini friend cards must not duplicate the id.
  if (!opts.mini) card.id = "discord";
  card.className = "presence-card" + (opts.mini ? " is-mini" : "") + (opts.tier ? " tier-" + opts.tier : "");
  card.hidden = true;
  card.innerHTML =
    '<img class="pc-banner" alt="" referrerpolicy="no-referrer" hidden>' +
    '<div class="pc-head">' +
      '<span class="pc-avatar">' +
        '<img class="pc-av-img" alt="" referrerpolicy="no-referrer" crossorigin="anonymous">' +
        '<img class="pc-av-deco" alt="" aria-hidden="true" hidden>' +
        '<span class="pc-status" aria-hidden="true"></span>' +
      '</span>' +
      '<span class="pc-id">' +
        '<span class="pc-name-row">' +
          '<span class="pc-name"></span>' +
          '<span class="pc-tag" hidden></span>' +
        '</span>' +
        '<span class="pc-sub-row">' +
          '<span class="pc-user"></span>' +
          '<span class="pc-status-text"></span>' +
          '<span class="pc-pronouns" hidden></span>' +
          '<span class="pc-platforms" aria-hidden="true"></span>' +
        '</span>' +
        '<span class="pc-meta" hidden></span>' +
        '<span class="pc-badges" aria-hidden="true"></span>' +
      '</span>' +
      '<button class="pc-star" type="button" aria-label="show wishlist" title="wishlist">★</button>' +
    '</div>' +
    '<div class="pc-bio" hidden></div>' +
    '<div class="pc-connections" hidden></div>' +
    '<div class="pc-sections"></div>' +
    '<div class="pc-wishlist" id="pc-wishlist"></div>';
  mount.replaceWith(card);

  const avImg = card.querySelector(".pc-av-img");
  const avDeco = card.querySelector(".pc-av-deco");
  const nameEl = card.querySelector(".pc-name");
  const tagEl = card.querySelector(".pc-tag");
  const userEl = card.querySelector(".pc-user");
  const platformsEl = card.querySelector(".pc-platforms");
  const statusTextEl = card.querySelector(".pc-status-text");
  const STATUS_TITLE = { online: "Online", idle: "Idle", dnd: "Do Not Disturb", offline: "Offline" };
  const metaEl = card.querySelector(".pc-meta");
  const badgesEl = card.querySelector(".pc-badges");
  const sections = card.querySelector(".pc-sections");
  const idEl = card.querySelector(".pc-id");
  const starBtn = card.querySelector(".pc-star");
  const wishlistEl = card.querySelector(".pc-wishlist");
  const bannerEl = card.querySelector(".pc-banner");
  const bioEl = card.querySelector(".pc-bio");
  const connectionsEl = card.querySelector(".pc-connections");
  const pronounsEl = card.querySelector(".pc-pronouns");

  // ---- friend-card extras: name link + instant placeholder ----------------
  // Optional website link on the name (friends can have a personal site).
  if (opts.link) {
    nameEl.classList.add("pc-name--link");
    nameEl.style.cursor = "pointer";
    nameEl.setAttribute("role", "link");
    nameEl.setAttribute("tabindex", "0");
    const goLink = function () { window.open(opts.link, "_blank", "noopener"); };
    nameEl.addEventListener("click", goLink);
    nameEl.addEventListener("keydown", function (e) {
      if (e.key === "Enter" || e.key === " ") { e.preventDefault(); goLink(); }
    });
  }
  // Seed a placeholder so the card shows instantly (and remains for ID-less or
  // offline dead alts the API can't fill). render() overwrites it on success.
  if (opts.fallbackName) {
    nameEl.textContent = opts.fallbackName;
    avImg.src = opts.fallbackImg || avatarUrl({ id: DISCORD_USER_ID });
    card.dataset.status = "offline";
    card.hidden = false;
  }

  // ---- wishlist (revealed by the star) ------------------------------------
  // Items come straight from the Doughmination Restful API (j.data.wishlist):
  // each is a resolved Shop item { sku_id, type, name, static_image_url,
  // animated_image_url, video_url, label, is_owned, price, visibility }.
  let wishlistItems = null;
  const WL_TYPE_LABEL = {
    avatar_decoration: "Decoration",
    profile_effect: "Effect",
    nameplate: "Nameplate",
    bundle: "Bundle",
    variants_group: "Variants",
    external_sku: "Item"
  };
  const CURRENCY_SYMBOL = { gbp: "£", usd: "$", eur: "€", aud: "A$", cad: "C$" };
  function fmtPrice(p) {
    if (!p || typeof p.amount !== "number") return null;
    const exp = typeof p.exponent === "number" ? p.exponent : 2;
    const v = (p.amount / Math.pow(10, exp)).toFixed(exp);
    const sym = CURRENCY_SYMBOL[(p.currency || "").toLowerCase()];
    return sym ? sym + v : v + " " + String(p.currency || "").toUpperCase();
  }
  // Pick a thumbnail and decide whether the wsrv webp proxy is safe: avatar
  // decorations and profile effects are animated APNGs the proxy mangles (the
  // same reason the avatar decoration loads raw), so those go straight to the
  // CDN; nameplates and the rest are static and proxy fine.
  function wlImg(w) {
    const url = w.static_image_url || w.animated_image_url;
    if (!url) return null;
    if (w.type === "avatar_decoration" || w.type === "profile_effect" || /avatar-decoration-presets/.test(url)) {
      return url;
    }
    return proxyImg(url, { w: 64 }) || url;
  }
  function renderWishlist() {
    if (!wishlistEl) return;
    const items = Array.isArray(wishlistItems) ? wishlistItems : [];
    let body;
    if (items.length) {
      body = items.map(function (w) {
        const ic = wlImg(w);
        const typeLabel = WL_TYPE_LABEL[w.type] || "";
        const price = fmtPrice(w.price);
        return '<span class="pc-wl-item' + (w.is_owned ? " is-owned" : "") + '">' +
          (ic ? '<img class="pc-wl-ic" src="' + esc(ic) + '" alt="" loading="lazy" referrerpolicy="no-referrer" onerror="this.remove()">' : "") +
          '<span class="pc-wl-text">' +
            '<span class="pc-wl-name">' + esc(w.name || "Collectible") + "</span>" +
            (typeLabel ? '<span class="pc-wl-type">' + esc(typeLabel) + "</span>" : "") +
          "</span>" +
          (price ? '<span class="pc-wl-price">' + esc(price) + "</span>" : "") +
        "</span>";
      }).join("");
    } else {
      body = '<p class="pc-wl-empty">nothing on the wishlist yet ✨</p>';
    }
    wishlistEl.innerHTML = '<div class="pc-wishlist-title">Wishlist</div>' + body;
  }
  if (starBtn) {
    starBtn.addEventListener("click", function (e) {
      e.stopPropagation();
      const open = card.classList.toggle("show-wishlist");
      starBtn.classList.toggle("on", open);
      starBtn.setAttribute("aria-expanded", open ? "true" : "false");
      if (open) renderWishlist();
    });
  }

  let latest = null;
  let customNode = null;
  let ticker = null;
  let ws = null;
  let heartbeat = null;
  let reconnectDelay = 1000;

  // ---- small helpers ------------------------------------------------------
  function fmt(ms) {
    const total = Math.max(0, Math.floor(ms / 1000));
    const m = Math.floor(total / 60);
    const s = total % 60;
    return `${m}:${String(s).padStart(2, "0")}`;
  }
  function elapsedStr(start) {
    const s = Math.max(0, Math.floor((Date.now() - start) / 1000));
    const h = Math.floor(s / 3600);
    const m = Math.floor((s % 3600) / 60);
    return h ? `${h}h ${m}m` : `${m}m`;
  }
  function clamp(n, lo, hi) { return Math.min(Math.max(n, lo), hi); }

  // pages.gay is a static host with no server-side compute, so we can't run
  // our own proxy. wsrv.nl is a free, cookieless image CDN: it re-serves the
  // image with no Set-Cookie (killing the third-party __cf_bm cookie) and can
  // convert to WebP on the fly. `opts` lets callers request a resize.
  function proxyImg(url, opts) {
    if (!url) return url;
    if (!/^https:\/\/(cdn|media)\.discordapp\.(com|net)\//.test(url)) return url;
    const src = url.replace(/^https:\/\//, "");
    let q = "https://wsrv.nl/?url=" + encodeURIComponent(src) + "&output=webp";
    if (opts && opts.w) q += "&w=" + opts.w + "&dpr=2&fit=cover";
    return q;
  }

  function avatarUrl(u) {
    if (!u || !u.avatar) return proxyImg("https://cdn.discordapp.com/embed/avatars/0.png");
    const ext = String(u.avatar).startsWith("a_") ? "gif" : "png";
    return proxyImg(`https://cdn.discordapp.com/avatars/${u.id}/${u.avatar}.${ext}?size=128`, { w: 80 });
  }
  function emojiUrl(e) {
    if (!e || !e.id) return null;
    return proxyImg(`https://cdn.discordapp.com/emojis/${e.id}.${e.animated ? "gif" : "png"}?size=32`);
  }
  function assetUrl(appId, asset) {
    if (!asset) return null;
    if (String(asset).startsWith("mp:")) return proxyImg("https://media.discordapp.net/" + asset.slice(3));
    return proxyImg(`https://cdn.discordapp.com/app-assets/${appId}/${asset}.png`);
  }
  function esc(str) {
    return String(str == null ? "" : str)
      .replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
  }
  function intToHex(n) {
    return "#" + (Number(n) >>> 0).toString(16).padStart(6, "0").slice(-6);
  }
  function guildBadgeUrl(pg) {
    if (!pg || !pg.badge || !pg.identity_guild_id) return null;
    return proxyImg(`https://cdn.discordapp.com/guild-tag-badges/${pg.identity_guild_id}/${pg.badge}.png?size=24`);
  }
  const PLATFORM_ICONS = {
    desktop: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="4" width="20" height="13" rx="1.5"/><path d="M8 21h8M12 17v4"/></svg>',
    mobile: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="7" y="2" width="10" height="20" rx="2.5"/><path d="M11 18h2"/></svg>',
    web: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3c2.5 2.5 2.5 15 0 18M12 3c-2.5 2.5-2.5 15 0 18"/></svg>'
  };
  function platformIcons(d) {
    let html = "";
    if (d.active_on_discord_desktop) html += '<span class="pc-plat" title="Desktop">' + PLATFORM_ICONS.desktop + "</span>";
    if (d.active_on_discord_mobile) html += '<span class="pc-plat" title="Mobile">' + PLATFORM_ICONS.mobile + "</span>";
    if (d.active_on_discord_web || d.active_on_discord_embedded) html += '<span class="pc-plat" title="Web">' + PLATFORM_ICONS.web + "</span>";
    return html;
  }
  const BADGE_FLAGS = [
    [1 << 0, "Discord Staff", "5e74e9b61934fc1f67c65515d1f7e60d"],
    [1 << 1, "Partnered Server Owner", "3f9748e53446a137a052f3454e2de41e"],
    [1 << 2, "HypeSquad Events", "bf01d1073931f921909045f3a39fd264"],
    [1 << 3, "Bug Hunter", "2717692c7dca7289b35297368a940dd0"],
    [1 << 6, "HypeSquad Bravery", "8a88d63823d8a71cd5e390baa45efa02"],
    [1 << 7, "HypeSquad Brilliance", "011940fd013da3f7fb926e4a1cd2e618"],
    [1 << 8, "HypeSquad Balance", "3aa41de486fa12454c3761e8e223442e"],
    [1 << 9, "Early Supporter", "7060786766c9c840eb3019e725d2b358"],
    [1 << 14, "Bug Hunter Gold", "848f79194d4be5ff5f81505cbd0ce1e6"],
    [1 << 17, "Early Verified Bot Developer", "6df5892e0f35b051f8b61eace34f4967"],
    [1 << 18, "Moderator Programs Alumni", "fee1624003e2fee35cb398e125dc479b"],
    [1 << 22, "Active Developer", "6bdc42827a38498929a4920da12695d9"]
  ];
  function renderBadges(flags) {
    flags = Number(flags) || 0;
    let html = "";
    for (const [bit, name, hash] of BADGE_FLAGS) {
      if (flags & bit) {
        html += '<img class="pc-badge" src="' + proxyImg("https://cdn.discordapp.com/badge-icons/" + hash + ".png") +
          '" alt="' + esc(name) + '" title="' + esc(name) + '" onerror="this.remove()">';
      }
    }
    return html;
  }

  // Richer badges via dstn.to — Nitro, boosts, quests, orbs… everything
  // Discord actually shows, which public_flags (0 for most) can't give.
  let dstnBadges = null;
  let lastFlags = 0;
  function renderDstnBadges() {
    return dstnBadges.map(function (b) {
      const img = '<img class="pc-badge" src="' + proxyImg("https://cdn.discordapp.com/badge-icons/" + esc(b.icon) + ".png") +
        '" alt="' + esc(b.description || b.id) + '" title="' + esc(b.description || b.id) + '" onerror="this.remove()">';
      return b.link
        ? '<a class="pc-badge-link" tabindex="-1" href="' + esc(b.link) + '" target="_blank" rel="noopener">' + img + "</a>"
        : img;
    }).join("");
  }
  function paintBadges() {
    if (!badgesEl) return;
    badgesEl.innerHTML = (dstnBadges && dstnBadges.length) ? renderDstnBadges() : renderBadges(lastFlags);
  }
  function rgbTriplet(n) {
    n = Number(n) >>> 0;
    return ((n >> 16) & 255) + ", " + ((n >> 8) & 255) + ", " + (n & 255);
  }
  function applyProfileGradient(colors) {
    if (!colors || colors.length < 2) return;
    card.style.setProperty("--pc-grad-1-rgb", rgbTriplet(colors[0]));
    card.style.setProperty("--pc-grad-2-rgb", rgbTriplet(colors[1]));
    card.classList.add("has-profile-grad");
  }
  // ---- banner / bio / connected accounts (extras for the /discord page) ---
  function bannerUrl(id, hash) {
    if (!id || !hash) return null;
    // Animated banners (a_) must be requested WITHOUT the .gif extension:
    // Discord's CDN throws HTTP 415 for some a_*.gif banners, but the
    // extension-less URL works (wsrv then re-serves it as cookieless webp).
    const animated = String(hash).startsWith("a_");
    const url = "https://cdn.discordapp.com/banners/" + id + "/" + hash + (animated ? "" : ".png") + "?size=600";
    return proxyImg(url, { w: 600 });
  }
  function applyBanner(url, fallbackColor) {
    if (!bannerEl) return;
    if (url) {
      bannerEl.src = url;
      bannerEl.hidden = false;
      bannerEl.onerror = function () { bannerEl.hidden = true; card.classList.remove("has-banner"); };
      card.classList.add("has-banner");
    } else if (fallbackColor) {
      bannerEl.hidden = true;
      card.style.setProperty("--pc-banner-color", fallbackColor);
      card.classList.add("has-banner-color");
    }
  }
  function renderBio(text) {
    if (!bioEl) return;
    if (text && String(text).trim()) {
      bioEl.textContent = String(text).trim();
      bioEl.hidden = false;
    } else {
      bioEl.hidden = true;
    }
  }
  // Best-effort profile links for the common connection types.
  const CONNECTION_URLS = {
    tiktok: function (n) { return "https://tiktok.com/@" + n; },
    ebay: function (n) { return "https://www.ebay.com/usr/" + n; },
    instagram: function (n) {return "https://www.instagram.com/" + n; },
    xbox: function (n) {return "https://www.xbox.com/en-GB/play/user/" + n; },
    github: function (n) { return "https://github.com/" + n; },
    roblox: function (n, id) { return "https://www.roblox.com/users/" + id + "/profile";},
    epicgames: function (n, id) {return "https://store.epicgames.com/u/" + id; },
    twitter: function (n) { return "https://twitter.com/" + n; },
    twitch: function (n) { return "https://twitch.tv/" + n; },
    youtube: function (n, id) { return "https://youtube.com/channel/" + id; },
    spotify: function (n, id) { return "https://open.spotify.com/user/" + id; },
    steam: function (n, id) { return "https://steamcommunity.com/profiles/" + id; },
    reddit: function (n) { return "https://reddit.com/user/" + n; },
    instagram: function (n) { return "https://instagram.com/" + n; },
    domain: function (n) { return "https://" + n; },
    bluesky: function (n) { return "https://bsky.app/profile/" + n; }
  };
  // connection type -> brand SVG in /assets/socials (anything unmapped uses
  // the generic globe "site.svg")
  const CONNECTION_ICON = {
    "amazon-music": "amazon",
    facebook: "facebook",
    ebay: "ebay",
    tiktok: "tiktok",
    bungie: "bungie", //
    playstation: "playstation",
    paypal: "paypal",
    instagram: "instagram",
    xbox: "xbox",
    crunchyroll: "crunchyroll",
    battlenet: "battlenet",
    github: "github",
    epicgames: "epic",
    riotgames: "riot",
    leagueoflegends: "league",
    steam: "steam",
    roblox: "roblox",
    twitter: "twitter",
    bluesky: "bluesky",
    mastodon: "mastodon",
    twitch: "twitch",
    youtube: "youtube",
    reddit: "reddit",
    spotify: "spotify",
    discord: "discord",
    linkedin: "linkedin",
    domain: "site"
  };
  function connIcon(type) {
    const file = CONNECTION_ICON[String(type || "").toLowerCase()] || "site";
    return '<img class="pc-conn-ic" src="/assets/socials/' + file + '.svg" alt="' +
      esc(type) + '" title="' + esc(type) + '" loading="lazy" onerror="this.remove()">';
  }
  function renderConnections(accounts) {
    if (!connectionsEl) return;
    const list = (accounts || []).filter(function (a) { return a && a.name; });
    if (!list.length) { connectionsEl.hidden = true; return; }
    connectionsEl.innerHTML = list.map(function (a) {
      const maker = CONNECTION_URLS[a.type];
      const url = maker ? maker(a.name, a.id) : null;
      const inner = connIcon(a.type) +
        '<span class="pc-conn-name">' + esc(a.name) + "</span>" +
        (a.verified ? '<span class="pc-conn-check" title="Verified">✓</span>' : "");
      return url
        ? '<a class="pc-conn" href="' + esc(url) + '" target="_blank" rel="noopener">' + inner + "</a>"
        : '<span class="pc-conn">' + inner + "</span>";
    }).join("");
    connectionsEl.hidden = false;
  }

  // ---- album-art → Catppuccin accent --------------------------------------
  const ACCENT_VARS = [
    "rosewater", "flamingo", "pink", "mauve", "red", "maroon", "peach",
    "yellow", "green", "teal", "sky", "saphire", "blue", "lavender",
  ];
  function hexToRgb(hex) {
    hex = hex.trim().replace("#", "");
    if (hex.length === 3) hex = hex.split("").map((c) => c + c).join("");
    const n = parseInt(hex, 16);
    return [(n >> 16) & 255, (n >> 8) & 255, n & 255];
  }
  function getThemePalette() {
    const cs = getComputedStyle(document.documentElement);
    const pal = [];
    for (const name of ACCENT_VARS) {
      const v = cs.getPropertyValue("--" + name).trim();
      if (v.startsWith("#")) { const [r, g, b] = hexToRgb(v); pal.push({ r, g, b }); }
    }
    return pal;
  }
  function nearestAccent(r, g, b) {
    const pal = getThemePalette();
    let best = null, bestD = Infinity;
    for (const c of pal) {
      const rm = (r + c.r) / 2, dr = r - c.r, dg = g - c.g, db = b - c.b;
      const d = (2 + rm / 256) * dr * dr + 4 * dg * dg + (2 + (255 - rm) / 256) * db * db;
      if (d < bestD) { bestD = d; best = c; }
    }
    return best;
  }
  let lastArtUrl = null;
  function applyAccent(url) {
    if (!url || url === lastArtUrl) return;
    lastArtUrl = url;
    const img = new Image();
    img.crossOrigin = "anonymous";
    img.referrerPolicy = "no-referrer";
    img.onload = () => {
      try {
        const c = document.createElement("canvas");
        c.width = c.height = 16;
        const ctx = c.getContext("2d", { willReadFrequently: true });
        ctx.drawImage(img, 0, 0, 16, 16);
        const { data } = ctx.getImageData(0, 0, 16, 16);
        let r = 0, g = 0, b = 0, count = 0;
        for (let i = 0; i < data.length; i += 4) {
          if (data[i + 3] < 125) continue;
          const lum = 0.2126 * data[i] + 0.7152 * data[i + 1] + 0.0722 * data[i + 2];
          if (lum < 24 || lum > 235) continue;
          r += data[i]; g += data[i + 1]; b += data[i + 2]; count++;
        }
        if (!count) { resetAccent(); return; }
        r = Math.round(r / count); g = Math.round(g / count); b = Math.round(b / count);
        const near = nearestAccent(r, g, b);
        const rgb = near ? `${near.r}, ${near.g}, ${near.b}` : `${r}, ${g}, ${b}`;
        card.style.setProperty("--dc-accent", rgb);
        card.classList.add("has-accent");
        // Only the full-size card recolours the whole page; mini friend cards
        // keep their accent local so they don't fight over --accent-rgb.
        if (!opts.mini) document.documentElement.style.setProperty("--accent-rgb", rgb);
      } catch (e) { resetAccent(); }
    };
    img.onerror = resetAccent;
    img.src = url;
  }
  function resetAccent() {
    lastArtUrl = null;
    card.classList.remove("has-accent");
    card.style.removeProperty("--dc-accent");
    if (!opts.mini) document.documentElement.style.removeProperty("--accent-rgb");
  }

  // ---- section (row) builders --------------------------------------------
  function rowText(kind, title, sub, extra) {
    return (
      '<span class="pc-row-text">' +
        '<span class="pc-row-kind">' + esc(kind) + "</span>" +
        '<span class="pc-row-title">' + esc(title) + "</span>" +
        '<span class="pc-row-sub">' + esc(sub) + "</span>" +
        (extra || "") +
      "</span>"
    );
  }

  function customRow(a) {
    const row = document.createElement("div");
    row.className = "pc-row pc-custom";
    const eu = emojiUrl(a.emoji);
    row.innerHTML =
      (eu ? '<img class="pc-emoji" src="' + eu + '" alt="">'
          : '<span class="pc-row-ic pc-dot" aria-hidden="true"></span>') +
      '<span class="pc-custom-text">' + esc(a.state || "") + "</span>";
    return row;
  }

  function spotifyRow(s) {
    const row = document.createElement("a");
    row.className = "pc-row pc-spotify";
    row.target = "_blank";
    row.rel = "noopener";
    row.href = s.track_id ? "https://open.spotify.com/track/" + s.track_id : "https://open.spotify.com/";
    if (s.album) row.title = (s.song || "") + " — " + s.album;
    if (s.timestamps && s.timestamps.start) row.dataset.start = s.timestamps.start;
    if (s.timestamps && s.timestamps.end) row.dataset.end = s.timestamps.end;
    row.innerHTML =
      (s.album_art_url ? '<img class="pc-art" src="' + esc(s.album_art_url) + '" alt="">' : "") +
      rowText("Listening to Spotify", s.song || "", s.artist || "",
        '<span class="pc-progress" aria-hidden="true">' +
          '<span class="pc-bar"><span class="pc-fill"></span></span>' +
          '<span class="pc-times"><span class="pc-cur">0:00</span><span class="pc-dur">0:00</span></span>' +
        "</span>");
    return row;
  }

  // Generic activity row (type 0). Discord presence exposes no link for
  // games or apps, so this renders as a non-clickable card.
  function activityRow(a) {
    const isCode = /visual studio code|vscode/i.test(a.name || "");
    const row = document.createElement("div");
    row.className = "pc-row pc-row--stack " + (isCode ? "pc-dev" : "pc-game");
    if (a.timestamps && a.timestamps.start) row.dataset.elapsedStart = a.timestamps.start;

    const large = a.assets && a.assets.large_image && assetUrl(a.application_id, a.assets.large_image);
    const small = a.assets && a.assets.small_image && assetUrl(a.application_id, a.assets.small_image);
    const iconHtml = large
      ? '<span class="pc-ic-wrap">' +
          '<img class="pc-row-ic-img" src="' + esc(large) + '" alt="">' +
          (small ? '<img class="pc-ic-badge" src="' + esc(small) + '" alt="" title="' + esc(a.assets.small_text || "") + '" onerror="this.remove()">' : "") +
        "</span>"
      : '<span class="pc-row-ic pc-dot" aria-hidden="true"></span>';

    let kind = isCode ? "Coding" : "Playing " + (a.name || "");
    if (a.party && a.party.size && a.party.size.length === 2 && a.party.size[1]) {
      kind += " · " + a.party.size[0] + " of " + a.party.size[1];
    }

    const main = document.createElement("div");
    main.className = "pc-row-link";
    main.innerHTML = iconHtml +
      rowText(kind, a.details || (isCode ? "" : a.name) || "",
              a.state || (a.assets && a.assets.large_text) || "",
              '<span class="pc-row-elapsed"></span>');
    row.appendChild(main);

    // Discord only exposes button *labels* (not URLs) via presence, so these
    // are shown as plain (non-clickable) chips.
    if (a.buttons && a.buttons.length) {
      const bwrap = document.createElement("div");
      bwrap.className = "pc-buttons";
      a.buttons.forEach(function (label) {
        const b = document.createElement("span");
        b.className = "pc-btn";
        b.textContent = typeof label === "string" ? label : (label && label.label) || "Open";
        bwrap.appendChild(b);
      });
      row.appendChild(bwrap);
    }
    return row;
  }

  function streamRow(a) {
    const hasUrl = !!a.url;
    const row = document.createElement(hasUrl ? "a" : "div");
    row.className = "pc-row pc-stream";
    if (hasUrl) {
      row.target = "_blank";
      row.rel = "noopener";
      row.href = a.url;
    }
    const platform = (a.url && /twitch/i.test(a.url)) ? "Twitch"
                   : (a.url && /youtube/i.test(a.url)) ? "YouTube" : "Live";
    row.innerHTML =
      '<span class="pc-row-ic pc-dot" aria-hidden="true"></span>' +
      rowText("Streaming on " + platform, a.details || a.name || "", a.state || "");
    return row;
  }

  // Discord display-name fonts (display_name_styles.font_id) -> our @font-face
  // families in css/fonts.css. Only ids we have a look-alike for are mapped;
  // any other id falls back to the card's normal font. (Comments = Discord's
  // underlying font; "verify" = best-guess pairing with your file names.)
  const NAME_FONTS = {
    3: "'DDN Sakura', cursive",       // 3 CHERRY_BOMB
    4: "'DDN Jellybean', cursive",    // 4 CHICLE
    6: "'DDN Modern', sans-serif",    // 6 MUSEO_MODERNO
    7: "'DDN Medieval', serif",       // 7 NEO_CASTEL
    8: "'DDN 8Bit', monospace",       // 8 PIXELIFY
    10: "'DDN Vampyre', serif",       // 10 SINISTRE
    11: "'DDN gg sans', sans-serif",  // 11 DEFAULT (Discord's normal font)
    12: "'DDN Tempo', serif",         // 12 ZILLA_SLAB
  };

  // ---- render -------------------------------------------------------------
  function render(d) {
    if (!d) return;
    latest = d;

    const u = d.discord_user || {};
    const status = d.discord_status || "offline";
    card.dataset.status = status;
    if (statusTextEl) statusTextEl.textContent = STATUS_TITLE[status] || "Offline";

    avImg.src = avatarUrl(u);
    const deco = u.avatar_decoration_data;
    if (deco && deco.asset) {
      // Load decorations straight from Discord's CDN: they're animated APNGs,
      // and the wsrv webp proxy fails on them (and would drop the animation).
      avDeco.src = `https://cdn.discordapp.com/avatar-decoration-presets/${deco.asset}.png`;
      avDeco.hidden = false;
    } else {
      avDeco.hidden = true;
    }
    nameEl.textContent = u.display_name || u.global_name || u.username || "Discord User";
    userEl.textContent = u.username ? "@" + u.username : "";

    const styles = u.display_name_styles;
    if (styles && styles.colors && styles.colors.length) {
      const cols = styles.colors.map(intToHex);
      nameEl.style.backgroundImage = "linear-gradient(90deg, " + (cols.length === 1 ? cols[0] + "," + cols[0] : cols.join(", ")) + ")";
      nameEl.classList.add("is-gradient");
    } else {
      nameEl.style.backgroundImage = "";
      nameEl.classList.remove("is-gradient");
    }
    // Custom display-name font from Discord's font_id (falls back to the
    // card's normal font when there's no style or no look-alike for that id).
    nameEl.style.fontFamily = (styles && NAME_FONTS[styles.font_id]) || "";

    const pg = u.primary_guild;
    if (pg && pg.tag && pg.identity_enabled) {
      const badge = guildBadgeUrl(pg);
      tagEl.innerHTML = (badge ? '<img class="pc-tag-badge" src="' + badge + '" alt="" onerror="this.remove()">' : "") +
        '<span class="pc-tag-text">' + esc(pg.tag) + "</span>";
      tagEl.hidden = false;
    } else {
      tagEl.hidden = true;
    }

    platformsEl.innerHTML = platformIcons(d);

    lastFlags = u.public_flags || 0;
    paintBadges();

    const loc = d.kv && d.kv.location;
    if (loc) {
      metaEl.innerHTML = '<span class="pc-pin" aria-hidden="true">📍</span>' + esc(loc);
      metaEl.hidden = false;
    } else {
      metaEl.hidden = true;
    }

    const acts = d.activities || [];

    sections.innerHTML = "";

    // The custom status renders in the identity column, directly under the
    // name, so its thought-bubble tail rises to the username (Discord-style)
    // — rather than down in the activity list.
    if (customNode) { customNode.remove(); customNode = null; }
    const custom = acts.find((a) => a.type === 4);
    if (custom && (custom.state || (custom.emoji && custom.emoji.id))) {
      customNode = customRow(custom);
      idEl.appendChild(customNode);
    }
    card.classList.toggle("has-custom", !!customNode);

    if (d.listening_to_spotify && d.spotify) {
      sections.appendChild(spotifyRow(d.spotify));
      applyAccent(d.spotify.album_art_url);
    } else {
      resetAccent();
    }

    acts.filter((a) => a.type === 0).forEach((a) => sections.appendChild(activityRow(a)));
    acts.filter((a) => a.type === 1).forEach((a) => sections.appendChild(streamRow(a)));

    card.classList.toggle("has-sections", sections.children.length > 0);
    updateTimes();
    if (sections.querySelector("[data-start], [data-elapsed-start]")) startTicker();
    else stopTicker();

    card.hidden = false;
  }

  // ---- time tickers (progress bar + elapsed labels) -----------------------
  function updateTimes() {
    const sp = sections.querySelector(".pc-spotify[data-start][data-end]");
    if (sp) {
      const start = +sp.dataset.start, end = +sp.dataset.end;
      if (end > start) {
        const elapsed = clamp(Date.now() - start, 0, end - start);
        const fill = sp.querySelector(".pc-fill");
        const cur = sp.querySelector(".pc-cur");
        const dur = sp.querySelector(".pc-dur");
        if (fill) fill.style.width = clamp((elapsed / (end - start)) * 100, 0, 100) + "%";
        if (cur) cur.textContent = fmt(elapsed);
        if (dur) dur.textContent = fmt(end - start);
      }
    }
    sections.querySelectorAll("[data-elapsed-start]").forEach((row) => {
      const lbl = row.querySelector(".pc-row-elapsed");
      if (lbl) lbl.textContent = elapsedStr(+row.dataset.elapsedStart);
    });
  }
  function startTicker() { if (!ticker) ticker = setInterval(updateTimes, 1000); }
  function stopTicker() { if (ticker) { clearInterval(ticker); ticker = null; } }

  // ---- data source: Doughmination Restful API (sole source) ---------------
  // Returns presence + full profile (incl. theme_colors + display_name_styles)
  // in a single call. Lanyard + dstn.to were removed.
  const SELF_BASE = "https://restful.doughmination.uk/v1/users/";
  const SELF_POLL_MS = opts.pollMs || 20000;   // presence refresh cadence
  let selfTimer = null;

  // self-host shape -> the Lanyard-shaped object render() already understands
  function mapSelfHostToLanyard(j) {
    const u = (j.data && j.data.user) || {};
    const p = (j.data && j.data.presence) || {};
    const plat = p.platform || {};
    const dec = u.avatar_decoration;
    const clan = u.clan;
    return {
      discord_user: {
        id: u.id || DISCORD_USER_ID,
        username: u.username,
        global_name: u.global_name,
        display_name: u.display_name,
        avatar: u.avatar,
        avatar_decoration_data: (dec && dec.asset) ? { asset: dec.asset } : null,
        primary_guild: (clan && clan.tag)
          ? { tag: clan.tag, identity_enabled: true, badge: clan.badge, identity_guild_id: clan.guild_id }
          : null,
        // carry the Nitro name styling through so render() can apply the
        // gradient + custom font (font_id) — without this it never reaches it
        display_name_styles: u.display_name_styles || null,
        public_flags: u.public_flags || 0
      },
      discord_status: p.status || (p.online ? "online" : "offline"),
      activities: p.activities || [],
      listening_to_spotify: !!p.listening_to_spotify,
      spotify: p.spotify || null,
      active_on_discord_desktop: !!plat.desktop,
      active_on_discord_mobile: !!plat.mobile,
      active_on_discord_web: !!plat.web,
      kv: {}
    };
  }

  function renderFromSelfHost(j) {
    const u = (j.data && j.data.user) || {};
    render(mapSelfHostToLanyard(j));
    // badges arrive pre-resolved (same consumer as dstn badges)
    if (Array.isArray(j.data.badges) && j.data.badges.length) {
      dstnBadges = j.data.badges;
      paintBadges();
    }
    // Nitro profile gradient — straight from the self-hosted API now that it
    // returns theme_colors (previously only the dstn.to fallback applied this)
    if (Array.isArray(u.theme_colors)) applyProfileGradient(u.theme_colors);
    // profile extras: banner rebuilt from the raw hash (dodges the animated
    // .gif 415), plus bio / connections / pronouns straight from the API
    applyBanner(
      bannerUrl(u.id || DISCORD_USER_ID, u.banner),
      (typeof u.accent_color === "number") ? intToHex(u.accent_color) : null
    );
    renderBio(u.bio);
    renderConnections(j.data.connected_accounts);
    if (pronounsEl) {
      if (u.pronouns) { pronounsEl.textContent = u.pronouns; pronounsEl.hidden = false; }
      else pronounsEl.hidden = true;
    }
    // wishlist: resolved Shop collectibles (null when the API couldn't load it).
    // Keep the panel live if it's already open when fresh data arrives.
    wishlistItems = Array.isArray(j.data.wishlist) ? j.data.wishlist : null;
    if (card.classList.contains("show-wishlist")) renderWishlist();
  }

  function loadSelfHosted() {
    return fetch(SELF_BASE + DISCORD_USER_ID, { cache: "no-store" })
      .then(function (r) { return r.ok ? r.json().catch(function () { return null; }) : null; })
      .then(function (j) {
        // render whenever the API has the user; presence may be null (offline)
        if (!j || !j.success || !j.data || !j.data.user) return false;
        renderFromSelfHost(j);
        return true;
      })
      .catch(function () { return false; });
  }

  function pollSelfHost() {
    if (!document.hidden) loadSelfHosted();
  }

  // boot: poll the Doughmination Restful API (the only source now). ID-less
  // placeholder cards (e.g. dead alts) keep their seeded look — no fetch.
  if (DISCORD_USER_ID) {
    loadSelfHosted();
    selfTimer = setInterval(pollSelfHost, SELF_POLL_MS);
  }

  document.addEventListener("visibilitychange", () => {
    if (!document.hidden && latest) updateTimes();
  });

    return card;
  }  // ---- end createPresenceCard ----

  // Expose the factory so other pages (e.g. /cool-people) can build cards.
  window.PresenceCard = createPresenceCard;

  // Auto-mount the standalone card whenever its #discord placeholder exists,
  // preserving the original /discord page behaviour exactly.
  if (document.getElementById("discord")) createPresenceCard({});
})();