@sorayasm/vietri-ds 0.3.1 → 0.3.2

package/dist/index.js

@@ -3,31 +3,31 @@ import p from "@mui/material/Box";
 import b from "@mui/material/Stack";
 import h from "@mui/material/Typography";
 import { default as vt } from "@mui/material/Typography";
-import z from "@mui/material/Button";
+import R from "@mui/material/Button";
 import { default as yt } from "@mui/material/Button";
-import A from "@mui/material/Card";
+import D from "@mui/material/Card";
 import { default as St } from "@mui/material/Card";
-import { default as kt } from "@mui/material/CardActionArea";
-import { default as At } from "@mui/material/CardActions";
-import D from "@mui/material/CardContent";
-import { default as Et } from "@mui/material/CardContent";
+import { default as Bt } from "@mui/material/CardActionArea";
+import { default as Dt } from "@mui/material/CardActions";
+import A from "@mui/material/CardContent";
+import { default as It } from "@mui/material/CardContent";
 import { default as Wt } from "@mui/material/CardMedia";
 import Y from "@mui/material/Chip";
 import { default as $t } from "@mui/material/Chip";
-import { useState as M, useMemo as ie, useId as E, useRef as I, useEffect as q, Children as ne } from "react";
-import B from "@mui/material/IconButton";
+import { useState as M, useMemo as ie, useId as I, useRef as E, useEffect as q, Children as ne } from "react";
+import k from "@mui/material/IconButton";
 import { ArrowRight as ae, Check as J, ChevronDown as le, ChevronLeft as Q, ChevronRight as K, Clock as ce, Copy as Z, Database as de, ExternalLink as H, Globe as se, Info as pe, LayoutGrid as ue, MapPin as he, Menu as me, Music as ee, Network as fe, Play as P, Search as ge, Share2 as be, ShieldCheck as xe, Sparkles as ve, TrendingUp as Fe, Users as ye, X as L } from "lucide-react";
 import Ce from "@mui/material/Table";
 import Se from "@mui/material/TableBody";
 import T from "@mui/material/TableCell";
 import we from "@mui/material/TableContainer";
-import ke from "@mui/material/TableHead";
+import Be from "@mui/material/TableHead";
 import O from "@mui/material/TableRow";
-import Be from "@mui/material/TableSortLabel";
-import Ae from "@mui/material/DialogActions";
-import De from "@mui/material/DialogContent";
-import Ee from "@mui/material/DialogContentText";
-import Ie from "@mui/material/DialogTitle";
+import ke from "@mui/material/TableSortLabel";
+import De from "@mui/material/DialogActions";
+import Ae from "@mui/material/DialogContent";
+import Ie from "@mui/material/DialogContentText";
+import Ee from "@mui/material/DialogTitle";
 import We from "@mui/material/Dialog";
 import re from "@mui/material/Drawer";
 import S from "@mui/material/Link";
@@ -37,34 +37,41 @@ import { useTheme as te, alpha as w, createTheme as $e } from "@mui/material/sty
 import Te from "@mui/material/TextField";
 import { default as Ot } from "@mui/material/TextField";
 import Oe from "@mui/material/ToggleButton";
-import Re from "@mui/material/ToggleButtonGroup";
-import ze from "@mui/material/AppBar";
+import ze from "@mui/material/ToggleButtonGroup";
+import Re from "@mui/material/AppBar";
 import He from "@mui/material/SvgIcon";
 import Pe from "@mui/material/Toolbar";
 import Le from "@mui/material/useMediaQuery";
 import je from "@mui/material/MenuItem";
-import { default as zt } from "@mui/material/Tab";
+import { default as Rt } from "@mui/material/Tab";
 import { default as Pt } from "@mui/material/Tabs";
 import Ne from "@mui/material/ButtonBase";
 function Ge() {
   return /* @__PURE__ */ e(He, { children: /* @__PURE__ */ e("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" }) });
 }
-function _({
+function U({
   link: r,
-  onClick: t
+  onClick: t,
+  accent: o = !1
 }) {
+  const a = !!r.current;
   return /* @__PURE__ */ e(
     S,
     {
       href: r.href,
-      underline: "none",
-      "aria-current": r.current ? "page" : void 0,
+      underline: o ? a ? "always" : "hover" : "none",
+      "aria-current": a ? "page" : void 0,
       onClick: t,
-      sx: {
-        color: r.current ? "text.primary" : "text.secondary",
-        fontWeight: r.current ? 600 : 500,
-        "&:hover": { color: "text.primary" }
-      },
+      sx: (n) => ({
+        color: o ? a ? n.palette.text.primary : n.palette.primary.main : a ? n.palette.text.primary : n.palette.text.secondary,
+        fontWeight: a ? 600 : 500,
+        ...o && a && {
+          textDecorationColor: n.palette.primary.main,
+          textDecorationThickness: 2,
+          textUnderlineOffset: 8
+        },
+        ...!o && { "&:hover": { color: n.palette.text.primary } }
+      }),
       children: r.label
     }
   );
@@ -73,15 +80,16 @@ function Gr({
   brand: r,
   brandHref: t = "/",
   links: o,
-  actions: l,
+  actions: a,
   ariaLabel: n = "Main",
-  menuLabel: a = "Menu",
+  menuLabel: l = "Menu",
   closeLabel: u = "Close menu",
-  maxWidth: f = "lg"
+  maxWidth: f = "lg",
+  accentLinks: c = !1
 }) {
-  const c = te(), i = Le(c.breakpoints.up("md"), { noSsr: !0 }), [s, m] = M(!1), g = () => m(!1);
+  const i = te(), s = Le(i.breakpoints.up("md"), { noSsr: !0 }), [m, g] = M(!1), v = () => g(!1);
   return /* @__PURE__ */ d(
-    ze,
+    Re,
     {
       component: "header",
       position: "sticky",
@@ -114,7 +122,7 @@ function Gr({
                   children: r
                 }
               ),
-              i ? /* @__PURE__ */ d(b, { direction: "row", alignItems: "center", spacing: 4, children: [
+              s ? /* @__PURE__ */ d(b, { direction: "row", alignItems: "center", spacing: 4, children: [
                 /* @__PURE__ */ e(p, { component: "nav", "aria-label": n, children: /* @__PURE__ */ e(
                   b,
                   {
@@ -122,20 +130,20 @@ function Gr({
                     direction: "row",
                     spacing: 4,
                     sx: { listStyle: "none", m: 0, p: 0 },
-                    children: o.map((x) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(_, { link: x }) }, x.href))
+                    children: o.map((x) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(U, { link: x, accent: c }) }, x.href))
                   }
                 ) }),
-                l
+                a
               ] }) : /* @__PURE__ */ d(b, { direction: "row", alignItems: "center", spacing: 1, children: [
-                l,
+                a,
                 /* @__PURE__ */ e(
-                  B,
+                  k,
                   {
                     edge: "end",
-                    color: "inherit",
-                    "aria-label": a,
-                    "aria-expanded": s,
-                    onClick: () => m(!0),
+                    color: c ? "primary" : "inherit",
+                    "aria-label": l,
+                    "aria-expanded": m,
+                    onClick: () => g(!0),
                     children: /* @__PURE__ */ e(Ge, {})
                   }
                 )
@@ -143,15 +151,15 @@ function Gr({
             ]
           }
         ) }),
-        !i && /* @__PURE__ */ e(re, { anchor: "right", open: s, onClose: g, children: /* @__PURE__ */ d(p, { sx: { width: 280, p: 3 }, children: [
-          /* @__PURE__ */ e(b, { alignItems: "flex-end", sx: { mb: 3 }, children: /* @__PURE__ */ e(z, { variant: "text", color: "secondary", onClick: g, children: u }) }),
+        !s && /* @__PURE__ */ e(re, { anchor: "right", open: m, onClose: v, children: /* @__PURE__ */ d(p, { sx: { width: 280, p: 3 }, children: [
+          /* @__PURE__ */ e(b, { alignItems: "flex-end", sx: { mb: 3 }, children: /* @__PURE__ */ e(R, { variant: "text", color: c ? "primary" : "secondary", onClick: v, children: u }) }),
           /* @__PURE__ */ e(p, { component: "nav", "aria-label": n, children: /* @__PURE__ */ e(
             b,
             {
               component: "ul",
               spacing: 3,
               sx: { listStyle: "none", m: 0, p: 0, fontSize: "1.25rem" },
-              children: o.map((x) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(_, { link: x, onClick: g }) }, x.href))
+              children: o.map((x) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(U, { link: x, onClick: v, accent: c }) }, x.href))
             }
           ) })
         ] }) })
@@ -167,24 +175,24 @@ function Vr({
   value: r,
   onChange: t,
   options: o = Ve,
-  ariaLabel: l = "Language"
+  ariaLabel: a = "Language"
 }) {
   return /* @__PURE__ */ e(
-    Re,
+    ze,
     {
       exclusive: !0,
       size: "small",
       value: r,
-      "aria-label": l,
-      onChange: (n, a) => {
-        a !== null && t(a);
+      "aria-label": a,
+      onChange: (n, l) => {
+        l !== null && t(l);
       },
       children: o.map((n) => /* @__PURE__ */ e(Oe, { value: n.value, children: n.label }, n.value))
     }
   );
 }
-function _r({ value: r, label: t, description: o }) {
-  return /* @__PURE__ */ e(A, { children: /* @__PURE__ */ d(D, { children: [
+function Ur({ value: r, label: t, description: o }) {
+  return /* @__PURE__ */ e(D, { children: /* @__PURE__ */ d(A, { children: [
     /* @__PURE__ */ e(h, { variant: "h3", component: "p", children: r }),
     /* @__PURE__ */ e(h, { variant: "body1", sx: { mt: 1 }, children: t }),
     o && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", sx: { mt: 1 }, children: o })
@@ -193,56 +201,56 @@ function _r({ value: r, label: t, description: o }) {
 function oe(r, t) {
   return r[t.key];
 }
-function U(r, t) {
+function _(r, t) {
   if (t.sortValue) return t.sortValue(r);
   const o = oe(r, t);
   return typeof o == "number" ? o : String(o ?? "");
 }
-function _e(r, t) {
+function Ue(r, t) {
   return typeof r == "number" && typeof t == "number" ? r - t : String(r).localeCompare(String(t), void 0, { numeric: !0 });
 }
-function Ur({
+function _r({
   columns: r,
   rows: t,
   getRowKey: o,
-  caption: l,
+  caption: a,
   emptyMessage: n = "No data"
 }) {
-  const [a, u] = M(
+  const [l, u] = M(
     null
   ), f = ie(() => {
-    if (!a) return t;
-    const i = r.find((m) => m.key === a.key);
+    if (!l) return t;
+    const i = r.find((m) => m.key === l.key);
     if (!i) return t;
-    const s = a.direction === "asc" ? 1 : -1;
+    const s = l.direction === "asc" ? 1 : -1;
     return [...t].sort(
-      (m, g) => s * _e(U(m, i), U(g, i))
+      (m, g) => s * Ue(_(m, i), _(g, i))
     );
-  }, [t, r, a]), c = (i) => {
+  }, [t, r, l]), c = (i) => {
     u(
       (s) => s?.key === i && s.direction === "asc" ? { key: i, direction: "desc" } : { key: i, direction: "asc" }
     );
   };
   return /* @__PURE__ */ e(we, { tabIndex: 0, sx: { overflowX: "auto" }, children: /* @__PURE__ */ d(Ce, { children: [
-    l && /* @__PURE__ */ e(
+    a && /* @__PURE__ */ e(
       h,
       {
         component: "caption",
         variant: "body2",
         color: "text.secondary",
         sx: { captionSide: "top", textAlign: "left", pb: 2 },
-        children: l
+        children: a
       }
     ),
-    /* @__PURE__ */ e(ke, { children: /* @__PURE__ */ e(O, { children: r.map((i) => {
-      const s = a?.key === i.key ? a.direction : void 0;
+    /* @__PURE__ */ e(Be, { children: /* @__PURE__ */ e(O, { children: r.map((i) => {
+      const s = l?.key === i.key ? l.direction : void 0;
       return /* @__PURE__ */ e(
         T,
         {
           align: i.align,
           sortDirection: s ?? !1,
           children: i.sortable ? /* @__PURE__ */ e(
-            Be,
+            ke,
             {
               active: s !== void 0,
               direction: s ?? "asc",
@@ -270,9 +278,9 @@ function Xr({
   data: r,
   title: t,
   max: o,
-  formatValue: l = String
+  formatValue: a = String
 }) {
-  const n = o ?? Math.max(0, ...r.map((a) => a.value));
+  const n = o ?? Math.max(0, ...r.map((l) => l.value));
   return /* @__PURE__ */ d(p, { component: "figure", sx: { m: 0 }, children: [
     t && /* @__PURE__ */ e(
       h,
@@ -284,8 +292,8 @@ function Xr({
         children: t
       }
     ),
-    /* @__PURE__ */ e(b, { component: "ul", spacing: 1.5, sx: { listStyle: "none", m: 0, p: 0 }, children: r.map((a) => {
-      const u = n > 0 ? Math.min(100, Math.max(0, a.value / n * 100)) : 0, f = l(a.value);
+    /* @__PURE__ */ e(b, { component: "ul", spacing: 1.5, sx: { listStyle: "none", m: 0, p: 0 }, children: r.map((l) => {
+      const u = n > 0 ? Math.min(100, Math.max(0, l.value / n * 100)) : 0, f = a(l.value);
       return /* @__PURE__ */ d(
         p,
         {
@@ -297,15 +305,15 @@ function Xr({
             columnGap: 2
           },
           children: [
-            /* @__PURE__ */ e(h, { variant: "body2", "aria-hidden": "true", children: a.label }),
+            /* @__PURE__ */ e(h, { variant: "body2", "aria-hidden": "true", children: l.label }),
             /* @__PURE__ */ e(
               p,
               {
                 role: "meter",
-                "aria-label": a.label,
+                "aria-label": l.label,
                 "aria-valuemin": 0,
                 "aria-valuemax": n,
-                "aria-valuenow": a.value,
+                "aria-valuenow": l.value,
                 "aria-valuetext": f,
                 sx: {
                   height: 12,
@@ -333,13 +341,13 @@ function Xr({
             )
           ]
         },
-        a.label
+        l.label
       );
     }) })
   ] });
 }
-function C({ icon: r, label: t, size: o = 18, ...l }) {
-  return t ? /* @__PURE__ */ e(r, { size: o, role: "img", "aria-label": t, ...l }) : /* @__PURE__ */ e(r, { size: o, "aria-hidden": "true", focusable: "false", ...l });
+function C({ icon: r, label: t, size: o = 18, ...a }) {
+  return t ? /* @__PURE__ */ e(r, { size: o, role: "img", "aria-label": t, ...a }) : /* @__PURE__ */ e(r, { size: o, "aria-hidden": "true", focusable: "false", ...a });
 }
 const Yr = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
@@ -368,7 +376,7 @@ const Yr = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   Users: ye,
   X: L
 }, Symbol.toStringTag, { value: "Module" }));
-function Ue({ color: r, dot: t = !1, ...o }) {
+function _e({ color: r, dot: t = !1, ...o }) {
   return /* @__PURE__ */ e(
     Y,
     {
@@ -415,9 +423,9 @@ function qr({
   title: r,
   description: t,
   lines: o = [],
-  links: l = [],
+  links: a = [],
   linksLabel: n = "Footer links",
-  action: a,
+  action: l,
   legal: u,
   externalLabel: f = "(opens in a new tab)"
 }) {
@@ -509,7 +517,7 @@ function qr({
                   ))
                 ] }),
                 /* @__PURE__ */ d(b, { spacing: 2, alignItems: { xs: "flex-start", sm: "flex-end" }, children: [
-                  l.length > 0 && /* @__PURE__ */ e(p, { component: "nav", "aria-label": n, children: /* @__PURE__ */ e(
+                  a.length > 0 && /* @__PURE__ */ e(p, { component: "nav", "aria-label": n, children: /* @__PURE__ */ e(
                     b,
                     {
                       component: "ul",
@@ -518,7 +526,7 @@ function qr({
                       useFlexGap: !0,
                       flexWrap: "wrap",
                       sx: { listStyle: "none", m: 0, p: 0 },
-                      children: l.map((i) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
+                      children: a.map((i) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
                         S,
                         {
                           href: i.href,
@@ -538,7 +546,7 @@ function qr({
                       ) }, i.href))
                     }
                   ) }),
-                  a
+                  l
                 ] })
               ]
             }
@@ -571,10 +579,10 @@ function Jr({
   title: r,
   eyebrow: t,
   description: o,
-  level: l = 2,
+  level: a = 2,
   align: n = "left"
 }) {
-  const a = `h${l}`;
+  const l = `h${a}`;
   return /* @__PURE__ */ d(b, { spacing: 1, sx: { textAlign: n, alignItems: n === "center" ? "center" : "flex-start" }, children: [
     t && /* @__PURE__ */ e(
       h,
@@ -586,7 +594,7 @@ function Jr({
         children: t
       }
     ),
-    /* @__PURE__ */ e(h, { component: a, variant: "h3", children: r }),
+    /* @__PURE__ */ e(h, { component: l, variant: "h3", children: r }),
     o && /* @__PURE__ */ e(h, { variant: "body1", color: "text.secondary", sx: { maxWidth: 680 }, children: o })
   ] });
 }
@@ -594,14 +602,14 @@ function Qr({
   label: r,
   value: t,
   onChange: o,
-  options: l,
+  options: a,
   helperText: n,
-  disabled: a,
+  disabled: l,
   fullWidth: u,
   size: f,
   id: c
 }) {
-  const i = new Map(l.map((s) => [s.value, s]));
+  const i = new Map(a.map((s) => [s.value, s]));
   return /* @__PURE__ */ e(
     Te,
     {
@@ -611,7 +619,7 @@ function Qr({
       value: t,
       onChange: (s) => o(s.target.value),
       helperText: n,
-      disabled: a,
+      disabled: l,
       fullWidth: u,
       size: f,
       slotProps: {
@@ -625,7 +633,7 @@ function Qr({
           }
         }
       },
-      children: l.map((s) => /* @__PURE__ */ d(je, { value: s.value, sx: { gap: 1 }, children: [
+      children: a.map((s) => /* @__PURE__ */ d(je, { value: s.value, sx: { gap: 1 }, children: [
         s.adornment,
         s.label,
         s.count !== void 0 && /* @__PURE__ */ e(h, { component: "span", variant: "caption", color: "text.secondary", sx: { ml: "auto", pl: 2 }, children: s.count })
@@ -637,13 +645,13 @@ function Kr({
   open: r,
   onClose: t,
   title: o,
-  description: l,
+  description: a,
   children: n,
-  actions: a,
+  actions: l,
   closeLabel: u = "Close",
   maxWidth: f = "sm"
 }) {
-  const c = E(), i = E();
+  const c = I(), i = I();
   return /* @__PURE__ */ d(
     We,
     {
@@ -652,11 +660,11 @@ function Kr({
       fullWidth: !0,
       maxWidth: f,
       "aria-labelledby": c,
-      "aria-describedby": l ? i : void 0,
+      "aria-describedby": a ? i : void 0,
       children: [
-        /* @__PURE__ */ e(Ie, { id: c, sx: { pr: 7 }, children: o }),
+        /* @__PURE__ */ e(Ee, { id: c, sx: { pr: 7 }, children: o }),
         /* @__PURE__ */ e(
-          B,
+          k,
           {
             "aria-label": u,
             onClick: t,
@@ -664,11 +672,11 @@ function Kr({
             children: /* @__PURE__ */ e(C, { icon: L })
           }
         ),
-        /* @__PURE__ */ d(De, { children: [
-          l && /* @__PURE__ */ e(Ee, { id: i, sx: { mb: n ? 2 : 0 }, children: l }),
+        /* @__PURE__ */ d(Ae, { children: [
+          a && /* @__PURE__ */ e(Ie, { id: i, sx: { mb: n ? 2 : 0 }, children: a }),
           n
         ] }),
-        a && /* @__PURE__ */ e(Ae, { sx: { px: 3, pb: 2 }, children: a })
+        l && /* @__PURE__ */ e(De, { sx: { px: 3, pb: 2 }, children: l })
       ]
     }
   );
@@ -677,14 +685,14 @@ function Zr({
   open: r,
   onClose: t,
   title: o,
-  eyebrow: l,
+  eyebrow: a,
   children: n,
-  footer: a,
+  footer: l,
   anchor: u = "right",
   width: f = 420,
   closeLabel: c = "Close"
 }) {
-  const i = E();
+  const i = I();
   return /* @__PURE__ */ e(re, { anchor: u, open: r, onClose: t, children: /* @__PURE__ */ d(
     p,
     {
@@ -707,8 +715,8 @@ function Zr({
             alignItems: "center",
             sx: { p: 3, pb: 1 },
             children: [
-              /* @__PURE__ */ e(h, { component: "p", variant: "overline", color: "primary.main", children: l }),
-              /* @__PURE__ */ e(B, { "aria-label": c, onClick: t, edge: "end", children: /* @__PURE__ */ e(C, { icon: L }) })
+              /* @__PURE__ */ e(h, { component: "p", variant: "overline", color: "primary.main", children: a }),
+              /* @__PURE__ */ e(k, { "aria-label": c, onClick: t, edge: "end", children: /* @__PURE__ */ e(C, { icon: L }) })
             ]
           }
         ),
@@ -716,7 +724,7 @@ function Zr({
           /* @__PURE__ */ e(h, { id: i, component: "h2", variant: "h4", sx: { mb: 2 }, children: o }),
           n
         ] }),
-        a && /* @__PURE__ */ e(p, { sx: { p: 3, borderTop: 1, borderColor: "divider" }, children: a })
+        l && /* @__PURE__ */ e(p, { sx: { p: 3, borderTop: 1, borderColor: "divider" }, children: l })
       ]
     }
   ) });
@@ -725,11 +733,11 @@ function et({
   label: r,
   value: t,
   copyLabel: o = "Copy",
-  copiedLabel: l = "Copied!",
+  copiedLabel: a = "Copied!",
   errorLabel: n = "Could not copy",
-  copiedDuration: a = 2e3
+  copiedDuration: l = 2e3
 }) {
-  const [u, f] = M("idle"), c = I(void 0);
+  const [u, f] = M("idle"), c = E(void 0);
   q(() => () => clearTimeout(c.current), []);
   async function i() {
     try {
@@ -737,7 +745,7 @@ function et({
     } catch {
       f("error");
     }
-    clearTimeout(c.current), c.current = setTimeout(() => f("idle"), a);
+    clearTimeout(c.current), c.current = setTimeout(() => f("idle"), l);
   }
   return /* @__PURE__ */ d(b, { spacing: 1.5, children: [
     /* @__PURE__ */ e(h, { component: "p", variant: "overline", color: "text.secondary", children: r }),
@@ -762,15 +770,15 @@ function et({
       }
     ),
     /* @__PURE__ */ e(
-      z,
+      R,
       {
         onClick: i,
         startIcon: /* @__PURE__ */ e(C, { icon: u === "copied" ? J : Z }),
         fullWidth: !0,
-        children: u === "copied" ? l : o
+        children: u === "copied" ? a : o
       }
     ),
-    /* @__PURE__ */ e(N, { role: "status", "aria-live": "polite", children: u === "copied" ? l : u === "error" ? n : "" })
+    /* @__PURE__ */ e(N, { role: "status", "aria-live": "polite", children: u === "copied" ? a : u === "error" ? n : "" })
   ] });
 }
 function rt({ href: r, children: t = "Skip to content" }) {
@@ -802,19 +810,19 @@ function tt({
   title: r,
   eyebrow: t,
   description: o,
-  actions: l,
+  actions: a,
   level: n = 1,
-  align: a = "left",
+  align: l = "left",
   image: u,
   imagePosition: f = "center"
 }) {
-  const c = `h${n}`, i = a === "center", s = !!u;
+  const c = `h${n}`, i = l === "center", s = !!u;
   return /* @__PURE__ */ e(
     p,
     {
       component: "section",
       sx: (m) => {
-        const g = m.vietri.color.scrim, x = m.vietri.gradient.surface, v = `linear-gradient(0deg, ${g} 0%, ${w(g, 0)} 28%)`, V = `url(${JSON.stringify(u ?? "")})`;
+        const g = m.vietri.color.scrim, v = m.vietri.gradient.surface, x = `linear-gradient(0deg, ${g} 0%, ${w(g, 0)} 18%)`, V = `url(${JSON.stringify(u ?? "")})`;
         return {
           display: "flex",
           alignItems: "center",
@@ -824,13 +832,13 @@ function tt({
           ...s ? {
             // Layers, from top to bottom: dark layer, bottom fade, photo, surface.
             backgroundImage: {
-              xs: `linear-gradient(${w(g, 0.88)}, ${w(g, 0.88)}), ${v}, ${V}, ${x}`,
-              md: `linear-gradient(90deg, ${w(g, 0.92)} 0%, ${w(g, 0.86)} 62%, ${w(g, 0.25)} 100%), ${v}, ${V}, ${x}`
+              xs: `linear-gradient(${w(g, 0.8)}, ${w(g, 0.8)}), ${x}, ${V}, ${v}`,
+              md: `linear-gradient(90deg, ${w(g, 0.84)} 0%, ${w(g, 0.74)} 62%, ${w(g, 0.1)} 100%), ${x}, ${V}, ${v}`
             },
             backgroundSize: "cover",
             backgroundPosition: f,
             backgroundRepeat: "no-repeat"
-          } : { background: x },
+          } : { background: v },
           // Focus ring and secondary buttons that stay visible on a dark surface.
           "& a:focus-visible, & button:focus-visible": {
             outline: "2px solid",
@@ -849,8 +857,8 @@ function tt({
           spacing: 2,
           sx: {
             alignItems: i ? "center" : "flex-start",
-            textAlign: a,
-            // With an image the text stays in the left 60%, where the dark layer is strongest.
+            textAlign: l,
+            // With an image the text stays in the left 60%, where the dark layer is at its strongest.
             ...s && { maxWidth: { md: "60%" }, ...i && { mx: "auto" } }
           },
           children: [
@@ -875,7 +883,7 @@ function tt({
                 children: o
               }
             ),
-            l && /* @__PURE__ */ e(
+            a && /* @__PURE__ */ e(
               b,
               {
                 direction: "row",
@@ -883,7 +891,7 @@ function tt({
                 useFlexGap: !0,
                 flexWrap: "wrap",
                 sx: { pt: 2, justifyContent: i ? "center" : "flex-start" },
-                children: l
+                children: a
               }
             )
           ]
@@ -896,11 +904,11 @@ function ot({
   icon: r,
   title: t,
   description: o,
-  level: l = 3,
+  level: a = 3,
   children: n
 }) {
-  const a = `h${l}`;
-  return /* @__PURE__ */ e(A, { sx: { height: "100%" }, children: /* @__PURE__ */ d(D, { children: [
+  const l = `h${a}`;
+  return /* @__PURE__ */ e(D, { sx: { height: "100%" }, children: /* @__PURE__ */ d(A, { children: [
     /* @__PURE__ */ e(
       p,
       {
@@ -917,13 +925,13 @@ function ot({
         children: /* @__PURE__ */ e(C, { icon: r, size: 22 })
       }
     ),
-    /* @__PURE__ */ e(h, { component: a, variant: "h6", gutterBottom: !0, children: t }),
+    /* @__PURE__ */ e(h, { component: l, variant: "h6", gutterBottom: !0, children: t }),
     o && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", children: o }),
     n && /* @__PURE__ */ e(p, { sx: { mt: 2 }, children: n })
   ] }) });
 }
 function it({ steps: r, level: t = 3, ariaLabel: o }) {
-  const l = `h${t}`;
+  const a = `h${t}`;
   return /* @__PURE__ */ e(
     p,
     {
@@ -941,7 +949,7 @@ function it({ steps: r, level: t = 3, ariaLabel: o }) {
           md: `repeat(${Math.max(r.length, 1)}, minmax(0, 1fr))`
         }
       },
-      children: r.map((n, a) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(b, { spacing: 1, children: [
+      children: r.map((n, l) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(b, { spacing: 1, children: [
         /* @__PURE__ */ e(
           p,
           {
@@ -956,17 +964,17 @@ function it({ steps: r, level: t = 3, ariaLabel: o }) {
               bgcolor: u.palette.primary.main,
               color: u.palette.primary.contrastText
             }),
-            children: a + 1
+            children: l + 1
           }
         ),
-        /* @__PURE__ */ e(h, { component: l, variant: "h6", children: n.title }),
+        /* @__PURE__ */ e(h, { component: a, variant: "h6", children: n.title }),
         n.description && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", children: n.description })
       ] }) }, n.title))
     }
   );
 }
 function nt({ entries: r, level: t = 3, ariaLabel: o }) {
-  const l = `h${t}`;
+  const a = `h${t}`;
   return /* @__PURE__ */ e(
     p,
     {
@@ -979,11 +987,11 @@ function nt({ entries: r, level: t = 3, ariaLabel: o }) {
         {
           component: "li",
           id: n.id,
-          sx: (a) => ({
+          sx: (l) => ({
             position: "relative",
             pl: 4,
             pb: 5,
-            scrollMarginTop: a.spacing(10),
+            scrollMarginTop: l.spacing(10),
             // Vertical line between dots.
             "&::before": {
               content: '""',
@@ -992,7 +1000,7 @@ function nt({ entries: r, level: t = 3, ariaLabel: o }) {
               top: 14,
               bottom: 0,
               width: 2,
-              bgcolor: a.palette.divider
+              bgcolor: l.palette.divider
             },
             "&:last-of-type": { pb: 0 },
             "&:last-of-type::before": { display: "none" }
@@ -1002,20 +1010,20 @@ function nt({ entries: r, level: t = 3, ariaLabel: o }) {
               p,
               {
                 "aria-hidden": "true",
-                sx: (a) => ({
+                sx: (l) => ({
                   position: "absolute",
                   left: 0,
                   top: 6,
                   width: 16,
                   height: 16,
                   borderRadius: "50%",
-                  bgcolor: a.palette.primary.main,
-                  border: `3px solid ${a.palette.background.default}`,
+                  bgcolor: l.palette.primary.main,
+                  border: `3px solid ${l.palette.background.default}`,
                   boxSizing: "border-box"
                 })
               }
             ),
-            /* @__PURE__ */ e(h, { component: l, variant: "h5", children: n.label }),
+            /* @__PURE__ */ e(h, { component: a, variant: "h5", children: n.label }),
             n.description && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", sx: { mt: 0.5 }, children: n.description }),
             n.content && /* @__PURE__ */ e(p, { sx: { mt: 2 }, children: n.content })
           ]
@@ -1041,15 +1049,15 @@ function at({
   name: r,
   subtitle: t,
   bio: o,
-  tags: l = [],
+  tags: a = [],
   href: n,
-  onClick: a,
+  onClick: l,
   level: u = 3,
   bioLines: f = 3
 }) {
-  const c = `h${u}`, i = !!(n || a);
+  const c = `h${u}`, i = !!(n || l);
   return /* @__PURE__ */ e(
-    A,
+    D,
     {
       sx: (m) => ({
         position: "relative",
@@ -1062,8 +1070,8 @@ function at({
         },
         "& a:focus-visible, & button:focus-visible": { outline: "none" }
       }),
-      children: /* @__PURE__ */ d(D, { children: [
-        /* @__PURE__ */ e(h, { component: c, variant: "h6", children: n ? /* @__PURE__ */ e(S, { href: n, underline: "none", sx: X, children: r }) : a ? /* @__PURE__ */ e(S, { component: "button", type: "button", onClick: a, underline: "none", sx: X, children: r }) : r }),
+      children: /* @__PURE__ */ d(A, { children: [
+        /* @__PURE__ */ e(h, { component: c, variant: "h6", children: n ? /* @__PURE__ */ e(S, { href: n, underline: "none", sx: X, children: r }) : l ? /* @__PURE__ */ e(S, { component: "button", type: "button", onClick: l, underline: "none", sx: X, children: r }) : r }),
         t && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", children: t }),
         o && /* @__PURE__ */ e(
           h,
@@ -1079,8 +1087,8 @@ function at({
             children: o
           }
         ),
-        l.length > 0 && /* @__PURE__ */ e(b, { direction: "row", spacing: 1, useFlexGap: !0, flexWrap: "wrap", sx: { mt: 2 }, children: l.map(
-          (m) => m.color ? /* @__PURE__ */ e(Ue, { label: m.label, color: m.color }, m.label) : /* @__PURE__ */ e(Y, { label: m.label, size: "small" }, m.label)
+        a.length > 0 && /* @__PURE__ */ e(b, { direction: "row", spacing: 1, useFlexGap: !0, flexWrap: "wrap", sx: { mt: 2 }, children: a.map(
+          (m) => m.color ? /* @__PURE__ */ e(_e, { label: m.label, color: m.color }, m.label) : /* @__PURE__ */ e(Y, { label: m.label, size: "small" }, m.label)
         ) })
       ] })
     }
@@ -1108,9 +1116,9 @@ function lt({
   title: r,
   subtitle: t,
   meta: o,
-  imageUrl: l,
+  imageUrl: a,
   duration: n,
-  badge: a,
+  badge: l,
   href: u,
   onClick: f,
   level: c = 3,
@@ -1119,9 +1127,9 @@ function lt({
 }) {
   const m = `h${c}`, g = !!(u || f);
   return /* @__PURE__ */ d(
-    A,
+    D,
     {
-      sx: (v) => ({
+      sx: (x) => ({
         position: "relative",
         height: "100%",
         overflow: "hidden",
@@ -1129,30 +1137,30 @@ function lt({
         ...g && {
           "&:hover": {
             transform: "scale(1.03)",
-            boxShadow: v.vietri.shadow.lg,
-            borderColor: v.palette.primary.main
+            boxShadow: x.vietri.shadow.lg,
+            borderColor: x.palette.primary.main
           },
           "&:hover .media-card-image": { transform: "scale(1.06)" }
         },
-        ...Xe(v)
+        ...Xe(x)
       }),
       children: [
         /* @__PURE__ */ d(
           p,
           {
-            sx: (v) => ({
+            sx: (x) => ({
               position: "relative",
               aspectRatio: s,
               overflow: "hidden",
-              bgcolor: v.vietri.color.chip
+              bgcolor: x.vietri.color.chip
             }),
             children: [
-              l && /* @__PURE__ */ e(
+              a && /* @__PURE__ */ e(
                 p,
                 {
                   component: "img",
                   className: "media-card-image",
-                  src: l,
+                  src: a,
                   alt: "",
                   loading: "lazy",
                   sx: {
@@ -1184,10 +1192,10 @@ function lt({
                   children: /* @__PURE__ */ e(C, { icon: P, size: 22 })
                 }
               ),
-              a && /* @__PURE__ */ e(
+              l && /* @__PURE__ */ e(
                 p,
                 {
-                  sx: (v) => ({
+                  sx: (x) => ({
                     position: "absolute",
                     top: 8,
                     left: 8,
@@ -1196,10 +1204,10 @@ function lt({
                     borderRadius: 1,
                     fontSize: "0.75rem",
                     fontWeight: 600,
-                    bgcolor: v.vietri.color.action[0],
-                    color: v.vietri.color.onAction
+                    bgcolor: x.vietri.color.action[0],
+                    color: x.vietri.color.onAction
                   }),
-                  children: a
+                  children: l
                 }
               ),
               n && /* @__PURE__ */ e(
@@ -1223,7 +1231,7 @@ function lt({
             ]
           }
         ),
-        /* @__PURE__ */ d(D, { children: [
+        /* @__PURE__ */ d(A, { children: [
           o && /* @__PURE__ */ e(h, { component: "p", variant: "overline", color: "text.secondary", children: o }),
           /* @__PURE__ */ e(h, { component: m, variant: "h6", children: u ? /* @__PURE__ */ e(S, { href: u, underline: "none", sx: W, children: r }) : f ? /* @__PURE__ */ e(S, { component: "button", type: "button", onClick: f, underline: "none", sx: W, children: r }) : r }),
           t && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", children: t })
@@ -1236,19 +1244,19 @@ function ct({
   title: r,
   children: t,
   level: o = 2,
-  itemWidth: l = 280,
+  itemWidth: a = 280,
   previousLabel: n = "Scroll left",
-  nextLabel: a = "Scroll right",
+  nextLabel: l = "Scroll right",
   action: u
 }) {
-  const f = `h${o}`, c = E(), i = I(null), s = ne.toArray(t);
+  const f = `h${o}`, c = I(), i = E(null), s = ne.toArray(t);
   function m(g) {
-    const x = i.current;
-    if (!x) return;
-    const v = typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-    x.scrollBy?.({
-      left: g * x.clientWidth * 0.8,
-      behavior: v ? "auto" : "smooth"
+    const v = i.current;
+    if (!v) return;
+    const x = typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+    v.scrollBy?.({
+      left: g * v.clientWidth * 0.8,
+      behavior: x ? "auto" : "smooth"
     });
   }
   return /* @__PURE__ */ d(p, { component: "section", "aria-labelledby": c, sx: { mb: 4 }, children: [
@@ -1263,8 +1271,8 @@ function ct({
           /* @__PURE__ */ e(h, { id: c, component: f, variant: "h5", children: r }),
           /* @__PURE__ */ d(b, { direction: "row", spacing: 1, alignItems: "center", children: [
             u,
-            /* @__PURE__ */ e(B, { "aria-label": n, onClick: () => m(-1), children: /* @__PURE__ */ e(C, { icon: Q }) }),
-            /* @__PURE__ */ e(B, { "aria-label": a, onClick: () => m(1), children: /* @__PURE__ */ e(C, { icon: K }) })
+            /* @__PURE__ */ e(k, { color: "primary", "aria-label": n, onClick: () => m(-1), children: /* @__PURE__ */ e(C, { icon: Q }) }),
+            /* @__PURE__ */ e(k, { color: "primary", "aria-label": l, onClick: () => m(1), children: /* @__PURE__ */ e(C, { icon: K }) })
           ] })
         ]
       }
@@ -1302,14 +1310,14 @@ function ct({
             component: "ul",
             role: "list",
             sx: { listStyle: "none", m: 0, p: 0, display: "flex", gap: 2 },
-            children: s.map((g, x) => /* @__PURE__ */ e(
+            children: s.map((g, v) => /* @__PURE__ */ e(
               p,
               {
                 component: "li",
-                sx: { flex: `0 0 ${l}px`, scrollSnapAlign: "start" },
+                sx: { flex: `0 0 ${a}px`, scrollSnapAlign: "start" },
                 children: g
               },
-              x
+              v
             ))
           }
         )
@@ -1318,18 +1326,18 @@ function ct({
   ] });
 }
 function Ye(r, t, o) {
-  const l = new URLSearchParams({ rel: "0", modestbranding: "1" });
-  return t && l.set("start", String(Math.floor(t))), o && l.set("autoplay", "1"), `https://www.youtube-nocookie.com/embed/${encodeURIComponent(r)}?${l.toString()}`;
+  const a = new URLSearchParams({ rel: "0", modestbranding: "1" });
+  return t && a.set("start", String(Math.floor(t))), o && a.set("autoplay", "1"), `https://www.youtube-nocookie.com/embed/${encodeURIComponent(r)}?${a.toString()}`;
 }
 function dt({
   videoId: r,
   title: t,
   poster: o,
-  start: l,
+  start: a,
   lazy: n = !0,
-  playLabel: a
+  playLabel: l
 }) {
-  const [u, f] = M(!n), c = I(!1), i = I(null);
+  const [u, f] = M(!n), c = E(!1), i = E(null);
   return q(() => {
     u && c.current && i.current?.focus();
   }, [u]), /* @__PURE__ */ e(
@@ -1347,7 +1355,7 @@ function dt({
         "iframe",
         {
           ref: i,
-          src: Ye(r, l, c.current),
+          src: Ye(r, a, c.current),
           title: t,
           allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
           allowFullScreen: !0,
@@ -1358,7 +1366,7 @@ function dt({
       ) : /* @__PURE__ */ d(
         Ne,
         {
-          "aria-label": a ?? `Play video: ${t}`,
+          "aria-label": l ?? `Play video: ${t}`,
           onClick: () => {
             c.current = !0, f(!0);
           },
@@ -1417,12 +1425,12 @@ function st({
   episodes: r,
   currentId: t,
   onSelect: o,
-  level: l = 3,
+  level: a = 3,
   ariaLabel: n,
-  episodeLabel: a = (f) => `Episode ${f}`,
+  episodeLabel: l = (f) => `Episode ${f}`,
   currentLabel: u = "Now playing"
 }) {
-  const f = `h${l}`;
+  const f = `h${a}`;
   return /* @__PURE__ */ e(
     p,
     {
@@ -1487,7 +1495,7 @@ function st({
               ),
               /* @__PURE__ */ d(p, { sx: { minWidth: 0 }, children: [
                 /* @__PURE__ */ d(h, { component: "p", variant: "overline", color: "text.secondary", children: [
-                  a(c.number),
+                  l(c.number),
                   i && ` · ${u}`
                 ] }),
                 /* @__PURE__ */ e(h, { component: f, variant: "h6", children: m }),
@@ -1519,13 +1527,13 @@ function pt({
   title: r,
   description: t,
   imageUrl: o,
-  platforms: l,
+  platforms: a,
   level: n = 3,
-  platformsLabel: a = "Listen on",
+  platformsLabel: l = "Listen on",
   externalLabel: u = "(opens in a new tab)"
 }) {
   const f = `h${n}`;
-  return /* @__PURE__ */ d(A, { sx: { height: "100%" }, children: [
+  return /* @__PURE__ */ d(D, { sx: { height: "100%" }, children: [
     /* @__PURE__ */ e(
       p,
       {
@@ -1548,22 +1556,22 @@ function pt({
         ) : /* @__PURE__ */ e(C, { icon: ee, size: 48 })
       }
     ),
-    /* @__PURE__ */ d(D, { children: [
+    /* @__PURE__ */ d(A, { children: [
       /* @__PURE__ */ e(h, { component: f, variant: "h6", gutterBottom: !0, children: r }),
       t && /* @__PURE__ */ e(h, { variant: "body2", color: "text.secondary", children: t }),
-      l.length > 0 && /* @__PURE__ */ e(
+      a.length > 0 && /* @__PURE__ */ e(
         b,
         {
           component: "ul",
           role: "list",
-          "aria-label": a,
+          "aria-label": l,
           direction: "row",
           spacing: 1,
           useFlexGap: !0,
           flexWrap: "wrap",
           sx: { listStyle: "none", m: 0, mt: 2, p: 0 },
-          children: l.map((c) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
-            z,
+          children: a.map((c) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
+            R,
             {
               variant: "outlined",
               size: "small",
@@ -1588,14 +1596,14 @@ function pt({
     ] })
   ] });
 }
-function R(r, t, o = 135) {
+function z(r, t, o = 135) {
   return `linear-gradient(${o}deg, ${r} 0%, ${t} 100%)`;
 }
 function Je(r) {
   return {
-    surface: R(...r.surface),
-    action: R(...r.action),
-    actionHover: R(...r.actionHover)
+    surface: z(...r.surface),
+    action: z(...r.action),
+    actionHover: z(...r.actionHover)
   };
 }
 const y = {
@@ -1642,13 +1650,22 @@ const y = {
   MuiButton: {
     defaultProps: { disableElevation: !0 },
     styleOverrides: {
-      root: ({ theme: r }) => ({
-        borderRadius: y.radius.md,
-        "&:focus-visible": {
-          outline: `2px solid ${r.palette.primary.main}`,
-          outlineOffset: 2
-        }
-      }),
+      root: ({ theme: r, ownerState: t }) => {
+        const o = t.variant === "outlined" ? 1 : 0;
+        return {
+          borderRadius: y.radius.md,
+          // A generous "large" button, for the main action of a banner.
+          ...t.size === "large" && {
+            minHeight: 52,
+            padding: `${12 - o}px ${32 - o}px`,
+            fontSize: "1rem"
+          },
+          "&:focus-visible": {
+            outline: `2px solid ${r.palette.primary.main}`,
+            outlineOffset: 2
+          }
+        };
+      },
       // Primary action fill. Flat in most themes, a soft gradient in the
       // Observatory. The text color meets AA at both ends of the fill.
       containedPrimary: ({ theme: r }) => ({
@@ -1834,7 +1851,7 @@ function G(r) {
     }
   });
 }
-const k = (r) => [r, r], rr = {
+const B = (r) => [r, r], rr = {
   error: "#B91C1C",
   warning: "#92400E",
   info: "#0369A1",
@@ -1850,10 +1867,10 @@ const k = (r) => [r, r], rr = {
   onPrimary: "#FFFFFF",
   secondary: "#7A5718",
   onSecondary: "#FFFFFF",
-  action: k("#DBAC5B"),
-  actionHover: k("#FDD07A"),
+  action: B("#DBAC5B"),
+  actionHover: B("#FDD07A"),
   onAction: "#000000",
-  surface: k("#000000"),
+  surface: B("#000000"),
   scrim: "#000000",
   onSurface: "#FFFFFF",
   onSurfaceSoft: "#D4D4D4",
@@ -1882,17 +1899,21 @@ const k = (r) => [r, r], rr = {
   ink: "#FFFFFF",
   inkSoft: "#D5CAEB",
   line: "rgba(255, 255, 255, 0.14)",
-  primary: "#1CDAF3",
+  // Orange as text, outline and focus ring on dark backgrounds (6.3:1 on night, 5.5:1 on cards).
+  primary: "#F4793F",
   onPrimary: "#20123A",
   secondary: "#B99BFF",
   onSecondary: "#20123A",
-  action: k("#1CDAF3"),
-  actionHover: k("#6AE9FA"),
-  onAction: "#20123A",
-  // Violet to lavender. The lavender end is #816CB2 darkened a hair (#7A64AE):
-  // the exact #816CB2 gives white text 4.45:1, just under the 4.5:1 minimum.
-  surface: ["#693BCC", "#7A64AE"],
-  scrim: "#20123A",
+  // Button fill: a burnt orange that holds white text at 4.8:1 (the brand orange gives 3.2:1).
+  action: B("#C8460B"),
+  actionHover: B("#B63F0A"),
+  onAction: "#FFFFFF",
+  // Deep teal to the purple of the cards: dark and calm, with 7:1 or more for white text.
+  // (The earlier violet-to-lavender gradient was bright and had the lowest contrast.)
+  surface: ["#0F5C66", "#2D1B50"],
+  // The layer over a hero photo: a deep lilac, the lightest one that still gives
+  // AA contrast to white text over a pure white photo (a deep purple was too dark).
+  scrim: "#3B2562",
   onSurface: "#FFFFFF",
   onSurfaceSoft: "#F7F3FF",
   chip: "#3C2866",
@@ -1910,18 +1931,23 @@ const k = (r) => [r, r], rr = {
     night: "#20123A",
     violet: "#693BCC",
     lavender: "#816CB2",
+    /** The deep teal of the footer and banners. */
+    teal: "#0F5C66",
     magenta: "#CB1F9C",
-    cyan: "#1CDAF3"
+    /** The brand orange. Too light for white text: use it as a decoration, not under a label. */
+    orange: "#F35F1C"
   },
   derived: {
-    /** Lavender darkened to carry white text at 4.5:1 (the end of the surface gradient). */
-    lavenderDeep: "#7A64AE",
     /** Violet that reads as text on the night background (7.6:1). */
     lilac: "#B99BFF",
     /** Raised surface over night. */
     nightRaised: "#2D1B50",
-    /** Hovered primary action (12:1 with the dark text). */
-    cyanHover: "#6AE9FA"
+    /** Orange for text and outlines on dark backgrounds. */
+    orangeText: "#F4793F",
+    /** Burnt orange of the button fill (white text at 4.8:1). */
+    orangeDeep: "#C8460B",
+    /** Hovered button fill, darker (white text at 5.8:1). */
+    orangeHover: "#B63F0A"
   }
 }, ir = {
   mode: "light",
@@ -1936,10 +1962,10 @@ const k = (r) => [r, r], rr = {
   onPrimary: "#FFFFFF",
   secondary: "#4A0875",
   onSecondary: "#FFFFFF",
-  action: k("#027381"),
-  actionHover: k("#015C68"),
+  action: B("#027381"),
+  actionHover: B("#015C68"),
   onAction: "#FFFFFF",
-  surface: k("#4A0875"),
+  surface: B("#4A0875"),
   scrim: "#2B1B3D",
   onSurface: "#FFFFFF",
   onSurfaceSoft: "#E8DCF4",
@@ -1999,7 +2025,7 @@ const k = (r) => [r, r], rr = {
 function ft(r, t = nr) {
   const o = Array.from(new Set(r));
   return Object.fromEntries(
-    o.map((l, n) => [l, t[n % t.length]])
+    o.map((a, n) => [a, t[n % t.length]])
   );
 }
 const gt = [
@@ -2022,15 +2048,15 @@ export {
   Xr as BarChart,
   yt as Button,
   St as Card,
-  kt as CardActionArea,
-  At as CardActions,
-  Et as CardContent,
+  Bt as CardActionArea,
+  Dt as CardActions,
+  It as CardContent,
   Wt as CardMedia,
-  Ue as CategoryChip,
+  _e as CategoryChip,
   $t as Chip,
   ct as ContentRail,
   et as CopyField,
-  Ur as DataTable,
+  _r as DataTable,
   Kr as Dialog,
   Zr as Drawer,
   st as EpisodeList,
@@ -2047,9 +2073,9 @@ export {
   Jr as SectionHeader,
   Qr as Select,
   rt as SkipLink,
-  _r as StatCard,
+  Ur as StatCard,
   it as Steps,
-  zt as Tab,
+  Rt as Tab,
   Pt as Tabs,
   nt as Timeline,
   vt as Typography,
@@ -2062,7 +2088,7 @@ export {
   tr as editorialColors,
   ut as editorialTheme,
   Yr as icons,
-  R as linearGradient,
+  z as linearGradient,
   gt as observatoryCategoryPalette,
   ir as observatoryColors,
   mt as observatoryTheme,