@behindthemusictree/app-kit-ui 42.0.2 → 43.1.0

package/dist/{chunk-PVYUC2PN.js → chunk-24PBIPA4.js}

@@ -1,15 +1,16 @@
 import {
   BasePopup_default,
   InternalErrorPopup,
+  PopupButtons,
   Toast
 } from "./chunk-2GH7CSCE.js";
 
 // src/genre-tree/GenreTreeView.tsx
-import { useCallback as useCallback6, useDeferredValue as useDeferredValue2, useEffect as useEffect6, useMemo as useMemo8, useRef as useRef3, useState as useState10 } from "react";
+import { useCallback as useCallback6, useDeferredValue as useDeferredValue2, useEffect as useEffect6, useMemo as useMemo8, useRef as useRef3, useState as useState11 } from "react";
 import { useIsMutating } from "@tanstack/react-query";
 import { Plus as Plus2 } from "lucide-react";
 import { Maximize2 as Maximize22, Minimize2 as Minimize22 } from "lucide-react";
-import { IconTextButton, IconButton as IconButton2, Button, SegmentedControl as SegmentedControl2, DetailPanel as DetailPanel2, useObscuredInset } from "@behindthemusictree/ui";
+import { IconTextButton, IconButton as IconButton2, Button as Button2, SegmentedControl as SegmentedControl2, useObscuredInset } from "@behindthemusictree/ui";
 import {
   GenreTreeWheelSkeleton,
   GenreTreeViewSkeleton,
@@ -486,6 +487,8 @@ function SearchBox({
   onClear,
   clearLabel,
   leading,
+  trailingAction,
+  trailingActionBreakpoint,
   className: className2,
   onFocus
 }) {
@@ -518,6 +521,8 @@ function SearchBox({
       onClear,
       clearLabel,
       leading,
+      trailingAction,
+      trailingActionBreakpoint,
       inputClassName: "focus-visible:ring-0"
     }
   ) });
@@ -623,7 +628,10 @@ function GenreSearch({
   placeholder,
   onQueryChange,
   extraGroups = [],
-  onFocus
+  onFocus,
+  trailingAction,
+  trailingActionBreakpoint,
+  fullWidthBreakpoint = "md"
 }) {
   const { query, setQuery, results, canClear, clear, select } = useGenreSearch({
     genrePlaylists,
@@ -651,7 +659,7 @@ function GenreSearch({
       (group) => active ? group : { ...group, items: [], status: "", loading: false }
     )
   ];
-  return /* @__PURE__ */ jsx9("div", { className: "genre-search w-[calc(var(--layout-detail-panel-w,25.5rem)-2*var(--layout-panel-inset,1rem))] shrink-0 max-md:w-full", children: /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx9("div", { className: `genre-search w-[calc(var(--layout-detail-panel-w,25.5rem)-2*var(--layout-panel-inset,1rem))] shrink-0 ${fullWidthBreakpoint === "sm" ? "max-sm:w-full sm:max-md:max-w-sm" : "max-md:w-full"}`, children: /* @__PURE__ */ jsx9(
     SearchBox,
     {
       label,
@@ -672,7 +680,9 @@ function GenreSearch({
         onQueryChange?.("");
       } : void 0,
       leading: onPrevious && /* @__PURE__ */ jsx9("button", { type: "button", "aria-label": "Previous", title: "Previous", className: SEARCH_LEADING_BUTTON_CLASS, onClick: onPrevious, children: /* @__PURE__ */ jsx9(ArrowLeft, { "aria-hidden": "true", className: "h-4 w-4" }) }),
-      onFocus
+      onFocus,
+      trailingAction,
+      trailingActionBreakpoint
     }
   ) });
 }
@@ -716,6 +726,54 @@ function GenreTreeSearch({
   return SearchGroups ? /* @__PURE__ */ jsx10(SearchGroups, { query: deferredQuery, focused, onSelectGenre, children: render }) : render([]);
 }
 
+// src/genre-tree/GenreOverviewDetailPanel.tsx
+import { forwardRef } from "react";
+import { DetailPanel } from "@behindthemusictree/ui";
+import { useFetchGenreOverview } from "@behindthemusictree/app-kit/genre-tree";
+
+// src/genre-tree/CommonsPhoto.tsx
+import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+function ExternalLink({ href, children }) {
+  return /* @__PURE__ */ jsx11("a", { href, target: "_blank", rel: "noopener noreferrer", className: "underline-offset-2 hover:underline", children });
+}
+function CommonsPhotoCredit({ image, creditLabel = "Photo" }) {
+  return /* @__PURE__ */ jsxs6("p", { className: "text-caption text-[var(--color-text-muted)]", children: [
+    creditLabel,
+    ": ",
+    /* @__PURE__ */ jsx11(ExternalLink, { href: image.pageUrl, children: image.author ?? "Wikimedia Commons" }),
+    ",",
+    " ",
+    image.licenseUrl ? /* @__PURE__ */ jsx11(ExternalLink, { href: image.licenseUrl, children: image.license }) : image.license
+  ] });
+}
+function CommonsCover({ image, alt }) {
+  return /* @__PURE__ */ jsx11("img", { src: image.url, alt, className: "h-64 w-full object-cover bg-[var(--color-surface-muted)]" });
+}
+function CommonsPhoto({
+  image,
+  alt,
+  creditLabel = "Photo"
+}) {
+  return /* @__PURE__ */ jsxs6("figure", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx11("img", { src: image.url, alt, className: "h-64 w-full object-contain bg-[var(--color-surface-muted)] rounded" }),
+    /* @__PURE__ */ jsxs6("figcaption", { className: "text-caption text-[var(--color-text-muted)]", children: [
+      creditLabel,
+      ": ",
+      /* @__PURE__ */ jsx11(ExternalLink, { href: image.pageUrl, children: image.author ?? "Wikimedia Commons" }),
+      ",",
+      " ",
+      image.licenseUrl ? /* @__PURE__ */ jsx11(ExternalLink, { href: image.licenseUrl, children: image.license }) : image.license
+    ] })
+  ] });
+}
+
+// src/genre-tree/GenreOverviewDetailPanel.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+var GenreOverviewDetailPanel = forwardRef(function GenreOverviewDetailPanel2({ genreUuid, scope, getBackendBaseUrl, criteriaOverviewSchema, cover, ...props }, ref) {
+  const { data: overview } = useFetchGenreOverview(genreUuid, scope, getBackendBaseUrl, criteriaOverviewSchema);
+  return /* @__PURE__ */ jsx12(DetailPanel, { ...props, ref, cover: genreUuid && overview?.image ? /* @__PURE__ */ jsx12(CommonsCover, { image: overview.image, alt: overview.name }) : cover });
+});
+
 // src/genre-tree/GenreDetailPanel.tsx
 import { useMemo as useMemo6 } from "react";
 import {
@@ -726,7 +784,7 @@ import {
   TEXT_COLOR,
   tintSurface
 } from "@behindthemusictree/genre-tree-view";
-import { DetailPanel, IconButton, Skeleton as Skeleton3 } from "@behindthemusictree/ui";
+import { IconButton, Skeleton as Skeleton3 } from "@behindthemusictree/ui";
 import { Maximize2, Minimize2 } from "lucide-react";
 import {
   useFetchGenreDetail,
@@ -759,12 +817,12 @@ import { FaWhatsapp } from "react-icons/fa";
 import { SiGmail } from "react-icons/si";
 
 // src/genre-tree/ShareDestinationButton.tsx
-import { Fragment as Fragment4, jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
 var className = "group flex min-w-0 flex-1 flex-col items-center justify-center gap-1.5 rounded-xl px-2 py-2 text-caption text-[var(--color-text)] transition-colors hover:bg-[var(--color-surface-muted)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] disabled:cursor-not-allowed disabled:opacity-50";
 function Contents({ icon, label }) {
-  return /* @__PURE__ */ jsxs6(Fragment4, { children: [
-    /* @__PURE__ */ jsx11("span", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-[var(--color-surface-muted)] transition-colors group-hover:bg-[var(--color-border)]", children: icon }),
-    /* @__PURE__ */ jsx11("span", { className: "max-w-full truncate", children: label })
+  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
+    /* @__PURE__ */ jsx13("span", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-[var(--color-surface-muted)] transition-colors group-hover:bg-[var(--color-border)]", children: icon }),
+    /* @__PURE__ */ jsx13("span", { className: "max-w-full truncate", children: label })
   ] });
 }
 function ShareDestinationButton({
@@ -776,29 +834,29 @@ function ShareDestinationButton({
   ariaLabel
 }) {
   if (href) {
-    return /* @__PURE__ */ jsx11("a", { href, target: "_blank", rel: "noopener noreferrer", "aria-label": ariaLabel, className, children: /* @__PURE__ */ jsx11(Contents, { icon, label }) });
+    return /* @__PURE__ */ jsx13("a", { href, target: "_blank", rel: "noopener noreferrer", "aria-label": ariaLabel, className, children: /* @__PURE__ */ jsx13(Contents, { icon, label }) });
   }
-  return /* @__PURE__ */ jsx11("button", { type: "button", onClick, disabled, "aria-label": ariaLabel, className, children: /* @__PURE__ */ jsx11(Contents, { icon, label }) });
+  return /* @__PURE__ */ jsx13("button", { type: "button", onClick, disabled, "aria-label": ariaLabel, className, children: /* @__PURE__ */ jsx13(Contents, { icon, label }) });
 }
 
 // src/genre-tree/SharePreviewCard.tsx
 import { Music, Music2, UserRound } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
 function SharePreviewCard({ target, url }) {
   const Icon = { genre: Music2, artist: UserRound, song: Music }[target.kind];
   const typeLabel = { genre: "Genre", artist: "Artist", song: "Song" }[target.kind];
-  return /* @__PURE__ */ jsx12("div", { className: "rounded-3xl bg-[var(--color-surface-muted)] p-4", children: /* @__PURE__ */ jsxs7("div", { className: "flex min-h-32 overflow-hidden rounded-2xl bg-[var(--color-surface)] shadow-lg", children: [
-    /* @__PURE__ */ jsx12("div", { className: "flex w-28 shrink-0 items-center justify-center bg-[var(--color-primary)]/15 text-[var(--color-primary)]", children: /* @__PURE__ */ jsx12(Icon, { "aria-hidden": "true", className: "h-10 w-10" }) }),
-    /* @__PURE__ */ jsxs7("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-1 p-4", children: [
-      /* @__PURE__ */ jsx12("span", { className: "text-caption font-medium uppercase tracking-wide text-[var(--color-text-muted)]", children: typeLabel }),
-      /* @__PURE__ */ jsx12("span", { className: "truncate text-base font-semibold text-[var(--color-text)]", title: target.name, children: target.name }),
-      /* @__PURE__ */ jsx12("span", { className: "truncate text-body text-[var(--color-primary)]", title: url, children: url })
+  return /* @__PURE__ */ jsx14("div", { className: "rounded-3xl bg-[var(--color-surface-muted)] p-4", children: /* @__PURE__ */ jsxs8("div", { className: "flex min-h-32 overflow-hidden rounded-2xl bg-[var(--color-surface)] shadow-lg", children: [
+    /* @__PURE__ */ jsx14("div", { className: "flex w-28 shrink-0 items-center justify-center bg-[var(--color-primary)]/15 text-[var(--color-primary)]", children: /* @__PURE__ */ jsx14(Icon, { "aria-hidden": "true", className: "h-10 w-10" }) }),
+    /* @__PURE__ */ jsxs8("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-1 p-4", children: [
+      /* @__PURE__ */ jsx14("span", { className: "text-caption font-medium uppercase tracking-wide text-[var(--color-text-muted)]", children: typeLabel }),
+      /* @__PURE__ */ jsx14("span", { className: "truncate text-base font-semibold text-[var(--color-text)]", title: target.name, children: target.name }),
+      /* @__PURE__ */ jsx14("span", { className: "truncate text-body text-[var(--color-primary)]", title: url, children: url })
     ] })
   ] }) });
 }
 
 // src/genre-tree/SharePopup.tsx
-import { Fragment as Fragment5, jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function resolveAbsoluteUrl(url) {
   try {
     const parsed = new URL(url, window.location.href);
@@ -873,8 +931,8 @@ function SharePopup({ target, url, onClose }) {
       setShareError("Could not open the share options.");
     }
   };
-  return /* @__PURE__ */ jsxs8(Fragment5, { children: [
-    /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs9(Fragment5, { children: [
+    /* @__PURE__ */ jsx15(
       BasePopup_default,
       {
         title: "Share",
@@ -889,70 +947,70 @@ function SharePopup({ target, url, onClose }) {
         titleTextClassName: "!text-xl !font-semibold !text-[var(--color-text)]",
         closeButtonClassName: "!h-10 !w-10 !rounded-none !border-0 !bg-transparent !p-0 !text-[var(--color-text)] hover:!bg-transparent hover:!text-[var(--color-text)]",
         contentClassName: "!rounded-none !bg-transparent !px-6 !pb-6 !pt-2",
-        children: /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-4", children: [
-          /* @__PURE__ */ jsx13(SharePreviewCard, { target, url: absoluteUrl || url }),
-          /* @__PURE__ */ jsxs8("div", { className: "grid grid-cols-3 gap-1 rounded-3xl bg-[var(--color-surface)] p-3 sm:grid-cols-4", children: [
-            /* @__PURE__ */ jsx13(
+        children: /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-4", children: [
+          /* @__PURE__ */ jsx15(SharePreviewCard, { target, url: absoluteUrl || url }),
+          /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-3 gap-1 rounded-3xl bg-[var(--color-surface)] p-3 sm:grid-cols-4", children: [
+            /* @__PURE__ */ jsx15(
               ShareDestinationButton,
               {
                 label: "Copy Link",
-                icon: /* @__PURE__ */ jsx13(Link2, { "aria-hidden": "true", className: "h-6 w-6" }),
+                icon: /* @__PURE__ */ jsx15(Link2, { "aria-hidden": "true", className: "h-6 w-6" }),
                 onClick: () => void handleCopy(),
                 ariaLabel: "Copy link",
                 disabled: !absoluteUrl
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               ShareDestinationButton,
               {
                 label: "WhatsApp",
-                icon: /* @__PURE__ */ jsx13(FaWhatsapp, { "aria-hidden": "true", className: "h-9 w-9 text-[#25D366]" }),
+                icon: /* @__PURE__ */ jsx15(FaWhatsapp, { "aria-hidden": "true", className: "h-9 w-9 text-[#25D366]" }),
                 href: destinationUrls?.whatsapp,
                 ariaLabel: `Share ${target.name} via WhatsApp`,
                 disabled: !absoluteUrl
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               ShareDestinationButton,
               {
                 label: "Gmail",
-                icon: /* @__PURE__ */ jsx13(SiGmail, { "aria-hidden": "true", className: "h-8 w-8 text-[#EA4335]" }),
+                icon: /* @__PURE__ */ jsx15(SiGmail, { "aria-hidden": "true", className: "h-8 w-8 text-[#EA4335]" }),
                 href: destinationUrls?.gmail,
                 ariaLabel: `Email ${target.name} with Gmail`,
                 disabled: !absoluteUrl
               }
             ),
-            canUseNativeShare && /* @__PURE__ */ jsx13(
+            canUseNativeShare && /* @__PURE__ */ jsx15(
               ShareDestinationButton,
               {
                 label: "More",
-                icon: /* @__PURE__ */ jsx13(Share2, { "aria-hidden": "true", className: "h-6 w-6" }),
+                icon: /* @__PURE__ */ jsx15(Share2, { "aria-hidden": "true", className: "h-6 w-6" }),
                 onClick: () => void handleNativeShare(),
                 ariaLabel: "More sharing options",
                 disabled: !absoluteUrl
               }
             )
           ] }),
-          copyStatus === "failed" && /* @__PURE__ */ jsx13("p", { role: "alert", className: "text-center text-body text-[var(--color-red-500)]", children: "Could not copy the link." }),
-          shareError && /* @__PURE__ */ jsx13("p", { role: "alert", className: "text-center text-body text-[var(--color-red-500)]", children: shareError })
+          copyStatus === "failed" && /* @__PURE__ */ jsx15("p", { role: "alert", className: "text-center text-body text-[var(--color-red-500)]", children: "Could not copy the link." }),
+          shareError && /* @__PURE__ */ jsx15("p", { role: "alert", className: "text-center text-body text-[var(--color-red-500)]", children: shareError })
         ] })
       }
     ),
-    toastId > 0 && /* @__PURE__ */ jsx13(Toast, { message: "Link copied", onClose: dismissToast }, toastId)
+    toastId > 0 && /* @__PURE__ */ jsx15(Toast, { message: "Link copied", onClose: dismissToast }, toastId)
   ] });
 }
 
 // src/genre-tree/ShareActionButton.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function ShareActionButton({ target, url }) {
   const { showPopup, hidePopup } = usePopup2();
   const openSharePopup = () => {
-    showPopup(/* @__PURE__ */ jsx14(SharePopup, { target, url, onClose: hidePopup }));
+    showPopup(/* @__PURE__ */ jsx16(SharePopup, { target, url, onClose: hidePopup }));
   };
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx16(
     ActionButton,
     {
-      icon: /* @__PURE__ */ jsx14(Share22, { "aria-hidden": "true", className: "w-5 h-5" }),
+      icon: /* @__PURE__ */ jsx16(Share22, { "aria-hidden": "true", className: "w-5 h-5" }),
       label: "Share",
       "aria-label": `Share ${target.name}`,
       title: `Share ${target.name}`,
@@ -962,7 +1020,7 @@ function ShareActionButton({ target, url }) {
 }
 
 // src/genre-tree/GenreActionBand.tsx
-import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
 function GenreActionBand({
   node,
   playActions,
@@ -983,24 +1041,24 @@ function GenreActionBand({
     items.push({
       key: "zoom-in",
       label: "Focus",
-      icon: /* @__PURE__ */ jsx15(ZoomIn, { "aria-hidden": "true", className: "w-5 h-5" }),
+      icon: /* @__PURE__ */ jsx17(ZoomIn, { "aria-hidden": "true", className: "w-5 h-5" }),
       onClick: onZoomIn
     });
   }
   if (onAddChild) {
-    adminItems.push({ key: "add-child", label: "Add", icon: /* @__PURE__ */ jsx15(Plus, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onAddChild });
+    adminItems.push({ key: "add-child", label: "Add", icon: /* @__PURE__ */ jsx17(Plus, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onAddChild });
   }
   if (onRename) {
-    adminItems.push({ key: "rename", label: "Rename", icon: /* @__PURE__ */ jsx15(Pencil, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onRename });
+    adminItems.push({ key: "rename", label: "Rename", icon: /* @__PURE__ */ jsx17(Pencil, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onRename });
   }
   if (onChangeParent) {
-    adminItems.push({ key: "change-parent", label: "Parent", icon: /* @__PURE__ */ jsx15(MoveUpRight, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onChangeParent });
+    adminItems.push({ key: "change-parent", label: "Parent", icon: /* @__PURE__ */ jsx17(MoveUpRight, { "aria-hidden": "true", className: "w-5 h-5" }), onClick: onChangeParent });
   }
   if (onToggleSide) {
     adminItems.push({
       key: "toggle-side",
       label: side === "pop" ? "Make core" : "Make pop",
-      icon: /* @__PURE__ */ jsx15(ArrowLeftRight, { "aria-hidden": "true", className: "w-5 h-5" }),
+      icon: /* @__PURE__ */ jsx17(ArrowLeftRight, { "aria-hidden": "true", className: "w-5 h-5" }),
       onClick: onToggleSide,
       disabled: !!toggleSideDisabledReason,
       title: toggleSideDisabledReason
@@ -1015,9 +1073,9 @@ function GenreActionBand({
       disabled: action.enabled ? !action.enabled(node) : false
     });
   }
-  const renderItems = (list) => list.map((item) => /* @__PURE__ */ jsx15(ActionButton2, { icon: item.icon, label: item.label, disabled: item.disabled, title: item.title, onClick: item.onClick }, item.key));
+  const renderItems = (list) => list.map((item) => /* @__PURE__ */ jsx17(ActionButton2, { icon: item.icon, label: item.label, disabled: item.disabled, title: item.title, onClick: item.onClick }, item.key));
   if (!playActions && items.length === 0 && adminItems.length === 0 && !(shareTarget && shareUrl)) return null;
-  return /* @__PURE__ */ jsx15(PanelBleed, { children: /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsx17(PanelBleed, { children: /* @__PURE__ */ jsxs10(
     ActionBand,
     {
       className: "genre-action-band",
@@ -1025,7 +1083,7 @@ function GenreActionBand({
       children: [
         playActions,
         renderItems(items),
-        shareTarget && shareUrl && /* @__PURE__ */ jsx15(ShareActionButton, { target: shareTarget, url: shareUrl })
+        shareTarget && shareUrl && /* @__PURE__ */ jsx17(ShareActionButton, { target: shareTarget, url: shareUrl })
       ]
     }
   ) });
@@ -1052,7 +1110,7 @@ var REGION_GLOBE_PATHS = {
 var REGION_GLOBES = ["africa", "americas", "asia"];
 
 // src/genre-tree/RegionGlobeIcon.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var ROTATION_INTERVAL_MS = 3e3;
 function RegionGlobeIcon({ className: className2 }) {
   const [index, setIndex] = useState5(0);
@@ -1070,29 +1128,29 @@ function RegionGlobeIcon({ className: className2 }) {
       clearInterval(timer);
     };
   }, []);
-  return /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 512 512", fill: "currentColor", className: className2, "aria-hidden": true, children: /* @__PURE__ */ jsx16("path", { "data-testid": "region-globe-path", d: REGION_GLOBE_PATHS[REGION_GLOBES[index]] }) });
+  return /* @__PURE__ */ jsx18("svg", { viewBox: "0 0 512 512", fill: "currentColor", className: className2, "aria-hidden": true, children: /* @__PURE__ */ jsx18("path", { "data-testid": "region-globe-path", d: REGION_GLOBE_PATHS[REGION_GLOBES[index]] }) });
 }
 
 // src/genre-tree/treeMarkPath.ts
 var TREE_MARK_PATH = "M3171 5598 c-5 -13 -5 -24 0 -26 5 -2 9 -16 9 -31 0 -25 -3 -28 -25 -23 l-25 4 0 -116 c0 -64 3 -116 8 -116 10 0 32 51 26 61 -3 5 -1 9 4 9 5 0 15 12 21 28 7 15 26 36 43 47 30 20 88 105 71 105 -4 0 -33 -21 -62 -47 l-54 -47 6 63 c4 35 7 72 7 82 0 10 9 19 23 22 16 3 13 5 -11 6 -25 1 -35 -4 -41 -21z M2893 5485 c8 -76 24 -100 71 -100 l36 0 0 53 c0 58 -15 69 -28 20 -8 -29 -10 -30 -16 -13 -15 43 -42 89 -55 93 -11 4 -13 -6 -8 -53z M2484 5438 c8 -70 49 -169 54 -131 2 12 10 27 18 33 17 15 19 84 3 129 -9 27 -16 31 -46 31 l-36 0 7 -62z M2625 5448 c-7 -22 -24 -121 -31 -179 l-6 -57 -27 11 c-15 5 -32 19 -37 31 -9 21 -88 86 -105 86 -39 0 38 -104 118 -158 17 -12 56 -59 86 -105 30 -45 67 -92 81 -104 14 -13 26 -30 26 -38 0 -13 -9 -11 -45 11 -67 39 -58 10 21 -66 67 -65 96 -110 108 -167 4 -17 13 -34 20 -36 20 -8 66 -186 75 -289 13 -161 -8 -272 -72 -365 -12 -18 -30 -33 -39 -33 -23 0 -53 33 -79 89 -25 54 -69 112 -121 162 -35 33 -38 40 -38 92 0 58 36 172 79 252 25 47 29 125 6 125 -19 0 -30 -22 -50 -100 -9 -35 -24 -78 -32 -94 l-16 -30 -19 24 -20 25 7 -58 c8 -62 0 -127 -16 -127 -19 0 -122 107 -166 172 -52 79 -68 150 -60 273 8 108 17 129 67 149 58 23 97 64 105 109 9 47 -5 49 -63 6 l-42 -30 15 35 c17 41 20 102 5 111 -18 11 -45 -4 -64 -36 -11 -19 -20 -60 -23 -110 -4 -54 -10 -79 -18 -79 -20 0 -27 28 -30 108 -2 40 -6 76 -9 79 -3 4 -6 51 -6 105 0 86 -3 101 -21 119 -27 27 -42 20 -53 -24 -7 -28 -5 -51 7 -90 9 -30 17 -76 17 -103 l0 -49 -29 51 c-29 49 -92 114 -111 114 -6 0 -10 -11 -10 -25 0 -14 5 -25 10 -25 6 0 10 -6 10 -13 0 -7 23 -44 51 -82 61 -84 59 -82 52 -57 -3 14 2 24 15 31 12 6 23 23 25 38 2 16 5 2 6 -29 1 -46 -2 -58 -14 -58 -21 0 -19 -13 10 -70 22 -44 25 -61 25 -165 l0 -116 -47 27 c-65 36 -142 118 -176 187 -15 31 -37 62 -49 68 -21 11 -21 10 -15 -41 l6 -52 -29 6 c-37 7 -39 -7 -4 -31 14 -10 53 -40 86 -68 92 -76 130 -104 163 -119 39 -19 101 -84 109 -116 10 -42 50 -88 217 -245 50 -47 94 -102 134 -167 33 -54 65 -98 71 -98 17 0 45 -79 51 -145 4 -47 0 -76 -20 -135 -14 -41 -39 -121 -56 -177 -18 -57 -35 -103 -40 -103 -4 0 -26 13 -49 30 -31 22 -50 49 -82 117 -99 209 -116 241 -185 337 -123 172 -123 173 -128 311 -5 140 -29 245 -57 245 -12 0 -20 -11 -24 -31 -9 -46 -7 -108 3 -127 14 -26 25 -162 14 -162 -20 0 -160 99 -192 135 -19 22 -42 58 -52 80 -10 23 -27 52 -37 66 -10 13 -26 38 -34 54 -9 17 -23 45 -33 64 -15 29 -16 40 -6 80 31 116 34 139 27 205 -7 57 -11 69 -28 74 -14 3 -32 30 -54 79 -21 46 -39 73 -47 70 -13 -5 -14 -15 -3 -65 l8 -33 -49 25 c-61 31 -93 40 -93 27 0 -13 43 -41 122 -79 47 -22 72 -41 83 -61 19 -38 19 -51 0 -51 -12 0 -15 -15 -16 -72 -1 -79 -12 -134 -22 -108 -3 8 -10 48 -16 89 -14 89 -25 111 -54 111 -38 0 -50 -15 -45 -54 4 -40 2 -42 -26 -21 -29 22 -36 19 -36 -20 0 -39 39 -85 125 -145 38 -27 62 -56 99 -120 45 -79 82 -177 70 -189 -2 -3 -42 3 -87 13 -45 10 -99 21 -119 26 -47 9 -103 51 -125 93 -24 44 -83 203 -94 252 -5 25 -4 59 3 91 14 68 3 140 -23 155 -12 6 -23 8 -27 5 -14 -15 -13 -115 2 -159 39 -116 0 -116 -70 1 -22 36 -31 42 -59 42 -20 0 -35 6 -39 15 -6 16 -56 21 -56 6 0 -5 23 -25 51 -44 53 -36 158 -156 188 -216 10 -20 26 -60 36 -88 11 -29 25 -53 32 -53 8 0 13 -12 13 -30 0 -26 -4 -30 -27 -31 l-28 -1 25 -7 c26 -8 177 -87 196 -102 5 -4 50 -18 100 -29 122 -29 277 -78 300 -95 10 -8 26 -15 34 -15 35 0 160 -166 160 -212 0 -22 -32 -24 -50 -4 -11 14 -100 46 -165 61 -16 3 -68 25 -115 48 -102 49 -163 56 -168 19 -9 -62 58 -104 178 -112 63 -5 103 -14 155 -37 39 -16 91 -38 117 -47 26 -9 74 -35 106 -56 52 -33 65 -48 96 -112 20 -40 39 -95 43 -122 6 -47 6 -48 -18 -41 -33 10 -69 33 -69 45 0 6 -10 10 -23 10 -13 0 -27 4 -32 9 -6 5 -27 14 -47 20 -20 7 -53 23 -73 37 -43 29 -45 29 -45 7 0 -26 80 -96 145 -127 119 -56 274 -185 311 -259 55 -107 104 -410 104 -640 0 -162 -22 -325 -45 -333 -25 -10 -72 25 -168 123 -129 131 -140 148 -182 274 -20 60 -50 142 -66 181 -16 39 -45 131 -65 202 -24 93 -55 173 -104 274 -77 158 -78 166 -32 256 31 64 27 129 -12 181 -31 40 -39 42 -65 18 -51 -49 -55 -120 -11 -208 37 -74 37 -85 3 -85 -36 0 -94 65 -137 154 -18 39 -37 80 -40 92 -3 11 -14 29 -24 40 -10 10 -28 35 -42 54 -13 19 -40 55 -61 80 -20 25 -41 63 -47 85 -6 22 -16 62 -23 89 -20 81 -95 147 -113 100 -18 -47 -6 -92 39 -147 25 -31 45 -61 45 -67 0 -15 -42 -3 -116 31 -94 44 -156 124 -184 235 -9 36 -13 41 -38 40 -39 -2 -144 113 -186 205 -31 66 -33 68 -53 54 -11 -8 -24 -11 -27 -7 -4 4 11 -24 33 -62 39 -67 43 -86 18 -86 -8 0 -8 3 1 9 11 6 9 9 -7 14 -11 3 -25 -1 -31 -7 -7 -10 0 -16 29 -24 39 -12 203 -147 215 -178 13 -34 4 -35 -48 -6 -64 37 -126 51 -126 30 0 -26 55 -67 125 -92 46 -16 80 -36 100 -58 l29 -33 -54 -3 c-79 -5 -203 14 -249 38 -47 24 -70 54 -105 140 -43 105 -115 163 -103 83 3 -21 9 -47 13 -57 4 -11 -15 4 -42 32 -62 64 -84 67 -84 14 0 -41 24 -76 61 -87 16 -6 18 -9 8 -15 -23 -15 15 -45 117 -91 52 -24 93 -48 91 -54 -10 -28 -150 -28 -190 0 -21 15 -47 5 -47 -17 0 -5 -10 -19 -22 -29 -23 -20 -23 -20 112 -14 174 8 208 8 430 0 l185 -7 84 -41 c115 -57 180 -118 225 -212 20 -41 36 -77 36 -80 0 -14 89 -126 150 -190 74 -78 120 -144 120 -175 0 -30 10 -33 -201 52 -94 38 -131 71 -218 195 -27 37 -59 77 -71 88 l-23 20 7 -40 c4 -22 12 -44 17 -49 13 -14 11 -26 -4 -26 -7 0 -29 21 -48 48 -33 45 -34 51 -39 159 -4 89 -9 116 -22 130 -17 16 -18 16 -18 0 0 -9 -7 -17 -16 -17 -14 0 -16 -9 -11 -62 3 -35 8 -74 12 -88 l7 -25 -25 27 c-41 44 -127 118 -137 118 -18 0 -10 -57 12 -85 18 -24 20 -32 10 -57 -10 -28 -9 -30 22 -43 18 -8 54 -19 79 -26 36 -9 60 -24 99 -66 80 -83 80 -83 1 -83 -80 0 -176 21 -236 51 -107 54 -234 169 -252 228 -4 14 -12 29 -17 35 -5 6 -18 25 -28 43 -24 40 -90 64 -116 42 -22 -18 -13 -84 17 -116 13 -13 42 -32 64 -42 22 -10 74 -53 115 -96 l75 -77 -75 5 c-135 8 -243 76 -336 207 -31 44 -65 87 -77 95 -37 26 -34 -9 7 -88 20 -39 34 -72 31 -75 -2 -2 -26 11 -52 31 -90 65 -143 83 -143 49 0 -32 71 -88 150 -117 41 -15 113 -47 159 -71 46 -24 99 -46 118 -50 18 -3 33 -12 33 -18 0 -12 -111 -46 -149 -46 -12 0 -29 -8 -39 -17 -10 -10 -27 -19 -37 -19 -11 -1 -45 -9 -75 -17 -58 -16 -110 -62 -110 -97 0 -39 116 -45 167 -9 11 8 34 31 52 51 28 32 50 43 144 74 145 47 222 48 404 5 70 -17 177 -38 237 -47 128 -19 202 -43 250 -79 18 -14 73 -42 122 -61 164 -66 208 -112 243 -251 36 -141 27 -167 -44 -123 -19 12 -63 23 -111 28 -117 13 -134 25 -275 193 -63 74 -193 151 -266 157 -29 2 -66 -1 -81 -7 -24 -10 -37 -9 -80 8 -66 26 -70 9 -11 -44 72 -65 119 -80 239 -78 60 1 109 -2 117 -8 6 -6 26 -35 42 -64 17 -30 46 -64 64 -77 19 -13 49 -40 67 -61 l34 -39 -79 3 c-57 3 -80 0 -83 -9 -3 -10 -7 -10 -18 -1 -8 6 -11 15 -8 20 3 5 0 9 -5 9 -16 0 -13 -16 6 -36 36 -36 78 -44 227 -44 119 0 152 -3 188 -19 56 -24 95 -64 125 -126 13 -27 35 -68 48 -90 14 -22 25 -53 25 -69 l0 -29 -107 5 c-131 6 -193 28 -290 100 -37 28 -82 56 -98 63 -75 32 -176 123 -277 247 -34 42 -122 98 -134 85 -5 -5 103 -138 184 -226 52 -57 46 -61 -49 -31 -87 28 -173 85 -325 214 -144 123 -189 151 -254 159 -25 2 -39 3 -32 0 6 -3 12 -16 12 -29 0 -17 -4 -23 -12 -19 -7 4 -1 -5 15 -19 15 -14 46 -30 70 -36 23 -6 60 -17 82 -25 l40 -13 -52 -1 c-49 -1 -53 -3 -53 -25 0 -28 28 -36 122 -36 54 0 62 -3 91 -32 l32 -33 -52 -3 c-88 -5 -75 -26 39 -62 130 -41 178 -63 206 -93 l22 -24 -20 -18 c-12 -11 -41 -20 -74 -23 -48 -4 -60 0 -116 32 -118 69 -241 96 -279 62 -13 -12 -40 -16 -104 -16 -48 0 -95 4 -105 9 -9 5 -34 16 -55 25 -20 9 -76 53 -122 97 -47 45 -88 79 -91 76 -12 -12 6 -54 41 -100 l36 -47 -74 0 c-88 0 -112 15 -78 49 26 26 21 39 -34 84 -87 73 -132 32 -50 -45 25 -23 45 -46 45 -50 0 -4 -21 2 -46 12 -45 20 -114 27 -114 12 0 -4 16 -22 35 -40 39 -38 78 -47 255 -61 164 -14 178 -17 172 -47 -2 -13 -2 -30 2 -39 5 -13 9 -13 40 2 19 9 33 20 30 25 -4 5 4 4 15 -4 21 -13 20 -15 -44 -74 -36 -33 -65 -66 -65 -72 0 -21 68 15 142 74 38 30 84 62 103 70 73 30 203 11 312 -46 32 -17 82 -33 111 -37 l53 -6 -28 -30 c-15 -16 -44 -40 -63 -52 -63 -42 -100 -82 -100 -111 0 -25 2 -26 37 -21 28 5 47 17 73 49 65 78 175 183 224 216 34 22 61 32 88 32 43 0 122 -36 152 -69 10 -11 39 -32 62 -46 43 -25 53 -46 36 -72 -11 -17 -200 -86 -232 -85 -28 1 -122 -47 -127 -65 -3 -8 14 -13 54 -15 l58 -3 -65 -44 c-36 -25 -68 -49 -71 -53 -11 -17 -115 -10 -188 12 -105 32 -112 11 -14 -39 l56 -28 -40 -6 c-52 -9 -96 0 -154 29 -31 15 -50 19 -60 13 -15 -10 -16 -10 44 -47 20 -13 37 -27 37 -31 0 -15 -144 -71 -205 -81 -33 -5 -85 -10 -116 -10 -32 0 -63 -6 -75 -14 -18 -13 -15 -15 34 -22 l53 -7 -31 -18 c-18 -12 -30 -27 -30 -40 0 -21 4 -21 61 -16 50 4 75 14 145 57 46 28 112 63 146 77 62 24 191 62 215 63 22 0 -47 -103 -107 -161 -42 -41 -60 -66 -65 -92 -10 -49 0 -60 47 -54 65 9 99 53 124 160 20 83 49 133 94 163 22 15 40 30 40 34 0 4 8 10 18 13 9 3 31 15 49 27 31 21 31 21 26 0 -3 -11 -21 -37 -40 -58 -43 -45 -72 -106 -73 -150 0 -39 18 -49 56 -30 38 18 63 64 75 137 13 82 40 142 89 194 22 24 40 49 40 54 0 6 24 21 53 34 49 22 63 23 237 20 193 -2 278 -14 348 -50 21 -11 44 -27 52 -36 7 -9 32 -27 55 -41 49 -28 138 -147 184 -243 16 -35 42 -114 57 -175 35 -147 31 -268 -14 -436 -17 -63 -37 -166 -45 -227 -12 -94 -21 -127 -54 -195 -22 -46 -52 -94 -67 -108 -15 -14 -46 -44 -68 -67 -23 -24 -47 -43 -53 -43 -7 0 -25 -12 -41 -26 -129 -121 -526 -267 -721 -268 -104 0 -109 -15 -19 -57 75 -35 67 -35 221 -10 125 21 235 27 235 13 0 -16 -66 -72 -85 -72 -24 0 -85 -36 -85 -49 0 -14 12 -19 58 -27 35 -5 42 -4 42 10 0 9 5 17 10 17 28 4 74 20 80 29 9 14 226 119 288 139 63 21 215 43 239 34 32 -12 12 -50 -52 -102 -36 -28 -73 -55 -83 -58 -17 -7 -66 -39 -92 -60 -8 -7 -38 -32 -67 -57 l-52 -45 42 -6 c36 -6 54 -1 122 33 44 22 120 56 169 76 112 45 222 107 289 164 46 40 84 62 107 62 18 0 130 -83 130 -96 0 -8 4 -14 10 -14 5 0 39 -26 75 -59 36 -32 96 -76 132 -97 36 -21 68 -46 71 -56 5 -19 21 -22 59 -12 18 5 20 9 10 19 -7 7 -69 71 -139 143 -147 149 -161 179 -80 168 136 -19 195 -39 378 -128 78 -37 147 -68 152 -68 6 0 15 -7 20 -16 8 -14 14 -15 46 -4 l38 12 -104 57 c-125 69 -148 84 -148 93 0 16 94 7 223 -22 74 -17 146 -30 160 -30 14 0 29 -4 32 -10 7 -11 54 6 115 43 l40 24 -38 1 c-22 1 -68 11 -103 21 -35 11 -107 30 -159 41 -131 31 -295 99 -406 171 -235 153 -355 366 -357 634 -1 211 65 343 285 568 117 119 206 167 368 198 153 29 267 59 328 86 80 35 166 44 264 27 148 -26 167 -38 251 -169 71 -110 136 -165 196 -165 26 0 31 4 31 23 -1 32 -28 62 -87 91 -39 20 -66 45 -118 112 -95 123 -95 135 -5 92 25 -12 77 -31 116 -43 56 -17 76 -19 97 -10 27 11 26 11 -25 29 -113 39 -138 49 -138 57 0 14 91 55 153 68 33 7 75 10 95 7 27 -4 31 -3 17 4 -19 8 -19 9 3 9 12 1 22 7 22 15 0 10 7 12 22 8 12 -3 17 -7 10 -10 -6 -2 -12 -10 -12 -18 0 -8 -6 -14 -12 -15 -27 -2 39 -17 80 -18 29 -1 42 3 42 13 0 20 -19 32 -67 45 -49 13 -53 22 -20 44 49 32 128 39 235 21 56 -9 112 -14 126 -10 26 6 96 69 96 86 0 6 -32 10 -77 10 -84 0 -126 -7 -118 -20 9 -14 -17 -24 -67 -24 -34 -1 -48 3 -48 13 0 8 -7 11 -20 8 -17 -4 -18 -2 -9 14 5 11 14 17 20 14 5 -4 9 0 9 8 0 8 16 35 35 60 35 45 35 46 14 57 -18 10 -23 8 -37 -12 -67 -95 -162 -167 -297 -225 -55 -23 -99 -47 -98 -53 2 -5 -6 -10 -18 -10 -27 0 -23 8 31 71 100 117 116 131 161 155 80 40 80 70 1 41 l-47 -18 36 38 c47 49 59 73 59 120 0 67 -24 80 -82 46 -49 -29 -76 -85 -89 -183 -10 -81 -9 -80 -89 -174 -20 -22 -43 -53 -53 -68 -28 -45 -89 -61 -217 -56 -70 2 -114 8 -118 15 -4 6 -28 13 -54 15 l-46 3 53 71 c51 68 100 104 140 104 50 0 125 73 125 122 0 30 0 31 -45 26 -28 -4 -59 -16 -82 -34 -30 -23 -35 -24 -28 -8 22 51 37 105 31 111 -13 13 -47 -34 -105 -146 -72 -138 -171 -248 -261 -292 -62 -30 -164 -44 -242 -34 -48 7 -50 8 -45 34 14 70 51 144 95 190 42 43 56 51 127 69 44 12 98 24 120 27 99 15 155 57 155 117 l0 31 -51 -5 c-40 -4 -58 -12 -87 -40 -56 -52 -66 -58 -131 -78 l-60 -18 10 27 c6 14 36 62 68 106 70 96 91 136 91 170 0 41 -18 29 -50 -35 -30 -59 -31 -60 -74 -60 -56 0 -71 -18 -101 -115 -23 -75 -43 -114 -72 -145 -8 -8 -41 -61 -73 -117 -35 -59 -75 -113 -95 -128 -37 -29 -177 -85 -210 -85 -35 0 -222 -134 -282 -202 -31 -35 -64 -64 -72 -66 -22 -4 -68 116 -88 223 -20 113 -5 256 37 340 37 76 124 182 195 238 140 110 221 137 416 137 136 0 171 6 186 28 9 15 2 17 -76 18 -47 0 -127 4 -178 9 -167 15 -274 -28 -423 -170 -72 -68 -114 -95 -128 -81 -12 12 17 138 44 194 64 132 229 243 439 298 182 46 319 21 425 -80 68 -65 144 -115 202 -135 119 -41 155 -32 72 17 -88 52 -224 144 -224 152 0 14 51 20 210 22 115 2 160 0 175 -10 19 -12 18 -13 -8 -9 -36 6 -45 -9 -11 -17 56 -15 117 -51 183 -110 66 -59 119 -86 169 -86 54 0 31 59 -35 90 -167 77 -176 82 -158 93 25 13 138 -8 201 -37 27 -13 67 -43 89 -66 50 -53 84 -70 134 -70 37 0 71 19 71 40 0 24 -62 57 -129 70 -40 7 -74 17 -77 22 -3 4 24 8 60 8 36 0 68 -4 71 -10 3 -5 26 -10 51 -10 50 0 57 15 23 46 -24 21 -113 25 -226 10 -50 -7 -65 -6 -77 7 -19 18 -100 37 -160 37 -74 0 -136 12 -136 26 0 17 11 23 53 28 32 4 83 29 97 47 8 10 71 40 99 47 28 7 159 8 309 1 50 -2 92 -1 92 4 0 4 14 7 30 7 23 0 30 -4 30 -20 0 -15 -7 -20 -25 -20 -42 0 -28 -17 30 -39 75 -28 103 -27 117 4 8 18 19 25 38 25 34 0 47 35 23 62 -24 27 -70 31 -190 18 -101 -11 -112 -10 -173 10 -36 12 -104 24 -152 27 -49 3 -88 9 -88 13 0 8 35 26 66 35 12 3 37 21 55 40 19 20 67 58 106 86 57 39 86 52 134 60 71 11 170 58 193 91 34 49 10 51 -66 5 -52 -31 -154 -65 -165 -54 -11 12 9 25 67 47 33 12 60 26 60 30 0 5 15 17 34 28 31 18 67 84 53 98 -15 15 -69 -17 -124 -75 -35 -36 -63 -63 -63 -58 0 4 14 31 30 60 43 77 39 180 -7 151 -39 -24 -56 -62 -63 -141 -7 -87 -27 -127 -98 -200 -50 -52 -120 -103 -139 -103 -8 0 -22 -8 -31 -17 -31 -31 -26 11 12 94 33 74 61 171 53 180 -3 2 -17 1 -32 -3 -38 -10 -65 -74 -75 -185 -9 -97 -31 -147 -79 -176 -31 -20 -81 -71 -81 -83 0 -5 -24 -16 -52 -26 -29 -9 -58 -24 -64 -32 -7 -9 -33 -17 -70 -19 l-59 -4 55 48 c120 105 133 126 66 103 -19 -6 -58 -36 -88 -66 -29 -30 -72 -64 -96 -76 -41 -19 -50 -20 -163 -9 -168 16 -237 52 -196 103 21 27 121 88 143 88 60 0 183 34 234 65 30 18 74 36 97 40 85 14 180 99 131 118 -16 5 -19 13 -14 33 7 25 5 25 -26 19 -52 -11 -83 -31 -122 -76 -54 -63 -94 -86 -197 -109 -52 -12 -102 -24 -111 -26 -28 -8 -22 22 10 44 15 11 35 34 45 51 16 27 16 31 2 31 -8 0 -18 -7 -22 -16 -8 -23 -23 2 -23 40 0 23 -3 27 -12 18 -14 -14 -42 -16 -33 -2 3 6 4 10 1 10 -9 0 -37 -61 -62 -133 -29 -84 -85 -162 -137 -189 -24 -12 -67 -21 -110 -24 -40 -2 -100 -6 -134 -9 l-62 -4 36 72 c20 39 48 84 62 98 29 29 86 122 96 157 9 32 -20 29 -42 -5 -17 -27 -128 -174 -222 -297 -45 -58 -101 -96 -141 -96 -48 0 -9 184 59 284 41 59 113 107 234 156 51 20 141 67 198 102 57 36 118 72 134 80 40 21 155 46 240 53 48 5 82 14 113 32 58 34 150 44 258 28 41 -6 57 -4 75 9 17 12 46 16 111 16 88 0 116 12 57 24 -17 3 -48 6 -69 6 -21 0 -43 6 -49 14 -14 17 -8 22 40 31 30 5 36 10 32 26 -4 13 0 19 12 19 23 0 95 44 129 79 34 35 30 67 -6 55 -13 -4 -31 -7 -41 -6 -11 0 -38 -25 -68 -64 -28 -35 -53 -64 -55 -64 -2 0 7 22 21 50 14 27 25 60 25 74 0 14 5 37 11 53 7 19 7 29 0 31 -6 2 -11 17 -11 33 0 16 -4 29 -10 29 -5 0 -10 -19 -10 -42 0 -50 -37 -158 -74 -222 -28 -48 -90 -86 -141 -86 l-29 0 36 38 c20 20 43 52 52 70 16 31 16 32 -5 32 -25 0 -94 -47 -109 -75 -19 -35 -161 -104 -245 -120 -42 -8 -85 -15 -96 -15 -18 0 -18 1 -2 35 9 19 20 35 25 35 4 0 8 6 8 13 0 7 13 34 30 60 30 48 75 77 182 117 58 21 112 66 176 146 26 31 57 57 84 69 124 52 167 75 177 93 17 33 -14 35 -71 6 -29 -14 -69 -32 -89 -39 l-38 -14 20 51 c11 28 24 59 29 68 10 19 -20 60 -45 60 -18 0 -21 46 -4 52 6 2 14 26 16 53 4 43 2 52 -16 63 -20 11 -21 10 -21 -25 -1 -209 -5 -248 -32 -305 -34 -73 -116 -188 -133 -188 -8 0 -20 -6 -27 -13 -7 -7 -29 -18 -48 -24 -19 -6 -52 -18 -72 -27 -34 -15 -38 -15 -38 -1 0 35 32 73 89 109 60 37 77 51 45 39 -14 -5 -14 -3 -3 14 7 13 9 28 4 39 -5 11 -7 24 -6 29 1 6 -19 -11 -44 -37 -25 -26 -45 -44 -45 -40 0 4 18 34 40 67 30 45 40 69 40 100 0 53 -11 67 -46 63 -22 -2 -34 -13 -53 -47 -14 -25 -26 -40 -29 -33 -2 7 -10 12 -17 12 -10 0 -14 -33 -17 -142 l-4 -143 -63 -127 c-39 -81 -74 -137 -94 -154 -51 -43 -167 -87 -167 -63 0 6 26 38 58 72 32 34 66 73 75 87 18 26 23 100 8 100 -5 0 -22 -19 -38 -42 -15 -23 -52 -60 -81 -82 -31 -25 -61 -59 -74 -85 -37 -75 -125 -156 -220 -201 -46 -22 -101 -43 -121 -47 -32 -5 -37 -3 -37 13 0 36 50 229 70 269 10 23 38 95 61 160 39 116 84 211 117 248 12 13 13 20 4 29 -9 9 -21 5 -49 -18 -58 -46 -166 -272 -249 -519 -37 -110 -73 -207 -80 -216 -8 -8 -14 -21 -14 -28 0 -8 -19 -54 -41 -105 -23 -50 -61 -146 -84 -212 -49 -144 -77 -193 -152 -274 -71 -77 -89 -77 -115 2 -11 33 -27 59 -36 62 -19 6 -21 27 -23 201 -2 197 49 394 151 580 33 61 72 135 86 165 118 253 140 288 273 462 87 112 121 167 121 195 0 37 -25 27 -75 -29 -42 -48 -45 -50 -38 -23 13 50 9 145 -8 156 -19 12 -30 7 -50 -22 -23 -33 -15 -116 12 -124 28 -9 35 -49 12 -73 -10 -11 -36 -45 -58 -76 -22 -31 -44 -56 -48 -56 -12 0 -3 78 17 160 8 36 15 84 16 107 0 23 4 44 9 47 4 3 11 37 14 75 3 39 14 86 26 109 26 50 80 97 94 83 16 -16 59 -13 85 5 30 21 52 66 52 109 0 33 -2 35 -32 35 -59 0 -78 -12 -118 -69 -21 -31 -55 -74 -74 -96 l-35 -40 -1 41 c0 23 7 60 15 83 15 43 92 151 124 173 20 14 55 77 48 85 -3 2 -8 -5 -12 -16 -7 -24 -35 -17 -35 9 0 23 -13 32 -35 24 -9 -4 -12 -9 -7 -13 17 -10 2 -62 -16 -59 -11 2 -30 -24 -61 -87 -34 -68 -46 -84 -49 -67 -2 12 -8 22 -13 22 -5 0 -9 -10 -9 -22 -1 -23 -1 -23 -16 -3 -9 11 -24 37 -34 58 -11 24 -20 34 -23 25 -3 -7 -6 25 -6 72 -1 105 -21 98 -26 -10 -3 -43 -9 -76 -16 -81 -10 -6 -10 -11 0 -23 14 -16 3 -22 -15 -8 -5 4 2 -2 15 -13 51 -41 78 -76 96 -128 26 -70 25 -187 -3 -292 -13 -49 -21 -109 -20 -155 0 -104 -54 -310 -81 -310 -6 0 -11 3 -11 8 -1 44 -24 191 -41 259 l-22 85 27 108 c30 123 34 211 10 231 -20 16 -40 5 -72 -42 -21 -30 -23 -42 -18 -97 3 -36 1 -60 -4 -57 -17 11 -34 81 -34 150 -1 64 2 76 39 140 22 39 45 84 52 100 17 43 16 92 -2 98 -17 7 -17 8 -44 -73 -12 -36 -34 -87 -50 -113 -33 -56 -41 -48 -41 39 0 41 -4 54 -15 54 -11 0 -15 -18 -17 -80 -2 -45 -7 -80 -13 -80 -5 0 -10 4 -10 8 0 5 -8 16 -18 26 -58 58 -70 132 -53 314 7 69 6 92 -3 92 -6 0 -13 -6 -16 -12z m321 -503 c3 -20 4 -39 0 -42 -3 -4 -6 6 -6 20 0 17 -5 27 -15 27 -16 0 -20 12 -8 23 14 14 22 6 29 -28z m-1006 -80 c0 -8 -9 -15 -19 -15 -29 0 -35 18 -9 23 13 2 24 5 26 6 1 0 2 -6 2 -14z m327 -27 c-3 -7 -5 -2 -5 12 0 14 2 19 5 13 2 -7 2 -19 0 -25z m-462 -358 c3 -5 1 -10 -4 -10 -6 0 -11 5 -11 10 0 6 2 10 4 10 3 0 8 -4 11 -10z m-835 -40 c-6 -11 -15 -20 -19 -20 -5 0 -7 9 -4 20 3 11 12 20 20 20 11 0 11 -4 3 -20z m864 -25 c3 -9 0 -15 -9 -15 -9 0 -15 -10 -16 -27 0 -27 -1 -27 -13 7 -10 25 -10 37 -2 42 18 12 33 9 40 -7z m-892 -863 c38 2 68 0 68 -4 0 -5 -33 -8 -73 -8 -49 0 -80 -5 -95 -16 -21 -14 -22 -14 -22 5 0 14 -6 21 -20 21 -11 0 -20 2 -20 4 0 2 -3 12 -6 21 -6 13 1 13 47 -5 40 -16 70 -21 121 -18z m3218 -91 c0 -10 -7 -21 -15 -25 -11 -4 -15 1 -15 19 0 16 6 25 15 25 8 0 15 -9 15 -19z m-3479 -32 c-14 -5 -30 -14 -37 -20 -8 -7 -13 -3 -17 11 -5 18 0 20 36 19 38 0 40 -1 18 -10z m3359 -572 c0 -7 -7 -22 -15 -33 -13 -17 -14 -16 -4 14 11 33 19 41 19 19z m-3345 -198 c7 -22 -7 -39 -33 -39 -10 0 -10 4 0 20 11 17 10 22 -2 30 -12 8 -11 10 7 10 13 0 24 -8 28 -21z m445 -37 c0 -23 -35 -8 -38 16 -3 21 -2 22 17 10 12 -7 21 -19 21 -26z m-310 -647 c-28 -30 -60 -33 -60 -7 0 26 9 32 48 32 l35 0 -23 -25z M3684 5414 c-14 -21 -16 -41 -10 -124 4 -62 2 -100 -3 -100 -9 0 -17 26 -25 84 -1 11 -8 22 -14 24 -9 3 -12 -27 -12 -105 0 -69 -6 -130 -16 -164 -24 -86 -24 -85 -33 -70 -6 9 -10 3 -14 -17 -4 -20 -23 -43 -59 -72 -29 -23 -54 -46 -54 -51 -1 -5 -3 -39 -4 -76 -1 -46 -4 -60 -9 -43 -6 21 -9 15 -20 -35 -16 -74 -29 -99 -97 -197 -35 -49 -54 -86 -54 -105 0 -31 59 -200 60 -171 0 9 6 21 14 25 13 7 13 16 0 68 -17 72 -12 78 75 93 106 19 127 33 145 95 20 70 65 111 186 172 83 42 89 47 75 62 -9 8 -14 23 -11 32 5 14 5 14 -6 1 -7 -8 -41 -25 -75 -37 -54 -19 -61 -19 -56 -5 10 26 43 72 91 126 46 53 77 104 68 114 -6 6 -95 -81 -143 -141 l-30 -38 -7 80 c-4 45 -5 89 -1 98 3 10 31 34 63 53 61 37 147 112 164 144 21 38 -53 8 -126 -52 -98 -80 -100 -81 -92 -46 12 47 54 133 81 166 14 16 25 42 25 56 l-1 27 -25 -30 -26 -30 6 53 c3 28 9 74 12 100 5 40 3 50 -10 55 -10 4 -22 -2 -32 -19z m-79 -654 c0 -125 0 -126 -33 -176 -22 -36 -56 -67 -109 -103 -42 -28 -82 -51 -90 -51 -20 0 -16 22 11 59 13 18 30 46 36 62 7 16 16 29 20 29 5 0 13 33 20 73 16 102 29 149 40 142 6 -4 10 -2 10 3 0 5 13 25 30 43 16 19 30 38 30 42 0 5 8 7 18 5 15 -3 17 -17 17 -128z M2287 5348 c-10 -10 -22 -16 -27 -13 -5 3 -8 -3 -8 -12 1 -10 -2 -37 -6 -59 -6 -32 -4 -43 7 -47 23 -9 67 61 67 105 0 44 -9 51 -33 26z M1853 5256 c4 -22 11 -42 17 -46 7 -4 14 -26 17 -49 3 -22 10 -41 15 -41 5 0 7 12 4 28 -3 15 -8 46 -11 69 -4 23 -16 49 -27 60 -21 18 -21 18 -15 -21z M1780 5267 c0 -47 15 -79 42 -93 l30 -16 -7 34 c-4 18 -12 44 -19 58 -12 28 -46 40 -46 17z M1960 5120 c0 -21 30 -70 49 -80 27 -14 31 -13 31 10 0 11 5 20 10 20 6 0 8 -11 4 -25 -6 -23 -4 -25 30 -25 20 0 36 4 36 8 0 18 -68 72 -109 87 -52 18 -51 18 -51 5z M4127 5076 c-4 -10 -7 -45 -7 -79 0 -42 -6 -70 -18 -88 -56 -85 -73 -107 -106 -138 -20 -19 -36 -39 -36 -43 0 -18 34 -6 62 23 29 28 34 30 84 24 41 -6 59 -3 83 11 37 22 44 37 28 59 -16 21 -72 22 -95 2 -21 -19 -32 -22 -32 -7 0 5 38 35 84 66 77 51 106 84 106 119 0 26 -43 16 -77 -17 l-33 -32 0 47 c0 34 -4 47 -14 47 -8 0 -16 5 -18 12 -3 7 -7 5 -11 -6z M1049 5043 c-8 -10 -9 -14 -2 -10 7 5 28 -18 57 -63 48 -74 62 -86 52 -45 -4 15 -2 25 4 25 15 0 -17 72 -41 93 -27 22 -53 22 -70 0z M3400 4964 c-14 -37 -12 -60 6 -75 14 -11 18 -10 30 6 19 26 18 81 -2 89 -23 9 -24 8 -34 -20z M3910 4933 c-29 -20 -40 -33 -40 -50 0 -33 63 6 75 45 8 26 -2 28 -35 5z M3401 4844 c0 -11 3 -14 6 -6 3 7 2 16 -1 19 -3 4 -6 -2 -5 -13z M4532 4829 c-8 -12 -9 -18 -3 -14 7 4 11 -8 12 -32 1 -21 4 -51 8 -68 6 -26 8 -22 13 29 5 39 3 67 -5 83 l-12 23 -13 -21z M1017 4820 c-8 -30 16 -52 65 -60 41 -6 45 -5 40 12 -5 20 -68 68 -88 68 -6 0 -14 -9 -17 -20z M2529 4778 c-11 -21 -7 -134 7 -185 8 -30 24 -19 24 17 0 16 7 35 15 44 18 17 20 70 4 115 -13 36 -33 40 -50 9z M830 4767 c0 -24 30 -116 40 -122 11 -7 1 92 -12 118 -10 20 -28 23 -28 4z M4660 4751 c0 -5 -9 -12 -19 -16 -23 -7 -101 -81 -101 -95 0 -26 50 -6 98 38 51 47 67 82 37 82 -8 0 -15 -4 -15 -9z M764 4719 c-7 -13 82 -106 92 -96 11 11 -9 43 -46 75 -27 23 -41 29 -46 21z M1887 4634 c-18 -18 -6 -91 21 -131 79 -118 125 -171 138 -159 10 9 8 18 -9 46 -12 19 -25 37 -29 38 -4 2 -8 25 -8 50 0 60 -15 115 -38 135 -20 19 -65 31 -75 21z M1030 4579 c0 -35 54 -169 68 -169 6 0 12 -8 12 -17 1 -17 2 -17 15 0 11 16 11 26 -5 71 -25 75 -47 114 -70 126 -17 9 -20 8 -20 -11z M697 4553 c19 -54 69 -92 112 -85 36 5 46 34 20 58 -11 9 -22 14 -25 11 -4 -4 -18 3 -32 13 -32 26 -84 28 -75 3z M1150 4486 c0 -36 52 -76 101 -76 47 0 57 29 12 32 -16 1 6 4 47 8 l75 6 -75 2 c-41 1 -85 8 -96 15 -12 6 -31 18 -43 25 -19 12 -21 11 -21 -12z M3909 4427 c-16 -27 -19 -51 -19 -149 0 -111 1 -118 20 -118 15 0 24 14 40 68 39 124 39 215 -1 225 -15 4 -25 -2 -40 -26z M4723 4375 c-30 -13 -33 -18 -33 -60 l0 -45 24 15 c27 18 49 48 60 83 9 26 -4 28 -51 7z M5002 4348 c-5 -7 -23 -40 -40 -73 -32 -65 -106 -146 -156 -172 -17 -9 -51 -21 -75 -28 -46 -11 -63 -28 -38 -38 7 -3 47 2 87 10 58 12 85 13 128 4 96 -19 162 -13 162 15 0 11 -19 14 -82 15 -46 0 -91 4 -101 8 -17 6 -17 8 2 25 11 10 44 25 73 32 34 8 43 13 27 13 -31 1 -44 24 -23 41 8 7 14 21 14 31 0 11 10 36 23 57 33 52 39 72 23 72 -7 0 -18 -6 -24 -12z M3632 4290 c-52 -37 -68 -69 -74 -145 -3 -33 -3 -54 0 -47 3 10 7 9 16 -4 12 -15 18 -14 79 15 69 33 101 66 95 98 -4 22 -37 30 -49 11 -6 -8 -7 10 -3 45 8 68 -2 72 -64 27z M5016 4271 c-11 -12 -16 -24 -12 -28 9 -9 39 22 34 37 -2 7 -10 4 -22 -9z M470 4264 c0 -9 8 -28 18 -42 10 -15 22 -33 27 -40 8 -15 -67 31 -102 62 -13 11 -23 14 -23 8 0 -7 -7 -12 -15 -12 -19 0 -19 -15 2 -50 20 -35 48 -48 118 -56 37 -5 55 -11 55 -20 0 -8 11 -14 25 -14 14 0 25 4 25 10 0 5 -22 43 -50 84 -49 73 -80 100 -80 70z M2382 4102 c-5 -9 -12 -42 -14 -72 -9 -96 18 -125 39 -43 17 66 17 120 -2 127 -8 3 -19 -2 -23 -12z M4235 3850 c36 -39 118 -80 162 -80 30 0 93 41 93 61 0 5 -14 15 -30 24 -25 13 -44 14 -107 6 -43 -5 -80 -6 -83 -1 -3 5 -19 12 -35 16 l-30 7 30 -33z M133 3667 c-19 -41 -15 -59 18 -86 30 -24 135 -55 151 -45 11 7 10 42 -2 49 -5 3 -10 11 -10 17 0 6 7 5 17 -3 12 -10 15 -10 9 -1 -13 22 -84 52 -125 52 -33 0 -40 4 -43 22 -3 21 -4 21 -15 -5z M5265 3631 c-16 -10 -43 -33 -60 -51 l-30 -32 83 4 c77 3 86 6 107 30 35 41 24 68 -29 68 -23 0 -54 -8 -71 -19z M400 3512 c0 -5 -53 -12 -117 -16 -64 -4 -120 -9 -125 -12 -16 -10 -8 -53 13 -65 51 -27 183 0 213 43 13 17 19 18 68 9 29 -5 66 -13 81 -16 22 -6 26 -4 21 9 -5 12 0 16 17 17 13 1 -3 7 -36 14 -106 22 -135 26 -135 17z M5090 3480 c0 -5 9 -10 20 -10 11 0 47 -13 80 -30 57 -29 121 -39 147 -22 22 14 19 45 -7 59 -30 15 -240 18 -240 3z M926 3272 c-12 -11 -6 -94 9 -122 16 -31 39 -47 86 -60 24 -7 29 -5 39 21 19 44 5 94 -34 124 -35 27 -90 47 -100 37z M500 3049 c0 -23 9 -62 20 -85 17 -33 30 -46 70 -62 34 -14 56 -32 70 -54 16 -28 109 -108 125 -108 3 0 5 7 5 15 0 12 7 14 28 9 15 -3 -8 11 -50 32 -42 20 -80 44 -83 53 -4 9 -9 46 -12 84 -5 61 -9 70 -41 98 -34 30 -59 43 -107 55 -24 6 -25 4 -25 -37z M5203 2779 c-18 -11 -35 -29 -38 -40 -7 -22 -20 -25 -32 -6 -8 13 -20 -26 -22 -74 -1 -30 25 -36 35 -7 4 15 9 17 20 7 8 -6 14 -18 14 -26 0 -11 7 -9 27 7 43 33 63 71 63 118 0 49 -14 53 -67 21z M5307 2622 c-34 -32 -86 -72 -115 -88 -51 -29 -61 -46 -29 -52 25 -5 198 81 229 114 15 16 30 41 33 57 7 25 5 27 -24 27 -25 0 -45 -13 -94 -58z M447 2652 c-10 -10 -15 -21 -12 -24 7 -7 75 24 75 34 0 15 -47 8 -63 -10z M263 2600 c-12 -5 -26 -18 -32 -28 -8 -15 -6 -24 13 -41 33 -31 84 -27 160 13 68 36 68 47 1 51 -16 1 -50 5 -75 8 -25 4 -55 3 -67 -3z M996 2540 c-37 -11 -102 -74 -115 -112 l-10 -28 58 0 c48 0 65 5 98 29 49 35 87 86 79 106 -6 17 -62 19 -110 5z M673 2324 c-43 -18 -42 -43 1 -88 33 -35 35 -36 114 -36 70 0 80 2 78 18 0 10 6 16 16 16 13 -1 9 8 -18 40 -19 22 -45 46 -57 53 -29 16 -94 15 -134 -3z M4790 2120 c-9 -17 -5 -20 43 -29 72 -15 166 -19 169 -9 2 5 11 6 21 3 20 -8 23 -35 5 -35 -7 -1 -2 -7 12 -15 29 -17 113 -20 141 -5 24 13 25 36 2 48 -10 5 -58 12 -108 15 -49 3 -117 12 -150 20 -110 28 -124 28 -135 7z M4881 2021 c6 -17 30 -50 53 -75 33 -36 49 -46 74 -46 25 0 32 4 32 19 0 25 -60 77 -99 86 -17 4 -36 15 -41 26 -17 30 -30 23 -19 -10z";
 
 // src/genre-tree/TreeMarkIcon.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 function TreeMarkIcon({ className: className2 }) {
-  return /* @__PURE__ */ jsx17("svg", { viewBox: "0 0 551 567", fill: "currentColor", className: className2, "aria-hidden": true, children: /* @__PURE__ */ jsx17("path", { transform: "translate(0 567) scale(0.1 -0.1)", d: TREE_MARK_PATH }) });
+  return /* @__PURE__ */ jsx19("svg", { viewBox: "0 0 551 567", fill: "currentColor", className: className2, "aria-hidden": true, children: /* @__PURE__ */ jsx19("path", { transform: "translate(0 567) scale(0.1 -0.1)", d: TREE_MARK_PATH }) });
 }
 
 // src/genre-tree/GenrePlayActions.tsx
-import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
 function PlayIcon({ kind }) {
-  return /* @__PURE__ */ jsxs10("span", { "aria-hidden": "true", className: "relative flex items-center justify-center w-5 h-5", children: [
-    kind === "tree" && /* @__PURE__ */ jsx18(TreeMarkIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35" }),
-    kind === "map" && /* @__PURE__ */ jsx18(RegionGlobeIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35" }),
-    kind === "tree-map" && /* @__PURE__ */ jsxs10(Fragment6, { children: [
-      /* @__PURE__ */ jsx18(TreeMarkIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35 [clip-path:inset(0_50%_0_0)]" }),
-      /* @__PURE__ */ jsx18(RegionGlobeIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35 [clip-path:inset(0_0_0_50%)]" })
+  return /* @__PURE__ */ jsxs11("span", { "aria-hidden": "true", className: "relative flex items-center justify-center w-5 h-5", children: [
+    kind === "tree" && /* @__PURE__ */ jsx20(TreeMarkIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35" }),
+    kind === "map" && /* @__PURE__ */ jsx20(RegionGlobeIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35" }),
+    kind === "tree-map" && /* @__PURE__ */ jsxs11(Fragment6, { children: [
+      /* @__PURE__ */ jsx20(TreeMarkIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35 [clip-path:inset(0_50%_0_0)]" }),
+      /* @__PURE__ */ jsx20(RegionGlobeIcon, { className: "absolute -left-1.5 -top-1.5 w-8 h-8 opacity-35 [clip-path:inset(0_0_0_50%)]" })
     ] }),
-    /* @__PURE__ */ jsx18(Play, { className: "relative w-5 h-5 fill-[var(--color-surface)]" })
+    /* @__PURE__ */ jsx20(Play, { className: "relative w-5 h-5 fill-[var(--color-surface)]" })
   ] });
 }
 function playOptions(playlist) {
@@ -1108,13 +1166,13 @@ function playOptions(playlist) {
 function GenrePlayActions({ genrePlaylist, playback }) {
   const { isPlaying, setIsPlaying } = usePlayer4();
   const options = playOptions(genrePlaylist);
-  return /* @__PURE__ */ jsx18(Fragment6, { children: options.map((option) => {
+  return /* @__PURE__ */ jsx20(Fragment6, { children: options.map((option) => {
     const isCurrent = playback.playing?.uuid === genrePlaylist.uuid && (option.selection === void 0 || playback.playing.selectionKey === "" || playback.playing.selectionKey === genreMusicSelectionKey2(option.selection).join());
     const playing = isCurrent && isPlaying;
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx20(
       ActionButton3,
       {
-        icon: playing ? /* @__PURE__ */ jsx18(Pause, { "aria-hidden": "true", className: "w-5 h-5" }) : /* @__PURE__ */ jsx18(PlayIcon, { kind: option.icon }),
+        icon: playing ? /* @__PURE__ */ jsx20(Pause, { "aria-hidden": "true", className: "w-5 h-5" }) : /* @__PURE__ */ jsx20(PlayIcon, { kind: option.icon }),
         label: playing ? "Pause" : option.label,
         caption: String(option.count),
         disabled: option.count === 0,
@@ -1134,11 +1192,11 @@ function GenrePlayActions({ genrePlaylist, playback }) {
 
 // src/genre-tree/GenreDetailExtras.tsx
 import { PanelSection as PanelSection2, Skeleton as Skeleton2 } from "@behindthemusictree/ui";
-import { useFetchGenreOverview } from "@behindthemusictree/app-kit/genre-tree";
+import { useFetchGenreOverview as useFetchGenreOverview2 } from "@behindthemusictree/app-kit/genre-tree";
 
 // src/genre-tree/ClampedText.tsx
 import { useLayoutEffect, useRef as useRef2, useState as useState6 } from "react";
-import { Fragment as Fragment7, jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
 function ClampedText({ children, className: className2 = "" }) {
   const ref = useRef2(null);
   const [expanded, setExpanded] = useState6(false);
@@ -1148,9 +1206,9 @@ function ClampedText({ children, className: className2 = "" }) {
     if (!element || expanded) return;
     setOverflows(element.scrollHeight > element.clientHeight);
   }, [children, expanded]);
-  return /* @__PURE__ */ jsxs11(Fragment7, { children: [
-    /* @__PURE__ */ jsx19("p", { ref, className: `${className2} ${expanded ? "" : "line-clamp-3"}`, children }),
-    (overflows || expanded) && /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsxs12(Fragment7, { children: [
+    /* @__PURE__ */ jsx21("p", { ref, className: `${className2} ${expanded ? "" : "line-clamp-3"}`, children }),
+    (overflows || expanded) && /* @__PURE__ */ jsx21(
       "button",
       {
         type: "button",
@@ -1163,29 +1221,6 @@ function ClampedText({ children, className: className2 = "" }) {
   ] });
 }
 
-// src/genre-tree/CommonsPhoto.tsx
-import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
-function ExternalLink({ href, children }) {
-  return /* @__PURE__ */ jsx20("a", { href, target: "_blank", rel: "noopener noreferrer", className: "underline-offset-2 hover:underline", children });
-}
-function CommonsPhoto({
-  image,
-  alt,
-  creditLabel = "Photo"
-}) {
-  return /* @__PURE__ */ jsxs12("figure", { className: "flex flex-col gap-1.5", children: [
-    /* @__PURE__ */ jsx20("img", { src: image.url, alt, className: "h-64 w-full object-contain bg-[var(--color-surface-muted)] rounded" }),
-    /* @__PURE__ */ jsxs12("figcaption", { className: "text-caption text-[var(--color-text-muted)]", children: [
-      creditLabel,
-      ": ",
-      /* @__PURE__ */ jsx20(ExternalLink, { href: image.pageUrl, children: image.author ?? "Wikimedia Commons" }),
-      ",",
-      " ",
-      image.licenseUrl ? /* @__PURE__ */ jsx20(ExternalLink, { href: image.licenseUrl, children: image.license }) : image.license
-    ] })
-  ] });
-}
-
 // src/genre-tree/GenrePlaylistTracks.tsx
 import { useEffect as useEffect4, useState as useState7 } from "react";
 import { useInfiniteQuery } from "@tanstack/react-query";
@@ -1208,15 +1243,15 @@ import { TracksFailureAlreadyReportedError as TracksFailureAlreadyReportedError2
 
 // src/genre-tree/MusicBrainzRecordingLink.tsx
 import { musicBrainzRecordingUrl } from "@behindthemusictree/app-kit/genre-tree";
-import { Fragment as Fragment8, jsx as jsx21 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx22 } from "react/jsx-runtime";
 function MusicBrainzRecordingLink({
   song,
   children,
   className: className2 = ""
 }) {
   const url = musicBrainzRecordingUrl(song);
-  if (!url) return /* @__PURE__ */ jsx21(Fragment8, { children });
-  return /* @__PURE__ */ jsx21(
+  if (!url) return /* @__PURE__ */ jsx22(Fragment8, { children });
+  return /* @__PURE__ */ jsx22(
     "a",
     {
       href: url,
@@ -1233,7 +1268,7 @@ function MusicBrainzRecordingLink({
 // src/genre-tree/GenrePlaylistTracks.tsx
 import { ArtistNames } from "@behindthemusictree/app-kit/genre-tree";
 import { capitalize, useTrackNoun } from "@behindthemusictree/app-kit/track-noun";
-import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
 var CATALOGUE_PAGE_SIZE = 100;
 var SongPageSchema = PaginatedResponseSchema(SongDetailedSchema).extend({
   overallTotal: z.number().nullable(),
@@ -1320,27 +1355,27 @@ function GenrePlaylistTracks({
     started.catch((error) => {
       console.error("Failed to play genre playlist:", error);
       if (error instanceof TracksFailureAlreadyReportedError2) return;
-      showPopup(/* @__PURE__ */ jsx22(InternalErrorPopup, { errorCode: error instanceof AppError2 ? error.code : ErrorCode2.CLIENT_UNKNOWN }));
+      showPopup(/* @__PURE__ */ jsx23(InternalErrorPopup, { errorCode: error instanceof AppError2 ? error.code : ErrorCode2.CLIENT_UNKNOWN }));
     });
   };
-  return /* @__PURE__ */ jsx22(PanelSection, { title: `${capitalize(trackNoun.plural)}${total !== void 0 ? ` (${total})` : ""}`, children: /* @__PURE__ */ jsxs13("div", { children: [
+  return /* @__PURE__ */ jsx23(PanelSection, { title: `${capitalize(trackNoun.plural)}${total !== void 0 ? ` (${total})` : ""}`, children: /* @__PURE__ */ jsxs13("div", { children: [
     renderTracksToolbar?.(),
-    scope === "me" && !genrePlaylist ? /* @__PURE__ */ jsx22("p", { children: "\u2014" }) : isPending ? /* @__PURE__ */ jsx22(Skeleton, { className: "h-4 w-3/4", "aria-busy": "true" }) : isError && tracks.length === 0 ? /* @__PURE__ */ jsxs13("p", { role: "alert", children: [
+    scope === "me" && !genrePlaylist ? /* @__PURE__ */ jsx23("p", { children: "\u2014" }) : isPending ? /* @__PURE__ */ jsx23(Skeleton, { className: "h-4 w-3/4", "aria-busy": "true" }) : isError && tracks.length === 0 ? /* @__PURE__ */ jsxs13("p", { role: "alert", children: [
       "Couldn't load ",
       trackNoun.plural,
       ".",
       " ",
-      /* @__PURE__ */ jsx22("button", { type: "button", className: "underline", onClick: () => void refetch(), children: "Retry" })
-    ] }) : tracks.length === 0 ? /* @__PURE__ */ jsx22("p", { children: "\u2014" }) : /* @__PURE__ */ jsxs13("ul", { className: "mt-1 max-h-64 overflow-y-auto text-body [container-type:inline-size]", "aria-label": `${genreName} ${trackNoun.plural}`, children: [
+      /* @__PURE__ */ jsx23("button", { type: "button", className: "underline", onClick: () => void refetch(), children: "Retry" })
+    ] }) : tracks.length === 0 ? /* @__PURE__ */ jsx23("p", { children: "\u2014" }) : /* @__PURE__ */ jsxs13("ul", { className: "mt-1 max-h-64 overflow-y-auto text-body [container-type:inline-size]", "aria-label": `${genreName} ${trackNoun.plural}`, children: [
       tracks.map((track, index) => {
         const label = track.artists?.length ? `${track.title} \u2014 ${track.artists.map((artist2) => artist2.name).join(", ")}` : track.title;
         const isCurrent = playerTrackObject?.track.id === track.uuid;
         const isPlaying = isCurrent && playState === PlayStates.PLAYING;
         const text = /* @__PURE__ */ jsxs13("span", { className: TEXT_CELL, children: [
-          /* @__PURE__ */ jsx22("span", { className: TITLE_CELL, children: renderSongLink ? renderSongLink(track) : isSong(track) ? /* @__PURE__ */ jsx22(MusicBrainzRecordingLink, { song: track, className: "hover:underline focus-visible:underline", children: track.title }) : track.title }),
-          track.artists?.length ? /* @__PURE__ */ jsx22("span", { className: SEPARATOR, children: " \u2014 " }) : null,
-          /* @__PURE__ */ jsx22("span", { className: COLUMN_CELL, children: track.artists?.length ? /* @__PURE__ */ jsx22(ArtistNames, { artists: track.artists, renderArtistLink }) : null }),
-          track.album && /* @__PURE__ */ jsx22("span", { className: ALBUM_CELL, children: track.album.name })
+          /* @__PURE__ */ jsx23("span", { className: TITLE_CELL, children: renderSongLink ? renderSongLink(track) : isSong(track) ? /* @__PURE__ */ jsx23(MusicBrainzRecordingLink, { song: track, className: "hover:underline focus-visible:underline", children: track.title }) : track.title }),
+          track.artists?.length ? /* @__PURE__ */ jsx23("span", { className: SEPARATOR, children: " \u2014 " }) : null,
+          /* @__PURE__ */ jsx23("span", { className: COLUMN_CELL, children: track.artists?.length ? /* @__PURE__ */ jsx23(ArtistNames, { artists: track.artists, renderArtistLink }) : null }),
+          track.album && /* @__PURE__ */ jsx23("span", { className: ALBUM_CELL, children: track.album.name })
         ] });
         const leading = renderSongLeading?.(track, index);
         const actions = renderSongActions?.(track);
@@ -1348,7 +1383,7 @@ function GenrePlaylistTracks({
         if (isUnplayable) {
           return /* @__PURE__ */ jsxs13("li", { className: "flex min-h-8 items-center gap-1 px-1 opacity-50", children: [
             leading,
-            /* @__PURE__ */ jsx22(
+            /* @__PURE__ */ jsx23(
               "button",
               {
                 type: "button",
@@ -1356,7 +1391,7 @@ function GenrePlaylistTracks({
                 "aria-disabled": "true",
                 "aria-label": label,
                 className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-full opacity-0 cursor-not-allowed",
-                children: /* @__PURE__ */ jsx22(FaPlay, { size: 10 })
+                children: /* @__PURE__ */ jsx23(FaPlay, { size: 10 })
               }
             ),
             text,
@@ -1369,14 +1404,14 @@ function GenrePlaylistTracks({
             className: `group flex min-h-8 items-center gap-1 rounded px-1 hover:bg-[var(--color-neutral-100)] ${isCurrent ? "font-medium text-[var(--color-primary)]" : ""}`,
             children: [
               leading,
-              /* @__PURE__ */ jsx22(
+              /* @__PURE__ */ jsx23(
                 "button",
                 {
                   type: "button",
                   "aria-label": `${isPlaying ? "Pause" : "Play"} ${label}`,
                   className: `flex h-6 w-6 shrink-0 items-center justify-center rounded-full cursor-pointer group-hover:opacity-100 focus-visible:opacity-100 ${isCurrent && playState !== PlayStates.STOPPED ? "opacity-100" : "opacity-0 [@media(pointer:coarse)]:opacity-100"}`,
                   onClick: () => isCurrent ? handlePlayPauseAction() : play(track.uuid),
-                  children: isCurrent && playState === PlayStates.LOADING ? /* @__PURE__ */ jsx22(RingLoader, { size: 10 }) : isPlaying ? /* @__PURE__ */ jsx22(FaPause, { size: 10 }) : /* @__PURE__ */ jsx22(FaPlay, { size: 10 })
+                  children: isCurrent && playState === PlayStates.LOADING ? /* @__PURE__ */ jsx23(RingLoader, { size: 10 }) : isPlaying ? /* @__PURE__ */ jsx23(FaPause, { size: 10 }) : /* @__PURE__ */ jsx23(FaPlay, { size: 10 })
                 }
               ),
               text,
@@ -1386,7 +1421,7 @@ function GenrePlaylistTracks({
           track.uuid
         );
       }),
-      hasNextPage && /* @__PURE__ */ jsx22("li", { ref: setSentinel, "aria-hidden": "true", className: "h-4" })
+      hasNextPage && /* @__PURE__ */ jsx23("li", { ref: setSentinel, "aria-hidden": "true", className: "h-4" })
     ] })
   ] }) });
 }
@@ -1394,8 +1429,9 @@ function GenrePlaylistTracks({
 // src/genre-tree/GenreDetailExtras.tsx
 import { useTrackNoun as useTrackNoun2 } from "@behindthemusictree/app-kit/track-noun";
 import { SiWikidata, SiWikipedia } from "react-icons/si";
-import { Fragment as Fragment9, jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
 function GenreDetailExtras({
+  imageInCover = false,
   genreUuid,
   genrePlaylist,
   genreName,
@@ -1413,7 +1449,7 @@ function GenreDetailExtras({
   ...trackSlots
 }) {
   const trackNoun = useTrackNoun2();
-  const { data: overview, isPending } = useFetchGenreOverview(
+  const { data: overview, isPending } = useFetchGenreOverview2(
     genreUuid,
     scope,
     getBackendBaseUrl,
@@ -1421,16 +1457,16 @@ function GenreDetailExtras({
   );
   if (isPending) {
     return /* @__PURE__ */ jsxs14(Fragment9, { children: [
-      /* @__PURE__ */ jsx23(PanelSection2, { title: "Summary", children: /* @__PURE__ */ jsx23("div", { "aria-busy": "true", "data-testid": "genre-detail-extras-skeleton", children: /* @__PURE__ */ jsx23(Skeleton2, { className: "h-4 w-3/4" }) }) }),
+      /* @__PURE__ */ jsx24(PanelSection2, { title: "Summary", children: /* @__PURE__ */ jsx24("div", { "aria-busy": "true", "data-testid": "genre-detail-extras-skeleton", children: /* @__PURE__ */ jsx24(Skeleton2, { className: "h-4 w-3/4" }) }) }),
       family
     ] });
   }
-  if (!overview) return /* @__PURE__ */ jsx23(Fragment9, { children: family });
+  if (!overview) return /* @__PURE__ */ jsx24(Fragment9, { children: family });
   const { summary, summarySourceUrl, essentialSongs, image } = overview;
   const wikidataUrl = wikidataId ? `https://www.wikidata.org/wiki/${encodeURIComponent(wikidataId)}` : null;
   return /* @__PURE__ */ jsxs14(Fragment9, { children: [
-    image && /* @__PURE__ */ jsx23(CommonsPhoto, { image, alt: overview.name, creditLabel: "Image" }),
-    (summarySourceUrl || wikidataUrl) && /* @__PURE__ */ jsx23(PanelSection2, { title: "Links", children: /* @__PURE__ */ jsxs14("div", { className: "flex flex-wrap gap-x-3 gap-y-1 text-caption text-[var(--color-text)]", children: [
+    image && (imageInCover ? /* @__PURE__ */ jsx24(CommonsPhotoCredit, { image, creditLabel: "Image" }) : /* @__PURE__ */ jsx24(CommonsPhoto, { image, alt: overview.name, creditLabel: "Image" })),
+    (summarySourceUrl || wikidataUrl) && /* @__PURE__ */ jsx24(PanelSection2, { title: "Links", children: /* @__PURE__ */ jsxs14("div", { className: "flex flex-wrap gap-x-3 gap-y-1 text-caption text-[var(--color-text)]", children: [
       summarySourceUrl && /* @__PURE__ */ jsxs14(
         "a",
         {
@@ -1439,7 +1475,7 @@ function GenreDetailExtras({
           rel: "noopener noreferrer",
           className: "inline-flex items-center gap-1.5 text-[var(--color-text-muted)] hover:text-[var(--color-text)]",
           children: [
-            /* @__PURE__ */ jsx23(SiWikipedia, { "aria-hidden": "true", className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ jsx24(SiWikipedia, { "aria-hidden": "true", className: "h-3.5 w-3.5" }),
             "Wikipedia"
           ]
         }
@@ -1452,17 +1488,17 @@ function GenreDetailExtras({
           rel: "noopener noreferrer",
           className: "inline-flex items-center gap-1.5 text-[var(--color-text-muted)] hover:text-[var(--color-text)]",
           children: [
-            /* @__PURE__ */ jsx23(SiWikidata, { "aria-hidden": "true", className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ jsx24(SiWikidata, { "aria-hidden": "true", className: "h-3.5 w-3.5" }),
             "Wikidata"
           ]
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsx23(PanelSection2, { title: "Summary", children: renderSummary ? renderSummary(overview) : /* @__PURE__ */ jsx23(ClampedText, { className: "text-body text-[var(--color-text)]", children: summary ?? "\u2014" }, genreUuid) }),
+    /* @__PURE__ */ jsx24(PanelSection2, { title: "Summary", children: renderSummary ? renderSummary(overview) : /* @__PURE__ */ jsx24(ClampedText, { className: "text-body text-[var(--color-text)]", children: summary ?? "\u2014" }, genreUuid) }),
     family,
     renderGenreDetailExtras?.(overview),
-    (renderEssentialTracks || essentialSongs) && /* @__PURE__ */ jsx23(PanelSection2, { title: `Essential ${trackNoun.plural}`, children: renderEssentialTracks ? renderEssentialTracks(overview) : essentialSongs && essentialSongs.length > 0 ? /* @__PURE__ */ jsx23("ul", { className: "text-body text-[var(--color-text)]", children: essentialSongs.map((track) => /* @__PURE__ */ jsx23("li", { className: "py-1", children: track.title }, track.uuid)) }) : /* @__PURE__ */ jsx23("p", { className: "text-body text-[var(--color-text)]", children: "\u2014" }) }),
-    /* @__PURE__ */ jsx23(
+    (renderEssentialTracks || essentialSongs) && /* @__PURE__ */ jsx24(PanelSection2, { title: `Essential ${trackNoun.plural}`, children: renderEssentialTracks ? renderEssentialTracks(overview) : essentialSongs && essentialSongs.length > 0 ? /* @__PURE__ */ jsx24("ul", { className: "text-body text-[var(--color-text)]", children: essentialSongs.map((track) => /* @__PURE__ */ jsx24("li", { className: "py-1", children: track.title }, track.uuid)) }) : /* @__PURE__ */ jsx24("p", { className: "text-body text-[var(--color-text)]", children: "\u2014" }) }),
+    /* @__PURE__ */ jsx24(
       GenrePlaylistTracks,
       {
         genreUuid,
@@ -1480,10 +1516,10 @@ function GenreDetailExtras({
 }
 
 // src/genre-tree/GenreInfoPanelBody.tsx
-import { Fragment as Fragment10, jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
 import { createElement } from "react";
 function GenreNodeActionBand({ genrePlaylist, playback, ...bandProps }) {
-  return /* @__PURE__ */ jsx24(GenreActionBand, { ...bandProps, playActions: /* @__PURE__ */ jsx24(GenrePlayActions, { genrePlaylist, playback }) });
+  return /* @__PURE__ */ jsx25(GenreActionBand, { ...bandProps, playActions: /* @__PURE__ */ jsx25(GenrePlayActions, { genrePlaylist, playback }) });
 }
 function GenreInfoPanelBody({
   toolbar,
@@ -1502,7 +1538,7 @@ function GenreInfoPanelBody({
   const selection = summary ? defaultGenreMusicSelection2(summary) : void 0;
   return /* @__PURE__ */ jsxs15(Fragment10, { children: [
     toolbar,
-    genrePlaylist ? /* @__PURE__ */ jsx24(GenreNodeActionBand, { ...band, genrePlaylist, playback }) : /* @__PURE__ */ jsx24(GenreActionBand, { ...band }),
+    genrePlaylist ? /* @__PURE__ */ jsx25(GenreNodeActionBand, { ...band, genrePlaylist, playback }) : /* @__PURE__ */ jsx25(GenreActionBand, { ...band }),
     /* @__PURE__ */ createElement(
       GenreDetailExtras,
       {
@@ -1522,7 +1558,7 @@ function GenreInfoPanelBody({
 }
 
 // src/genre-tree/GenreDetailPanel.tsx
-import { Fragment as Fragment11, jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
 var RELATIVE_ITEM_COUNT = 1;
 function toNode(genre, parentId) {
   return {
@@ -1580,24 +1616,24 @@ function useGenreDetailContent({
   if (result.status === "not-found") return {
     name: null,
     title: "Genre not found",
-    content: /* @__PURE__ */ jsx25("p", { className: "text-[var(--color-text-muted)]", children: "This genre does not exist." })
+    content: /* @__PURE__ */ jsx26("p", { className: "text-[var(--color-text-muted)]", children: "This genre does not exist." })
   };
   if (result.status === "error") return {
     name: null,
     title: "Genre unavailable",
-    content: /* @__PURE__ */ jsx25("p", { role: "alert", className: "text-body text-[var(--color-text)]", children: "This genre could not be loaded." })
+    content: /* @__PURE__ */ jsx26("p", { role: "alert", className: "text-body text-[var(--color-text)]", children: "This genre could not be loaded." })
   };
   if (!detail || !view) return {
     name: null,
     title: "Loading genre\u2026",
     content: /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-3", "aria-busy": "true", "data-testid": "genre-detail-panel-skeleton", children: [
-      /* @__PURE__ */ jsx25(Skeleton3, { className: "h-6 w-2/3" }),
-      /* @__PURE__ */ jsx25(Skeleton3, { className: "h-4 w-full" }),
-      /* @__PURE__ */ jsx25(Skeleton3, { className: "h-4 w-3/4" })
+      /* @__PURE__ */ jsx26(Skeleton3, { className: "h-6 w-2/3" }),
+      /* @__PURE__ */ jsx26(Skeleton3, { className: "h-4 w-full" }),
+      /* @__PURE__ */ jsx26(Skeleton3, { className: "h-4 w-3/4" })
     ] })
   };
   const selectGenre = (nodeId) => onSelectGenre(GenreUuidSchema.parse(nodeId));
-  const family = /* @__PURE__ */ jsx25(
+  const family = /* @__PURE__ */ jsx26(
     GenreNodeFamily,
     {
       node: view.node,
@@ -1608,14 +1644,23 @@ function useGenreDetailContent({
       onSelectNode: selectGenre
     }
   );
-  const ancestors = /* @__PURE__ */ jsx25(GenreNodeAncestors, { ancestorNodes: view.ancestorNodes, onSelectNode: selectGenre });
+  const ancestors = /* @__PURE__ */ jsx26(
+    GenreNodeAncestors,
+    {
+      node: view.node,
+      fill: view.fill,
+      textColor: view.textColor,
+      ancestorNodes: view.ancestorNodes,
+      onSelectNode: selectGenre
+    }
+  );
   return {
     name: detail.name,
     title: detail.name,
     headerAccent: { background: view.fill, color: view.textColor },
     aside: expanded ? ancestors : void 0,
     content: /* @__PURE__ */ jsxs16(Fragment11, { children: [
-      /* @__PURE__ */ jsx25(
+      /* @__PURE__ */ jsx26(
         GenreInfoPanelBody,
         {
           family: /* @__PURE__ */ jsxs16(Fragment11, { children: [
@@ -1630,7 +1675,7 @@ function useGenreDetailContent({
           getBackendBaseUrl,
           playback,
           band: { node: view.node, ...band, shareTarget: band?.shareTarget?.kind === "genre" ? { ...band.shareTarget, name: detail.name } : band?.shareTarget },
-          extras
+          extras: { ...extras, imageInCover: true }
         }
       ),
       trailing
@@ -1662,9 +1707,13 @@ function GenreDetailPanel({
     expanded,
     band: { onZoomIn, shareUrl, shareTarget: shareUrl ? shareTarget : void 0 }
   });
-  return /* @__PURE__ */ jsx25(
-    DetailPanel,
+  return /* @__PURE__ */ jsx26(
+    GenreOverviewDetailPanel,
     {
+      genreUuid: panel.name ? GenreUuidSchema.parse(genreUuid) : null,
+      scope,
+      getBackendBaseUrl,
+      criteriaOverviewSchema: extras?.criteriaOverviewSchema,
       side: "left",
       title: panel.title,
       headerAccent: panel.headerAccent,
@@ -1675,19 +1724,20 @@ function GenreDetailPanel({
       edgeTab,
       aside: panel.aside,
       titleInSearch,
-      headerActions: onExpandedChange ? /* @__PURE__ */ jsx25(IconButton, { "aria-label": expanded ? "Shrink panel" : "Extend panel", onClick: () => onExpandedChange(!expanded), children: expanded ? /* @__PURE__ */ jsx25(Minimize2, { "aria-hidden": "true", className: "h-4 w-4" }) : /* @__PURE__ */ jsx25(Maximize2, { "aria-hidden": "true", className: "h-4 w-4" }) }) : void 0,
+      headerActions: onExpandedChange ? /* @__PURE__ */ jsx26(IconButton, { "aria-label": expanded ? "Shrink panel" : "Extend panel", onClick: () => onExpandedChange(!expanded), children: expanded ? /* @__PURE__ */ jsx26(Minimize2, { "aria-hidden": "true", className: "h-4 w-4" }) : /* @__PURE__ */ jsx26(Maximize2, { "aria-hidden": "true", className: "h-4 w-4" }) }) : void 0,
       children: panel.content
     }
   );
 }
 
 // src/genre-tree/ChangeParentPopup.tsx
-import { useEffect as useEffect5, useMemo as useMemo7 } from "react";
+import { useEffect as useEffect5, useMemo as useMemo7, useState as useState8 } from "react";
 import {
   getReparentCandidates,
   useUpdateGenre
 } from "@behindthemusictree/app-kit/genre-tree";
-import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Button } from "@behindthemusictree/ui";
+import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
 function ChangeParentPopup({
   genrePlaylist,
   genrePlaylists,
@@ -1701,20 +1751,22 @@ function ChangeParentPopup({
     () => getReparentCandidates(genrePlaylists, genrePlaylist.uuid),
     [genrePlaylists, genrePlaylist.uuid]
   );
-  const handleSelect = (newParent) => {
+  const [confirmingRoot, setConfirmingRoot] = useState8(false);
+  const handleMove = (to) => {
     const genre = genrePlaylist.criteria.uuid;
     const parentPlaylistUuid = genrePlaylist.parent?.uuid;
     const from = parentPlaylistUuid ? genrePlaylists.find(({ uuid }) => uuid === parentPlaylistUuid)?.criteria?.uuid ?? null : null;
     mutate(
-      { uuid: genre, data: { parent: newParent.criteria.uuid } },
+      { uuid: genre, data: { parent: to } },
       {
         onSuccess: () => {
           onClose();
-          onParentChanged?.({ genre, from, to: newParent.criteria.uuid });
+          onParentChanged?.({ genre, from, to });
         }
       }
     );
   };
+  const handleSelect = (newParent) => handleMove(newParent.criteria.uuid);
   useEffect5(() => {
     const handleKeyDown = (event) => {
       if (event.key === "Escape") onClose();
@@ -1727,7 +1779,19 @@ function ChangeParentPopup({
       "Current parent: ",
       genrePlaylist.parent?.name ?? "none"
     ] }),
-    /* @__PURE__ */ jsx26("div", { "aria-busy": isPending, className: isPending ? "pointer-events-none opacity-60" : void 0, children: /* @__PURE__ */ jsx26(
+    genrePlaylist.parent && (confirmingRoot ? /* @__PURE__ */ jsxs17("div", { className: "mb-3 text-sm", children: [
+      /* @__PURE__ */ jsxs17("p", { className: "mb-2", children: [
+        genrePlaylist.name,
+        " and its descendants will no longer be under ",
+        genrePlaylist.parent.name,
+        "."
+      ] }),
+      /* @__PURE__ */ jsxs17(PopupButtons, { alignment: "left", children: [
+        /* @__PURE__ */ jsx27(Button, { disabled: isPending, onClick: () => handleMove(null), children: "Confirm" }),
+        /* @__PURE__ */ jsx27(Button, { variant: "secondary", disabled: isPending, onClick: () => setConfirmingRoot(false), children: "Back" })
+      ] })
+    ] }) : /* @__PURE__ */ jsx27("div", { className: "mb-3", children: /* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: () => setConfirmingRoot(true), children: "Make root" }) })),
+    /* @__PURE__ */ jsx27("div", { "aria-busy": isPending, className: isPending ? "pointer-events-none opacity-60" : void 0, children: /* @__PURE__ */ jsx27(
       GenreSearch,
       {
         genrePlaylists: candidates,
@@ -1735,7 +1799,7 @@ function ChangeParentPopup({
         placeholder: "Search a new parent\u2026"
       }
     ) }),
-    formErrors.length > 0 && /* @__PURE__ */ jsx26("p", { role: "alert", className: "mt-3 text-body text-[var(--color-red-500)]", children: formErrors.map(({ message }) => message).join(" ") })
+    formErrors.length > 0 && /* @__PURE__ */ jsx27("p", { role: "alert", className: "mt-3 text-body text-[var(--color-red-500)]", children: formErrors.map(({ message }) => message).join(" ") })
   ] });
 }
 
@@ -1750,7 +1814,7 @@ import { Pause as Pause2, Play as Play2 } from "lucide-react";
 import { ActionBand as ActionBand2, ActionButton as ActionButton4, PanelBleed as PanelBleed2 } from "@behindthemusictree/ui";
 import { TrackListOriginType as TrackListOriginType2, useTrackList as useTrackList3 } from "@behindthemusictree/app-kit/genre-tree";
 import { usePlayer as usePlayer6 } from "@behindthemusictree/app-kit/player";
-import { jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
 function ArtistActionBand({ artist, share }) {
   const { trackList, playNewTrackListFromArtist } = useTrackList3();
   const { isPlaying, setIsPlaying } = usePlayer6();
@@ -1766,11 +1830,11 @@ function ArtistActionBand({ artist, share }) {
       console.error("Failed to load artist tracks:", error);
     });
   };
-  return /* @__PURE__ */ jsx27(PanelBleed2, { children: /* @__PURE__ */ jsxs18(ActionBand2, { children: [
-    /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx28(PanelBleed2, { children: /* @__PURE__ */ jsxs18(ActionBand2, { children: [
+    /* @__PURE__ */ jsx28(
       ActionButton4,
       {
-        icon: playing ? /* @__PURE__ */ jsx27(Pause2, { "aria-hidden": "true", className: "w-5 h-5" }) : /* @__PURE__ */ jsx27(Play2, { "aria-hidden": "true", className: "w-5 h-5" }),
+        icon: playing ? /* @__PURE__ */ jsx28(Pause2, { "aria-hidden": "true", className: "w-5 h-5" }) : /* @__PURE__ */ jsx28(Play2, { "aria-hidden": "true", className: "w-5 h-5" }),
         label: playing ? "Pause" : "Play",
         caption: String(artist.playableTracksCount),
         disabled: artist.playableTracksCount === 0,
@@ -1798,7 +1862,7 @@ import {
   SiYoutube
 } from "react-icons/si";
 import { Chip } from "@behindthemusictree/ui";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var LINK_KINDS = {
   official: { label: "Official website", Icon: Globe },
   wikipedia: { label: "Wikipedia", Icon: SiWikipedia2 },
@@ -1835,7 +1899,7 @@ function artistLinks(artist) {
   return links;
 }
 function ArtistLinks({ links }) {
-  return /* @__PURE__ */ jsx28("ul", { className: "flex flex-wrap gap-1.5", children: links.map(({ key, url, Icon, label }) => /* @__PURE__ */ jsx28("li", { children: /* @__PURE__ */ jsx28(Chip, { href: url, icon: /* @__PURE__ */ jsx28(Icon, { className: "h-3.5 w-3.5 shrink-0", "aria-hidden": "true" }), children: label }) }, key)) });
+  return /* @__PURE__ */ jsx29("ul", { className: "flex flex-wrap gap-1.5", children: links.map(({ key, url, Icon, label }) => /* @__PURE__ */ jsx29("li", { children: /* @__PURE__ */ jsx29(Chip, { href: url, icon: /* @__PURE__ */ jsx29(Icon, { className: "h-3.5 w-3.5 shrink-0", "aria-hidden": "true" }), children: label }) }, key)) });
 }
 
 // src/genre-tree/artist/formatYears.ts
@@ -1846,7 +1910,7 @@ function formatYears(beginYear, endYear, ended) {
 }
 
 // src/genre-tree/artist/ArtistHeader.tsx
-import { Fragment as Fragment12, jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
 var countryNames = new Intl.DisplayNames(["en"], { type: "region" });
 function originLabel(artist, origin) {
   if (origin.source === "area") return "From";
@@ -1875,22 +1939,16 @@ function ArtistHeader({
   if (artist.origin) {
     fields.push({
       label: originLabel(artist, artist.origin),
-      value: /* @__PURE__ */ jsx29(OriginValue, { origin: artist.origin, country, renderPlaceLink })
+      value: /* @__PURE__ */ jsx30(OriginValue, { origin: artist.origin, country, renderPlaceLink })
     });
   }
   if (country && !artist.origin) fields.push({ label: "Country", value: country });
   const years = formatYears(artist.beginYear, artist.endYear, artist.ended);
   if (years) fields.push({ label: "Active", value: years });
   const links = artistLinks(artist);
-  if (links.length > 0) fields.push({ label: "Links", value: /* @__PURE__ */ jsx29(ArtistLinks, { links }) });
+  if (links.length > 0) fields.push({ label: "Links", value: /* @__PURE__ */ jsx30(ArtistLinks, { links }) });
   if (fields.length === 0) return null;
-  return /* @__PURE__ */ jsx29(FieldList, { items: fields });
-}
-
-// src/genre-tree/artist/ArtistPhoto.tsx
-import { jsx as jsx30 } from "react/jsx-runtime";
-function ArtistPhoto({ image, name }) {
-  return /* @__PURE__ */ jsx30(CommonsPhoto, { image, alt: name });
+  return /* @__PURE__ */ jsx30(FieldList, { items: fields });
 }
 
 // src/genre-tree/artist/ArtistMembers.tsx
@@ -1965,7 +2023,7 @@ function ArtistDiscography({ albums }) {
 }
 
 // src/genre-tree/artist/ArtistSongs.tsx
-import { useState as useState8 } from "react";
+import { useState as useState9 } from "react";
 import { keepPreviousData } from "@tanstack/react-query";
 import { Pagination, PanelSection as PanelSection5, Skeleton as Skeleton4 } from "@behindthemusictree/ui";
 import { usePlayer as usePlayer9 } from "@behindthemusictree/app-kit/player";
@@ -2109,8 +2167,8 @@ var SORTS = [
   { ordering: "-albumYear", label: "Year" }
 ];
 function ArtistSongs({ artist, getBackendBaseUrl, renderArtistLink, renderSongLink }) {
-  const [page, setPage] = useState8(1);
-  const [ordering, setOrdering] = useState8("title");
+  const [page, setPage] = useState9(1);
+  const [ordering, setOrdering] = useState9("title");
   const { playNewTrackListFromArtist } = useTrackList5();
   const { playerTrackObject } = usePlayer9();
   const { data, isPending, isError } = usePlaybackQuery({
@@ -2214,6 +2272,7 @@ function useArtistPanel({
       return {
         ...panel,
         title: artist.name,
+        cover: artist.image ? /* @__PURE__ */ jsx36(CommonsCover, { image: artist.image, alt: artist.name }) : void 0,
         content: /* @__PURE__ */ jsxs25(Fragment14, { children: [
           /* @__PURE__ */ jsx36(
             ArtistActionBand,
@@ -2222,7 +2281,7 @@ function useArtistPanel({
               share: shareTarget && shareUrl ? /* @__PURE__ */ jsx36(ShareActionButton, { target: shareTarget, url: shareUrl }) : void 0
             }
           ),
-          artist.image && /* @__PURE__ */ jsx36(ArtistPhoto, { image: artist.image, name: artist.name }),
+          artist.image && /* @__PURE__ */ jsx36(CommonsPhotoCredit, { image: artist.image }),
           /* @__PURE__ */ jsx36(ArtistHeader, { artist, renderPlaceLink }),
           /* @__PURE__ */ jsx36(ArtistMembers, { title: "Members", memberships: artist.members, renderArtistLink }),
           /* @__PURE__ */ jsx36(ArtistMembers, { title: "Member of", memberships: artist.memberOf, renderArtistLink }),
@@ -2249,7 +2308,7 @@ import {
 } from "@behindthemusictree/app-kit/genre-tree";
 
 // src/genre-tree/song/SongPanelContent.tsx
-import { useState as useState9 } from "react";
+import { useState as useState10 } from "react";
 import { Pause as Pause3, Play as Play3 } from "lucide-react";
 import { ActionBand as ActionBand3, ActionButton as ActionButton5, FieldList as FieldList2, PANEL_LABEL_CLASS, PanelBleed as PanelBleed3, PanelSection as PanelSection6, Skeleton as Skeleton6 } from "@behindthemusictree/ui";
 import { PlayStates as PlayStates3, usePlayer as usePlayer10 } from "@behindthemusictree/app-kit/player";
@@ -2265,7 +2324,7 @@ var numberFormat = new Intl.NumberFormat("en");
 var dateFormat = new Intl.DateTimeFormat("en", { dateStyle: "medium" });
 var externalLink = "text-[var(--color-primary)] hover:underline focus-visible:underline";
 function SongHistory({ uuid, getBackendBaseUrl }) {
-  const [open, setOpen] = useState9(false);
+  const [open, setOpen] = useState10(false);
   const history = useSongHistory(uuid, getBackendBaseUrl, open);
   let body = null;
   if (history.status === "loading") body = /* @__PURE__ */ jsx37(Skeleton6, { className: "h-10", "aria-busy": "true" });
@@ -2514,6 +2573,8 @@ function GenreTreeView({
   criteriaOverviewSchema,
   renderGenreDetailExtras,
   floatingControlsLeading,
+  searchTrailingAction,
+  searchFullWidthBreakpoint = "md",
   sizeMetric: controlledSizeMetric,
   onSizeMetricChange,
   renderArtistLink,
@@ -2553,17 +2614,17 @@ function GenreTreeView({
 }) {
   const getShareUrlRef = useRef3(getShareUrl);
   getShareUrlRef.current = getShareUrl;
-  const [internalArtistUuid, setInternalArtistUuid] = useState10(null);
+  const [internalArtistUuid, setInternalArtistUuid] = useState11(null);
   const isArtistControlled = controlledArtistUuid !== void 0;
   const artistUuid = isArtistControlled ? controlledArtistUuid : internalArtistUuid;
-  const [internalSongUuid, setInternalSongUuid] = useState10(null);
+  const [internalSongUuid, setInternalSongUuid] = useState11(null);
   const isSongControlled = controlledSongUuid !== void 0;
   const songUuid = isSongControlled ? controlledSongUuid : internalSongUuid;
   const changeSong = (uuid) => {
     if (!isSongControlled) setInternalSongUuid(uuid);
     onSongUuidChange?.(uuid);
   };
-  const [internalSizeMetric, setInternalSizeMetric] = useState10("songs");
+  const [internalSizeMetric, setInternalSizeMetric] = useState11("songs");
   const sizeMetric = controlledSizeMetric ?? internalSizeMetric;
   const deferredSizeMetric = useDeferredValue2(sizeMetric);
   const changeSizeMetric = (metric) => {
@@ -2607,7 +2668,7 @@ function GenreTreeView({
     artistUuid
   });
   const restoreRevision = viewportRestore?.revision;
-  const [stackedRestoreOwner, setStackedRestoreOwner] = useState10({ revision: restoreRevision, rootUuid: selectedGenrePlaylist?.root.uuid });
+  const [stackedRestoreOwner, setStackedRestoreOwner] = useState11({ revision: restoreRevision, rootUuid: selectedGenrePlaylist?.root.uuid });
   let restoreRootUuid = stackedRestoreOwner.rootUuid;
   if (stackedRestoreOwner.revision !== restoreRevision) {
     restoreRootUuid = selectedGenrePlaylist?.root.uuid;
@@ -2644,8 +2705,8 @@ function GenreTreeView({
     (song) => renderSongLink ? renderSongLink(song) : /* @__PURE__ */ jsx40("button", { type: "button", onClick: () => openSongRef.current(song.uuid), className: "hover:underline", children: song.title }),
     [renderSongLink]
   );
-  const [expandedSongUuid, setExpandedSongUuid] = useState10(null);
-  const [expandedArtistUuid, setExpandedArtistUuid] = useState10(null);
+  const [expandedSongUuid, setExpandedSongUuid] = useState11(null);
+  const [expandedArtistUuid, setExpandedArtistUuid] = useState11(null);
   const artistBaseUrl = artistSearchBaseUrl ?? getBackendBaseUrl;
   const songBaseUrl = getBackendBaseUrl;
   const resolvedRenderArtistLink = renderArtistLink ?? ((artist) => artist.isSpecialPurpose ? artist.name : /* @__PURE__ */ jsx40("button", { type: "button", onClick: () => openArtist(artist.uuid), className: "hover:underline", children: artist.name }));
@@ -2692,8 +2753,8 @@ function GenreTreeView({
     }
   });
   const otherPanel = overlayPanel ?? (selectedGenreUuid !== null ? void 0 : entityPanel);
-  const [uncontrolledCollapsed, setUncontrolledCollapsed] = useState10(false);
-  const [uncontrolledExpanded, setUncontrolledExpanded] = useState10(false);
+  const [uncontrolledCollapsed, setUncontrolledCollapsed] = useState11(false);
+  const [uncontrolledExpanded, setUncontrolledExpanded] = useState11(false);
   const isCollapsed = collapsed ?? uncontrolledCollapsed;
   const isExpanded = expanded ?? uncontrolledExpanded;
   const changeCollapsed = (next) => {
@@ -2707,10 +2768,10 @@ function GenreTreeView({
   useEffect6(() => {
     setUncontrolledCollapsed(false);
   }, [selectedGenreUuid, artistUuid, songUuid]);
-  const [isWheelRevealed, setIsWheelRevealed] = useState10(false);
+  const [isWheelRevealed, setIsWheelRevealed] = useState11(false);
   const usesHandoff = viewMode === "wheel" || viewMode === "pop-core";
   const isTreeReady = !isLoading && !isError && (!usesHandoff || isWheelRevealed);
-  const [resolveStyle, setResolveStyle] = useState10(null);
+  const [resolveStyle, setResolveStyle] = useState11(null);
   const handleNodeStyleResolverChange = useCallback6(
     (resolver) => setResolveStyle(() => resolver),
     []
@@ -2727,7 +2788,7 @@ function GenreTreeView({
   );
   const treeStyles = useMemo8(() => toGenreNodeStyles(relations, visibleGenrePlaylists), [relations, visibleGenrePlaylists]);
   const validSelectedGenreUuid = toGenreUuid(selectedGenreUuid);
-  const [selectionHistory, setSelectionHistory] = useState10({ current: validSelectedGenreUuid, previous: null });
+  const [selectionHistory, setSelectionHistory] = useState11({ current: validSelectedGenreUuid, previous: null });
   if (selectionHistory.current !== validSelectedGenreUuid) {
     setSelectionHistory({ current: validSelectedGenreUuid, previous: selectionHistory.current ?? selectionHistory.previous });
   }
@@ -2821,6 +2882,7 @@ function GenreTreeView({
     activePanel = {
       title: otherPanel.title,
       content: otherPanel.content,
+      cover: otherPanel.cover,
       aside: otherPanel.extraContent,
       expanded: otherPanel.expanded ?? false,
       onExpandedChange: otherPanel.onExpandedChange,
@@ -2911,6 +2973,9 @@ function GenreTreeView({
         onPrevious: handlePrevious,
         onQueryChange: onSearchQueryChange,
         onFocus: onSearchFocus,
+        trailingAction: searchTrailingAction,
+        trailingActionBreakpoint: "md",
+        fullWidthBreakpoint: searchFullWidthBreakpoint,
         extraGroups: extraSearchGroups
       }
     ),
@@ -2937,7 +3002,7 @@ function GenreTreeView({
           role: "group",
           "aria-label": "Tree display options",
           children: !isRotationControlled && viewMode !== "stacked" && viewMode !== "outline" && /* @__PURE__ */ jsx40(
-            Button,
+            Button2,
             {
               variant: allowWheelRotation ? "default" : "outline",
               size: "sm",
@@ -2961,12 +3026,21 @@ function GenreTreeView({
     "div",
     {
       "data-left-panel": isPanelShown && !isCollapsed ? void 0 : "hidden",
-      className: ["genre-tree-view relative flex flex-col h-full", placement === "regions" && REGIONS_CLASS, className2].filter(Boolean).join(" "),
+      className: [
+        "genre-tree-view relative flex flex-col h-full",
+        placement === "regions" && REGIONS_CLASS,
+        placement === "regions" && searchTrailingAction && "max-md:[&:has([data-detail-panel][data-collapsed=false][data-sheet=true]_[aria-label='Resize_panel'][aria-expanded=true])_.actions-container]:top-[max(var(--layout-touch-target),env(safe-area-inset-top))]",
+        className2
+      ].filter(Boolean).join(" "),
       children: [
         /* @__PURE__ */ jsx40(
           "div",
           {
-            className: `actions-container absolute z-30 flex items-center gap-2 ${placement === "regions" ? "left-[calc(var(--layout-gutter)+var(--layout-panel-inset))] top-[calc(var(--layout-gutter)+var(--layout-panel-inset))] md:left-[var(--layout-panel-inset)] md:top-[var(--layout-panel-inset)] max-md:right-[calc(var(--layout-gutter)+var(--layout-panel-inset))] max-md:top-[var(--layout-band-top)] max-md:flex-col max-md:items-stretch" : "left-5 top-5"}`,
+            className: `actions-container absolute z-30 flex items-center gap-2 ${placement === "regions" ? [
+              "left-[calc(var(--layout-gutter)+var(--layout-panel-inset))] top-[calc(var(--layout-gutter)+var(--layout-panel-inset))] md:left-[var(--layout-panel-inset)] md:top-[var(--layout-panel-inset)] max-md:flex-col max-md:items-stretch",
+              searchFullWidthBreakpoint === "sm" ? "max-sm:right-[calc(var(--layout-gutter)+var(--layout-panel-inset))]" : "max-md:right-[calc(var(--layout-gutter)+var(--layout-panel-inset))]",
+              searchTrailingAction ? "max-md:top-[max(var(--layout-panel-inset),env(safe-area-inset-top))]" : "max-md:top-[var(--layout-band-top)]"
+            ].join(" ") : "left-5 top-5"}`,
             children: actions
           }
         ),
@@ -3096,11 +3170,16 @@ function GenreTreeView({
             }
           ) }),
           /* @__PURE__ */ jsx40(
-            DetailPanel2,
+            GenreOverviewDetailPanel,
             {
+              genreUuid: !otherPanel && genreContent.name && selectedGenreUuid ? toGenreUuid(selectedGenreUuid) : null,
+              scope,
+              getBackendBaseUrl,
+              criteriaOverviewSchema,
               ref: panelRef,
               side: "left",
               title: activePanel?.title ?? "",
+              cover: activePanel?.cover,
               titleInSearch: !isLoading && !isError,
               headerAccent: activePanel?.headerAccent,
               headerActions: expandButton,
@@ -3300,7 +3379,8 @@ function TrackListSidebar({
 }
 
 // src/genre-tree/PlayerPanel.tsx
-import { useEffect as useEffect8, useState as useState11 } from "react";
+import { useEffect as useEffect8, useState as useState12 } from "react";
+import { X } from "lucide-react";
 import { twMerge } from "tailwind-merge";
 import {
   usePlayer as usePlayer12,
@@ -3309,7 +3389,7 @@ import {
 import {
   useTrackListSidebarVisibility
 } from "@behindthemusictree/app-kit/genre-tree";
-import { PanelEdgeTab } from "@behindthemusictree/ui";
+import { IconButton as IconButton3, PanelEdgeTab } from "@behindthemusictree/ui";
 
 // src/genre-tree/PlayerControls.tsx
 import { Pause as Pause4, Play as Play4, SkipBack, SkipForward, Volume2, VolumeX } from "lucide-react";
@@ -3434,14 +3514,14 @@ function PlayerPanel({
   renderArtistLink,
   renderSongLink
 }) {
-  const { playerTrackObject, retryPlayback } = usePlayer12();
+  const { playerTrackObject, retryPlayback, stop } = usePlayer12();
   const { toggleTrackListSidebar, isTrackListSidebarVisible } = useTrackListSidebarVisibility();
-  const [lastLoadedTrackTitle, setLastLoadedTrackTitle] = useState11("");
+  const [lastLoadedTrackTitle, setLastLoadedTrackTitle] = useState12("");
   const loadedTrackTitle = playerTrackObject?.track.title;
   useEffect8(() => {
     if (loadedTrackTitle) setLastLoadedTrackTitle(loadedTrackTitle);
   }, [loadedTrackTitle]);
-  const [uncontrolledExtended, setUncontrolledExtended] = useState11(false);
+  const [uncontrolledExtended, setUncontrolledExtended] = useState12(false);
   const isExtendRequested = expanded ?? uncontrolledExtended;
   const setIsExtendRequested = (next) => {
     setUncontrolledExtended(next);
@@ -3494,7 +3574,10 @@ function PlayerPanel({
             ),
             children: [
               /* @__PURE__ */ jsxs31("div", { className: "flex w-[var(--layout-right-w)] shrink-0 flex-col", children: [
-                /* @__PURE__ */ jsx43("div", { className: "flex shrink-0 items-center justify-between gap-2 border-b border-zinc-800 p-2", children: /* @__PURE__ */ jsx43("span", { className: "min-w-0 truncate text-sm font-semibold", children: loadedTrackTitle || lastLoadedTrackTitle }) }),
+                /* @__PURE__ */ jsxs31("div", { className: "flex shrink-0 items-center justify-between gap-2 border-b border-zinc-800 p-2", children: [
+                  /* @__PURE__ */ jsx43("span", { className: "min-w-0 truncate text-sm font-semibold", children: loadedTrackTitle || lastLoadedTrackTitle }),
+                  playerTrackObject && /* @__PURE__ */ jsx43(IconButton3, { "aria-label": "Close player", onClick: stop, children: /* @__PURE__ */ jsx43(X, { "aria-hidden": "true", className: "h-4 w-4" }) })
+                ] }),
                 /* @__PURE__ */ jsxs31("div", { className: "relative w-full shrink-0", children: [
                   /* @__PURE__ */ jsx43(PlayerVideoSurface, { className: "aspect-video w-full bg-black" }),
                   playerTrackObject?.loadError && /* @__PURE__ */ jsxs31("span", { className: "absolute bottom-2 left-2 right-2 text-xs text-red-400", children: [
@@ -3568,7 +3651,7 @@ function Rating({ rating, handleChange }) {
 }
 
 // src/genre-tree/EntityDetailPanel.tsx
-import { useState as useState12 } from "react";
+import { useState as useState13 } from "react";
 import { DetailPanel as DetailPanel3 } from "@behindthemusictree/ui";
 import { Fragment as Fragment17, jsx as jsx45, jsxs as jsxs33 } from "react/jsx-runtime";
 function EntityDetailPanel({
@@ -3587,8 +3670,8 @@ function EntityDetailPanel({
   edgeTab,
   ...navigation
 }) {
-  const [expandedSongUuid, setExpandedSongUuid] = useState12(null);
-  const [expandedArtistUuid, setExpandedArtistUuid] = useState12(null);
+  const [expandedSongUuid, setExpandedSongUuid] = useState13(null);
+  const [expandedArtistUuid, setExpandedArtistUuid] = useState13(null);
   const panel = useEntityPanel({
     scope,
     getBackendBaseUrl,
@@ -3617,6 +3700,7 @@ function EntityDetailPanel({
     {
       side: "left",
       title: panel.title,
+      cover: panel.cover,
       titleInSearch: true,
       onClose: panel.onClose,
       collapsed,
@@ -3658,4 +3742,4 @@ export {
   GenreTreeViewSkeleton2 as GenreTreeViewSkeleton,
   GenreTreeOutlineSkeleton
 };
-//# sourceMappingURL=chunk-PVYUC2PN.js.map
+//# sourceMappingURL=chunk-24PBIPA4.js.map