fansunited-widgets-cdn 0.0.84 → 0.0.86-RC1

package/chunks/NotFoundSkeleton-BYJTzYJR-Be3R34nS.js

@@ -0,0 +1,2764 @@
+import { F as yo, G as bo, r as F, v as Co, _ as So, a0 as jo, Z as Se, w as G, E as vo, x as _e, y as Ye, j as o, z as ce, D as To, B as t, C as ko } from "./main-XP7dqk6g.js";
+import { e as T, K as _, J as A, Y as q, o as Y, y as ke, C as L, Z as U, t as Io, r as J, h as ie, j as z, s as Ie, u as wo, d as Je, g as we, n as Re, m as Ze, a as Xe, G as Ro, $ as Mo } from "./Portal-BWqqFvVm-TuHZWjxn.js";
+import { d as de, e as Fo, a as zo, T as a, B as X } from "./Button-BV7YIFkS.js";
+import { A as Te } from "./AspectRatio-D3Sgxj7p.js";
+import { b as Po, P as Do } from "./Select-p_cHpLhi.js";
+import { u as Ne, g as Ao } from "./getReactElementRef-BD-S8A24.js";
+import { I as pe } from "./IconButton-Lt9Xks7c.js";
+import { M as Wo, a as Bo } from "./ModalDialog-Ci3hulZA.js";
+import { D as Ho } from "./DialogContent-MIXff4nd.js";
+function Lo(e) {
+  return yo("MuiTooltip", e);
+}
+bo("MuiTooltip", ["root", "tooltipArrow", "arrow", "touch", "placementLeft", "placementRight", "placementTop", "placementBottom", "colorPrimary", "colorDanger", "colorNeutral", "colorSuccess", "colorWarning", "colorContext", "sizeSm", "sizeMd", "sizeLg", "variantPlain", "variantOutlined", "variantSoft", "variantSolid"]);
+const Eo = ["children", "className", "component", "arrow", "describeChild", "disableFocusListener", "disableHoverListener", "disableInteractive", "disableTouchListener", "enterDelay", "enterNextDelay", "enterTouchDelay", "followCursor", "id", "leaveDelay", "leaveTouchDelay", "onClose", "onOpen", "open", "disablePortal", "direction", "keepMounted", "modifiers", "placement", "title", "color", "variant", "size", "slots", "slotProps"], $o = (e) => {
+  const {
+    arrow: i,
+    variant: n,
+    color: l,
+    size: s,
+    placement: r,
+    touch: m
+  } = e, c = {
+    root: ["root", i && "tooltipArrow", m && "touch", s && `size${ce(s)}`, l && `color${ce(l)}`, n && `variant${ce(n)}`, `tooltipPlacement${ce(r.split("-")[0])}`],
+    arrow: ["arrow"]
+  };
+  return To(c, Lo, {});
+}, Vo = Ye("div", {
+  name: "JoyTooltip",
+  slot: "Root",
+  overridesResolver: (e, i) => i.root
+})(({
+  ownerState: e,
+  theme: i
+}) => {
+  var n, l, s;
+  const r = (n = i.variants[e.variant]) == null ? void 0 : n[e.color];
+  return G({}, e.size === "sm" && {
+    "--Icon-fontSize": i.vars.fontSize.md,
+    "--Tooltip-arrowSize": "8px",
+    padding: i.spacing(0.25, 0.625)
+  }, e.size === "md" && {
+    "--Icon-fontSize": i.vars.fontSize.lg,
+    "--Tooltip-arrowSize": "10px",
+    padding: i.spacing(0.5, 0.75)
+  }, e.size === "lg" && {
+    "--Icon-fontSize": i.vars.fontSize.xl,
+    "--Tooltip-arrowSize": "12px",
+    padding: i.spacing(0.75, 1)
+  }, {
+    zIndex: i.vars.zIndex.tooltip,
+    borderRadius: i.vars.radius.sm,
+    boxShadow: i.shadow.sm,
+    wordWrap: "break-word",
+    position: "relative"
+  }, e.disableInteractive && {
+    pointerEvents: "none"
+  }, i.typography[`body-${{
+    sm: "xs",
+    md: "sm",
+    lg: "md"
+  }[e.size]}`], r, !r.backgroundColor && {
+    backgroundColor: i.vars.palette.background.surface
+  }, {
+    "&::before": {
+      // acts as a invisible connector between the element and the tooltip
+      // so that the cursor can move to the tooltip without losing focus.
+      content: '""',
+      display: "block",
+      position: "absolute",
+      width: (l = e.placement) != null && l.match(/(top|bottom)/) ? "100%" : (
+        // 10px equals the default offset popper config
+        "calc(10px + var(--variant-borderWidth, 0px))"
+      ),
+      height: (s = e.placement) != null && s.match(/(top|bottom)/) ? "calc(10px + var(--variant-borderWidth, 0px))" : "100%"
+    },
+    '&[data-popper-placement*="bottom"]::before': {
+      top: 0,
+      left: 0,
+      transform: "translateY(-100%)"
+    },
+    '&[data-popper-placement*="left"]::before': {
+      top: 0,
+      right: 0,
+      transform: "translateX(100%)"
+    },
+    '&[data-popper-placement*="right"]::before': {
+      top: 0,
+      left: 0,
+      transform: "translateX(-100%)"
+    },
+    '&[data-popper-placement*="top"]::before': {
+      bottom: 0,
+      left: 0,
+      transform: "translateY(100%)"
+    }
+  });
+}), Oo = Ye("span", {
+  name: "JoyTooltip",
+  slot: "Arrow",
+  overridesResolver: (e, i) => i.arrow
+})(({
+  theme: e,
+  ownerState: i
+}) => {
+  var n, l, s;
+  const r = (n = e.variants[i.variant]) == null ? void 0 : n[i.color];
+  return {
+    "--unstable_Tooltip-arrowRotation": 0,
+    width: "var(--Tooltip-arrowSize)",
+    height: "var(--Tooltip-arrowSize)",
+    boxSizing: "border-box",
+    // use pseudo element because Popper controls the `transform` property of the arrow.
+    "&::before": {
+      content: '""',
+      display: "block",
+      position: "absolute",
+      width: 0,
+      height: 0,
+      border: "calc(var(--Tooltip-arrowSize) / 2) solid",
+      borderLeftColor: "transparent",
+      borderBottomColor: "transparent",
+      borderTopColor: (l = r == null ? void 0 : r.backgroundColor) != null ? l : e.vars.palette.background.surface,
+      borderRightColor: (s = r == null ? void 0 : r.backgroundColor) != null ? s : e.vars.palette.background.surface,
+      borderRadius: "0px 2px 0px 0px",
+      boxShadow: `var(--variant-borderWidth, 0px) calc(-1 * var(--variant-borderWidth, 0px)) 0px 0px ${r.borderColor}`,
+      transformOrigin: "center center",
+      transform: "rotate(calc(-45deg + 90deg * var(--unstable_Tooltip-arrowRotation)))"
+    },
+    '[data-popper-placement*="bottom"] &': {
+      top: "calc(0.5px + var(--Tooltip-arrowSize) * -1 / 2)"
+      // 0.5px is for perfect overlap with the Tooltip
+    },
+    '[data-popper-placement*="top"] &': {
+      "--unstable_Tooltip-arrowRotation": 2,
+      bottom: "calc(0.5px + var(--Tooltip-arrowSize) * -1 / 2)"
+    },
+    '[data-popper-placement*="left"] &': {
+      "--unstable_Tooltip-arrowRotation": 1,
+      right: "calc(0.5px + var(--Tooltip-arrowSize) * -1 / 2)"
+    },
+    '[data-popper-placement*="right"] &': {
+      "--unstable_Tooltip-arrowRotation": 3,
+      left: "calc(0.5px + var(--Tooltip-arrowSize) * -1 / 2)"
+    }
+  };
+});
+let xe = !1;
+const Ue = new Fo();
+let te = {
+  x: 0,
+  y: 0
+};
+function Ge(e, i) {
+  return (n) => {
+    i && i(n), e(n);
+  };
+}
+function qe(e, i) {
+  return (n, ...l) => {
+    i && i(n, ...l), e(n, ...l);
+  };
+}
+const je = /* @__PURE__ */ F.forwardRef(function(i, n) {
+  var l;
+  const s = Co({
+    props: i,
+    name: "JoyTooltip"
+  }), {
+    children: r,
+    className: m,
+    component: c,
+    arrow: p = !1,
+    describeChild: k = !1,
+    disableFocusListener: C = !1,
+    disableHoverListener: S = !1,
+    disableInteractive: y = !1,
+    disableTouchListener: h = !1,
+    enterDelay: R = 100,
+    enterNextDelay: w = 0,
+    enterTouchDelay: M = 700,
+    followCursor: v = !1,
+    id: x,
+    leaveDelay: I = 0,
+    leaveTouchDelay: f = 1500,
+    onClose: D,
+    onOpen: b,
+    open: d,
+    disablePortal: g,
+    direction: N,
+    keepMounted: j,
+    modifiers: W,
+    placement: Z = "bottom",
+    title: H,
+    color: E = "neutral",
+    variant: $ = "solid",
+    size: Ke = "md",
+    slots: Qe = {},
+    slotProps: eo = {}
+  } = s, Fe = So(s, Eo), [K, ze] = F.useState(), [ge, oo] = F.useState(null), ne = F.useRef(!1), me = y || v, Pe = de(), ue = de(), re = de(), De = de(), [to, Ae] = Po({
+    controlled: d,
+    default: !1,
+    name: "Tooltip",
+    state: "open"
+  });
+  let V = to;
+  const fe = jo(x), Q = F.useRef(void 0), le = Ne(() => {
+    Q.current !== void 0 && (document.body.style.WebkitUserSelect = Q.current, Q.current = void 0), De.clear();
+  });
+  F.useEffect(() => le, [le]);
+  const We = (u) => {
+    Ue.clear(), xe = !0, Ae(!0), b && !V && b(u);
+  }, ae = Ne((u) => {
+    Ue.start(800 + I, () => {
+      xe = !1;
+    }), Ae(!1), D && V && D(u), Pe.start(150, () => {
+      ne.current = !1;
+    });
+  }), se = (u) => {
+    ne.current && u.type !== "touchstart" || (K && K.removeAttribute("title"), ue.clear(), re.clear(), R || xe && w ? ue.start(xe ? w : R, () => {
+      We(u);
+    }) : We(u));
+  }, he = (u) => {
+    ue.clear(), re.start(I, () => {
+      ae(u);
+    });
+  }, {
+    isFocusVisibleRef: Be,
+    onBlur: io,
+    onFocus: no,
+    ref: ro
+  } = zo(), [, He] = F.useState(!1), Le = (u) => {
+    io(u), Be.current === !1 && (He(!1), he(u));
+  }, Ee = (u) => {
+    K || ze(u.currentTarget), no(u), Be.current === !0 && (He(!0), se(u));
+  }, $e = (u) => {
+    ne.current = !0;
+    const O = r.props;
+    O.onTouchStart && O.onTouchStart(u);
+  }, lo = (u) => {
+    $e(u), re.clear(), Pe.clear(), le(), Q.current = document.body.style.WebkitUserSelect, document.body.style.WebkitUserSelect = "none", De.start(M, () => {
+      document.body.style.WebkitUserSelect = Q.current, se(u);
+    });
+  }, ao = (u) => {
+    r.props.onTouchEnd && r.props.onTouchEnd(u), le(), re.start(f, () => {
+      ae(u);
+    });
+  };
+  F.useEffect(() => {
+    if (!V)
+      return;
+    function u(O) {
+      (O.key === "Escape" || O.key === "Esc") && ae(O);
+    }
+    return document.addEventListener("keydown", u), () => {
+      document.removeEventListener("keydown", u);
+    };
+  }, [ae, V]);
+  const so = Se(ze, n), co = Se(ro, so), po = Se(Ao(r), co);
+  typeof H != "number" && !H && (V = !1);
+  const ye = F.useRef(null), xo = (u) => {
+    const O = r.props;
+    O.onMouseMove && O.onMouseMove(u), te = {
+      x: u.clientX,
+      y: u.clientY
+    }, ye.current && ye.current.update();
+  }, ee = {}, be = typeof H == "string";
+  k ? (ee.title = !V && be && !S ? H : null, ee["aria-describedby"] = V ? fe : null) : (ee["aria-label"] = be ? H : null, ee["aria-labelledby"] = V && !be ? fe : null);
+  const B = G({}, ee, Fe, {
+    component: c
+  }, r.props, {
+    className: vo(m, r.props.className),
+    onTouchStart: $e,
+    ref: po
+  }, v ? {
+    onMouseMove: xo
+  } : {}), oe = {};
+  h || (B.onTouchStart = lo, B.onTouchEnd = ao), S || (B.onMouseOver = Ge(se, B.onMouseOver), B.onMouseLeave = Ge(he, B.onMouseLeave), me || (oe.onMouseOver = se, oe.onMouseLeave = he)), C || (B.onFocus = qe(Ee, B.onFocus), B.onBlur = qe(Le, B.onBlur), me || (oe.onFocus = Ee, oe.onBlur = Le));
+  const Ce = G({}, s, {
+    arrow: p,
+    disableInteractive: me,
+    placement: Z,
+    touch: ne.current,
+    color: E,
+    variant: $,
+    size: Ke
+  }), Ve = $o(Ce), Oe = G({}, Fe, {
+    component: c,
+    slots: Qe,
+    slotProps: eo
+  }), go = F.useMemo(() => [{
+    name: "arrow",
+    enabled: !!ge,
+    options: {
+      element: ge,
+      // https://popper.js.org/docs/v2/modifiers/arrow/#padding
+      // make the arrow looks nice with the Tooltip's border radius
+      padding: 6
+    }
+  }, {
+    name: "offset",
+    options: {
+      offset: [0, 10]
+    }
+  }, ...W || []], [ge, W]), [mo, uo] = _e("root", {
+    additionalProps: G({
+      id: fe,
+      popperRef: ye,
+      placement: Z,
+      anchorEl: v ? {
+        getBoundingClientRect: () => ({
+          top: te.y,
+          left: te.x,
+          right: te.x,
+          bottom: te.y,
+          width: 0,
+          height: 0
+        })
+      } : K,
+      open: K ? V : !1,
+      disablePortal: g,
+      keepMounted: j,
+      direction: N,
+      modifiers: go
+    }, oe),
+    ref: null,
+    className: Ve.root,
+    elementType: Vo,
+    externalForwardedProps: Oe,
+    ownerState: Ce
+  }), [fo, ho] = _e("arrow", {
+    ref: oo,
+    className: Ve.arrow,
+    elementType: Oo,
+    externalForwardedProps: Oe,
+    ownerState: Ce
+  });
+  return /* @__PURE__ */ o.jsxs(F.Fragment, {
+    children: [/* @__PURE__ */ F.isValidElement(r) && /* @__PURE__ */ F.cloneElement(r, B), /* @__PURE__ */ o.jsxs(mo, G({}, uo, !((l = s.slots) != null && l.root) && {
+      as: Do,
+      slots: {
+        root: c || "div"
+      }
+    }, {
+      children: [H, p ? /* @__PURE__ */ o.jsx(fo, G({}, ho)) : null]
+    }))]
+  });
+}), lt = ({ my: e }) => /* @__PURE__ */ o.jsx(
+  t,
+  {
+    sx: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      width: "100%",
+      height: "100%",
+      my: e
+    },
+    children: /* @__PURE__ */ o.jsx(
+      ko,
+      {
+        slotProps: {
+          track: {
+            sx: {
+              stroke: T().palette.neutral.softBg
+            }
+          },
+          progress: {
+            sx: {
+              stroke: T().palette.neutral.solidBg
+            }
+          }
+        }
+      }
+    )
+  }
+), at = ({
+  additionalCTA: e,
+  buttonStyle: i,
+  buttonContentStyle: n,
+  textStyle: l
+}) => {
+  const { t: s } = ie();
+  return e ? e.component ? e.component : e.onClick ? /* @__PURE__ */ o.jsx(X, { sx: i, onClick: e.onClick, children: e.defaultLabel && /* @__PURE__ */ o.jsx(t, { sx: n, children: /* @__PURE__ */ o.jsx(a, { sx: l, children: e.defaultLabel }) }) }) : e.url ? /* @__PURE__ */ o.jsx(
+    X,
+    {
+      component: "a",
+      href: e.url,
+      target: e.target || "_self",
+      sx: i,
+      children: /* @__PURE__ */ o.jsx(a, { sx: l, children: e.defaultLabel || s("common.additional") })
+    }
+  ) : null : null;
+}, ve = we(/* @__PURE__ */ o.jsx("path", {
+  d: "M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"
+}), "InfoOutlined"), _o = we(/* @__PURE__ */ o.jsx("path", {
+  d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
+}), "Close"), P = ({
+  rules: e,
+  rulesDisplay: i,
+  isOverlayVariant: n = !1
+}) => {
+  const { t: l } = ie(), { shadowRootElement: s } = Ro(Mo), r = T(), m = U(), c = A(), p = _(), k = Y(), [C, S] = F.useState(!1);
+  if (!e)
+    return null;
+  if (i != null && i.component)
+    return i.component;
+  if (((i == null ? void 0 : i.type) || "modal") === "link" && i != null && i.url) {
+    const y = i.target || "_blank", h = {
+      backgroundColor: "transparent",
+      color: n ? r.palette.neutral.plainColor : r.textSecondary,
+      border: "none",
+      borderRadius: "50%",
+      width: "2em",
+      height: "2em",
+      minHeight: "2em",
+      minWidth: "2em",
+      padding: 0,
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      cursor: "pointer",
+      transition: "all 0.2s ease-in-out",
+      "&: hover": {
+        backgroundColor: "transparent",
+        transform: "scale(1.05)"
+      },
+      "&:focus-visible": {
+        outline: "none"
+      },
+      "& svg": {
+        fontSize: "1.25em"
+      }
+    };
+    return typeof window > "u" ? /* @__PURE__ */ o.jsx(
+      je,
+      {
+        title: l("common.rules.info"),
+        placement: "right",
+        variant: "soft",
+        disablePortal: !0,
+        children: /* @__PURE__ */ o.jsx(
+          pe,
+          {
+            component: "a",
+            href: i.url,
+            target: y,
+            rel: "noopener noreferrer",
+            sx: h,
+            "aria-label": l("common.rules.info"),
+            children: /* @__PURE__ */ o.jsx(ve, {})
+          }
+        )
+      }
+    ) : /* @__PURE__ */ o.jsx(
+      je,
+      {
+        title: l("common.rules.info"),
+        placement: "right",
+        variant: "soft",
+        disablePortal: !0,
+        children: /* @__PURE__ */ o.jsx(
+          pe,
+          {
+            onClick: (R) => {
+              R.stopPropagation(), window.open(i.url, y, "noopener,noreferrer");
+            },
+            sx: h,
+            "aria-label": l("common.rules.info"),
+            children: /* @__PURE__ */ o.jsx(ve, {})
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    /* @__PURE__ */ o.jsx(
+      je,
+      {
+        title: l("common.rules.info"),
+        placement: "right",
+        variant: "soft",
+        disablePortal: !0,
+        children: /* @__PURE__ */ o.jsx(
+          pe,
+          {
+            onClick: (y) => {
+              y.stopPropagation(), S(!0);
+            },
+            sx: {
+              backgroundColor: "transparent",
+              color: r.palette.neutral[500],
+              border: "none",
+              borderRadius: "50%",
+              width: "2em",
+              height: "2em",
+              minHeight: "2em",
+              minWidth: "2em",
+              padding: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              cursor: "pointer",
+              transition: "all 0.2s ease-in-out",
+              "&:hover": {
+                backgroundColor: "transparent",
+                color: r.palette.neutral[500],
+                transform: "scale(1.05)"
+              },
+              "&:focus-visible": {
+                outline: "none"
+              },
+              "& svg": {
+                fontSize: "1.25em"
+              }
+            },
+            "aria-label": l("common.rules.info"),
+            children: /* @__PURE__ */ o.jsx(ve, {})
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ o.jsx(
+      Wo,
+      {
+        open: C,
+        onClose: () => S(!1),
+        container: s,
+        sx: { zIndex: 1300 },
+        children: /* @__PURE__ */ o.jsxs(
+          Bo,
+          {
+            sx: {
+              width: "100%",
+              maxWidth: k ? "90vw" : "600px",
+              maxHeight: k ? "90vh" : "80vh",
+              p: k ? 2 : 3,
+              borderRadius: m.md,
+              backgroundColor: r.surface
+            },
+            children: [
+              /* @__PURE__ */ o.jsx(
+                pe,
+                {
+                  onClick: (y) => {
+                    y.stopPropagation(), S(!1);
+                  },
+                  sx: {
+                    position: "absolute",
+                    top: p.sm,
+                    right: p.sm,
+                    backgroundColor: "transparent",
+                    color: r.textSecondary,
+                    border: "none",
+                    borderRadius: "50%",
+                    width: "2em",
+                    height: "2em",
+                    minHeight: "2em",
+                    minWidth: "2em",
+                    padding: 0,
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    cursor: "pointer",
+                    transition: "all 0.2s ease-in-out",
+                    zIndex: 1e3,
+                    "&:hover": {
+                      backgroundColor: `${r.textSecondary}15`,
+                      color: r.textPrimary,
+                      transform: "scale(1.05)"
+                    },
+                    "&:focus-visible": {
+                      outline: "none"
+                    },
+                    "& svg": {
+                      fontSize: "1.25em"
+                    }
+                  },
+                  children: /* @__PURE__ */ o.jsx(_o, {})
+                }
+              ),
+              /* @__PURE__ */ o.jsxs(
+                Ho,
+                {
+                  sx: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: p.md
+                  },
+                  children: [
+                    /* @__PURE__ */ o.jsx(
+                      a,
+                      {
+                        sx: {
+                          fontFamily: c.primary,
+                          fontWeight: 600,
+                          fontSize: "1.25em",
+                          lineHeight: 1.2,
+                          color: r.textPrimary,
+                          textAlign: "center",
+                          marginBottom: p.sm
+                        },
+                        children: l("common.rules.title")
+                      }
+                    ),
+                    /* @__PURE__ */ o.jsx(
+                      t,
+                      {
+                        sx: {
+                          fontFamily: c.secondary,
+                          fontSize: "1em",
+                          lineHeight: 1.5,
+                          color: r.textSecondary,
+                          overflow: "auto",
+                          // Custom scrollbar styling for dark theme
+                          "&::-webkit-scrollbar": {
+                            width: "8px"
+                          },
+                          "&::-webkit-scrollbar-track": {
+                            backgroundColor: "transparent"
+                          },
+                          "&::-webkit-scrollbar-thumb": {
+                            backgroundColor: r.secondaryContainer,
+                            borderRadius: "4px",
+                            "&:hover": {
+                              backgroundColor: r.textSecondary
+                            }
+                          },
+                          // Firefox scrollbar styling
+                          scrollbarWidth: "thin",
+                          scrollbarColor: `${r.secondaryContainer} transparent`,
+                          "& p": {
+                            marginBottom: p.sm
+                          },
+                          "& ul, & ol": {
+                            marginLeft: p.md,
+                            marginBottom: p.sm
+                          },
+                          "& li": {
+                            marginBottom: p.xs
+                          },
+                          "& h1, & h2, & h3, & h4, & h5, & h6": {
+                            fontFamily: c.primary,
+                            color: r.textPrimary,
+                            marginTop: p.md,
+                            marginBottom: p.sm
+                          }
+                        },
+                        dangerouslySetInnerHTML: { __html: e }
+                      }
+                    ),
+                    /* @__PURE__ */ o.jsx(
+                      X,
+                      {
+                        variant: "outlined",
+                        onClick: (y) => {
+                          y.stopPropagation(), S(!1);
+                        },
+                        sx: {
+                          marginTop: p.md,
+                          borderColor: r.textPrimary,
+                          color: r.textPrimary,
+                          fontFamily: c.secondary,
+                          fontSize: "0.875em",
+                          borderRadius: m.sm,
+                          "&:hover": {
+                            borderColor: r.textPrimary,
+                            color: r.textPrimary,
+                            backgroundColor: r.surfaceVariant
+                          }
+                        },
+                        children: l("common.rules.close")
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}, No = (e) => {
+  var i, n, l;
+  return {
+    // Mobile headline with image background
+    mobileHeadlineWithImage: {
+      display: e.isMobile ? "flex" : "none",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: "5px",
+      borderTopRightRadius: "5px",
+      position: "relative",
+      minHeight: "210px",
+      overflow: "hidden",
+      height: "auto",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      }
+    },
+    // Mobile headline content
+    mobileHeadlineContent: {
+      zIndex: 1,
+      height: "100%",
+      p: e.spacingScale.xl,
+      gap: e.spacingScale["2xl"],
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between"
+    },
+    // Mobile headline without image
+    mobileHeadlineWithoutImage: {
+      display: e.isMobile ? "flex" : "none",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      p: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
+      gap: e.spacingScale["2xl"]
+    },
+    // Headline typography (mobile with image)
+    headlineTypographyMobileImage: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((i = e.brandingColors) == null ? void 0 : i.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: "center"
+    },
+    // Headline typography (mobile without image & desktop)
+    headlineTypography: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textTransform: "uppercase",
+      fontSize: "0.75em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilySecondary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Headline typography (desktop centered)
+    headlineTypographyDesktop: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textTransform: "uppercase",
+      fontSize: "0.75em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilySecondary
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title typography (mobile with image)
+    titleTypographyMobileImage: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((n = e.brandingColors) == null ? void 0 : n.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Title typography (mobile without image & desktop responsive)
+    titleTypography: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Title typography (desktop centered)
+    titleTypographyDesktop: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Description typography (mobile with image)
+    descriptionTypographyMobileImage: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((l = e.brandingColors) == null ? void 0 : l.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Description typography (mobile without image & desktop responsive)
+    descriptionTypography: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description typography (desktop centered)
+    descriptionTypographyDesktop: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Image container (left position)
+    imageContainerLeft: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: "auto",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center center",
+      backgroundRepeat: "no-repeat",
+      alignItems: "center",
+      justifyContent: "center"
+    },
+    // Image container (right position)
+    imageContainerRight: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: "auto",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center center",
+      backgroundRepeat: "no-repeat",
+      alignItems: "center",
+      justifyContent: "center"
+    },
+    // Image safe area (placeholder for image space)
+    imageSafeArea: {
+      width: "100%",
+      height: "100%"
+    },
+    // Main content area
+    mainContentArea: {
+      flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
+      display: "flex",
+      flexDirection: "column",
+      px: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
+      pt: e.spacingScale.lg,
+      pb: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
+      gap: e.spacingScale.md
+    },
+    // Desktop headline container
+    desktopHeadlineContainer: {
+      display: e.isMobile ? "none" : "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: e.spacingScale["2xl"],
+      textAlign: "center"
+    },
+    // Aspect ratio container (for embed code)
+    aspectRatioContainer: {
+      borderRadius: e.borderRadius.md,
+      overflow: "hidden"
+    }
+  };
+}, st = ({
+  entity: e,
+  headline: i,
+  finalImage: n,
+  imagePosition: l = "left",
+  children: s,
+  embedCodeContainerRef: r,
+  hasEmbedCode: m = !1,
+  filterScreenContent: c,
+  rulesDisplay: p
+}) => {
+  var k, C;
+  const S = Y(), y = q(), h = _(), R = A().primary, w = A().secondary, M = U(), v = ((k = e.branding) == null ? void 0 : k.colors) || null, x = ((C = e.branding) == null ? void 0 : C.urls) || null, I = (v == null ? void 0 : v.contentColor) || T().textColor, f = (v == null ? void 0 : v.secondaryColor) || T().textColor, D = (v == null ? void 0 : v.backgroundColor) || T().surfaceVariant, b = "60%", d = J(
+    L.STANDARD
+  ), g = No({
+    finalImage: n,
+    spacingScale: h,
+    borderRadius: M,
+    fontFamilyPrimary: R,
+    fontFamilySecondary: w,
+    textColor: I,
+    secondaryColor: f,
+    bgcolor: Re(D || ""),
+    opacity: b,
+    brandingColors: v,
+    darkTextColor: y.colorSchemes.dark.textColor,
+    imageBackgroundGradient: d,
+    isMobile: S
+  }), N = Ze(
+    x == null ? void 0 : x.primaryUrl,
+    x == null ? void 0 : x.secondaryUrl,
+    "image"
+  ), j = () => {
+    N && window.open(N, "_blank", "noopener,noreferrer");
+  }, W = (E, $) => N ? typeof window > "u" ? /* @__PURE__ */ o.jsx(
+    t,
+    {
+      component: "a",
+      href: N,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      sx: {
+        ...$,
+        cursor: "pointer",
+        textDecoration: "none"
+      },
+      children: E
+    }
+  ) : /* @__PURE__ */ o.jsx(
+    t,
+    {
+      sx: {
+        ...$,
+        cursor: "pointer"
+      },
+      onClick: j,
+      children: E
+    }
+  ) : /* @__PURE__ */ o.jsx(t, { sx: $, children: E }), Z = () => m && r ? /* @__PURE__ */ o.jsxs(t, { sx: g.mobileHeadlineWithoutImage, children: [
+    /* @__PURE__ */ o.jsxs(t, { children: [
+      /* @__PURE__ */ o.jsxs(
+        t,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: h["3xs"]
+          },
+          children: [
+            /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: g.headlineTypography, children: i }),
+            /* @__PURE__ */ o.jsx(
+              P,
+              {
+                rules: e.rules || "",
+                rulesDisplay: p,
+                isOverlayVariant: !1
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ o.jsxs(t, { sx: g.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "h4", sx: g.titleTypography, children: e.title }),
+        /* @__PURE__ */ o.jsx(a, { sx: g.descriptionTypography, children: z(e.description) })
+      ] })
+    ] }),
+    /* @__PURE__ */ o.jsx(Te, { ratio: "16/9", sx: g.aspectRatioContainer, children: /* @__PURE__ */ o.jsx(t, { ref: r }) })
+  ] }) : n ? W(
+    /* @__PURE__ */ o.jsxs(t, { sx: g.mobileHeadlineContent, children: [
+      /* @__PURE__ */ o.jsxs(t, { children: [
+        /* @__PURE__ */ o.jsxs(
+          t,
+          {
+            sx: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: h["3xs"]
+            },
+            children: [
+              /* @__PURE__ */ o.jsx(
+                a,
+                {
+                  level: "body-sm",
+                  sx: g.headlineTypographyMobileImage,
+                  children: i
+                }
+              ),
+              /* @__PURE__ */ o.jsx(
+                P,
+                {
+                  rules: e.rules || "",
+                  rulesDisplay: p,
+                  isOverlayVariant: !1
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ o.jsxs(t, { sx: g.contentContainer, children: [
+          /* @__PURE__ */ o.jsx(a, { sx: g.titleTypographyMobileImage, children: e.title }),
+          /* @__PURE__ */ o.jsx(a, { sx: g.descriptionTypographyMobileImage, children: z(e.description) })
+        ] })
+      ] }),
+      c && /* @__PURE__ */ o.jsx(t, { children: c })
+    ] }),
+    g.mobileHeadlineWithImage
+  ) : /* @__PURE__ */ o.jsxs(t, { sx: g.mobileHeadlineWithoutImage, children: [
+    /* @__PURE__ */ o.jsxs(t, { children: [
+      /* @__PURE__ */ o.jsxs(
+        t,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: h["3xs"]
+          },
+          children: [
+            /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: g.headlineTypography, children: i }),
+            /* @__PURE__ */ o.jsx(
+              P,
+              {
+                rules: e.rules || "",
+                rulesDisplay: p,
+                isOverlayVariant: !1
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ o.jsxs(t, { sx: g.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "h4", sx: g.titleTypography, children: e.title }),
+        /* @__PURE__ */ o.jsx(a, { sx: g.descriptionTypography, children: z(e.description) })
+      ] })
+    ] }),
+    c && /* @__PURE__ */ o.jsx(t, { children: c })
+  ] }), H = !(S && c);
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    S && Z(),
+    l === "left" && n ? W(
+      /* @__PURE__ */ o.jsx(t, { sx: g.imageSafeArea }),
+      g.imageContainerLeft
+    ) : null,
+    H && /* @__PURE__ */ o.jsxs(t, { sx: g.mainContentArea, children: [
+      !S && /* @__PURE__ */ o.jsx(t, { children: /* @__PURE__ */ o.jsxs(t, { sx: g.desktopHeadlineContainer, children: [
+        /* @__PURE__ */ o.jsxs(
+          t,
+          {
+            sx: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center"
+            },
+            children: [
+              /* @__PURE__ */ o.jsxs(
+                t,
+                {
+                  sx: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: h["3xs"]
+                  },
+                  children: [
+                    /* @__PURE__ */ o.jsx(
+                      a,
+                      {
+                        level: "body-sm",
+                        sx: g.headlineTypographyDesktop,
+                        children: i
+                      }
+                    ),
+                    /* @__PURE__ */ o.jsx(
+                      P,
+                      {
+                        rules: e.rules || "",
+                        rulesDisplay: p,
+                        isOverlayVariant: !1
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ o.jsxs(t, { sx: g.contentContainer, children: [
+                /* @__PURE__ */ o.jsx(a, { level: "h4", sx: g.titleTypographyDesktop, children: e.title }),
+                /* @__PURE__ */ o.jsx(a, { sx: g.descriptionTypographyDesktop, children: z(e.description) })
+              ] })
+            ]
+          }
+        ),
+        m && r ? /* @__PURE__ */ o.jsx(t, { sx: { px: h.md }, children: /* @__PURE__ */ o.jsx(Te, { ratio: "16/9", sx: g.aspectRatioContainer, children: /* @__PURE__ */ o.jsx(t, { ref: r }) }) }) : c ? /* @__PURE__ */ o.jsx(t, { children: c }) : /* @__PURE__ */ o.jsx(o.Fragment, {})
+      ] }) }),
+      s
+    ] }),
+    l === "right" && n ? W(
+      /* @__PURE__ */ o.jsx(t, { sx: g.imageSafeArea }),
+      g.imageContainerRight
+    ) : null
+  ] });
+}, Uo = (e) => {
+  var i, n, l, s;
+  return {
+    // Main headline section with background image
+    headlineSection: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      flex: e.isMobile ? "1" : "0 0 50%",
+      width: e.isMobile ? "100%" : "50%",
+      minWidth: e.isMobile ? "100%" : "50%",
+      maxWidth: e.isMobile ? "100%" : "50%",
+      backgroundImage: e.finalImage ? `url(${e.finalImage})` : "none",
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: e.borderRadius.md,
+      borderTopRightRadius: e.isMobile ? e.borderRadius.md : 0,
+      borderBottomLeftRadius: e.isMobile ? 0 : e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: e.isMobile ? "210px" : "430px",
+      "&::before": e.finalImage ? {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      } : {}
+    },
+    // Headline section without image
+    headlineSectionNoImage: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      flex: e.isMobile ? "1" : "0 0 50%",
+      width: e.isMobile ? "100%" : "50%",
+      minWidth: e.isMobile ? "100%" : "50%",
+      maxWidth: e.isMobile ? "100%" : "50%",
+      borderTopLeftRadius: e.borderRadius.md,
+      borderTopRightRadius: e.isMobile ? e.borderRadius.md : 0,
+      borderBottomLeftRadius: e.isMobile ? 0 : e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: e.isMobile ? "210px" : "430px",
+      backgroundColor: ((i = e.brandingColors) == null ? void 0 : i.backgroundColor) || e.textColor + "10"
+    },
+    // Embed code headline section (for poll-vote and classic-quiz-play)
+    embedCodeHeadlineSection: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      flex: e.isMobile ? "1" : "0 0 50%",
+      width: e.isMobile ? "100%" : "50%",
+      minWidth: e.isMobile ? "100%" : "50%",
+      maxWidth: e.isMobile ? "100%" : "50%",
+      borderTopLeftRadius: e.borderRadius.md,
+      borderTopRightRadius: e.isMobile ? e.borderRadius.md : 0,
+      borderBottomLeftRadius: e.isMobile ? 0 : e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: e.isMobile ? "210px" : "430px"
+    },
+    // AspectRatio container for embed code
+    aspectRatioContainer: {
+      borderRadius: 0,
+      width: "100%",
+      height: "100%"
+    },
+    // Headline content wrapper
+    headlineContent: {
+      zIndex: 1,
+      height: "100%",
+      p: e.spacingScale.xl,
+      gap: e.spacingScale.xl,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between"
+    },
+    // Embed code headline content (shown in question area when embed code is present)
+    embedCodeHeadlineContent: {
+      px: e.spacingScale.lg,
+      pt: e.spacingScale.lg,
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale.md
+    },
+    // Headline typography (with image background)
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((n = e.brandingColors) == null ? void 0 : n.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Headline typography (without image background)
+    headlineTextNoImage: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: e.secondaryColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title typography (with image background)
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((l = e.brandingColors) == null ? void 0 : l.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Title typography (without image background)
+    titleTextNoImage: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description typography (with image background)
+    descriptionText: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((s = e.brandingColors) == null ? void 0 : s.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description typography (without image background)
+    descriptionTextNoImage: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: e.secondaryColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Question area / content section
+    questionArea: {
+      flex: e.isMobile ? "1" : "0 0 50%",
+      width: e.isMobile ? "100%" : "50%",
+      minWidth: e.isMobile ? "100%" : "50%",
+      maxWidth: e.isMobile ? "100%" : "50%",
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center"
+    }
+  };
+}, ct = ({
+  entity: e,
+  headline: i,
+  finalImage: n,
+  children: l,
+  embedCodeContainerRef: s,
+  hasEmbedCode: r = !1,
+  brandingLogo: m,
+  renderPresentedBy: c,
+  rulesDisplay: p
+}) => {
+  var k, C;
+  const S = Y(), y = Xe(), h = e.type === "poll" || e.type === "match-quiz" ? y : S, R = q(), w = _(), M = A().primary, v = A().secondary, x = U(), I = ((k = e.branding) == null ? void 0 : k.colors) || null, f = ((C = e.branding) == null ? void 0 : C.urls) || null, D = (I == null ? void 0 : I.contentColor) || T().textColor, b = (I == null ? void 0 : I.secondaryColor) || T().textColor, d = (I == null ? void 0 : I.backgroundColor) || T().surfaceVariant, g = R.colorSchemes.dark.textColor, N = J(
+    L.SPLIT
+  ), j = Uo({
+    finalImage: n,
+    spacingScale: w,
+    borderRadius: x,
+    fontFamilyPrimary: M,
+    fontFamilySecondary: v,
+    secondaryColor: b,
+    bgcolor: Re(d || ""),
+    textColor: D,
+    brandingColors: I,
+    darkTextColor: g,
+    imageBackgroundGradient: N,
+    isMobile: h
+  }), W = Ze(
+    f == null ? void 0 : f.primaryUrl,
+    f == null ? void 0 : f.secondaryUrl,
+    "image"
+  ), Z = () => {
+    W && window.open(W, "_blank", "noopener,noreferrer");
+  }, H = (E, $) => W ? typeof window > "u" ? /* @__PURE__ */ o.jsx(
+    t,
+    {
+      component: "a",
+      href: W,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      sx: {
+        ...$,
+        cursor: "pointer",
+        textDecoration: "none"
+      },
+      children: E
+    }
+  ) : /* @__PURE__ */ o.jsx(
+    t,
+    {
+      sx: {
+        ...$,
+        cursor: "pointer"
+      },
+      onClick: Z,
+      children: E
+    }
+  ) : /* @__PURE__ */ o.jsx(t, { sx: $, children: E });
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    r && s ? /* @__PURE__ */ o.jsx(t, { sx: j.embedCodeHeadlineSection, children: /* @__PURE__ */ o.jsx(
+      Te,
+      {
+        ratio: "16/9",
+        sx: j.aspectRatioContainer,
+        slotProps: { content: { sx: { height: "100%" } } },
+        children: /* @__PURE__ */ o.jsx(t, { ref: s })
+      }
+    ) }) : n ? H(
+      /* @__PURE__ */ o.jsxs(t, { sx: j.headlineContent, children: [
+        /* @__PURE__ */ o.jsxs(t, { children: [
+          /* @__PURE__ */ o.jsxs(
+            t,
+            {
+              sx: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: h ? "center" : "flex-start",
+                gap: w["3xs"]
+              },
+              children: [
+                /* @__PURE__ */ o.jsx(a, { sx: j.headlineText, children: i }),
+                /* @__PURE__ */ o.jsx(P, { rulesDisplay: p, rules: e.rules || "" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ o.jsxs(t, { sx: j.contentContainer, children: [
+            /* @__PURE__ */ o.jsx(a, { sx: j.titleText, children: e.title }),
+            /* @__PURE__ */ o.jsx(a, { sx: j.descriptionText, children: z(e.description) })
+          ] })
+        ] }),
+        m && !h && c && /* @__PURE__ */ o.jsx(t, { children: c((I == null ? void 0 : I.contentColor) || g) })
+      ] }),
+      j.headlineSection
+    ) : /* @__PURE__ */ o.jsx(t, { sx: j.headlineSectionNoImage, children: /* @__PURE__ */ o.jsxs(t, { sx: j.headlineContent, children: [
+      /* @__PURE__ */ o.jsxs(t, { children: [
+        /* @__PURE__ */ o.jsxs(
+          t,
+          {
+            sx: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: h ? "center" : "flex-start",
+              gap: w["3xs"]
+            },
+            children: [
+              /* @__PURE__ */ o.jsx(a, { sx: j.headlineTextNoImage, children: i }),
+              /* @__PURE__ */ o.jsx(P, { rulesDisplay: p, rules: e.rules || "" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o.jsxs(t, { sx: j.contentContainer, children: [
+          /* @__PURE__ */ o.jsx(a, { sx: j.titleTextNoImage, children: e.title }),
+          /* @__PURE__ */ o.jsx(a, { sx: j.descriptionTextNoImage, children: z(e.description) })
+        ] })
+      ] }),
+      m && !h && c && /* @__PURE__ */ o.jsx(t, { children: c(D) })
+    ] }) }),
+    /* @__PURE__ */ o.jsxs(t, { sx: j.questionArea, children: [
+      r && s && /* @__PURE__ */ o.jsx(t, { sx: j.embedCodeHeadlineContent, children: /* @__PURE__ */ o.jsxs(t, { children: [
+        /* @__PURE__ */ o.jsxs(
+          t,
+          {
+            sx: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: w["3xs"]
+            },
+            children: [
+              /* @__PURE__ */ o.jsx(
+                a,
+                {
+                  sx: {
+                    ...j.headlineTextNoImage,
+                    textAlign: "center"
+                  },
+                  children: i
+                }
+              ),
+              /* @__PURE__ */ o.jsx(P, { rulesDisplay: p, rules: e.rules || "" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o.jsxs(t, { sx: j.contentContainer, children: [
+          /* @__PURE__ */ o.jsx(
+            a,
+            {
+              sx: {
+                ...j.titleTextNoImage,
+                textAlign: "center"
+              },
+              children: e.title
+            }
+          ),
+          /* @__PURE__ */ o.jsx(
+            a,
+            {
+              sx: {
+                ...j.descriptionTextNoImage,
+                textAlign: "center"
+              },
+              children: z(e.description)
+            }
+          )
+        ] })
+      ] }) }),
+      l
+    ] })
+  ] });
+}, Go = (e) => {
+  var i;
+  return {
+    // Main container with background overlay
+    mainContainer: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "40px",
+      p: e.spacingScale.xl,
+      boxShadow: "md",
+      border: (i = e.brandingColors) != null && i.borderColor ? `${e.borderSize} solid ${e.brandingColors.borderColor}` : "none",
+      overflow: "hidden",
+      backgroundImage: e.backgroundImage,
+      backgroundPosition: "center",
+      backgroundSize: "cover",
+      position: "relative",
+      borderRadius: e.mdBorderRadius,
+      minHeight: "250px",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        background: e.imageBackgroundGradient,
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        borderRadius: "inherit",
+        zIndex: 0
+      }
+    },
+    // Headline section wrapper
+    headlineSection: {
+      display: "flex",
+      justifyContent: "space-between",
+      flex: "1 0 0",
+      alignSelf: "stretch"
+    },
+    // Headline content container
+    headlineContent: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "flex-start",
+      flex: "1 0 0",
+      gap: "16px"
+    },
+    // Headline content with z-index
+    headlineContentInner: {
+      zIndex: 10
+    },
+    // Headline typography
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textAlign: { xs: "center", md: "left" },
+      color: e.secondaryColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      fontSize: "0.75em"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title typography
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      textAlign: { xs: "center", md: "left" },
+      fontSize: "1.5em",
+      color: e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Description typography
+    descriptionText: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      textAlign: { xs: "center", md: "left" },
+      color: e.secondaryColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Main content section
+    mainContentSection: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "24px"
+    }
+  };
+}, dt = ({
+  entity: e,
+  headline: i,
+  finalImage: n,
+  children: l,
+  rulesDisplay: s
+}) => {
+  var r, m;
+  const c = q(), p = _(), k = J(
+    L.OVERLAY
+  ), C = ((r = e.branding) == null ? void 0 : r.colors) || null, S = (C == null ? void 0 : C.contentColor) || c.colorSchemes.dark.textColor, y = c.customFontFamily.dark.primary, h = c.customFontFamily.dark.secondary, R = c.customRadius.dark.md, w = (m = c.border) == null ? void 0 : m.dark.size, M = c.colorSchemes.dark.textColor, v = Je(n), x = Go({
+    spacingScale: p,
+    brandingColors: C,
+    secondaryColor: S,
+    fontFamilyPrimary: y,
+    fontFamilySecondary: h,
+    mdBorderRadius: R,
+    borderSize: w,
+    backgroundImage: v,
+    darkTextColor: M,
+    imageBackgroundGradient: k
+  });
+  return /* @__PURE__ */ o.jsxs(t, { sx: x.mainContainer, children: [
+    /* @__PURE__ */ o.jsx(t, { children: /* @__PURE__ */ o.jsx(t, { sx: x.headlineSection, children: /* @__PURE__ */ o.jsx(t, { sx: x.headlineContent, children: /* @__PURE__ */ o.jsxs(t, { sx: x.headlineContentInner, children: [
+      /* @__PURE__ */ o.jsxs(
+        t,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            gap: p["3xs"]
+          },
+          children: [
+            /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: x.headlineText, children: i }),
+            /* @__PURE__ */ o.jsx(
+              P,
+              {
+                rulesDisplay: s,
+                isOverlayVariant: !0,
+                rules: e.rules || ""
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ o.jsxs(t, { sx: x.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "h4", sx: x.titleText, children: e.title }),
+        e.description && /* @__PURE__ */ o.jsx(a, { level: "body-lg", sx: x.descriptionText, children: z(e.description) })
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ o.jsx(t, { sx: x.mainContentSection, children: l })
+  ] });
+}, qo = (e) => {
+  var i, n, l;
+  return {
+    // Wrapper container for the entire split layout
+    wrapper: {
+      display: "flex",
+      flexDirection: e.isMobile || e.isLarge && !e.alwaysShowImage || e.alwaysShowImage && e.isLarge ? "column" : "row",
+      width: "100%"
+    },
+    // Desktop image section with background image and overlay
+    desktopImageSection: {
+      display: e.isLarge && !e.alwaysShowImage ? "none" : "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      flex: e.isMobile || e.isLarge && e.alwaysShowImage ? "1" : "0 0 50%",
+      width: e.isMobile || e.isLarge && e.alwaysShowImage ? "100%" : "50%",
+      minWidth: e.isMobile || e.isLarge && e.alwaysShowImage ? "100%" : "50%",
+      maxWidth: e.isMobile || e.isLarge && e.alwaysShowImage ? "100%" : "50%",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: e.isTabulated ? 0 : e.borderRadius.md,
+      borderTopRightRadius: e.isMobile || e.isLarge && e.alwaysShowImage ? e.isTabulated ? 0 : e.borderRadius.md : 0,
+      borderBottomLeftRadius: e.isMobile || e.isLarge && e.alwaysShowImage ? 0 : e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: e.isMobile || e.isLarge && e.alwaysShowImage ? "210px" : "430px",
+      maxHeight: e.isMobile || e.isLarge && e.alwaysShowImage ? "auto" : "100%",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      }
+    },
+    // Image section content wrapper
+    imageSectionContent: {
+      zIndex: 1,
+      height: "100%",
+      p: e.spacingScale.xl,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: e.spacingScale.xl
+    },
+    // Headline text
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((i = e.brandingColors) == null ? void 0 : i.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: e.isLarge ? "center" : "left"
+    },
+    // Content container (title + description)
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title text
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((n = e.brandingColors) == null ? void 0 : n.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isLarge ? "center" : "left"
+    },
+    // Description text
+    descriptionText: {
+      fontWeight: 500,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((l = e.brandingColors) == null ? void 0 : l.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isLarge ? "center" : "left"
+    },
+    // Presented by desktop container
+    presentedByDesktop: {
+      display: "block"
+    },
+    // Question/Content area (right side on desktop, below image on mobile)
+    questionArea: {
+      flex: e.isMobile || e.isLarge && !e.alwaysShowImage || e.alwaysShowImage && e.isLarge ? "1" : "0 0 50%",
+      width: e.isMobile || e.isLarge && !e.alwaysShowImage || e.alwaysShowImage && e.isLarge ? "100%" : "50%",
+      minWidth: e.isMobile || e.isLarge && !e.alwaysShowImage || e.alwaysShowImage && e.isLarge ? "100%" : "50%",
+      maxWidth: e.isMobile || e.isLarge && !e.alwaysShowImage || e.alwaysShowImage && e.isLarge ? "100%" : "50%",
+      display: "flex",
+      flexDirection: "column"
+    }
+  };
+}, pt = ({
+  entity: e,
+  headline: i,
+  finalImage: n,
+  brandingContent: l,
+  children: s,
+  isTabulated: r = !1,
+  alwaysShowImage: m = !1,
+  rulesDisplay: c
+}) => {
+  var p;
+  const k = Y(), C = Xe(), S = q(), y = _(), h = A().primary, R = A().secondary, w = U(), M = J(
+    L.SPLIT
+  ), v = ((p = e.branding) == null ? void 0 : p.colors) || null, x = qo({
+    finalImage: n,
+    spacingScale: y,
+    borderRadius: w,
+    fontFamilyPrimary: h,
+    fontFamilySecondary: R,
+    brandingColors: v,
+    darkTextColor: S.colorSchemes.dark.textColor,
+    imageBackgroundGradient: M,
+    isMobile: k,
+    isLarge: C,
+    isTabulated: r,
+    alwaysShowImage: m
+  });
+  return /* @__PURE__ */ o.jsxs(t, { sx: x.wrapper, children: [
+    /* @__PURE__ */ o.jsx(t, { sx: x.desktopImageSection, children: /* @__PURE__ */ o.jsxs(t, { sx: x.imageSectionContent, children: [
+      /* @__PURE__ */ o.jsxs(t, { children: [
+        /* @__PURE__ */ o.jsxs(
+          t,
+          {
+            sx: {
+              display: "flex",
+              alignItems: "center",
+              gap: y["3xs"]
+            },
+            children: [
+              /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: x.headlineText, children: i }),
+              /* @__PURE__ */ o.jsx(P, { rulesDisplay: c, rules: e.rules || "" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o.jsxs(t, { sx: x.contentContainer, children: [
+          /* @__PURE__ */ o.jsx(a, { level: "body-lg", sx: x.titleText, children: e.title }),
+          /* @__PURE__ */ o.jsx(a, { level: "body-md", sx: x.descriptionText, children: z(e.description) })
+        ] })
+      ] }),
+      /* @__PURE__ */ o.jsx(t, { sx: x.presentedByDesktop, children: l })
+    ] }) }),
+    /* @__PURE__ */ o.jsx(t, { sx: x.questionArea, children: s })
+  ] });
+}, Yo = (e) => {
+  var i, n, l;
+  return {
+    // Mobile headline with image background
+    mobileHeadlineWithImage: {
+      display: e.isMobile ? "flex" : "none",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: "5px",
+      borderTopRightRadius: "5px",
+      position: "relative",
+      minHeight: "210px",
+      overflow: "hidden",
+      height: "auto",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      }
+    },
+    // Content inside mobile headline with image
+    mobileHeadlineContent: {
+      zIndex: 1,
+      height: "100%",
+      p: e.spacingScale.xl,
+      gap: e.spacingScale["2xl"],
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between"
+    },
+    // Mobile headline without image
+    mobileHeadlineWithoutImage: {
+      display: e.isMobile ? "flex" : "none",
+      flex: "0.5",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      p: e.spacingScale.lg,
+      gap: e.spacingScale["2xl"]
+    },
+    // Headline typography (mobile with image)
+    headlineTypographyMobileImage: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((i = e.brandingColors) == null ? void 0 : i.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: "center"
+    },
+    // Headline typography (mobile without image & desktop)
+    headlineTypography: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textTransform: "uppercase",
+      fontSize: "0.75em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilySecondary,
+      textAlign: "center"
+    },
+    // Title typography (mobile with image)
+    titleTypographyMobileImage: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((n = e.brandingColors) == null ? void 0 : n.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Title typography (mobile without image & desktop)
+    titleTypography: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description typography (mobile with image)
+    descriptionTypographyMobileImage: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((l = e.brandingColors) == null ? void 0 : l.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Description typography (mobile without image & desktop)
+    descriptionTypography: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Desktop title typography (centered)
+    titleTypographyDesktop: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Desktop description typography (centered)
+    descriptionTypographyDesktop: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Image container (left position)
+    imageContainerLeft: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      borderTopLeftRadius: e.borderRadius.md,
+      borderBottomLeftRadius: e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative"
+    },
+    // Image container (right position)
+    imageContainerRight: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      borderTopRightRadius: "5px",
+      borderBottomRightRadius: "5px",
+      overflow: "hidden",
+      height: "auto",
+      position: "relative"
+    },
+    // Main content area
+    mainContentArea: {
+      flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
+      // display: props.isMobile ? "block" : "flex",
+      display: "flex",
+      flexDirection: "column",
+      p: e.spacingScale.md,
+      gap: e.isMobile ? e.spacingScale.md : e.spacingScale.lg
+    },
+    // Desktop headline container
+    desktopHeadlineContainer: {
+      display: e.isMobile ? "none" : "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: e.spacingScale["2xl"],
+      textAlign: "center"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Question area
+    questionArea: {
+      display: "flex",
+      flexDirection: "column",
+      px: e.spacingScale.md
+    },
+    // Question container
+    questionContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.isMobile ? e.spacingScale.md : e.spacingScale.lg
+    },
+    // Alert container
+    alertContainer: {
+      // py: props.spacingScale.md,
+      display: "flex",
+      flexDirection: "column",
+      backdropFilter: "blur(4px)"
+    },
+    image: {
+      width: "100%",
+      height: "100%",
+      objectFit: "cover"
+    },
+    // CTA container
+    ctaContainer: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center"
+    },
+    // CTA content wrapper
+    ctaContentWrapper: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: e.spacingScale.lg
+    },
+    // Buttons container
+    buttonsContainer: {
+      display: "flex",
+      flexDirection: e.isMobile ? "column" : "row",
+      gap: e.spacingScale.md
+    },
+    // Try again button
+    tryAgainButton: {
+      display: "flex",
+      py: e.spacingScale.xs,
+      px: "16px",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      borderRadius: e.borderRadius.xl,
+      border: e.borderSize + " solid " + e.primaryColor,
+      bgcolor: e.buttonBgColor,
+      "&:hover": {
+        bgcolor: e.onSurfaceColor,
+        borderColor: e.primaryColor
+      },
+      fontSize: "0.8125em"
+    },
+    // Try again button content
+    tryAgainButtonContent: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      alignSelf: "stretch"
+    },
+    // Try again icon
+    tryAgainIcon: {
+      display: "flex",
+      width: "16px",
+      height: "16px",
+      justifyContent: "flex-end",
+      alignItems: "center",
+      color: e.textPrimary
+    },
+    // Try again text
+    tryAgainText: {
+      color: e.textPrimary,
+      textAlign: "center",
+      fontFamily: e.fontFamilyPrimary,
+      fontSize: "0.8125em",
+      fontStyle: "normal",
+      fontWeight: 500,
+      lineHeight: "22px",
+      letterSpacing: "0.46px",
+      textTransform: "uppercase"
+    },
+    // Presented by container
+    presentedByContainer: {
+      px: e.spacingScale.md
+    }
+  };
+}, Me = we(/* @__PURE__ */ o.jsx("path", {
+  d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8"
+}), "Replay"), xt = (e) => {
+  var i;
+  const n = ((i = e.entity.branding) == null ? void 0 : i.colors) || null, l = q(), s = Y(), r = ke(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : ""
+    },
+    L.STANDARD
+  ), m = _(), c = A().primary, p = A().secondary, k = U(), C = (n == null ? void 0 : n.contentColor) || T().textColor, S = T().textPrimary, y = (n == null ? void 0 : n.primaryColor) || T().palette.primary.plainColor, h = (n == null ? void 0 : n.secondaryColor) || T().textColor, R = Io().size, w = T().surface, M = T().onSurface, v = J(
+    L.STANDARD
+  ), { t: x } = ie(), I = e.imagePosition || "left", f = "60%", D = e.isApiError ? x("common.error.title") : x("common.authentication.accessRequired"), b = e.isApiError ? e.apiErrorMessage || x("common.error.message") : x("common.authentication.invalidOrMissingAuth"), d = Yo({
+    finalImage: r,
+    spacingScale: m,
+    borderRadius: k,
+    fontFamilyPrimary: c,
+    fontFamilySecondary: p,
+    textColor: C,
+    secondaryColor: h,
+    brandingColors: n,
+    darkTextColor: l.colorSchemes.dark.textColor,
+    opacity: f,
+    imageBackgroundGradient: v,
+    textPrimary: S,
+    primaryColor: y,
+    borderSize: R,
+    buttonBgColor: w,
+    onSurfaceColor: M,
+    isMobile: s
+  }), g = () => e.isApiError ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    /* @__PURE__ */ o.jsx(t, { sx: d.ctaContainer, children: /* @__PURE__ */ o.jsx(t, { sx: d.ctaContentWrapper, children: /* @__PURE__ */ o.jsx(t, { sx: d.buttonsContainer, children: /* @__PURE__ */ o.jsx(X, { sx: d.tryAgainButton, onClick: e.toggleTryAgain, children: /* @__PURE__ */ o.jsxs(t, { sx: d.tryAgainButtonContent, children: [
+      /* @__PURE__ */ o.jsx(Me, { sx: d.tryAgainIcon }),
+      /* @__PURE__ */ o.jsx(a, { sx: d.tryAgainText, children: e.tryAgainButtonText })
+    ] }) }) }) }) }),
+    /* @__PURE__ */ o.jsx(t, { sx: d.presentedByContainer, children: e.renderPresentedBy(C) })
+  ] }) : /* @__PURE__ */ o.jsx(o.Fragment, {});
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    r ? /* @__PURE__ */ o.jsx(t, { sx: d.mobileHeadlineWithImage, children: /* @__PURE__ */ o.jsx(t, { sx: d.mobileHeadlineContent, children: /* @__PURE__ */ o.jsxs(t, { children: [
+      /* @__PURE__ */ o.jsxs(t, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+        /* @__PURE__ */ o.jsx(
+          a,
+          {
+            level: "body-sm",
+            sx: d.headlineTypographyMobileImage,
+            children: e.headline
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          P,
+          {
+            rulesDisplay: e.rulesDisplay,
+            rules: e.entity.rules || ""
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o.jsxs(t, { sx: d.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(
+          a,
+          {
+            level: "body-lg",
+            sx: d.titleTypographyMobileImage,
+            children: e.entity.title
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          a,
+          {
+            level: "body-md",
+            sx: d.descriptionTypographyMobileImage,
+            children: z(e.entity.description)
+          }
+        )
+      ] })
+    ] }) }) }) : /* @__PURE__ */ o.jsx(t, { sx: d.mobileHeadlineWithoutImage, children: /* @__PURE__ */ o.jsxs(t, { children: [
+      /* @__PURE__ */ o.jsxs(t, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: d.headlineTypography, children: e.headline }),
+        /* @__PURE__ */ o.jsx(
+          P,
+          {
+            rulesDisplay: e.rulesDisplay,
+            rules: e.entity.rules || ""
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o.jsxs(t, { sx: d.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "h4", sx: d.titleTypography, children: e.entity.title }),
+        /* @__PURE__ */ o.jsx(a, { level: "body-md", sx: d.descriptionTypography, children: z(e.entity.description) })
+      ] })
+    ] }) }),
+    r && I === "left" && /* @__PURE__ */ o.jsx(t, { sx: d.imageContainerLeft, children: /* @__PURE__ */ o.jsx(
+      "img",
+      {
+        src: r,
+        alt: "illustration",
+        style: d.image
+      }
+    ) }),
+    /* @__PURE__ */ o.jsxs(t, { sx: d.mainContentArea, children: [
+      /* @__PURE__ */ o.jsx(t, { sx: { px: m.md }, children: /* @__PURE__ */ o.jsx(t, { sx: d.desktopHeadlineContainer, children: /* @__PURE__ */ o.jsxs(
+        t,
+        {
+          sx: {
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center"
+          },
+          children: [
+            /* @__PURE__ */ o.jsxs(t, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+              /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: d.headlineTypography, children: e.headline }),
+              /* @__PURE__ */ o.jsx(
+                P,
+                {
+                  rulesDisplay: e.rulesDisplay,
+                  rules: e.entity.rules || ""
+                }
+              )
+            ] }),
+            /* @__PURE__ */ o.jsxs(t, { sx: d.contentContainer, children: [
+              /* @__PURE__ */ o.jsx(a, { level: "h4", sx: d.titleTypographyDesktop, children: e.entity.title }),
+              /* @__PURE__ */ o.jsx(
+                a,
+                {
+                  level: "body-md",
+                  sx: d.descriptionTypographyDesktop,
+                  children: z(e.entity.description)
+                }
+              )
+            ] })
+          ]
+        }
+      ) }) }),
+      /* @__PURE__ */ o.jsx(t, { sx: d.questionArea, children: /* @__PURE__ */ o.jsxs(t, { sx: d.questionContainer, children: [
+        /* @__PURE__ */ o.jsx(t, { sx: d.alertContainer, children: /* @__PURE__ */ o.jsx(
+          Ie,
+          {
+            variant: "error",
+            title: D,
+            message: b
+          }
+        ) }),
+        e.isApiError ? /* @__PURE__ */ o.jsx(o.Fragment, {}) : e.renderPresentedBy(C)
+      ] }) }),
+      g()
+    ] }),
+    r && I === "right" && /* @__PURE__ */ o.jsx(t, { sx: d.imageContainerRight, children: /* @__PURE__ */ o.jsx(
+      "img",
+      {
+        src: r,
+        alt: "illustration",
+        style: d.image
+      }
+    ) })
+  ] });
+}, Jo = (e) => {
+  var i, n, l;
+  return {
+    // Main headline section with background image
+    headlineSection: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      flex: "0.5",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: e.mdBorderRadius,
+      borderTopRightRadius: e.isMobile ? e.mdBorderRadius : 0,
+      borderBottomLeftRadius: e.isMobile ? 0 : e.mdBorderRadius,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative",
+      minHeight: e.isMobile ? "210px" : "430px",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      }
+    },
+    // Headline content wrapper
+    headlineContent: {
+      zIndex: 1,
+      height: "100%",
+      p: e.spacingScale.xl,
+      gap: e.spacingScale.xl,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between"
+    },
+    // Headline text
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((i = e.brandingColors) == null ? void 0 : i.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title text
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((n = e.brandingColors) == null ? void 0 : n.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description text
+    descriptionText: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((l = e.brandingColors) == null ? void 0 : l.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Presented by desktop container
+    presentedByDesktop: {
+      display: e.isMobile ? "none" : "block"
+    },
+    // Question area (error section)
+    questionArea: {
+      flex: "0.5",
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      gap: e.spacingScale.md,
+      p: e.spacingScale.lg
+    },
+    // Presented by mobile container
+    presentedByMobile: {
+      display: e.isMobile ? "block" : "none"
+    },
+    // CTA container
+    ctaContainer: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center"
+    },
+    // CTA content wrapper
+    ctaContentWrapper: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: e.spacingScale.lg
+    },
+    // Buttons container
+    buttonsContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "16px"
+    },
+    // Try again button
+    tryAgainButton: {
+      display: "flex",
+      py: e.spacingScale.xs,
+      px: "16px",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      borderRadius: e.borderRadius.xl,
+      color: e.textPrimary,
+      bgcolor: e.surfaceColor,
+      "&:hover": {
+        bgcolor: e.onSurfaceColor
+      },
+      fontSize: "0.9375em"
+    },
+    // Try again button content
+    tryAgainButtonContent: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      alignSelf: "stretch"
+    },
+    // Try again icon
+    tryAgainIcon: {
+      display: "flex",
+      width: "16px",
+      height: "16px",
+      justifyContent: "flex-end",
+      alignItems: "center",
+      color: e.textPrimary
+    },
+    // Try again text
+    tryAgainText: {
+      color: e.textPrimary,
+      textAlign: "center",
+      fontFamily: e.fontFamilyPrimary,
+      fontSize: "0.8125em",
+      fontStyle: "normal",
+      fontWeight: 500,
+      lineHeight: "22px",
+      letterSpacing: "0.46px",
+      textTransform: "uppercase"
+    }
+  };
+}, gt = (e) => {
+  var i;
+  const n = q(), l = Y(), s = ((i = e.entity.branding) == null ? void 0 : i.colors) || null, r = ke(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: e.defaultImagePlaceholderUrl || ""
+    },
+    L.SPLIT
+  ), { t: m } = ie(), c = T().textPrimary, p = T().surface, k = T().onSurface, C = (s == null ? void 0 : s.backgroundColor) || T().surfaceVariant, S = U(), y = A().secondary, h = A().primary, R = U().md, w = T().textColor, M = _(), v = J(
+    L.SPLIT
+  ), x = e.isApiError ? m("common.error.title") : m("common.authentication.accessRequired"), I = e.isApiError ? e.apiErrorMessage || m("common.error.message") : m("common.authentication.invalidOrMissingAuth"), f = Jo({
+    finalImage: r,
+    spacingScale: M,
+    borderRadius: U(),
+    fontFamilyPrimary: h,
+    fontFamilySecondary: y,
+    mdBorderRadius: R,
+    brandingColors: s,
+    darkTextColor: n.colorSchemes.dark.textColor,
+    imageBackgroundGradient: v,
+    textPrimary: c,
+    surfaceColor: p,
+    onSurfaceColor: k,
+    isMobile: l
+  }), D = () => e.isApiError ? /* @__PURE__ */ o.jsx(
+    t,
+    {
+      sx: {
+        p: M.lg,
+        gap: M.lg,
+        display: "flex",
+        flexDirection: "column",
+        backdropFilter: "blur(4px)",
+        bgcolor: `rgba(${C ? Re(C || "").replace(/[^\d,]/g, "") : ""}, 0.5)`,
+        borderRadius: S.sm
+      },
+      children: /* @__PURE__ */ o.jsx(t, { sx: f.ctaContainer, children: /* @__PURE__ */ o.jsx(t, { sx: f.ctaContentWrapper, children: /* @__PURE__ */ o.jsx(t, { sx: f.buttonsContainer, children: /* @__PURE__ */ o.jsx(X, { sx: f.tryAgainButton, onClick: e.toggleTryAgain, children: /* @__PURE__ */ o.jsxs(t, { sx: f.tryAgainButtonContent, children: [
+        /* @__PURE__ */ o.jsx(Me, { sx: f.tryAgainIcon }),
+        /* @__PURE__ */ o.jsx(a, { sx: f.tryAgainText, children: e.tryAgainButtonText })
+      ] }) }) }) }) })
+    }
+  ) : /* @__PURE__ */ o.jsx(o.Fragment, {});
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    /* @__PURE__ */ o.jsx(t, { sx: f.headlineSection, children: /* @__PURE__ */ o.jsxs(t, { sx: f.headlineContent, children: [
+      /* @__PURE__ */ o.jsxs(t, { children: [
+        /* @__PURE__ */ o.jsxs(t, { sx: { display: "flex", alignItems: "center", gap: M["3xs"] }, children: [
+          /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: f.headlineText, children: e.headline }),
+          /* @__PURE__ */ o.jsx(
+            P,
+            {
+              rulesDisplay: e.rulesDisplay,
+              rules: e.entity.rules || ""
+            }
+          )
+        ] }),
+        /* @__PURE__ */ o.jsxs(t, { sx: f.contentContainer, children: [
+          /* @__PURE__ */ o.jsx(a, { level: "body-lg", sx: f.titleText, children: e.entity.title }),
+          /* @__PURE__ */ o.jsx(a, { level: "body-md", sx: f.descriptionText, children: z(e.entity.description) })
+        ] })
+      ] }),
+      /* @__PURE__ */ o.jsx(t, { sx: f.presentedByDesktop, children: e.renderPresentedBy(
+        (s == null ? void 0 : s.contentColor) || n.colorSchemes.dark.textColor
+      ) })
+    ] }) }),
+    /* @__PURE__ */ o.jsxs(t, { sx: f.questionArea, children: [
+      /* @__PURE__ */ o.jsx(
+        Ie,
+        {
+          variant: "error",
+          title: x,
+          message: I
+        }
+      ),
+      D(),
+      /* @__PURE__ */ o.jsx(t, { sx: f.presentedByMobile, children: e.renderPresentedBy((s == null ? void 0 : s.contentColor) || w) })
+    ] })
+  ] });
+}, Zo = (e) => {
+  var i;
+  return {
+    // Main container with background overlay
+    mainContainer: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "40px",
+      p: e.spacingScale.xl,
+      boxShadow: "md",
+      border: (i = e.brandingColors) != null && i.borderColor ? `${e.borderSize} solid ${e.brandingColors.borderColor}` : "none",
+      overflow: "hidden",
+      backgroundImage: e.backgroundImage,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      position: "relative",
+      borderRadius: e.borderRadius.md,
+      minHeight: "250px",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        background: e.imageBackgroundGradient,
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        borderRadius: "inherit",
+        zIndex: 0
+      }
+    },
+    // Headline section wrapper
+    headlineSection: {
+      display: "flex",
+      justifyContent: "space-between",
+      flex: "1 0 0",
+      alignSelf: "stretch"
+    },
+    // Headline content container
+    headlineContent: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "flex-start",
+      flex: "1 0 0",
+      gap: "16px"
+    },
+    // Headline content with z-index
+    headlineContentInner: {
+      zIndex: 10
+    },
+    // Headline typography
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textAlign: e.isMobile ? "center" : "left",
+      color: e.secondaryColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      fontSize: "0.75em"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Title typography
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      textAlign: e.isMobile ? "center" : "left",
+      fontSize: "1.5em",
+      color: e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Description typography
+    descriptionText: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      textAlign: e.isMobile ? "center" : "left",
+      color: e.secondaryColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Bottom section container
+    bottomSection: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "24px",
+      zIndex: 1
+    },
+    // Footer container
+    footerContainer: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      flexDirection: e.isMobile ? "column-reverse" : "row",
+      gap: e.spacingScale.md
+    },
+    ctaSection: {
+      borderRadius: e.borderRadius.md,
+      py: e.spacingScale.md,
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      alignSelf: "stretch",
+      gap: e.spacingScale.md,
+      backdropFilter: "blur(4px)",
+      position: "relative",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        backgroundColor: e.contentBgColor,
+        opacity: 0.25,
+        borderRadius: "inherit",
+        zIndex: 0,
+        backdropFilter: "blur(4px)"
+      },
+      "& > *": {
+        position: "relative",
+        zIndex: 1
+      }
+    },
+    // Buttons container
+    buttonsContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale.md
+    },
+    // Try again button
+    tryAgainButton: {
+      display: "flex",
+      minHeight: "48px",
+      py: "12px",
+      pr: "24px",
+      pl: "16px",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      borderRadius: e.borderRadius.xl,
+      bgcolor: e.onSurfaceColor,
+      "&:hover": {
+        bgcolor: e.surfaceVariantColor
+      },
+      fontSize: "0.9375em"
+    },
+    // Try again button content
+    tryAgainButtonContent: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      alignSelf: "stretch"
+    },
+    // Try again icon
+    tryAgainIcon: {
+      display: "flex",
+      width: "24px",
+      height: "24px",
+      justifyContent: "center",
+      alignItems: "center",
+      color: e.textPrimary
+    },
+    // Try again text
+    tryAgainText: {
+      color: e.textPrimary,
+      textAlign: "center",
+      fontFamily: e.fontFamilyPrimary,
+      fontSize: "0.9375em",
+      fontStyle: "normal",
+      fontWeight: 500,
+      lineHeight: "24px",
+      letterSpacing: "0.46px",
+      textTransform: "uppercase"
+    }
+  };
+}, mt = (e) => {
+  const i = _(), n = q(), l = Y(), { t: s } = ie(), r = J(
+    L.OVERLAY
+  ), { brandingImage: m, brandingColors: c, brandingLogo: p } = wo(e.entity.branding || null), k = m || ke(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: e.defaultImagePlaceholderUrl || ""
+    },
+    L.OVERLAY
+  ), C = Je(k), S = (c == null ? void 0 : c.contentColor) || n.colorSchemes.dark.textColor, y = n.customFontFamily.dark.primary, h = n.customFontFamily.dark.secondary, R = n.customRadius.dark, w = n.border.dark.size, M = (c == null ? void 0 : c.backgroundColor) || n.colorSchemes.dark.surfaceVariant, v = n.colorSchemes.dark.onSurface, x = n.colorSchemes.dark.surfaceVariant, I = n.colorSchemes.dark.textPrimary, f = e.isApiError ? s("common.error.title") : s("common.authentication.accessRequired"), D = e.isApiError ? e.apiErrorMessage || s("common.error.message") : s("common.authentication.invalidOrMissingAuth"), b = Zo({
+    spacingScale: i,
+    brandingColors: c,
+    secondaryColor: S,
+    fontFamilyPrimary: y,
+    fontFamilySecondary: h,
+    borderRadius: R,
+    borderSize: w,
+    darkTextColor: n.colorSchemes.dark.textColor,
+    backgroundImage: C,
+    imageBackgroundGradient: r,
+    contentBgColor: M,
+    onSurfaceColor: v,
+    surfaceVariantColor: x,
+    textPrimary: I,
+    isMobile: l
+  }), d = () => e.isApiError ? /* @__PURE__ */ o.jsx(t, { sx: b.ctaSection, children: /* @__PURE__ */ o.jsx(t, { sx: b.buttonsContainer, children: /* @__PURE__ */ o.jsx(X, { sx: b.tryAgainButton, onClick: e.toggleTryAgain, children: /* @__PURE__ */ o.jsxs(t, { sx: b.tryAgainButtonContent, children: [
+    /* @__PURE__ */ o.jsx(Me, { sx: b.tryAgainIcon }),
+    /* @__PURE__ */ o.jsx(a, { sx: b.tryAgainText, children: e.tryAgainButtonText })
+  ] }) }) }) }) : /* @__PURE__ */ o.jsx(o.Fragment, {});
+  return /* @__PURE__ */ o.jsxs(t, { sx: b.mainContainer, children: [
+    /* @__PURE__ */ o.jsx(t, { children: /* @__PURE__ */ o.jsx(t, { sx: b.headlineSection, children: /* @__PURE__ */ o.jsx(t, { sx: b.headlineContent, children: /* @__PURE__ */ o.jsxs(t, { sx: b.headlineContentInner, children: [
+      /* @__PURE__ */ o.jsxs(t, { sx: { display: "flex", alignItems: "center", gap: i["3xs"] }, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "body-sm", sx: b.headlineText, children: e.headline }),
+        /* @__PURE__ */ o.jsx(
+          P,
+          {
+            rulesDisplay: e.rulesDisplay,
+            isOverlayVariant: !0,
+            rules: e.entity.rules || ""
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o.jsxs(t, { sx: b.contentContainer, children: [
+        /* @__PURE__ */ o.jsx(a, { level: "h4", sx: b.titleText, children: e.entity.title }),
+        /* @__PURE__ */ o.jsx(a, { level: "body-lg", sx: b.descriptionText, children: z(e.entity.description) })
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ o.jsxs(t, { sx: b.bottomSection, children: [
+      /* @__PURE__ */ o.jsx(
+        Ie,
+        {
+          variant: "error",
+          title: f,
+          message: D
+        }
+      ),
+      d(),
+      p ? /* @__PURE__ */ o.jsx(t, { sx: b.footerContainer, children: e.renderPresentedBy(n.colorSchemes.dark.textColor) }) : /* @__PURE__ */ o.jsx(o.Fragment, {})
+    ] })
+  ] });
+}, ut = ({
+  notFoundTitle: e,
+  notFoundMessage: i
+}) => {
+  var n, l;
+  const s = (l = (n = T().palette) == null ? void 0 : n.danger) == null ? void 0 : l.plainColor, r = T().textSecondary, m = _(), c = A().primary, p = A().secondary;
+  return /* @__PURE__ */ o.jsxs(
+    t,
+    {
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        width: "100%",
+        minHeight: "300px",
+        padding: "32px 24px",
+        textAlign: "center"
+      },
+      children: [
+        /* @__PURE__ */ o.jsx(
+          t,
+          {
+            sx: {
+              width: "80px",
+              height: "80px",
+              borderRadius: "50%",
+              backgroundColor: `${s}15`,
+              // 15% opacity
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              marginBottom: "24px"
+            },
+            children: /* @__PURE__ */ o.jsx(
+              t,
+              {
+                sx: {
+                  fontSize: "32px",
+                  color: s,
+                  fontWeight: "bold",
+                  fontFamily: c
+                },
+                children: "?"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          a,
+          {
+            level: "h4",
+            sx: {
+              color: s,
+              marginBottom: m.xs,
+              fontWeight: "600",
+              fontFamily: c
+            },
+            children: e
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          a,
+          {
+            level: "body-md",
+            sx: {
+              color: r,
+              lineHeight: 1.5,
+              fontFamily: p
+            },
+            children: i
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  ct as B,
+  pt as D,
+  lt as H,
+  xt as L,
+  at as P,
+  je as T,
+  ut as V,
+  dt as W,
+  _o as b,
+  gt as j,
+  Me as l,
+  mt as p,
+  P as v,
+  st as z
+};