@nulib/clover 4.2.0 → 4.3.1

package/dist/templates/document/Document.mjs

@@ -34,6 +34,7 @@ function Document({
   headingLevel = 2,
   storageKey = "clover-template-document",
   collapseControls,
+  canvasOptions,
   ...root
 }) {
   const title = titled(
@@ -60,7 +61,8 @@ function Document({
           languages,
           headingLevel,
           storageKey,
-          collapseControls
+          collapseControls,
+          canvasOptions
         }
       )
     }
@@ -81,6 +83,7 @@ function DocumentLayout({
   panelSections,
   panelLabels,
   collapseControls,
+  canvasOptions,
   title
 }) {
   const t = useT();
@@ -241,7 +244,14 @@ function DocumentLayout({
               min: showSidebar && !sidebar.over || docked ? PAGE_MIN : void 0,
               children: [
                 pages && !sidebar.open && /* @__PURE__ */ jsx("div", { className: "clover-template-document-sidebar-closed", children: toggle }),
-                /* @__PURE__ */ jsx(Sheets, { collapseControls, children: !docked && panelToggle })
+                /* @__PURE__ */ jsx(
+                  Sheets,
+                  {
+                    collapseControls,
+                    canvasOptions,
+                    children: !docked && panelToggle
+                  }
+                )
               ]
             }
           ),

package/dist/templates/document/Sheets.mjs

@@ -17,6 +17,7 @@ const ratioOf = (canvas) => {
 };
 function Sheets({
   collapseControls,
+  canvasOptions,
   children
 }) {
   const { clover } = useClover("Document");
@@ -307,6 +308,7 @@ function Sheets({
               {
                 className: "clover-template-document-body",
                 collapseControls,
+                options: canvasOptions,
                 onReady: setHandle,
                 children
               }

package/dist/templates/gallery/Gallery.mjs

@@ -32,6 +32,7 @@ function Gallery({
   storageKey = "clover-template-gallery",
   headingLevel = 2,
   collapseControls,
+  canvasOptions,
   style,
   ...root
 }) {
@@ -83,7 +84,8 @@ function Gallery({
             download,
             languages,
             storageKey,
-            collapseControls
+            collapseControls,
+            canvasOptions
           }
         )
       ]

package/dist/templates/index.d.mts

@@ -156,6 +156,39 @@ export interface RootProps extends Omit<React.HTMLAttributes<HTMLElement>, "chil
 	as?: React.ElementType;
 	children?: React.ReactNode;
 }
+export type BackendKind = "webgl2" | "canvas2d" | "none";
+export interface GestureOptions {
+	/**
+	 * A mouse click zooms in; with Shift, out. With this or `dblClickToZoom`, a double tap
+	 * (a finger, or a pen that does not hover) zooms in.
+	 */
+	clickToZoom: boolean;
+	/** A double click zooms in. Only consulted when `clickToZoom` is off. */
+	dblClickToZoom: boolean;
+	pinchToZoom: boolean;
+	/**
+	 * Plain wheel zooms. Off by default, matching Clover's OpenSeadragon setting, so an
+	 * embedded viewer never swallows page scroll. A trackpad pinch (a wheel event with
+	 * `ctrlKey`) always zooms the image, since it is never a page scroll.
+	 */
+	scrollToZoom: boolean;
+	/**
+	 * The reader may move the camera at all: drag, pinch, wheel, double-click and keys.
+	 * Off, the view stays where the host puts it and only taps are reported (a lone video
+	 * or sound, always fitted to the Body).
+	 */
+	navigable: boolean;
+	/**
+	 * A mouse or pen drag tracks the pointer 1:1 and glides on after a fast release. Off,
+	 * the drag is eased instead and stops where the pointer does. A finger always tracks 1:1 and flicks.
+	 */
+	flickEnabled: boolean;
+	/** Release speed, px/s, below which a drag does not flick. */
+	flickMinSpeed: number;
+	/** Seconds of release velocity the flick travels. */
+	flickMomentum: number;
+}
+export type BackendPreference = "auto" | BackendKind;
 /** A region of the image as shares of it: 0 to 1 across and down. */
 export interface RegionShare {
 	x: number;
@@ -174,6 +207,9 @@ export interface RegionShare {
  *   nor than its limits, at level 0 only a size it lists (Mat, 2026-10-24: "be
  *   responsible when making IIIF image server requests"). What a manifest says of a
  *   service is not trusted to say what its server does.
+ * - A `thumbnail` whose own `width` and `height` already fit the size (`resolveThumbnail`)
+ *   is used as the manifest gives it, with no `info.json` read: the publisher's own URL,
+ *   not one built from what a service says.
  * - Without a service, the image itself is used.
  */
 export interface ThumbnailSource {
@@ -188,6 +224,58 @@ export interface ThumbnailSource {
 	region?: RegionShare | string;
 	/** Used if the service cannot answer. */
 	fallback?: string;
+	/** The pixels `fallback` is, as its own `width` and `height` say (a `thumbnail`'s). */
+	fallbackSize?: {
+		width: number;
+		height: number;
+	};
+}
+export interface CloverCanvasOptions {
+	/** Which painter to use. `auto` (default) tries WebGL2, then Canvas2D. */
+	backend?: BackendPreference;
+	/** Pointer, wheel and keyboard behavior. Wheel zoom is off by default. */
+	gestures?: Partial<GestureOptions>;
+	/** Largest zoom, in CSS pixels per image pixel. Default 1.1. */
+	maxZoomPixelRatio?: number;
+	/** Smallest zoom, as a fraction of the home zoom. Default 0.9. */
+	minZoomImageRatio?: number;
+	/** Seconds for an animation to close most of its distance. 0 disables easing. */
+	animationTime?: number;
+	/**
+	 * Seconds each animation (zoom, glide, home) takes, on a fixed-length spring. Unset,
+	 * the camera eases by `animationTime` instead.
+	 */
+	animationDuration?: number;
+	/** With `animationDuration`, how much of the movement comes early: higher starts faster. Default 6.5. */
+	springStiffness?: number;
+	/** Hold the image inside its bounds while dragging. Default true; false lets it spring back on release. */
+	constrainDuringPan?: boolean;
+	/**
+	 * Milliseconds the controls and navigator stay after a mouse (or a pen that hovers)
+	 * stops moving, or a finger lifts, as the Player's `hideDelay`. Default 3000; `Infinity`
+	 * keeps them once shown. A tap on the picture shows them, and another hides them. Focus
+	 * that no press brought holds them, and so does a paused recording.
+	 * A Timeline's: a Canvas's controls stay in sight, for now (Mat, 2026-11-01).
+	 */
+	hideDelay?: number;
+	/** A time-based Canvas's video or sound. */
+	/**
+	 * An animation Canvas (painting annotations at `#t=` times, one per frame): play on
+	 * arrival, and loop at the end (the reader can turn looping off and on). Inside a `Root`,
+	 * `auto-advance` and `repeat` behaviors set them, and a Manifest's `auto-advance` moves
+	 * on when a non-looping animation ends (`onEnded`, as for video). Neither by default; a
+	 * reader asking for reduced motion is never autoplayed.
+	 */
+	animation?: {
+		autoplay?: boolean;
+		loop?: boolean;
+	};
+	/**
+	 * Credentials, headers and a custom `fetch` for every request the Canvas makes:
+	 * `info.json`, tiles, captions and HLS. A `<video>` or an image without CORS can only
+	 * send credentials. Inside a `Root`, the Root's `request` is used.
+	 */
+	request?: CloverRequest;
 }
 /**
  * What `Items` shows: light models of a Manifest's views or a Collection's members, never
@@ -393,6 +481,8 @@ export type DefaultProps = Omit<RootProps, "children"> & {
 	 * The Body's `collapseControls`.
 	 */
 	collapseControls?: "auto" | "always";
+	/** The Body's Canvas `options`: its gestures, zoom limits and motion. */
+	canvasOptions?: CloverCanvasOptions;
 };
 /**
  * The Viewer's own layout, drawn when no `template` is given: Clover 3.x's Viewer, built
@@ -406,7 +496,7 @@ export type DefaultProps = Omit<RootProps, "children"> & {
  * uncovered: a click there, Escape or the panel's close button puts it away. Size it with
  * `--clover-body-height`.
  */
-export declare function Default({ className, header, headingLevel, panel, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, items, singleItem, storageKey, fill, collapseControls, ...root }: DefaultProps): React.JSX.Element;
+export declare function Default({ className, header, headingLevel, panel, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, items, singleItem, storageKey, fill, collapseControls, canvasOptions, ...root }: DefaultProps): React.JSX.Element;
 export type DocumentProps = Omit<RootProps, "children"> & {
 	/**
 	 * Whether the page thumbnails start shown beside the page. Default `true`. On a phone,
@@ -465,6 +555,8 @@ export type DocumentProps = Omit<RootProps, "children"> & {
 	 * The Body's `collapseControls`.
 	 */
 	collapseControls?: "auto" | "always";
+	/** The Body's Canvas `options`: its gestures, zoom limits and motion. */
+	canvasOptions?: CloverCanvasOptions;
 };
 /**
  * A layout that reads like a PDF viewer: a toolbar, page thumbnails down the left, and
@@ -475,7 +567,7 @@ export type DocumentProps = Omit<RootProps, "children"> & {
  * where there is room for both, and slides out over the page where there is not. Size
  * it with `--clover-template-document-height`.
  */
-export declare function Document({ className, defaultSidebarOpen, singleItem, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, headingLevel, storageKey, collapseControls, ...root }: DocumentProps): React.JSX.Element;
+export declare function Document({ className, defaultSidebarOpen, singleItem, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, headingLevel, storageKey, collapseControls, canvasOptions, ...root }: DocumentProps): React.JSX.Element;
 export type GalleryProps = Omit<RootProps, "children"> & {
 	/** The size of a grid cell. Default `10rem`, through `--clover-items-size`. */
 	size?: string;
@@ -558,6 +650,8 @@ export type GalleryProps = Omit<RootProps, "children"> & {
 	 * Its lightbox's Body's `collapseControls`.
 	 */
 	collapseControls?: "auto" | "always";
+	/** Its lightbox's Body's Canvas `options`: its gestures, zoom limits and motion. */
+	canvasOptions?: CloverCanvasOptions;
 };
 /**
  * A grid framed by what it opens, that opens a cell in a lightbox with the Body and the
@@ -566,7 +660,7 @@ export type GalleryProps = Omit<RootProps, "children"> & {
  * shows that Manifest in the lightbox. Escape, the close button, or a press outside
  * closes it, and focus returns to the cell.
  */
-export declare function Gallery({ className, size, height, gap, items, secondary, summary, lightboxItems, panel, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, storageKey, headingLevel, collapseControls, style, ...root }: GalleryProps): React.JSX.Element;
+export declare function Gallery({ className, size, height, gap, items, secondary, summary, lightboxItems, panel, defaultPanelOpen, panelLayout, panelSections, panelLabels, download, languages, storageKey, headingLevel, collapseControls, canvasOptions, style, ...root }: GalleryProps): React.JSX.Element;
 export interface LightboxProps {
 	open: boolean;
 	onClose: () => void;
@@ -607,6 +701,8 @@ export interface LightboxProps {
 	storageKey?: string | false;
 	/** The Body's `collapseControls`: when the view's controls collapse behind one button. */
 	collapseControls?: "auto" | "always";
+	/** The Body's Canvas `options`: its gestures, zoom limits and motion. */
+	canvasOptions?: CloverCanvasOptions;
 	className?: string;
 }
 /**
@@ -619,9 +715,9 @@ export interface LightboxProps {
  * 2026-11-01: "carousel by default") or the pager (with the position). A modal
  * `<dialog>`'s backdrop always covers the whole window, so this is a layer in the Root, a
  * `dialog` to assistive technology, named by its title: while it is open the rest of the
- * Root is inert, focus is on the view in its strip (on Close with the pager), and Escape,
- * Close, Back or a press on the layer outside the panel closes it, focus going back to
- * what opened it.
+ * Root is inert but what speaks, focus is on the view in its strip (on Close with the
+ * pager), Tab comes round inside it, and Escape, Close, Back or a press on the layer
+ * outside the panel closes it, focus going back to the grid's cell of the view shown.
  * By default it fills the layout's bounds; `--clover-template-lightbox-inset`,
  * `-backdrop` and `-radius` give it room, a backdrop and corners (`Lightbox.css`). The
  * layout positions it and holds its stacking (`position: relative` and `isolation:

package/dist/templates/shared/Lightbox.mjs

@@ -40,7 +40,7 @@ function Lightbox({
     if (!open || !element || !root) return;
     const opener = element.ownerDocument.activeElement;
     const others = Array.from(root.children).filter(
-      (child) => child !== element && !child.classList.contains("clover-announcer")
+      (child) => child !== element && !child.classList.contains("clover-announcer") && !child.classList.contains("clover-status")
     );
     others.forEach((child) => child.inert = true);
     (_b = (_a2 = panel.current) == null ? void 0 : _a2.scrollIntoView) == null ? void 0 : _b.call(_a2, { block: "nearest" });
@@ -48,9 +48,33 @@ function Lightbox({
       '[role="listbox"] [role="option"][aria-selected="true"]'
     );
     (_d = chosen ?? close.current) == null ? void 0 : _d.focus({ preventScroll: true });
+    const doc = element.ownerDocument;
+    let check;
+    const onTab = (event) => {
+      var _a3;
+      if (event.key !== "Tab" || !((_a3 = panel.current) == null ? void 0 : _a3.contains(event.target)))
+        return;
+      const back = event.shiftKey;
+      clearTimeout(check);
+      check = setTimeout(() => {
+        var _a4;
+        const dialog = panel.current;
+        if (!dialog || dialog.contains(doc.activeElement)) return;
+        const stops = stopsOf(dialog);
+        (_a4 = back ? stops.at(-1) : stops[0]) == null ? void 0 : _a4.focus();
+      });
+    };
+    doc.addEventListener("keydown", onTab, true);
     return () => {
+      var _a3, _b2;
+      doc.removeEventListener("keydown", onTab, true);
+      clearTimeout(check);
       others.forEach((child) => child.inert = false);
-      if (opener == null ? void 0 : opener.isConnected) opener.focus({ preventScroll: true });
+      const shown = (_a3 = opener == null ? void 0 : opener.closest('[role="listbox"]')) == null ? void 0 : _a3.querySelector('[role="option"][aria-selected="true"]');
+      const back = shown ?? opener;
+      if (!(back == null ? void 0 : back.isConnected)) return;
+      back.focus({ preventScroll: true });
+      (_b2 = back.scrollIntoView) == null ? void 0 : _b2.call(back, { block: "nearest" });
     };
   }, [open]);
   return /* @__PURE__ */ jsx(
@@ -63,7 +87,12 @@ function Lightbox({
         if (event.target === layer.current) onClose();
       },
       onKeyDown: (event) => {
-        if (event.key !== "Escape" || event.defaultPrevented) return;
+        if (event.defaultPrevented) return;
+        if (event.key === "Tab" && panel.current) {
+          wrapFocus(panel.current, event);
+          return;
+        }
+        if (event.key !== "Escape") return;
         event.preventDefault();
         closing.current();
       },
@@ -149,6 +178,24 @@ function Lightbox({
     }
   );
 }
+const STOPS = 'a[href], button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])';
+const stopsOf = (dialog) => Array.from(dialog.querySelectorAll(STOPS)).filter(
+  (stop) => {
+    var _a;
+    return stop.tabIndex >= 0 && !stop.matches(":disabled") && !stop.closest("[inert]") && (((_a = stop.checkVisibility) == null ? void 0 : _a.call(stop, { visibilityProperty: true })) ?? true);
+  }
+);
+function wrapFocus(dialog, event) {
+  const stops = stopsOf(dialog);
+  const first = stops[0];
+  const last = stops.at(-1);
+  if (!first || !last) return;
+  const at = dialog.ownerDocument.activeElement;
+  if (event.shiftKey ? at === first : at === last) {
+    event.preventDefault();
+    (event.shiftKey ? last : first).focus();
+  }
+}
 function Back({ onOut }) {
   const t = useT();
   const langOf = useLangOf();

package/dist/templates/shared/LightboxView.mjs

@@ -22,7 +22,8 @@ function LightboxView({
   download = true,
   languages = true,
   storageKey,
-  collapseControls
+  collapseControls,
+  canvasOptions
 }) {
   const panes = useRef(null);
   useEffect(() => {
@@ -81,6 +82,7 @@ function LightboxView({
                 {
                   className: "clover-template-lightbox-body",
                   collapseControls,
+                  options: canvasOptions,
                   children: panel && !pane.docked && pane.toggle
                 }
               ),

package/dist/templates.css

@@ -1 +1 @@
-@layer clover{.clover-template-lightbox{position:absolute;inset:0;z-index:10;padding:var(--clover-template-lightbox-inset, 0);background:var(--clover-template-lightbox-backdrop, transparent)}.clover-template-lightbox[hidden]{display:none}.clover-template-lightbox-content{position:sticky;top:calc(var(--clover-template-lightbox-top, 0px) + var(--clover-template-lightbox-inset, 0px));box-sizing:border-box;display:flex;flex-direction:column;gap:var(--clover-space-m);height:min(100%,calc(100vh - var(--clover-template-lightbox-top, 0px) - 2 * var(--clover-template-lightbox-inset, 0px)));padding:var(--clover-inset);border-radius:var(--clover-template-lightbox-radius, 0);background:var(--clover-color-secondary, #fff);color:var(--clover-color-primary, #1a1d1e);--clover-body-height: min(70vh, 48rem)}@supports (height: 1svh){.clover-template-lightbox-content{height:min(100%,calc(100svh - var(--clover-template-lightbox-top, 0px) - 2 * var(--clover-template-lightbox-inset, 0px)));--clover-body-height: min(70svh, 48rem)}}.clover-template-lightbox-content>.clover-template-lightbox-panes{flex:1 1 auto;min-height:0}.clover-template-lightbox-main{display:flex;flex-direction:column;gap:var(--clover-space-m);min-height:0}.clover-template-lightbox-main>.clover-template-lightbox-body{flex:1 1 auto;min-height:0}.clover-template-lightbox-main>.clover-items[data-layout=slider]{flex:none;--clover-items-height: 4rem;--clover-items-lines: 1}.clover-template-lightbox-pending{height:var(--clover-body-height, 60vh);background-color:#0001}.clover-template-lightbox-header{display:flex;align-items:center;gap:var(--clover-space-m)}.clover-template-lightbox-title{flex:1 1 auto;min-width:0}.clover-template-lightbox-caption{flex:none;margin:calc(var(--clover-space-xs) - var(--clover-space-m)) 0 0;overflow-wrap:anywhere}.clover-template-lightbox-back:dir(rtl) svg{transform:scaleX(-1)}button:is(.clover-template-lightbox-back,.clover-template-lightbox-close){flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--clover-control);height:var(--clover-control);padding:0;border:0;border-radius:var(--clover-radius-pill, 2rem);background:transparent;color:inherit;cursor:pointer}button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):is(:hover,:focus-visible){background:var(--clover-color-accent, #0065c3);color:var(--clover-color-control-glyph, #fff)}:where([data-high-contrast]) button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):is(:hover,:focus-visible){background:var(--clover-accent-fill)}:where([data-high-contrast]) button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):hover:not(:focus-visible){outline:var(--clover-accent-ring-hover);outline-offset:1px}.clover-template-document{--clover-template-document-height: min(85vh, 56rem);display:flex;flex-direction:column;height:var(--clover-template-document-height);min-height:min-content;overflow:hidden;background-color:var(--clover-color-secondary, #fff);color:var(--clover-color-primary, #1a1d1e)}@supports (height: 1svh){.clover-template-document{--clover-template-document-height: min(85svh, 56rem)}}.clover-template-document-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--clover-space-s);padding:var(--clover-space-m) var(--clover-inset);border-bottom:1px solid var(--clover-color-secondary-muted, #e6e8eb)}.clover-template-document-provider{max-width:100%;margin-inline-start:auto}.clover-template-document-toolbar .clover-download-groups{flex-direction:row;flex-wrap:wrap;column-gap:var(--clover-space-m)}.clover-template-document-toolbar .clover-download-group{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--clover-space-s)}.clover-template-document-toolbar .clover-download-title{margin:0}.clover-template-document-toolbar .clover-download-list{display:flex;flex-wrap:wrap;column-gap:var(--clover-space-s)}.clover-template-document-title{flex:1 1 6rem;min-width:0}button.clover-template-document-sidebar-toggle{display:inline-flex;flex:none;align-items:center;gap:var(--clover-space-xs);min-height:var(--clover-control);padding-block:0;padding-inline:var(--clover-space-s) calc(var(--clover-space-xs) + var(--clover-space-3xs));border:0;border-radius:var(--clover-radius-pill, 2rem);background-color:var(--clover-color-control, #1a1d1e);color:var(--clover-color-control-glyph, #fff);cursor:pointer;transition:var(--clover-transition, all .2s cubic-bezier(.16, 1, .3, 1))}button.clover-template-document-sidebar-toggle:is(:hover,:focus-visible){background-color:var(--clover-color-accent, #0065c3)}:where([data-high-contrast]) button.clover-template-document-sidebar-toggle:is(:hover,:focus-visible){background-color:var(--clover-accent-fill)}:where([data-high-contrast]) button.clover-template-document-sidebar-toggle:hover:not(:focus-visible){outline:var(--clover-accent-ring-hover);outline-offset:1px}button.clover-template-document-sidebar-toggle:focus-visible{outline:2px solid var(--clover-color-accent, #0065c3);outline-offset:2px}.clover-template-document-sidebar-toggle .clover-template-document-position{color:inherit;font-size:var(--clover-text-xs);white-space:nowrap}.clover-template-document-sidebar-toggle .clover-template-document-position>.clover-pager-room[hidden]{display:none}.clover-template-document-panes{position:relative;flex:1 1 auto;min-height:16rem}.clover-template-document-panes:is([data-panel=over],[data-narrow])>.clover-template-document-main{isolation:isolate}.clover-template-document-sidebar{contain:size;overflow-y:auto;overscroll-behavior:contain;padding:var(--clover-inset);scroll-padding-top:calc(2 * var(--clover-inset) + var(--clover-control));background-color:var(--clover-color-secondary, #fff)}.clover-template-document-sidebar-closed{position:absolute;top:var(--clover-inset);inset-inline-start:var(--clover-inset);z-index:3}@media (width < 31rem){.clover-template-document-toolbar,.clover-template-document-sidebar-closed,.clover-template-document-spine{--clover-inset: var(--clover-space-m)}}.clover-template-document-sidebar[hidden]{display:none}.clover-template-document-sidebar+.clover-split-handle:before{inset-inline-start:0;inset-inline-end:calc(3px - var(--clover-space-l))}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-figure{grid-template-columns:repeat(var(--parts, 1),minmax(0,1fr));gap:var(--clover-space-xs) 0}.clover-template-document-sidebar .clover-items[data-layout] :is(.clover-items-pictures,.clover-items-caption){grid-column:1 / -1;grid-template-columns:subgrid}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-label{contain:inline-size}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-picture[data-empty],.clover-template-document-sidebar .clover-items[data-layout] .clover-items-picture img{width:100%;height:auto;max-height:20rem;aspect-ratio:var(--clover-items-ratio, auto);object-fit:contain}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-caption{font-size:var(--clover-text-s)}.clover-template-document-main{position:relative;overflow:hidden;background-color:var(--clover-color-secondary-muted, #e6e8eb)}.clover-template-document-column{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;container-type:size}.clover-template-document-sheets{position:relative}.clover-template-document-sheet{--clover-template-document-tease: calc(2 * var(--clover-inset));display:flex;justify-content:center;box-sizing:border-box;height:min(100cqh - var(--clover-template-document-tease),(100cqw - 2 * var(--clover-inset)) / var(--ratio) + 2 * var(--clover-inset));padding:var(--clover-inset);transition:opacity .2s ease,height .24s cubic-bezier(.16,1,.3,1)}.clover-template-document-sheet[data-fill]{height:calc(100cqh - var(--clover-template-document-tease))}.clover-template-document-column[data-zoomed] .clover-template-document-sheet[data-active]{height:100cqh}.clover-template-document-column[data-zoomed] .clover-template-document-sheet[data-active]>*{visibility:hidden}.clover-template-document-column[data-zoomed] .clover-template-document-sheet:not([data-active]){--clover-template-document-muted: 0;pointer-events:none}.clover-template-document-sheet:not([data-active]){--clover-template-document-muted: .618;cursor:pointer;opacity:var(--clover-template-document-muted)}.clover-template-document-sheet:not([data-active]):hover{--clover-template-document-muted: .809}@media (prefers-reduced-motion: reduce){.clover-template-document-sheet{transition:none}}.clover-template-document-sheets[data-single]>.clover-template-document-sheet{--clover-template-document-tease: 0px}.clover-template-document-sheet>*{display:block;height:100%;min-width:0}.clover-template-document-sheet[data-fill]>*{object-fit:contain}.clover-template-document-live{--clover-body-height: 100%;position:absolute;inset-inline:0;top:0;height:100%;transition:opacity .16s ease}.clover-template-document-body .clover-canvas{--clover-canvas-inset: var(--clover-inset);background-color:transparent}.clover-template-document-live[data-moved]:not(:focus-within){opacity:0;pointer-events:none}.clover-template-document-column[data-scrolling] .clover-template-document-live:not(:focus-within) .clover-canvas-controls>*{--clover-controls-shown: 0;--clover-controls-events: none}.clover-template-document-column:not([data-zoomed]) :not(.clover-scene)>.clover-canvas-viewport{touch-action:pan-y}.clover-template-document-scrim[data-for=sidebar]{z-index:2}.clover-template-document-panes[data-narrow]{--clover-template-sidebar-width: min(14rem, 80%)}.clover-template-document-panes[data-narrow]>.clover-template-document-sidebar{position:absolute;inset-block:0;inset-inline-start:0;z-index:3;width:var(--clover-template-sidebar-width);border-inline-end:1px solid var(--clover-color-secondary-muted, #e6e8eb);--clover-template-inner: right;--clover-template-toward: 1}.clover-template-document-panes[data-narrow]>.clover-template-document-sidebar:dir(rtl){--clover-template-inner: left;--clover-template-toward: -1}.clover-template-document-spine{position:relative;z-index:4;flex:none;width:0}.clover-template-document-spine>*{position:absolute;top:var(--clover-inset);inset-inline-start:-1.5px;translate:-50%}.clover-template-document-spine:dir(rtl)>*{translate:50%}.clover-template-document-spine[data-for=sidebar]>*{inset-inline:auto calc(1.5px - var(--clover-control) / 2);translate:none}.clover-template-document-panes[data-narrow]>.clover-template-document-spine[data-for=sidebar]{inset-inline-start:var(--clover-template-sidebar-width)}.clover-template-document-panes[data-narrow]>.clover-template-document-spine[data-for=sidebar]>*{inset-inline-end:calc(var(--clover-control) / -2)}.clover-template-gallery{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:var(--clover-space-l);padding:var(--clover-inset);color:var(--clover-color-primary, #1a1d1e)}.clover-template-gallery[data-height=fixed]{box-sizing:border-box;height:var(--clover-template-gallery-height)}.clover-template-gallery[data-height=fixed]>.clover-items{flex:1 1 auto;min-height:0;overflow:auto;margin:calc(-1 * var(--clover-items-ring-room, 4px));padding:var(--clover-items-ring-room, 4px)}.clover-template-gallery-header{flex:none;display:flex;flex-direction:column;gap:var(--clover-space-2xs)}.clover-template-gallery-summary{margin:0;--clover-summary-lines: 2}.clover-template-gallery .clover-items{--clover-items-gap: var(--clover-template-gallery-gap, var(--clover-inset));--clover-items-lines: none}}
+@layer clover{.clover-template-lightbox{position:absolute;inset:0;z-index:10;padding:var(--clover-template-lightbox-inset, 0);background:var(--clover-template-lightbox-backdrop, transparent)}.clover-template-lightbox[hidden]{display:none}.clover-template-lightbox-content{position:sticky;overflow-y:auto;top:calc(var(--clover-template-lightbox-top, 0px) + var(--clover-template-lightbox-inset, 0px));box-sizing:border-box;display:flex;flex-direction:column;gap:var(--clover-space-m);height:min(100%,calc(100vh - var(--clover-template-lightbox-top, 0px) - 2 * var(--clover-template-lightbox-inset, 0px)));padding:var(--clover-inset);border-radius:var(--clover-template-lightbox-radius, 0);background:var(--clover-color-secondary, #fff);color:var(--clover-color-primary, #1a1d1e);--clover-body-height: min(70vh, 48rem)}@supports (height: 1svh){.clover-template-lightbox-content{height:min(100%,calc(100svh - var(--clover-template-lightbox-top, 0px) - 2 * var(--clover-template-lightbox-inset, 0px)));--clover-body-height: min(70svh, 48rem)}}.clover-template-lightbox-content>.clover-template-lightbox-panes{flex:1 1 auto;min-height:16rem}.clover-template-lightbox-main{display:flex;flex-direction:column;gap:var(--clover-space-m);min-height:0}.clover-template-lightbox-main>.clover-template-lightbox-body{flex:1 1 auto;min-height:0}.clover-template-lightbox-main>.clover-items[data-layout=slider]{flex:none;--clover-items-height: 4rem;--clover-items-lines: 1}.clover-template-lightbox-pending{height:var(--clover-body-height, 60vh);background-color:#0001}.clover-template-lightbox-header{display:flex;align-items:center;gap:var(--clover-space-m)}.clover-template-lightbox-title{flex:1 1 auto;min-width:0}.clover-template-lightbox-caption{flex:none;margin:calc(var(--clover-space-xs) - var(--clover-space-m)) 0 0;overflow-wrap:anywhere}.clover-template-lightbox-back:dir(rtl) svg{transform:scaleX(-1)}button:is(.clover-template-lightbox-back,.clover-template-lightbox-close){flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--clover-control);height:var(--clover-control);padding:0;border:0;border-radius:var(--clover-radius-pill, 2rem);background:transparent;color:inherit;cursor:pointer}button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):is(:hover,:focus-visible){background:var(--clover-color-accent, #0065c3);color:var(--clover-color-control-glyph, #fff)}:where([data-high-contrast]) button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):is(:hover,:focus-visible){background:var(--clover-accent-fill)}:where([data-high-contrast]) button:is(.clover-template-lightbox-back,.clover-template-lightbox-close):hover:not(:focus-visible){outline:var(--clover-accent-ring-hover);outline-offset:1px}.clover-template-document{--clover-template-document-height: min(85vh, 56rem);display:flex;flex-direction:column;height:var(--clover-template-document-height);min-height:min-content;overflow:hidden;background-color:var(--clover-color-secondary, #fff);color:var(--clover-color-primary, #1a1d1e)}@supports (height: 1svh){.clover-template-document{--clover-template-document-height: min(85svh, 56rem)}}.clover-template-document-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--clover-space-s);padding:var(--clover-space-m) var(--clover-inset);border-bottom:1px solid var(--clover-color-secondary-muted, #e6e8eb)}.clover-template-document-provider{max-width:100%;margin-inline-start:auto}.clover-template-document-toolbar .clover-download-groups{flex-direction:row;flex-wrap:wrap;column-gap:var(--clover-space-m)}.clover-template-document-toolbar .clover-download-group{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--clover-space-s)}.clover-template-document-toolbar .clover-download-title{margin:0}.clover-template-document-toolbar .clover-download-list{display:flex;flex-wrap:wrap;column-gap:var(--clover-space-s)}.clover-template-document-title{flex:1 1 6rem;min-width:0}button.clover-template-document-sidebar-toggle{display:inline-flex;flex:none;align-items:center;gap:var(--clover-space-xs);min-height:var(--clover-control);padding-block:0;padding-inline:var(--clover-space-s) calc(var(--clover-space-xs) + var(--clover-space-3xs));border:0;border-radius:var(--clover-radius-pill, 2rem);background-color:var(--clover-color-control, #1a1d1e);color:var(--clover-color-control-glyph, #fff);cursor:pointer;transition:var(--clover-transition, all .2s cubic-bezier(.16, 1, .3, 1))}button.clover-template-document-sidebar-toggle:is(:hover,:focus-visible){background-color:var(--clover-color-accent, #0065c3)}:where([data-high-contrast]) button.clover-template-document-sidebar-toggle:is(:hover,:focus-visible){background-color:var(--clover-accent-fill)}:where([data-high-contrast]) button.clover-template-document-sidebar-toggle:hover:not(:focus-visible){outline:var(--clover-accent-ring-hover);outline-offset:1px}button.clover-template-document-sidebar-toggle:focus-visible{outline:2px solid var(--clover-color-accent, #0065c3);outline-offset:2px}.clover-template-document-sidebar-toggle .clover-template-document-position{color:inherit;font-size:var(--clover-text-xs);white-space:nowrap}.clover-template-document-sidebar-toggle .clover-template-document-position>.clover-pager-room[hidden]{display:none}.clover-template-document-panes{position:relative;flex:1 1 auto;min-height:16rem}.clover-template-document-panes:is([data-panel=over],[data-narrow])>.clover-template-document-main{isolation:isolate}.clover-template-document-sidebar{contain:size;overflow-y:auto;overscroll-behavior:contain;padding:var(--clover-inset);scroll-padding-top:calc(2 * var(--clover-inset) + var(--clover-control));background-color:var(--clover-color-secondary, #fff)}.clover-template-document-sidebar-closed{position:absolute;top:var(--clover-inset);inset-inline-start:var(--clover-inset);z-index:3}@media (width < 31rem){.clover-template-document-toolbar,.clover-template-document-sidebar-closed,.clover-template-document-spine{--clover-inset: var(--clover-space-m)}}.clover-template-document-sidebar[hidden]{display:none}.clover-template-document-sidebar+.clover-split-handle:before{inset-inline-start:0;inset-inline-end:calc(3px - var(--clover-space-l))}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-figure{grid-template-columns:repeat(var(--parts, 1),minmax(0,1fr));gap:var(--clover-space-xs) 0}.clover-template-document-sidebar .clover-items[data-layout] :is(.clover-items-pictures,.clover-items-caption){grid-column:1 / -1;grid-template-columns:subgrid}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-label{contain:inline-size}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-picture[data-empty],.clover-template-document-sidebar .clover-items[data-layout] .clover-items-picture img{width:100%;height:auto;max-height:20rem;aspect-ratio:var(--clover-items-ratio, auto);object-fit:contain}.clover-template-document-sidebar .clover-items[data-layout] .clover-items-caption{font-size:var(--clover-text-s)}.clover-template-document-main{position:relative;overflow:hidden;background-color:var(--clover-color-secondary-muted, #e6e8eb)}.clover-template-document-column{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;container-type:size}.clover-template-document-sheets{position:relative}.clover-template-document-sheet{--clover-template-document-tease: calc(2 * var(--clover-inset));display:flex;justify-content:center;box-sizing:border-box;height:min(100cqh - var(--clover-template-document-tease),(100cqw - 2 * var(--clover-inset)) / var(--ratio) + 2 * var(--clover-inset));padding:var(--clover-inset);transition:opacity .2s ease,height .24s cubic-bezier(.16,1,.3,1)}.clover-template-document-sheet[data-fill]{height:calc(100cqh - var(--clover-template-document-tease))}.clover-template-document-column[data-zoomed] .clover-template-document-sheet[data-active]{height:100cqh}.clover-template-document-column[data-zoomed] .clover-template-document-sheet[data-active]>*{visibility:hidden}.clover-template-document-column[data-zoomed] .clover-template-document-sheet:not([data-active]){--clover-template-document-muted: 0;pointer-events:none}.clover-template-document-sheet:not([data-active]){--clover-template-document-muted: .618;cursor:pointer;opacity:var(--clover-template-document-muted)}.clover-template-document-sheet:not([data-active]):hover{--clover-template-document-muted: .809}@media (prefers-reduced-motion: reduce){.clover-template-document-sheet{transition:none}}.clover-template-document-sheets[data-single]>.clover-template-document-sheet{--clover-template-document-tease: 0px}.clover-template-document-sheet>*{display:block;height:100%;min-width:0}.clover-template-document-sheet[data-fill]>*{object-fit:contain}.clover-template-document-live{--clover-body-height: 100%;position:absolute;inset-inline:0;top:0;height:100%;transition:opacity .16s ease}.clover-template-document-body .clover-canvas{--clover-canvas-inset: var(--clover-inset);background-color:transparent}.clover-template-document-live[data-moved]:not(:focus-within){opacity:0;pointer-events:none}.clover-template-document-column[data-scrolling] .clover-template-document-live:not(:focus-within) .clover-canvas-controls>*{--clover-controls-shown: 0;--clover-controls-events: none}.clover-template-document-column:not([data-zoomed]) :not(.clover-scene)>.clover-canvas-viewport{touch-action:pan-y}.clover-template-document-scrim[data-for=sidebar]{z-index:2}.clover-template-document-panes[data-narrow]{--clover-template-sidebar-width: min(14rem, 80%)}.clover-template-document-panes[data-narrow]>.clover-template-document-sidebar{position:absolute;inset-block:0;inset-inline-start:0;z-index:3;width:var(--clover-template-sidebar-width);border-inline-end:1px solid var(--clover-color-secondary-muted, #e6e8eb);--clover-template-inner: right;--clover-template-toward: 1}.clover-template-document-panes[data-narrow]>.clover-template-document-sidebar:dir(rtl){--clover-template-inner: left;--clover-template-toward: -1}.clover-template-document-spine{position:relative;z-index:4;flex:none;width:0}.clover-template-document-spine>*{position:absolute;top:var(--clover-inset);inset-inline-start:-1.5px;translate:-50%}.clover-template-document-spine:dir(rtl)>*{translate:50%}.clover-template-document-spine[data-for=sidebar]>*{inset-inline:auto calc(1.5px - var(--clover-control) / 2);translate:none}.clover-template-document-panes[data-narrow]>.clover-template-document-spine[data-for=sidebar]{inset-inline-start:var(--clover-template-sidebar-width)}.clover-template-document-panes[data-narrow]>.clover-template-document-spine[data-for=sidebar]>*{inset-inline-end:calc(var(--clover-control) / -2)}.clover-template-gallery{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:var(--clover-space-l);padding:var(--clover-inset);color:var(--clover-color-primary, #1a1d1e)}.clover-template-gallery[data-height=fixed]{box-sizing:border-box;height:var(--clover-template-gallery-height)}.clover-template-gallery[data-height=fixed]>.clover-items{flex:1 1 auto;min-height:0;overflow:auto;margin:calc(-1 * var(--clover-items-ring-room, 4px));padding:var(--clover-items-ring-room, 4px)}.clover-template-gallery-header{flex:none;display:flex;flex-direction:column;gap:var(--clover-space-2xs)}.clover-template-gallery-summary{margin:0;--clover-summary-lines: 2}.clover-template-gallery .clover-items{--clover-items-gap: var(--clover-template-gallery-gap, var(--clover-inset));--clover-items-lines: none}}

package/dist/ui/Button.mjs

@@ -12,7 +12,8 @@ const Button = ({
   expanded,
   controls,
   shortcut,
-  lang
+  lang,
+  unavailable
 }) => {
   const buttonType = id.split("-")[0];
   const dataButton = buttonType.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
@@ -24,6 +25,7 @@ const Button = ({
       "data-testid": "clover-canvas-button",
       "data-button": dataButton,
       onClick,
+      "aria-disabled": unavailable || void 0,
       "aria-expanded": expanded,
       "aria-controls": controls,
       "aria-label": label,

package/dist/ui/ControlCluster.mjs

@@ -15,7 +15,8 @@ function renderControl({
   expanded,
   controls,
   shortcut,
-  lang
+  lang,
+  unavailable
 }, controlButtons) {
   const Custom = controlButtons == null ? void 0 : controlButtons[key];
   if (Custom)
@@ -28,7 +29,8 @@ function renderControl({
           "aria-label": label,
           ...lang && { lang },
           ...shortcut && { "aria-keyshortcuts": shortcut.keys },
-          onClick,
+          onClick: unavailable ? void 0 : onClick,
+          ...unavailable && { "aria-disabled": true },
           ...expanded !== void 0 && {
             "aria-expanded": expanded,
             "aria-controls": controls
@@ -45,7 +47,8 @@ function renderControl({
     {
       id,
       label,
-      onClick,
+      onClick: unavailable ? void 0 : onClick,
+      unavailable,
       expanded,
       controls,
       shortcut,

package/dist/ui/Markup.mjs

@@ -15,16 +15,16 @@ ${text}` : text;
     Promise.all([
       import("../core/sanitize.mjs"),
       markdown ? import("../core/markdown.mjs") : null
-    ]).then(([{ sanitizeHTML }, md]) => {
+    ]).then(([{ sanitizeHTML, trusted }, md]) => {
       const source = md ? md.markdownToHtml(text, { headingLevel }) : text;
-      if (live)
-        setHtml({ for: key, html: sanitizeHTML(source, { markdown: !!md }) });
+      const clean = sanitizeHTML(source, { markdown: !!md });
+      if (live) setHtml({ for: key, html: clean, inner: trusted(clean) });
     });
     return () => {
       live = false;
     };
   }, [text, key, markup, markdown, headingLevel]);
-  return markup && (html == null ? void 0 : html.for) === key ? html.html : null;
+  return markup && (html == null ? void 0 : html.for) === key ? html : null;
 }
 const INLINE_ONLY = /* @__PURE__ */ new Set([
   "p",
@@ -50,11 +50,12 @@ const Markup = forwardRef(function Markup2({ as: Tag = "span", markup, language,
   const written = languageProps(lang);
   const kind = readAs(format, text);
   const markdown = kind === "markdown";
-  const html = useSanitized(
+  const sanitized = useSanitized(
     kind === "plain" ? "" : text,
     markdown,
     headingLevel
   );
+  const html = (sanitized == null ? void 0 : sanitized.html) ?? null;
   if (!text) return null;
   if (kind === "plain")
     return /* @__PURE__ */ jsx(Tag, { ref, ...rest, ...written, children: text.split(/\r?\n/).map((line, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
@@ -62,13 +63,13 @@ const Markup = forwardRef(function Markup2({ as: Tag = "span", markup, language,
       line
     ] }, index)) });
   const Box = typeof Tag === "string" && INLINE_ONLY.has(Tag) && html && /<(p|ul|ol|div)[\s>]/i.test(html) ? "div" : Tag;
-  return html !== null ? /* @__PURE__ */ jsx(
+  return sanitized ? /* @__PURE__ */ jsx(
     Box,
     {
       ref,
       ...rest,
       ...written,
-      dangerouslySetInnerHTML: { __html: html }
+      dangerouslySetInnerHTML: { __html: sanitized.inner }
     }
   ) : (
     // Until the sanitizer arrives, Markdown shows without its syntax.

package/dist/ui/Tip.mjs

@@ -87,6 +87,10 @@ function placeTip(event) {
   const tip = control && tipOf(control);
   if (tip) keepInside(tip);
 }
+function placeTipAgain(control) {
+  const tip = tipOf(controlOf(control));
+  if (tip && isShown(tip)) keepInside(tip);
+}
 function tipOf(control) {
   return Array.from(control.children).find(
     (child) => child.classList.contains("clover-tip")
@@ -197,5 +201,6 @@ export {
   SHORTCUT_KEYS,
   Tip,
   forwardShortcut,
-  hideUntilBack
+  hideUntilBack,
+  placeTipAgain
 };

package/dist/ui/adoptSheet.mjs

@@ -0,0 +1,19 @@
+"use client";
+const adopted = /* @__PURE__ */ new Set();
+function adoptSheet(name, css) {
+  if (typeof document === "undefined" || adopted.has(name)) return;
+  adopted.add(name);
+  if ("adoptedStyleSheets" in document && "replaceSync" in CSSStyleSheet.prototype) {
+    const sheet = new CSSStyleSheet();
+    sheet.replaceSync(css);
+    document.adoptedStyleSheets = [...document.adoptedStyleSheets, sheet];
+    return;
+  }
+  const style = document.createElement("style");
+  style.dataset.clover = name;
+  style.textContent = css;
+  document.head.append(style);
+}
+export {
+  adoptSheet
+};

package/dist/ui/sheets/map.mjs

@@ -0,0 +1,5 @@
+"use client";
+const __clover_sheet_map = '@layer clover{.clover-geomap{display:grid;gap:var(--clover-space-s)}.clover-geomap>div:first-child{overflow:hidden;border-radius:var(--clover-radius, 3px);background-color:var(--clover-color-secondary-muted, #e6e8eb)}.clover-geomap-error{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:var(--clover-space-m);color:var(--clover-color-primary-muted, #26292b);text-align:center}.clover-geomap>div:has(.maplibregl-canvas:focus-visible):after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 2px var(--clover-color-primary, #1a1d1e),inset 0 0 0 5px var(--clover-color-accent, #0065c3),inset 0 0 0 7px var(--clover-color-secondary, #fff);pointer-events:none}.clover-geomap .maplibregl-map{font:inherit!important}.clover-geomap{--clover-map-controls-inset: var(--clover-inset);--clover-map-controls-top: 0px;--clover-map-controls-start: calc( 2 * var(--clover-control) + 2 * var(--clover-space-s) )}.clover-geomap :is(.maplibregl-ctrl-top-right,.maplibregl-ctrl-bottom-right){right:var(--clover-map-controls-inset)!important}.clover-geomap .maplibregl-ctrl-top-right{top:var(--clover-map-controls-inset)!important}.clover-geomap :is(.maplibregl-ctrl-bottom-left,.maplibregl-ctrl-bottom-right){bottom:var(--clover-map-controls-inset)!important}.clover-geomap .maplibregl-ctrl-bottom-left{left:var(--clover-map-controls-inset)!important}.clover-geomap :is(.maplibregl-ctrl-top-right,.maplibregl-ctrl-bottom-left,.maplibregl-ctrl-bottom-right)>.maplibregl-ctrl{float:none!important;margin:0!important}.clover-geomap .maplibregl-ctrl-group{display:flex;gap:var(--clover-space-s);border-radius:0!important;background:none!important;box-shadow:none!important}.clover-geomap .maplibregl-ctrl-group button{position:relative!important;display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;width:var(--clover-control)!important;height:var(--clover-control)!important;border:0!important;border-radius:var(--clover-radius-pill, 2rem)!important;background-color:var(--clover-color-control, #1a1d1e)!important;background-image:none!important;color:var(--clover-color-control-glyph, #fff);cursor:pointer;transition:var(--clover-transition, all .2s cubic-bezier(.16, 1, .3, 1))}.clover-geomap .maplibregl-ctrl-group button:is(:hover,:focus-visible){background-color:var(--clover-color-accent, #0065c3)!important;box-shadow:none!important}:where([data-high-contrast]) .clover-geomap .maplibregl-ctrl-group button:is(:hover,:focus-visible){background-color:var(--clover-accent-fill)!important}:where([data-high-contrast]) .clover-geomap .maplibregl-ctrl-group button:hover:not(:focus-visible){outline:var(--clover-accent-ring-hover)!important;outline-offset:1px!important}.clover-geomap .maplibregl-ctrl-group button .maplibregl-ctrl-icon{display:none!important}.clover-geomap .clover-geomap-glyph{flex:none;width:1rem;height:1rem}.clover-geomap>div:first-child{container-type:size}.clover-geomap .maplibregl-ctrl-attrib.maplibregl-compact{display:flex;flex-direction:row-reverse;align-items:flex-end;gap:var(--clover-space-xs);box-sizing:border-box!important;min-height:0!important;max-width:calc(100cqi - 2 * var(--clover-map-controls-inset) - var(--clover-map-controls-start));margin:0!important;padding:0!important;border-radius:0!important;background:none!important;color:inherit}.clover-geomap .maplibregl-ctrl-attrib-button{position:relative!important;inset:auto!important;display:inline-flex!important;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--clover-space-l)!important;height:var(--clover-space-l)!important;border:0!important;border-radius:var(--clover-radius-pill, 2rem)!important;background-color:var(--clover-color-control, #1a1d1e)!important;background-image:none!important;color:var(--clover-color-control-glyph, #fff);cursor:pointer;list-style:none;transition:var(--clover-transition, all .2s cubic-bezier(.16, 1, .3, 1))}.clover-geomap .maplibregl-ctrl-attrib-button::-webkit-details-marker{display:none}.clover-geomap .maplibregl-ctrl-attrib-button:before{content:none!important}.clover-geomap .maplibregl-ctrl-attrib-button .clover-geomap-glyph{width:var(--clover-text-s);height:var(--clover-text-s)}.clover-geomap :is(.maplibregl-ctrl-attrib-button:is(:hover,:focus-visible),.maplibregl-compact-show>.maplibregl-ctrl-attrib-button){background-color:var(--clover-color-accent, #0065c3)!important;box-shadow:none!important}:where([data-high-contrast]) .clover-geomap :is(.maplibregl-ctrl-attrib-button:is(:hover,:focus-visible),.maplibregl-compact-show>.maplibregl-ctrl-attrib-button){background-color:var(--clover-accent-fill)!important}:where([data-high-contrast]) .clover-geomap .maplibregl-ctrl-attrib-button:hover:not(:focus-visible){outline:var(--clover-accent-ring-hover)!important;outline-offset:1px!important}:where([data-high-contrast]) .clover-geomap .maplibregl-compact-show>.maplibregl-ctrl-attrib-button:not(:focus-visible){outline:var(--clover-accent-ring)!important;outline-offset:1px!important}.clover-geomap .maplibregl-compact-show>.maplibregl-ctrl-attrib-button>.clover-tip{opacity:0;visibility:hidden}.clover-geomap .maplibregl-compact-show .maplibregl-ctrl-attrib-inner{box-sizing:border-box;min-width:0;max-height:max(calc(100cqb - 2 * var(--clover-map-controls-inset) - var(--clover-map-controls-top)),calc(2lh + 2 * var(--clover-space-2xs)));overflow-y:auto;padding:var(--clover-space-2xs) var(--clover-space-xs);border-radius:var(--clover-radius, 3px);background-color:var(--clover-color-primary, #1a1d1e);color:var(--clover-color-secondary, #fff);font-size:var(--clover-text-s);line-height:inherit;text-align:end;overflow-wrap:anywhere}.clover-geomap .maplibregl-ctrl-attrib-inner a{color:inherit!important;text-decoration:underline!important}.clover-geomap .maplibregl-ctrl-top-right .clover-tip{top:calc(100% + var(--clover-space-xs));bottom:auto}.clover-geomap .maplibregl-ctrl-top-right .clover-tip:before{top:auto;bottom:100%}@media (forced-colors: active){.clover-geomap :is(.maplibregl-ctrl-group button,.maplibregl-ctrl-attrib-button){border:1px solid ButtonText!important}}@media (forced-colors: active){.clover-geomap>div:has(.maplibregl-canvas:focus-visible):after{box-shadow:none;outline:3px solid CanvasText;outline-offset:-3px}}.clover-geomap-popup .maplibregl-popup-content{padding:var(--clover-space-2xs) var(--clover-space-xs);border-radius:var(--clover-radius, 3px);background-color:var(--clover-color-primary, #1a1d1e)!important;box-shadow:none!important;color:var(--clover-color-secondary, #fff);font:inherit;font-size:var(--clover-text-s)}.clover-geomap-popup{pointer-events:none}.clover-geomap-popup .maplibregl-popup-tip{display:none!important}.clover-geomap-popup .maplibregl-popup-content{max-width:min(18rem,100cqi - 2 * var(--clover-space-xs))}.clover-geomap-popup-date{display:block;color:var(--clover-color-secondary-alt, #c1c8cd)}.clover-geomap-places :is(span+span,.clover-geomap-place-date){display:block;margin-block-start:var(--clover-space-3xs);color:var(--clover-color-primary-muted, #26292b);font-size:var(--clover-text-s)}}';
+export {
+  __clover_sheet_map as default
+};

package/dist/ui/sheets/media.mjs

@@ -0,0 +1,5 @@
+"use client";
+const __clover_sheet_media = '@layer clover{.clover-canvas-media{position:absolute;inset:0;z-index:1;pointer-events:none;container-type:size}.clover-canvas-media:has([aria-expanded=true],.clover-canvas-transport-mark-group:is(:hover,:focus-within)){z-index:4}.clover-canvas-captions{position:absolute;inset:0 0 max(var(--clover-canvas-controls-inset) + var(--clover-controls-shown) * (var(--clover-transport-room) - var(--clover-canvas-controls-inset)),var(--clover-transport-preview-top, 0px) + var(--clover-space-2xs));z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;justify-content:safe flex-end;gap:var(--clover-space-2xs);padding:0 var(--clover-canvas-controls-inset);pointer-events:none;transition:bottom var(--clover-controls-timing)}.clover-canvas:has(.clover-canvas-transport-seek-area[data-tip-hidden]) .clover-canvas-captions{--clover-transport-preview-top: 0px}.clover-canvas-captions-cue{max-width:90%;padding:var(--clover-space-2xs) var(--clover-space-xs);border-radius:var(--clover-radius, 3px);background-color:var(--clover-player-caption-surface, rgb(0 0 0 / 85%));color:var(--clover-player-caption-text, #fff);text-shadow:var(--clover-player-caption-edge, none);font-size:var(--clover-text-s);line-height:1.35;text-align:center;text-wrap:balance;white-space:pre-line}.clover-canvas-captions-cue-label{display:block;font-size:var(--clover-text-s);font-weight:500}.clover-canvas-media>*{--clover-cue-size: var(--clover-text-s)}@container (min-width: 38.5rem){.clover-canvas-media>*{--clover-cue-size: 1rem}.clover-canvas-captions-cue{font-size:inherit}}@container (min-width: 44rem){.clover-canvas-media>*{--clover-cue-size: var(--clover-text-m)}.clover-canvas-captions-cue{font-size:var(--clover-text-m)}}@container (min-width: 47.5rem){.clover-canvas-media>*{--clover-cue-size: var(--clover-text-l)}.clover-canvas-captions-cue{font-size:var(--clover-text-l)}}.clover-canvas-transport{position:absolute;inset:auto 0 0;z-index:2;display:flex;flex-direction:column;padding:var(--clover-space-xl) var(--clover-canvas-controls-inset) var(--clover-canvas-controls-inset);--clover-controls-edge: 1;--clover-transport-thumb: 12px;--clover-transport-track: var(--clover-space-xs);-webkit-user-select:none;user-select:none;--clover-transport-menu-room: calc( 100cqb - var(--clover-canvas-controls-inset) - var(--clover-control) - var(--clover-space-s) - var(--clover-space-xs) )}.clover-canvas-transport:before{position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,#000000c7,#0009 calc(100% - var(--clover-space-xl)),#0000);pointer-events:none;content:""}.clover-canvas-transport:has([aria-expanded=true],:focus-visible,>.clover-canvas-transport-seek-area:hover){z-index:4}.clover-canvas-transport-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--clover-space-xs) var(--clover-space-s);min-width:0}.clover-canvas-transport-bar>*{flex-shrink:0}.clover-canvas-transport-bar>:is(:hover,:active,:focus-within){z-index:1}.clover-canvas-transport-bar>.clover-canvas-transport-status{display:flex;flex:1 1 0;align-items:center;gap:var(--clover-space-s);min-width:min-content}.clover-canvas-transport-end{display:flex;gap:var(--clover-space-s);margin-inline-start:auto}@container (max-width: 37.5rem){.clover-canvas-transport-bar:has([data-button=chapters])>.clover-canvas-transport-status{order:-1;flex-basis:100%}}@container (max-width: 28rem){.clover-canvas-transport-bar>.clover-canvas-transport-status{order:-1;flex-basis:100%}}.clover-canvas-transport-button svg{fill:currentColor;stroke:none}.clover-canvas-transport-button svg [stroke]{fill:none}.clover-canvas-transport-button:hover,.clover-canvas-transport-button:focus-visible{background-color:var(--clover-color-accent, #0065c3)}:where([data-high-contrast]) .clover-canvas-transport-button:is(:hover,:focus-visible){background-color:var(--clover-accent-fill)}:where([data-high-contrast]) .clover-canvas-transport-button:hover:not(:focus-visible){outline:var(--clover-accent-ring-hover);outline-offset:1px}button.clover-canvas-transport-button[aria-pressed=true]:after{content:"";position:absolute;inset-inline:var(--clover-space-s);bottom:var(--clover-space-2xs);border-bottom:2px solid;border-radius:1px}.clover-canvas-transport-button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--clover-color-secondary, #fff),0 0 0 4px var(--clover-color-accent, #0065c3)}.clover-canvas-transport-seek-area{position:relative;display:flex;margin-bottom:var(--clover-space-xs);--clover-transport-gap: var(--clover-space-2xs)}.clover-canvas-transport-points,.clover-canvas-transport-marks{--clover-transport-mark: var(--clover-space-s);position:absolute;inset:0;pointer-events:none}.clover-canvas-transport-points{z-index:0}.clover-canvas-transport-seek{position:relative;z-index:1}.clover-canvas-transport-marks{z-index:2}.clover-canvas-transport-mark-point{position:absolute;top:calc(50% - var(--clover-transport-track) / 2 - var(--clover-space-s) - (var(--clover-transport-mark) + 2 * 3px) / 2);box-sizing:content-box;width:var(--clover-transport-mark);height:var(--clover-transport-mark);border:2px solid var(--clover-color-secondary, #fff);border-radius:50%;background-color:var(--clover-color-accent, #0065c3);box-shadow:0 0 0 1px var(--clover-color-primary, #1a1d1e);translate:-50% -50%}.clover-canvas-transport-mark-point:after{position:absolute;top:calc(100% + 3px);left:50%;width:3px;height:calc(var(--clover-space-s) + var(--clover-transport-track));translate:-50% 0;background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 38.2%,transparent);-webkit-mask-image:linear-gradient(#000,#0000);mask-image:linear-gradient(#000,#0000);content:""}.clover-canvas-transport-mark-point[data-active=true]{box-shadow:0 0 0 2px var(--clover-color-accent, #0065c3),0 0 0 3px var(--clover-color-primary, #1a1d1e)}.clover-canvas-transport-mark-group{position:absolute;top:calc(50% - var(--clover-transport-track) / 2 - var(--clover-space-l));width:var(--clover-space-l);height:var(--clover-space-l);translate:-50% 0;pointer-events:var(--clover-controls-events, auto)}.clover-canvas-transport-mark{display:block;width:100%;height:100%;margin:0;padding:0;border:none;border-radius:50%;background:none;cursor:pointer}.clover-canvas-transport-mark:focus-visible{outline:none}.clover-canvas-transport-mark-group:is(:hover,:focus-within){z-index:1}.clover-canvas-transport-mark-group>.clover-tip.clover-canvas-transport-mark-tip{text-align:start;--clover-tip-x: clamp( var(--clover-space-xs) - var(--clover-mark-x, 50cqw), -50%, 100cqw - var(--clover-space-xs) - var(--clover-mark-x, 50cqw) - 100% );display:flex;flex-direction:column;max-width:min(18rem,100cqw - 2 * var(--clover-space-xs));max-height:calc(100cqh - var(--clover-canvas-controls-inset) - var(--clover-transport-bar-height, var(--clover-control)) - var(--clover-space-xs) - var(--clover-space-l) / 2 - var(--clover-transport-track) / 2 - var(--clover-space-l) - 3 * var(--clover-space-xs));transform:translate(calc(var(--clover-tip-x) + 50%))}.clover-canvas-transport-mark-group:focus-within:not([data-tip-hidden])>.clover-tip.clover-canvas-transport-mark-tip{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}.clover-canvas:has(.clover-canvas-transport-marks){--clover-transport-marks-room: calc( 2 * var(--clover-space-s) + 2 * 3px - (var(--clover-space-l) - var(--clover-space-xs)) / 2 )}.clover-canvas-transport-mark-words{min-height:0;overflow-y:auto}.clover-canvas-transport-mark-tip{--clover-color-primary-muted: var(--clover-color-secondary-alt, #c1c8cd);color:var(--clover-color-secondary-alt, #c1c8cd)}.clover-canvas-transport-mark-group .clover-canvas-transport-mark-tip>.clover-steps{flex:none;margin-top:var(--clover-space-xs)}.clover-canvas-transport input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:var(--clover-space-l);margin:0;background:transparent;cursor:pointer;touch-action:none}.clover-canvas-transport input.clover-canvas-transport-volume{width:var(--clover-space-2xl)}@container (max-width: 28rem){.clover-canvas-transport input.clover-canvas-transport-volume{width:var(--clover-space-xl)}.clover-canvas-transport-bar,.clover-canvas-transport-end{column-gap:var(--clover-space-xs)}}.clover-canvas-transport input[type=range]::-webkit-slider-runnable-track{height:var(--clover-transport-track);border-radius:var(--clover-radius, 3px);background:linear-gradient(to right,var(--clover-color-accent, #0065c3) var(--clover-transport-progress, 0%),rgb(255 255 255 / 90%) var(--clover-transport-progress, 0%),rgb(255 255 255 / 90%) var(--clover-transport-loaded, 0%),var(--clover-player-track, rgb(255 255 255 / 65%)) var(--clover-transport-loaded, 0%));box-shadow:var(--clover-player-track-shadow, none)}.clover-canvas-transport input[type=range]::-moz-range-track{height:var(--clover-transport-track);border-radius:var(--clover-radius, 3px);background:linear-gradient(to right,var(--clover-color-accent, #0065c3) var(--clover-transport-progress, 0%),rgb(255 255 255 / 90%) var(--clover-transport-progress, 0%),rgb(255 255 255 / 90%) var(--clover-transport-loaded, 0%),var(--clover-player-track, rgb(255 255 255 / 65%)) var(--clover-transport-loaded, 0%));box-shadow:var(--clover-player-track-shadow, none)}.clover-canvas-transport input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:var(--clover-transport-thumb);height:var(--clover-transport-thumb);margin-top:calc((var(--clover-transport-track) - var(--clover-transport-thumb)) / 2);border:none;border-radius:var(--clover-radius-pill, 2rem);background-color:var(--clover-player-text, #fff)}.clover-canvas-transport input[type=range]::-moz-range-thumb{width:var(--clover-transport-thumb);height:var(--clover-transport-thumb);border:none;border-radius:var(--clover-radius-pill, 2rem);background-color:var(--clover-player-text, #fff)}.clover-canvas-transport input[type=range]:focus-visible{outline:none}.clover-canvas-transport input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--clover-color-accent, #0065c3),0 0 0 4px var(--clover-player-text, #fff),0 0 0 6px #0009}.clover-canvas-transport input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--clover-color-accent, #0065c3),0 0 0 4px var(--clover-player-text, #fff),0 0 0 6px #0009}.clover-canvas-transport-time{display:flex;align-items:center;gap:var(--clover-space-xs);color:var(--clover-player-text, #fff);font-size:var(--clover-text-s);font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 1px 2px rgb(0 0 0 / 90%)}.clover-canvas-transport-frames{position:relative;display:flex}button.clover-canvas-transport-time{margin:0;padding:var(--clover-space-2xs) var(--clover-space-xs);border:0;border-radius:var(--clover-radius, 3px);background:none;font:inherit;font-size:var(--clover-text-s);cursor:pointer}button.clover-canvas-transport-time:is(:hover,[aria-expanded=true]){background-color:#0006}button.clover-canvas-transport-time:focus-visible{outline:2px solid var(--clover-player-text, #fff)}.clover-canvas-transport-place{display:inline-grid;justify-items:end;font-variant-numeric:tabular-nums}.clover-canvas-transport-place>*{grid-area:1 / 1}.clover-canvas-transport-place>.clover-canvas-transport-place-room[hidden]{display:block;visibility:hidden}.clover-canvas-transport-frames>.clover-canvas-menu{right:0;bottom:calc(100% + var(--clover-space-s));left:auto;max-width:min(20rem,100cqi - 2 * var(--clover-canvas-controls-inset));max-height:min(24rem,var(--clover-transport-menu-room),var(--clover-transport-menu-above, 100cqb) - var(--clover-space-s) - var(--clover-space-xs));translate:var(--clover-transport-menu-shift, 0px) 0}.clover-canvas-transport-menu{position:relative;display:flex}.clover-canvas-transport-options{position:absolute;right:0;bottom:calc(100% + var(--clover-space-s));display:flex;flex-direction:column;box-sizing:border-box;min-width:min(11rem,100cqi - 2 * var(--clover-canvas-controls-inset));max-width:calc(100cqi - 2 * var(--clover-canvas-controls-inset));max-height:min(16rem,var(--clover-transport-menu-room),var(--clover-transport-menu-above, 100cqb) - var(--clover-space-s) - var(--clover-space-xs));translate:var(--clover-transport-menu-shift, 0px) 0;margin:0;padding:var(--clover-space-xs);border:none;border-radius:var(--clover-radius, 3px);background-color:var(--clover-player-menu-surface, #151718);color:var(--clover-player-text, #fff);overflow-y:auto}.clover-canvas-transport-option{display:flex;flex:none;align-items:center;gap:var(--clover-space-xs);min-height:var(--clover-space-l);padding:var(--clover-space-xs) var(--clover-space-s);border-radius:var(--clover-radius, 3px);font-size:var(--clover-text-s);cursor:pointer}.clover-canvas-transport-option:hover{background-color:var(--clover-player-menu-hover, #26292b)}.clover-canvas-transport-option:has(input:checked){background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 24%,transparent);font-weight:600}.clover-canvas-transport-option:has(input:focus-visible){box-shadow:inset 0 0 0 2px var(--clover-player-text, #fff)}.clover-canvas-transport-code{flex:none;min-width:var(--clover-space-l);color:color-mix(in srgb,currentColor 72%,transparent);font-size:var(--clover-text-xs);font-weight:600;line-height:1}.clover-canvas-transport-options:has(.clover-canvas-transport-code),.clover-canvas-transport-menu:has([data-button=chapters]) .clover-canvas-transport-options{min-width:min(16rem,100cqi - 2 * var(--clover-canvas-controls-inset))}.clover-canvas-transport-option:has(>.clover-entry-thumbnail){display:grid;grid-template-columns:auto minmax(0,1fr);justify-items:start;gap:var(--clover-space-2xs) var(--clover-space-s);padding-block-end:var(--clover-space-s)}.clover-canvas-transport-options.clover-canvas-menu{border-radius:var(--clover-radius, 6px);background-color:var(--clover-color-secondary, #fff);color:var(--clover-color-primary, #1a1d1e)}.clover-canvas-menu>.clover-canvas-transport-option{align-items:baseline;gap:var(--clover-space-s);font-size:inherit}.clover-canvas-menu>.clover-canvas-transport-option:hover{background-color:var(--clover-color-secondary-muted, #e6e8eb)}@media (forced-colors: none){.clover-canvas-menu>.clover-canvas-transport-option:has(input:checked){background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 8%,transparent)}}.clover-canvas-menu>.clover-canvas-transport-option:has(input:focus-visible){box-shadow:none;outline:2px solid var(--clover-color-accent, #0065c3);outline-offset:-2px}.clover-canvas-transport-option input{position:absolute;opacity:0;pointer-events:none}@media (forced-colors: active){.clover-canvas-transport button.clover-canvas-transport-button{border:1px solid ButtonText}.clover-canvas-transport input[type=range]{forced-color-adjust:none}.clover-canvas-transport input[type=range]::-webkit-slider-runnable-track{border:1px solid CanvasText;background:linear-gradient(to right,Highlight var(--clover-transport-progress, 0%),Canvas var(--clover-transport-progress, 0%));box-shadow:none}.clover-canvas-transport input[type=range]::-moz-range-track{border:1px solid CanvasText;background:linear-gradient(to right,Highlight var(--clover-transport-progress, 0%),Canvas var(--clover-transport-progress, 0%));box-shadow:none}.clover-canvas-transport input[type=range]::-webkit-slider-thumb,.clover-canvas-transport input[type=range]:focus-visible::-webkit-slider-thumb{background-color:CanvasText;box-shadow:0 0 0 2px Canvas}.clover-canvas-transport input[type=range]::-moz-range-thumb,.clover-canvas-transport input[type=range]:focus-visible::-moz-range-thumb{background-color:CanvasText;box-shadow:0 0 0 2px Canvas}.clover-canvas-transport input[type=range]:focus-visible{outline:2px solid CanvasText;outline-offset:2px}.clover-canvas-transport-button:focus-visible{outline:3px solid CanvasText;outline-offset:2px;box-shadow:none}.clover-canvas-transport-button:is([data-active],[aria-pressed=true]),.clover-canvas-transport-option:has(input:checked){background-color:Highlight;color:HighlightText}.clover-captions-icon[data-on] .clover-captions-icon-letters{stroke:ButtonFace}.clover-canvas-transport-button[data-active] .clover-captions-icon[data-on] .clover-captions-icon-letters{stroke:Highlight}}@media (prefers-reduced-motion: reduce){.clover-canvas-transport,.clover-canvas-transport-button,.clover-canvas-transport-button svg{transition:none}}.clover-canvas-transport-seek[data-gaps]{--clover-transport-disk: calc(var(--clover-transport-thumb) / 2 + 1px);-webkit-mask-image:radial-gradient(circle at calc(var(--clover-transport-thumb) / 2 + (100% - var(--clover-transport-thumb)) * var(--clover-transport-at, 0)) 50%,#000 var(--clover-transport-disk),transparent var(--clover-transport-disk)),var(--clover-transport-gaps);mask-image:radial-gradient(circle at calc(var(--clover-transport-thumb) / 2 + (100% - var(--clover-transport-thumb)) * var(--clover-transport-at, 0)) 50%,#000 var(--clover-transport-disk),transparent var(--clover-transport-disk)),var(--clover-transport-gaps)}.clover-canvas-transport-seek[data-gaps]:focus-visible{--clover-transport-disk: calc(var(--clover-transport-thumb) / 2 + 6px)}.clover-canvas-transport-chapter-span{position:absolute;z-index:1;top:50%;box-sizing:border-box;border-inline:calc(var(--clover-transport-gap) / 2) solid transparent;background-clip:padding-box;height:var(--clover-space-s);translate:0 -50%;border-radius:var(--clover-radius, 3px);background-color:var(--clover-player-text, #fff);opacity:.5;pointer-events:none}.clover-canvas-transport-seek-area>.clover-tip{left:var(--clover-transport-preview, 50%)}.clover-canvas-transport-seek-area>.clover-tip:has(>.clover-tip-image){padding:var(--clover-space-s)}.clover-canvas-transport-seek-area>.clover-tip .clover-tip-image{width:var(--clover-picture);max-height:none;margin-block-end:var(--clover-space-xs)}.clover-canvas-transport-seek-area:is(:hover,:has(>input:focus-visible)):not([data-tip-hidden])>.clover-tip{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}@media (forced-colors: active){.clover-canvas-transport-mark-point:after{position:absolute;top:calc(100% + 3px);left:50%;width:3px;height:calc(var(--clover-space-s) + var(--clover-transport-track));translate:-50% 0;background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 38.2%,transparent);content:""}.clover-canvas-transport-mark-point[data-active=true]{outline:2px solid Highlight;outline-offset:1px}.clover-canvas-transport-chapter-span{background-color:Highlight;opacity:1}}.clover-canvas-transport-status>.clover-canvas-transport-chapter{flex:1 1 auto;overflow:hidden;width:0;min-width:0;color:color-mix(in srgb,var(--clover-player-text, #fff) 85%,transparent);font-size:var(--clover-text-s);text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 2px rgb(0 0 0 / 90%)}.clover-canvas[data-player]{--clover-controls-shown: 1;--clover-controls-events: auto}.clover-canvas[data-player]>.clover-canvas-scrim{display:none}.clover-canvas[data-player]>.clover-canvas-controls>*{opacity:1;translate:none}.clover-canvas[data-player]:has(>.clover-canvas-viewport:focus-visible)>.clover-canvas-media:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 0 2px var(--clover-color-primary, #1a1d1e),inset 0 0 0 5px var(--clover-color-accent, #0065c3),inset 0 0 0 7px var(--clover-color-secondary, #fff)}.clover-canvas-player{--clover-player-pad: var(--clover-space-l);--clover-player-text: var(--clover-color-control-glyph, #fff);--clover-player-muted: color-mix( in srgb, var(--clover-player-text) 80%, transparent );--clover-player-dark: var(--clover-color-control, #1a1d1e);--clover-player-top: calc( var(--clover-canvas-controls-inset, var(--clover-space-l)) + var(--clover-control) + var(--clover-space-s) );--clover-player-bottom: calc( var(--clover-transport-room, 0px) + 2.7 * var(--clover-cue-size, var(--clover-text-s)) + 2 * var(--clover-space-2xs) + var(--clover-space-s) );--clover-player-art-height: max( 0px, calc(100cqb - var(--clover-player-top) - var(--clover-player-bottom)) );position:absolute;inset:0;isolation:isolate;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--clover-space-l);padding:var(--clover-player-top) var(--clover-player-pad) var(--clover-player-bottom);color:var(--clover-player-text)}.clover-canvas-player-ground{--clover-player-depth: color-mix( in srgb, var(--clover-player-dark) 82%, var(--clover-player-text) );--clover-player-glow: color-mix( in srgb, var(--clover-player-text) 61.8%, #0000 );--clover-player-shade: color-mix( in srgb, var(--clover-player-dark) 61.8%, #0000 );position:absolute;inset:0;z-index:-1;overflow:hidden;isolation:isolate;background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 23.6%,var(--clover-player-dark))}.clover-canvas-player-ground>img{position:absolute;inset:-24%;z-index:0;width:148%;height:148%;object-fit:cover;filter:blur(var(--clover-space-2xl)) saturate(2.618)}.clover-canvas-player-ground[data-art]:before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(61.8% 85% at 23.6% 23.6%,var(--clover-player-glow),#0000 70%),radial-gradient(50% 70% at 85% 76.4%,var(--clover-player-glow),#0000 70%);mix-blend-mode:soft-light}.clover-canvas-player-ground[data-art]:after{content:"";position:absolute;inset:0;z-index:2;background:radial-gradient(61.8% 76.4% at 0% 100%,var(--clover-player-shade),#0000 100%),radial-gradient(50% 61.8% at 100% 0%,var(--clover-player-shade),#0000 100%),var(--clover-player-depth);mix-blend-mode:multiply}.clover-canvas-player>.clover-canvas-transport:before{background:linear-gradient(to top,color-mix(in srgb,var(--clover-player-dark) 38.2%,#0000),#0000)}.clover-canvas-player-art{flex:none;display:grid;place-items:center;overflow:hidden;width:min(calc(var(--clover-player-art-height) * var(--clover-player-art-ratio, 1)),40cqi,12rem);aspect-ratio:var(--clover-player-art-ratio, 1);border-radius:calc(2 * var(--clover-radius, 3px));background-color:color-mix(in srgb,var(--clover-color-accent, #0065c3) 40%,var(--clover-player-dark));box-shadow:0 .618rem 1.618rem color-mix(in srgb,var(--clover-player-dark) 45%,#0000)}.clover-canvas-player-art>img{display:block;width:100%;height:100%;object-fit:cover;opacity:0}.clover-canvas-player-art[data-loaded]>img{opacity:1}.clover-canvas-player-note{width:38.2%;height:38.2%;fill:currentColor;opacity:.85}.clover-canvas-player-head{flex:0 1 auto;max-width:38rem;min-width:0}.clover-canvas-player-title,.clover-canvas-player-part-of{margin:0;overflow-wrap:break-word}.clover-canvas-player-title{font-size:inherit;font-weight:700;line-height:1.25;text-wrap:balance}.clover-canvas-player-part-of{margin-top:var(--clover-space-xs);color:var(--clover-player-muted);font-size:var(--clover-text-s);line-height:1.35}.clover-canvas-player-cues{display:contents}@container (max-width: 30rem){.clover-canvas-player{--clover-player-pad: var(--clover-space-m)}}@container (max-height: 24rem){.clover-canvas-player{--clover-player-room: calc( 100cqb - 2 * var(--clover-canvas-controls-inset) );--clover-player-art-height: clamp( var(--clover-player-art-least, 7.416rem), var(--clover-player-room), 12rem );--clover-player-centering: max( 0px, (var(--clover-player-room) - var(--clover-player-art-height)) / 2 );display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr auto auto;align-content:end;gap:0 var(--clover-player-pad);padding:calc(var(--clover-canvas-controls-inset) + var(--clover-player-centering)) var(--clover-canvas-controls-inset)}.clover-canvas-player-art{grid-row:1 / -1;align-self:end;width:min(calc(var(--clover-player-art-height) * var(--clover-player-art-ratio, 1)),38.2cqi,12rem)}.clover-canvas-player-head,.clover-canvas-player-cues,.clover-canvas-player .clover-canvas-transport-seek-area,.clover-canvas-player .clover-canvas-transport-bar{grid-column:2}.clover-canvas-player-head{grid-row:1;max-width:none;margin-inline-end:calc(var(--clover-canvas-controls-width, var(--clover-control)) + var(--clover-space-s))}.clover-canvas-player-cues{grid-row:2;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--clover-space-2xs);padding:var(--clover-space-xs) 0 calc(var(--clover-space-2xs) + var(--clover-transport-marks-room, 0px));pointer-events:none}.clover-canvas-player-cues>.clover-canvas-captions{position:static;align-items:flex-start;padding:0;transition:none}.clover-canvas-player-cues .clover-canvas-captions-cue{max-width:100%;text-align:start}.clover-canvas-player>.clover-canvas-transport{display:contents}.clover-canvas-player>.clover-canvas-transport:before{display:none}.clover-canvas-player .clover-canvas-transport-seek-area{grid-row:3;z-index:2}.clover-canvas-player .clover-canvas-transport-bar{grid-row:4;z-index:2}.clover-canvas-player :is(.clover-canvas-transport-seek-area:is(:hover,:focus-within),.clover-canvas-transport-bar:has([aria-expanded=true],:focus-visible)){z-index:4}.clover-canvas-player-title,.clover-canvas-player-part-of{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.clover-canvas-player-part-of{-webkit-line-clamp:1}}@container (max-height: 24rem) and (max-width: 37.5rem){.clover-canvas-player{--clover-player-art-height: var(--clover-space-2xl);--clover-player-centering: 0px}.clover-canvas-player-art{grid-row:1;align-self:center}.clover-canvas-player-head{align-self:center}.clover-canvas-player-cues,.clover-canvas-player .clover-canvas-transport-seek-area,.clover-canvas-player .clover-canvas-transport-bar{grid-column:1 / -1}}@container (max-height: 15.236rem){.clover-canvas-player:has(>.clover-canvas-player-cues>.clover-canvas-captions)>.clover-canvas-player-head{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}@container (max-height: 15.236rem) and (min-width: 38.5rem){.clover-canvas-player-cues .clover-canvas-captions-cue{font-size:var(--clover-text-s)}}@container (max-height: 15.236rem) and (min-width: 44rem){.clover-canvas-player-cues .clover-canvas-captions-cue{font-size:inherit}}@container (max-height: 15.236rem) and (min-width: 47.5rem){.clover-canvas-player-cues .clover-canvas-captions-cue{font-size:var(--clover-text-m)}}@container (max-height: 15.236rem) and (max-width: 37.5rem){.clover-canvas-player:has(>.clover-canvas-player-cues>.clover-canvas-captions)>.clover-canvas-player-art{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}}@media (prefers-reduced-motion: no-preference){.clover-canvas-player-art>img{transition:opacity 382ms ease}}@media (forced-colors: active){.clover-canvas-player-ground{display:none}.clover-canvas-player{color:CanvasText}}}';
+export {
+  __clover_sheet_media as default
+};