@bug-on/m3-expressive 1.2.3 → 1.2.5

package/dist/navigation.mjs

@@ -1,5 +1,5 @@
 "use client";
-import * as React36 from 'react';
+import * as React37 from 'react';
 import { useRef, useEffect, useState } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
@@ -305,9 +305,10 @@ var SUBMENU_CONTAINER_VARIANTS = {
     transition: FAST_EFFECTS_TRANSITION
   }
 };
-var MenuContext = React36.createContext({
+var MenuContext = React37.createContext({
   variant: "baseline",
   colorVariant: "standard",
+  density: 0,
   menuPrimitive: "dropdown",
   open: false,
   onOpenChange: () => {
@@ -316,29 +317,46 @@ var MenuContext = React36.createContext({
 function MenuProvider({
   variant = "baseline",
   colorVariant = "standard",
+  density = 0,
   menuPrimitive = "dropdown",
   open,
   onOpenChange,
   children
 }) {
-  const value = React36.useMemo(
-    () => ({ variant, colorVariant, menuPrimitive, open, onOpenChange }),
-    [variant, colorVariant, menuPrimitive, open, onOpenChange]
+  const value = React37.useMemo(
+    () => ({
+      variant,
+      colorVariant,
+      density,
+      menuPrimitive,
+      open,
+      onOpenChange
+    }),
+    [variant, colorVariant, density, menuPrimitive, open, onOpenChange]
   );
   return /* @__PURE__ */ jsx(MenuContext.Provider, { value, children });
 }
 function useMenuContext() {
-  const ctx = React36.useContext(MenuContext);
-  return React36.useMemo(
-    () => __spreadProps(__spreadValues({}, ctx), {
-      isStatic: ctx.menuPrimitive === "static",
-      menuVariant: ctx.variant
+  const ctx = React37.useContext(MenuContext);
+  return React37.useMemo(
+    () => Object.assign(ctx, {
+      get isStatic() {
+        return ctx.menuPrimitive === "static";
+      },
+      get menuVariant() {
+        return ctx.variant;
+      }
     }),
     [ctx]
   );
 }
 var MENU_BASELINE_ITEM_HORIZONTAL_PADDING = "px-3";
 var MENU_ITEM_MIN_HEIGHT = "min-h-11";
+var DENSITY_MIN_HEIGHT = {
+  0: "min-h-12",
+  "-2": "min-h-10",
+  "-4": "min-h-8"
+};
 var MENU_MIN_WIDTH = "min-w-28";
 var MENU_MAX_WIDTH = "max-w-70";
 var MENU_GROUP_GAP = "gap-0.5";
@@ -371,7 +389,7 @@ var ITEM_SHAPE_CLASSES = {
   leading: "rounded-t-[12px] rounded-b-[4px]",
   middle: "rounded-[4px]",
   trailing: "rounded-t-[4px] rounded-b-[12px]",
-  standalone: "rounded-[4px]",
+  standalone: "rounded-[12px]",
   selected: "rounded-[12px]"
 };
 var STANDARD_COLORS = {
@@ -388,9 +406,9 @@ var STANDARD_COLORS = {
   /** Trailing icon color (StandardMenuTokens.ItemTrailingIconColor) */
   trailingIconColor: "text-m3-on-surface-variant",
   /** Hover state layer (OnSurface @ 8% opacity) */
-  hoverLayer: "hover:bg-m3-on-surface/8",
+  hoverLayer: "hover:bg-m3-on-surface/8 data-[highlighted]:bg-m3-on-surface/8",
   /** Focus state layer (OnSurface @ 12% opacity) */
-  focusLayer: "focus:bg-m3-on-surface/12",
+  focusLayer: "focus:bg-m3-on-surface/12 data-[highlighted]:bg-m3-on-surface/8",
   /** Selected item background (StandardMenuTokens.ItemSelectedContainerColor) */
   selectedBg: "bg-m3-tertiary-container",
   /** Selected item text (StandardMenuTokens.ItemSelectedLabelTextColor) */
@@ -406,8 +424,8 @@ var BASELINE_COLORS = {
   iconColor: "text-m3-on-surface-variant",
   supportingTextColor: "text-m3-on-surface-variant",
   trailingIconColor: "text-m3-on-surface-variant",
-  hoverLayer: "hover:bg-m3-on-surface/8",
-  focusLayer: "focus:bg-m3-on-surface/12",
+  hoverLayer: "hover:bg-m3-on-surface/8 data-[highlighted]:bg-m3-on-surface/8",
+  focusLayer: "focus:bg-m3-on-surface/12 data-[highlighted]:bg-m3-on-surface/8",
   selectedBg: "bg-m3-secondary-container",
   selectedText: "text-m3-on-secondary-container",
   selectedIcon: "text-m3-on-secondary-container"};
@@ -425,9 +443,9 @@ var VIBRANT_COLORS = {
   /** Trailing icon color (VibrantMenuTokens.ItemTrailingIconColor) */
   trailingIconColor: "text-m3-on-tertiary-container",
   /** Hover state layer (OnTertiaryContainer @ 8% opacity) */
-  hoverLayer: "hover:bg-m3-on-tertiary-container/8",
+  hoverLayer: "hover:bg-m3-on-tertiary-container/8 data-[highlighted]:bg-m3-on-tertiary-container/8",
   /** Focus state layer (OnTertiaryContainer @ 12% opacity) */
-  focusLayer: "focus:bg-m3-on-tertiary-container/12",
+  focusLayer: "focus:bg-m3-on-tertiary-container/12 data-[highlighted]:bg-m3-on-tertiary-container/8",
   /** Selected item background (VibrantMenuTokens.ItemSelectedContainerColor = Tertiary) */
   selectedBg: "bg-m3-tertiary",
   /** Selected item text (VibrantMenuTokens.ItemSelectedLabelTextColor = OnTertiary) */
@@ -439,12 +457,29 @@ var VIBRANT_COLORS = {
 };
 var DIVIDER_PADDING = "mx-3 my-0.5";
 var DIVIDER_COLOR = "bg-m3-outline-variant";
+function flattenChildren(nodes) {
+  return React37.Children.toArray(nodes).reduce(
+    (acc, child) => {
+      if (!React37.isValidElement(child)) return acc;
+      if (child.type === React37.Fragment) {
+        return acc.concat(
+          flattenChildren(
+            child.props.children
+          )
+        );
+      }
+      acc.push(child);
+      return acc;
+    },
+    []
+  );
+}
 function ContextMenu({
   children,
   variant = "baseline",
   colorVariant = "standard"
 }) {
-  const [open, setOpen] = React36.useState(false);
+  const [open, setOpen] = React37.useState(false);
   return /* @__PURE__ */ jsx(
     MenuProvider,
     {
@@ -458,12 +493,12 @@ function ContextMenu({
   );
 }
 ContextMenu.displayName = "ContextMenu";
-var ContextMenuTrigger = React36.forwardRef((_a, ref) => {
+var ContextMenuTrigger = React37.forwardRef((_a, ref) => {
   var _b = _a, { children, asChild = true } = _b, props = __objRest(_b, ["children", "asChild"]);
   return /* @__PURE__ */ jsx(RxContextMenu.Trigger, __spreadProps(__spreadValues({ ref, asChild }, props), { children }));
 });
 ContextMenuTrigger.displayName = "ContextMenuTrigger";
-var ContextMenuContent = React36.forwardRef(
+var ContextMenuContent = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -486,71 +521,51 @@ var ContextMenuContent = React36.forwardRef(
     const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
     const colors = variant === "baseline" ? BASELINE_COLORS : colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
     const isExpressiveGap = variant === "expressive" && separatorStyle === "gap";
-    const containerClassName = variant === "expressive" ? cn(
-      "z-50 flex flex-col w-full",
-      MENU_MIN_WIDTH,
-      MENU_MAX_WIDTH,
-      isExpressiveGap ? MENU_GROUP_GAP : "",
-      isExpressiveGap ? "bg-transparent" : colors.containerBg,
-      isExpressiveGap ? "" : "rounded-2xl",
-      isExpressiveGap ? "" : "elevation-2",
-      hasOverflow || isExpressiveGap ? "overflow-visible" : "overflow-hidden",
-      "outline-none",
-      className
-    ) : cn(
-      "z-50 flex flex-col",
-      MENU_MIN_WIDTH,
-      MENU_MAX_WIDTH,
-      MENU_POPUP_PADDING_Y,
-      MENU_GROUP_GAP,
-      colors.containerBg,
-      MENU_CONTAINER_SHAPE,
-      "elevation-2",
-      hasOverflow ? "overflow-visible" : "overflow-hidden",
-      "outline-none",
-      className
+    const containerClassName = React37.useMemo(
+      () => variant === "expressive" ? cn(
+        "z-50 flex flex-col w-full",
+        MENU_MIN_WIDTH,
+        MENU_MAX_WIDTH,
+        isExpressiveGap ? MENU_GROUP_GAP : "",
+        isExpressiveGap ? "bg-transparent" : colors.containerBg,
+        isExpressiveGap ? "" : "rounded-2xl",
+        isExpressiveGap ? "" : "elevation-2",
+        hasOverflow || isExpressiveGap ? "overflow-visible" : "overflow-hidden",
+        "outline-none",
+        className
+      ) : cn(
+        "z-50 flex flex-col",
+        MENU_MIN_WIDTH,
+        MENU_MAX_WIDTH,
+        MENU_POPUP_PADDING_Y,
+        MENU_GROUP_GAP,
+        colors.containerBg,
+        MENU_CONTAINER_SHAPE,
+        "elevation-2",
+        hasOverflow ? "overflow-visible" : "overflow-hidden",
+        "outline-none",
+        className
+      ),
+      [variant, isExpressiveGap, hasOverflow, className, colors.containerBg]
     );
-    const flattenChildren = (nodes) => {
-      return React36.Children.toArray(nodes).reduce(
-        (acc, child) => {
-          if (React36.isValidElement(child)) {
-            if (child.type === React36.Fragment) {
-              return acc.concat(
-                flattenChildren(
-                  child.props.children
-                )
-              );
-            }
-            acc.push(child);
-          }
-          return acc;
-        },
-        []
-      );
-    };
-    let renderedChildren = children;
-    if (variant === "expressive") {
+    const renderedChildren = React37.useMemo(() => {
+      if (variant !== "expressive") return children;
       const validChildren = flattenChildren(children);
       const groupCount = validChildren.length;
-      const enhancedChildren = validChildren.map(
-        (child, i) => React36.cloneElement(
+      const enhanced = validChildren.map(
+        (child, i) => React37.cloneElement(
           child,
-          {
-            index: i,
-            count: groupCount,
-            isGapVariant: isExpressiveGap
-          }
+          { index: i, count: groupCount, isGapVariant: isExpressiveGap }
         )
       );
-      renderedChildren = separatorStyle === "divider" ? enhancedChildren.reduce((acc, child, i) => {
+      if (separatorStyle !== "divider") return enhanced;
+      return enhanced.reduce((acc, child, i) => {
         if (i > 0) {
           acc.push(
             /* @__PURE__ */ jsx(
               "hr",
               {
-                className: cn(
-                  "mx-3 my-0.5 h-px border-0 bg-m3-outline-variant"
-                )
+                className: cn("mx-3 my-0.5 h-px border-0 bg-m3-outline-variant")
               },
               `divider-${child.key || i}`
             )
@@ -558,8 +573,8 @@ var ContextMenuContent = React36.forwardRef(
         }
         acc.push(child);
         return acc;
-      }, []) : enhancedChildren;
-    }
+      }, []);
+    }, [children, variant, isExpressiveGap, separatorStyle]);
     return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsx(RxContextMenu.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(RxContextMenu.Content, __spreadProps(__spreadValues({ ref, asChild: true, forceMount: true }, props), { children: /* @__PURE__ */ jsx(
       m.div,
       {
@@ -583,6 +598,7 @@ function Menu(_a) {
     variant,
     menuVariant,
     colorVariant = "standard",
+    density = 0,
     open: controlledOpen,
     onOpenChange: controlledOnOpenChange,
     defaultOpen
@@ -591,18 +607,19 @@ function Menu(_a) {
     "variant",
     "menuVariant",
     "colorVariant",
+    "density",
     "open",
     "onOpenChange",
     "defaultOpen"
   ]);
   var _a2;
   const resolvedVariant = (_a2 = variant != null ? variant : menuVariant) != null ? _a2 : "baseline";
-  const [internalOpen, setInternalOpen] = React36.useState(
+  const [internalOpen, setInternalOpen] = React37.useState(
     () => defaultOpen != null ? defaultOpen : false
   );
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : internalOpen;
-  const handleOpenChange = React36.useCallback(
+  const handleOpenChange = React37.useCallback(
     (next) => {
       if (!isControlled) setInternalOpen(next);
       controlledOnOpenChange == null ? void 0 : controlledOnOpenChange(next);
@@ -614,6 +631,7 @@ function Menu(_a) {
     {
       variant: resolvedVariant,
       colorVariant,
+      density,
       open,
       onOpenChange: handleOpenChange,
       children: /* @__PURE__ */ jsx(
@@ -629,12 +647,12 @@ function Menu(_a) {
   );
 }
 Menu.displayName = "Menu";
-var MenuTrigger = React36.forwardRef((_a, ref) => {
+var MenuTrigger = React37.forwardRef((_a, ref) => {
   var _b = _a, { children, asChild = true } = _b, props = __objRest(_b, ["children", "asChild"]);
   return /* @__PURE__ */ jsx(DropdownMenu.Trigger, __spreadProps(__spreadValues({ ref, asChild }, props), { children }));
 });
 MenuTrigger.displayName = "MenuTrigger";
-var MenuContent = React36.forwardRef(
+var MenuContent = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -644,6 +662,7 @@ var MenuContent = React36.forwardRef(
       hasOverflow = false,
       colorVariant: propColorVariant,
       separatorStyle = "gap",
+      matchTriggerWidth = false,
       className
     } = _b, props = __objRest(_b, [
       "children",
@@ -653,6 +672,7 @@ var MenuContent = React36.forwardRef(
       "hasOverflow",
       "colorVariant",
       "separatorStyle",
+      "matchTriggerWidth",
       "className"
     ]);
     const {
@@ -663,68 +683,66 @@ var MenuContent = React36.forwardRef(
     const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
     const colors = variant === "baseline" ? BASELINE_COLORS : colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
     const isExpressiveGap = variant === "expressive" && separatorStyle === "gap";
-    const containerClassName = variant === "expressive" ? cn(
-      "z-50 flex flex-col",
-      MENU_MIN_WIDTH,
-      MENU_MAX_WIDTH,
-      isExpressiveGap ? MENU_GROUP_GAP : "",
-      isExpressiveGap ? "bg-transparent" : colors.containerBg,
-      isExpressiveGap ? "" : "rounded-2xl",
-      isExpressiveGap ? "" : "elevation-2",
-      hasOverflow || isExpressiveGap ? "overflow-visible" : "overflow-hidden",
-      "outline-none",
-      className
-    ) : cn(
-      "z-50 flex flex-col",
-      MENU_MIN_WIDTH,
-      MENU_MAX_WIDTH,
-      MENU_POPUP_PADDING_Y,
-      MENU_GROUP_GAP,
-      colors.containerBg,
-      MENU_CONTAINER_SHAPE,
-      "elevation-2",
-      hasOverflow ? "overflow-visible" : "overflow-hidden",
-      "outline-none",
-      className
-    );
-    const flattenChildren = (nodes) => {
-      return React36.Children.toArray(nodes).reduce(
-        (acc, child) => {
-          if (React36.isValidElement(child)) {
-            if (child.type === React36.Fragment) {
-              return acc.concat(
-                flattenChildren(
-                  child.props.children
-                )
-              );
-            }
-            acc.push(child);
-          }
-          return acc;
-        },
-        []
+    const containerClassName = React37.useMemo(() => {
+      const widthClass = matchTriggerWidth ? "w-[var(--radix-dropdown-menu-trigger-width)]" : cn(MENU_MIN_WIDTH, MENU_MAX_WIDTH);
+      return variant === "expressive" ? cn(
+        "z-50 flex flex-col",
+        widthClass,
+        isExpressiveGap ? MENU_GROUP_GAP : "",
+        isExpressiveGap ? "bg-transparent" : colors.containerBg,
+        isExpressiveGap ? "" : "p-1",
+        isExpressiveGap ? "" : "rounded-2xl",
+        isExpressiveGap ? "" : "elevation-2",
+        hasOverflow || isExpressiveGap ? "overflow-visible" : "overflow-hidden",
+        "outline-none",
+        className
+      ) : cn(
+        "z-50 flex flex-col",
+        widthClass,
+        MENU_POPUP_PADDING_Y,
+        MENU_GROUP_GAP,
+        colors.containerBg,
+        MENU_CONTAINER_SHAPE,
+        "elevation-2",
+        hasOverflow ? "overflow-visible" : "overflow-hidden",
+        "outline-none",
+        className
       );
-    };
-    let renderedChildren = children;
-    if (variant === "expressive") {
+    }, [
+      variant,
+      isExpressiveGap,
+      hasOverflow,
+      matchTriggerWidth,
+      className,
+      colors.containerBg
+    ]);
+    const renderedChildren = React37.useMemo(() => {
+      if (variant !== "expressive") return children;
       const validChildren = flattenChildren(children);
       const groupCount = validChildren.length;
-      const enhancedChildren = validChildren.map(
-        (child, i) => React36.cloneElement(child, {
-          index: i,
-          count: groupCount,
-          isGapVariant: isExpressiveGap
-        })
-      );
-      renderedChildren = separatorStyle === "divider" ? enhancedChildren.reduce((acc, child, i) => {
+      const enhanced = validChildren.map((child, i) => {
+        var _a2;
+        if (typeof child.type === "string") return child;
+        const defaultItemPosition = groupCount === 1 ? "standalone" : i === 0 ? "leading" : i === groupCount - 1 ? "trailing" : "middle";
+        const itemPosition = (_a2 = child.props.itemPosition) != null ? _a2 : defaultItemPosition;
+        return React37.cloneElement(
+          child,
+          {
+            index: i,
+            count: groupCount,
+            itemPosition,
+            isGapVariant: isExpressiveGap
+          }
+        );
+      });
+      if (separatorStyle !== "divider") return enhanced;
+      return enhanced.reduce((acc, child, i) => {
         if (i > 0) {
           acc.push(
             /* @__PURE__ */ jsx(
               "hr",
               {
-                className: cn(
-                  "mx-3 my-0.5 h-px border-0 bg-m3-outline-variant"
-                )
+                className: cn("mx-3 my-0.5 h-px border-0 bg-m3-outline-variant")
               },
               `divider-${child.key || i}`
             )
@@ -732,8 +750,8 @@ var MenuContent = React36.forwardRef(
         }
         acc.push(child);
         return acc;
-      }, []) : enhancedChildren;
-    }
+      }, []);
+    }, [children, variant, isExpressiveGap, separatorStyle]);
     return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsx(DropdownMenu.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(
       DropdownMenu.Content,
       __spreadProps(__spreadValues({
@@ -765,9 +783,9 @@ var MenuContent = React36.forwardRef(
   }
 );
 MenuContent.displayName = "MenuContent";
-var MenuDivider = React36.forwardRef(
+var MenuDivider = React37.forwardRef(
   (_a, ref) => {
-    var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+    var _b = _a, { className, isGapVariant: _isGapVariant } = _b, props = __objRest(_b, ["className", "isGapVariant"]);
     const { menuVariant } = useMenuContext();
     return /* @__PURE__ */ jsx(DropdownMenu.Separator, { asChild: true, children: /* @__PURE__ */ jsx(
       "hr",
@@ -796,7 +814,7 @@ function getGroupPosition(index, count) {
 function getGroupActiveShape(position) {
   return GROUP_SHAPES[`${position}Active`];
 }
-var MenuGroup = React36.forwardRef(
+var MenuGroup = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -817,46 +835,25 @@ var MenuGroup = React36.forwardRef(
       "itemPosition",
       "className"
     ]);
-    const {
-      menuVariant,
-      colorVariant: contextColorVariant,
-      isStatic
-    } = useMenuContext();
+    const { menuVariant, colorVariant: contextColorVariant } = useMenuContext();
     const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
     const colors = menuVariant === "baseline" ? BASELINE_COLORS : colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
     const position = getGroupPosition(index, count);
-    const activeShape = getGroupActiveShape(position);
-    const [isHovered, setIsHovered] = React36.useState(false);
-    const currentShape = isStatic || isHovered ? activeShape : GROUP_SHAPES.inactive;
-    const handlePointerEnter = React36.useCallback(() => setIsHovered(true), []);
-    const handlePointerLeave = React36.useCallback(() => setIsHovered(false), []);
-    const flattenChildren = (children2) => {
-      return React36.Children.toArray(children2).reduce(
-        (acc, child) => {
-          if (React36.isValidElement(child)) {
-            if (child.type === React36.Fragment) {
-              return acc.concat(
-                flattenChildren(
-                  child.props.children
-                )
-              );
-            }
-            acc.push(child);
-          }
-          return acc;
-        },
-        []
-      );
-    };
-    const validChildren = flattenChildren(children);
-    const itemCount = validChildren.length;
-    const enhancedChildren = validChildren.map((child, i) => {
-      const itemPosition2 = itemCount === 1 ? "standalone" : i === 0 ? "leading" : i === itemCount - 1 ? "trailing" : "middle";
-      return React36.cloneElement(child, {
-        itemPosition: itemPosition2,
-        colorVariant
+    const currentShape = getGroupActiveShape(position);
+    const enhancedChildren = React37.useMemo(() => {
+      const valid = flattenChildren(children);
+      const itemCount = valid.length;
+      return valid.map((child, i) => {
+        var _a2;
+        if (typeof child.type === "string") return child;
+        const defaultItemPosition = itemCount === 1 ? "standalone" : i === 0 ? "leading" : i === itemCount - 1 ? "trailing" : "middle";
+        const itemPosition2 = (_a2 = child.props.itemPosition) != null ? _a2 : defaultItemPosition;
+        return React37.cloneElement(child, {
+          itemPosition: itemPosition2,
+          colorVariant
+        });
       });
-    });
+    }, [children, colorVariant]);
     return /* @__PURE__ */ jsxs(
       m.div,
       __spreadProps(__spreadValues({
@@ -868,10 +865,8 @@ var MenuGroup = React36.forwardRef(
           // In baseline variant, MenuGroup is transparent so it shouldn't clip.
           // In expressive variant, it needs overflow-hidden to clip hover states to its morphing shape.
           menuVariant === "baseline" ? "" : "overflow-hidden",
-          // Vertical padding: 2dp for gap variant (to match Figma), 4dp for baseline
-          isGapVariant ? "py-0.5" : MENU_GROUP_PADDING_Y,
-          // Horizontal padding: 4dp for expressive menus (both static and popup), 0 for baseline
-          menuVariant === "expressive" ? "px-1" : "",
+          // Padding: uniform 4dp (p-1) for expressive menus (matches 12px inner item corners inside 16px outer corners)
+          menuVariant === "expressive" ? "p-1" : MENU_GROUP_PADDING_Y,
           // Gap variant has floating segments, so each group manages its own shadow
           isGapVariant ? "elevation-2" : "",
           // Background based on color variant (transparent for baseline to avoid double-layering)
@@ -879,9 +874,7 @@ var MenuGroup = React36.forwardRef(
           className
         ),
         animate: { borderRadius: currentShape },
-        transition: FAST_SPATIAL_SPRING,
-        onPointerEnter: handlePointerEnter,
-        onPointerLeave: handlePointerLeave
+        transition: FAST_SPATIAL_SPRING
       }, rest), {
         children: [
           label && /* @__PURE__ */ jsx(
@@ -918,7 +911,7 @@ var VARIANT_FONT = {
   rounded: "'Material Symbols Rounded'",
   sharp: "'Material Symbols Sharp'"
 };
-var IconComponent = React36.forwardRef(
+var IconComponent = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       name,
@@ -984,14 +977,14 @@ var IconComponent = React36.forwardRef(
   }
 );
 IconComponent.displayName = "Icon";
-var Icon = React36.memo(IconComponent);
+var Icon = React37.memo(IconComponent);
 function getItemShapeClass(position, selected, isStatic = false, menuVariant = "expressive") {
   if (menuVariant === "baseline") return BASELINE_ITEM_SHAPE;
   if (selected) return ITEM_SHAPE_CLASSES.selected;
   if (isStatic && position === "standalone") return "rounded-[12px]";
   return ITEM_SHAPE_CLASSES[position];
 }
-var MenuItem = React36.forwardRef(
+var MenuItem = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -1004,11 +997,13 @@ var MenuItem = React36.forwardRef(
       disabled = false,
       itemPosition = "standalone",
       colorVariant: propColorVariant,
+      density: propDensity,
       keepOpen = false,
       className,
       isSubTrigger,
       value,
-      role
+      role,
+      isGapVariant: _isGapVariant
     } = _b, rest = __objRest(_b, [
       "children",
       "onClick",
@@ -1020,18 +1015,24 @@ var MenuItem = React36.forwardRef(
       "disabled",
       "itemPosition",
       "colorVariant",
+      "density",
       "keepOpen",
       "className",
       "isSubTrigger",
       "value",
-      "role"
+      "role",
+      "isGapVariant"
     ]);
+    var _a2;
     const {
       menuVariant,
       colorVariant: contextColorVariant,
+      density: contextDensity,
       menuPrimitive
     } = useMenuContext();
     const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
+    const density = (_a2 = propDensity != null ? propDensity : contextDensity) != null ? _a2 : 0;
+    const minHeightClass = DENSITY_MIN_HEIGHT[density];
     const colors = menuVariant === "baseline" ? BASELINE_COLORS : colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
     const isStaticMenu = menuPrimitive === "static";
     const shapeClass = getItemShapeClass(
@@ -1073,12 +1074,11 @@ var MenuItem = React36.forwardRef(
             className: cn(
               // Layout
               "relative flex w-full cursor-pointer select-none items-center outline-none",
-              // Sizing: min-h 48dp, min-w 112dp, max-w 280dp
-              "min-h-12 min-w-28 max-w-70",
+              // Sizing: min-h based on density (48dp, 40dp, 32dp), min-w 112dp
+              minHeightClass,
+              "min-w-28",
               // Horizontal padding
               menuVariant === "baseline" ? MENU_BASELINE_ITEM_HORIZONTAL_PADDING : "px-4",
-              // Spacing between items
-              isStaticMenu ? "my-0.5" : "",
               // Shape morphing (position-based + selected override)
               shapeClass,
               // Animate border-radius AND background-color together (FastEffects: 150ms)
@@ -1090,7 +1090,7 @@ var MenuItem = React36.forwardRef(
               !selected && colors.focusLayer,
               // Focus visible ring (WCAG 2.4.11 — visible focus indicator)
               // Uses ring-inset so the ring doesn't overflow the item bounds.
-              "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-m3-primary",
+              "focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-m3-secondary data-highlighted:ring-0",
               // Disabled
               disabled && "pointer-events-none opacity-[0.38]",
               className
@@ -1193,31 +1193,31 @@ function SubMenu({
 }) {
   const { colorVariant: contextColorVariant, menuPrimitive } = useMenuContext();
   const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
-  const [open, setOpen] = React36.useState(false);
-  const openTimerRef = React36.useRef(null);
-  const closeTimerRef = React36.useRef(
+  const [open, setOpen] = React37.useState(false);
+  const openTimerRef = React37.useRef(null);
+  const closeTimerRef = React37.useRef(
     null
   );
-  const clearTimers = React36.useCallback(() => {
+  const clearTimers = React37.useCallback(() => {
     if (openTimerRef.current) clearTimeout(openTimerRef.current);
     if (closeTimerRef.current) clearTimeout(closeTimerRef.current);
   }, []);
-  const handleTriggerPointerEnter = React36.useCallback(() => {
+  const handleTriggerPointerEnter = React37.useCallback(() => {
     clearTimers();
     openTimerRef.current = setTimeout(() => setOpen(true), hoverOpenDelay);
   }, [hoverOpenDelay, clearTimers]);
-  const handleTriggerPointerLeave = React36.useCallback(() => {
+  const handleTriggerPointerLeave = React37.useCallback(() => {
     clearTimers();
     closeTimerRef.current = setTimeout(() => setOpen(false), hoverCloseDelay);
   }, [hoverCloseDelay, clearTimers]);
-  const handleContentPointerEnter = React36.useCallback(() => {
+  const handleContentPointerEnter = React37.useCallback(() => {
     clearTimers();
   }, [clearTimers]);
-  const handleContentPointerLeave = React36.useCallback(() => {
+  const handleContentPointerLeave = React37.useCallback(() => {
     clearTimers();
     closeTimerRef.current = setTimeout(() => setOpen(false), hoverCloseDelay);
   }, [hoverCloseDelay, clearTimers]);
-  React36.useEffect(() => () => clearTimers(), [clearTimers]);
+  React37.useEffect(() => () => clearTimers(), [clearTimers]);
   const Sub3 = menuPrimitive === "context" ? RxContextMenu.Sub : DropdownMenu.Sub;
   const SubTrigger3 = menuPrimitive === "context" ? RxContextMenu.SubTrigger : DropdownMenu.SubTrigger;
   const SubContent3 = menuPrimitive === "context" ? RxContextMenu.SubContent : DropdownMenu.SubContent;
@@ -1229,7 +1229,7 @@ function SubMenu({
         className: "w-full outline-none",
         onPointerEnter: handleTriggerPointerEnter,
         onPointerLeave: handleTriggerPointerLeave,
-        children: React36.isValidElement(trigger) ? React36.cloneElement(trigger, {
+        children: React37.isValidElement(trigger) ? React37.cloneElement(trigger, {
           isSubTrigger: true,
           // Auto-add chevron if missing
           trailingIcon: trigger.props.trailingIcon || /* @__PURE__ */ jsx(Icon, { name: "chevron_right", size: 20 })
@@ -1306,7 +1306,7 @@ function SubMenuContent({
   );
 }
 SubMenuContent.displayName = "SubMenuContent";
-var VerticalMenuDivider = React36.forwardRef((_a, ref) => {
+var VerticalMenuDivider = React37.forwardRef((_a, ref) => {
   var _b = _a, { className, index, count, isGapVariant } = _b, props = __objRest(_b, ["className", "index", "count", "isGapVariant"]);
   return /* @__PURE__ */ jsx(
     "hr",
@@ -1326,7 +1326,7 @@ var VerticalMenuDivider = React36.forwardRef((_a, ref) => {
 });
 VerticalMenuDivider.displayName = "VerticalMenuDivider";
 var VerticalMenuGroup = MenuGroup;
-var VerticalMenuContent = React36.forwardRef(
+var VerticalMenuContent = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -1342,46 +1342,39 @@ var VerticalMenuContent = React36.forwardRef(
     const { colorVariant: contextColorVariant } = useMenuContext();
     const colorVariant = propColorVariant != null ? propColorVariant : contextColorVariant;
     const colors = colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
-    const flattenChildren = (children2) => {
-      return React36.Children.toArray(children2).reduce(
-        (acc, child) => {
-          if (React36.isValidElement(child)) {
-            if (child.type === React36.Fragment) {
-              return acc.concat(
-                flattenChildren(
-                  child.props.children
-                )
-              );
-            }
-            acc.push(child);
+    const renderedChildren = React37.useMemo(() => {
+      const valid = flattenChildren(children);
+      const groupCount = valid.length;
+      const enhanced = valid.map((child, i) => {
+        var _a2;
+        if (typeof child.type === "string") return child;
+        const defaultItemPosition = groupCount === 1 ? "standalone" : i === 0 ? "leading" : i === groupCount - 1 ? "trailing" : "middle";
+        const itemPosition = (_a2 = child.props.itemPosition) != null ? _a2 : defaultItemPosition;
+        return React37.cloneElement(
+          child,
+          {
+            index: i,
+            count: groupCount,
+            itemPosition,
+            isGapVariant: separatorStyle === "gap"
           }
-          return acc;
-        },
-        []
-      );
-    };
-    const validChildren = flattenChildren(children);
-    const groupCount = validChildren.length;
-    const enhancedChildren = validChildren.map(
-      (child, i) => React36.cloneElement(child, {
-        index: i,
-        count: groupCount,
-        isGapVariant: separatorStyle === "gap"
-      })
-    );
-    const renderedChildren = separatorStyle === "divider" ? enhancedChildren.reduce((acc, child, i) => {
-      if (i > 0) {
-        acc.push(
-          /* @__PURE__ */ jsx(
-            VerticalMenuDivider,
-            {},
-            `divider-${child.key || i}`
-          )
         );
-      }
-      acc.push(child);
-      return acc;
-    }, []) : enhancedChildren;
+      });
+      if (separatorStyle !== "divider") return enhanced;
+      return enhanced.reduce((acc, child, i) => {
+        if (i > 0) {
+          acc.push(
+            /* @__PURE__ */ jsx(
+              VerticalMenuDivider,
+              {},
+              `divider-${child.key || i}`
+            )
+          );
+        }
+        acc.push(child);
+        return acc;
+      }, []);
+    }, [children, separatorStyle]);
     return /* @__PURE__ */ jsx(
       "div",
       __spreadProps(__spreadValues({
@@ -1400,13 +1393,13 @@ var VerticalMenuContent = React36.forwardRef(
   }
 );
 VerticalMenuContent.displayName = "VerticalMenuContent";
-var VerticalMenu = React36.forwardRef((_a, ref) => {
+var VerticalMenu = React37.forwardRef((_a, ref) => {
   var _b = _a, { children, colorVariant = "standard", className } = _b, props = __objRest(_b, ["children", "colorVariant", "className"]);
-  const noop = React36.useCallback(() => {
+  const noop = React37.useCallback(() => {
   }, []);
   const colors = colorVariant === "vibrant" ? VIBRANT_COLORS : STANDARD_COLORS;
-  const containerRef = React36.useRef(null);
-  const mergedRef = React36.useCallback(
+  const containerRef = React37.useRef(null);
+  const mergedRef = React37.useCallback(
     (node) => {
       containerRef.current = node;
       if (typeof ref === "function") ref(node);
@@ -1415,7 +1408,7 @@ var VerticalMenu = React36.forwardRef((_a, ref) => {
     },
     [ref]
   );
-  const handleKeyDown = React36.useCallback(
+  const handleKeyDown = React37.useCallback(
     (e) => {
       var _a2;
       if (!containerRef.current) return;
@@ -1498,7 +1491,7 @@ var VerticalMenu = React36.forwardRef((_a, ref) => {
 });
 VerticalMenu.displayName = "VerticalMenu";
 function detectSeparatorStyle(children) {
-  const child = React36.Children.toArray(children).find(React36.isValidElement);
+  const child = React37.Children.toArray(children).find(React37.isValidElement);
   if (child) {
     const style = child.props.separatorStyle;
     if (style) return style;
@@ -1579,11 +1572,11 @@ function AppBarColumn({
   maxItemCount,
   className
 }) {
-  const containerRef = React36.useRef(null);
-  const [visibleCount, setVisibleCount] = React36.useState(
+  const containerRef = React37.useRef(null);
+  const [visibleCount, setVisibleCount] = React37.useState(
     maxItemCount != null ? maxItemCount : items.length
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (maxItemCount !== void 0) {
       setVisibleCount(Math.min(maxItemCount, items.length));
       return;
@@ -1631,11 +1624,11 @@ function AppBarColumn({
   );
 }
 function AppBarRow({ items, maxItemCount, className }) {
-  const containerRef = React36.useRef(null);
-  const [visibleCount, setVisibleCount] = React36.useState(
+  const containerRef = React37.useRef(null);
+  const [visibleCount, setVisibleCount] = React37.useState(
     maxItemCount != null ? maxItemCount : items.length
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (maxItemCount !== void 0) {
       setVisibleCount(Math.min(maxItemCount, items.length));
       return;
@@ -1689,12 +1682,12 @@ function useAppBarScroll({
   collapsedHeight = 64,
   expandedHeight = 112
 } = {}) {
-  const [isScrolled, setIsScrolled] = React36.useState(false);
-  const [collapsedFraction, setCollapsedFraction] = React36.useState(0);
-  const [isHidden, setIsHidden] = React36.useState(false);
-  const prevScrollYRef = React36.useRef(0);
+  const [isScrolled, setIsScrolled] = React37.useState(false);
+  const [collapsedFraction, setCollapsedFraction] = React37.useState(0);
+  const [isHidden, setIsHidden] = React37.useState(false);
+  const prevScrollYRef = React37.useRef(0);
   const hideThreshold = 64;
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     var _a;
     const scrollDistance = expandedHeight - collapsedHeight;
     const getScrollY = () => {
@@ -1815,7 +1808,7 @@ function useFlexibleAppBar({
     expandedHeight
   });
   const scrollProgress = useMotionValue(0);
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     scrollProgress.set(
       shouldReduceMotion ? collapsedFraction > 0.5 ? 1 : 0 : collapsedFraction
     );
@@ -2156,7 +2149,7 @@ function SearchAppBar({
 }) {
   var _a, _b;
   const shouldReduceMotion = useReducedMotion();
-  const [isSearchOpen, setIsSearchOpen] = React36.useState(false);
+  const [isSearchOpen, setIsSearchOpen] = React37.useState(false);
   const { isScrolled } = useAppBarScroll({
     scrollElement,
     behavior: scrollBehavior === "exitUntilCollapsed" ? "pinned" : scrollBehavior
@@ -2270,8 +2263,8 @@ function SearchView({
   className
 }) {
   const shouldReduceMotion = useReducedMotion();
-  const inputRef = React36.useRef(null);
-  React36.useEffect(() => {
+  const inputRef = React37.useRef(null);
+  React37.useEffect(() => {
     const timer = window.setTimeout(() => {
       var _a;
       (_a = inputRef.current) == null ? void 0 : _a.focus();
@@ -2527,7 +2520,7 @@ function SmallAppBar({
     "small-app-bar"
   ) });
 }
-var RippleItem = React36.memo(function RippleItem2({
+var RippleItem = React37.memo(function RippleItem2({
   ripple,
   onDone
 }) {
@@ -2571,8 +2564,8 @@ function Ripple({
 }
 function useRippleState(options = {}) {
   const { disabled = false } = options;
-  const [ripples, setRipples] = React36.useState([]);
-  const onPointerDown = React36.useCallback(
+  const [ripples, setRipples] = React37.useState([]);
+  const onPointerDown = React37.useCallback(
     (e) => {
       if (disabled) return;
       const rect = e.currentTarget.getBoundingClientRect();
@@ -2589,7 +2582,7 @@ function useRippleState(options = {}) {
     },
     [disabled]
   );
-  const removeRipple = React36.useCallback((id) => {
+  const removeRipple = React37.useCallback((id) => {
     setRipples((prev) => prev.filter((r) => r.id !== id));
   }, []);
   return { ripples, onPointerDown, removeRipple };
@@ -2603,27 +2596,1950 @@ function TouchTarget() {
     }
   );
 }
-var NavigationBarContext = React36.createContext({ variant: "flexible" });
+
+// src/shapes/core/features.ts
+function cornerFeature(cubics, convex2) {
+  return { type: "corner", cubics, convex: convex2 };
+}
+function edgeFeature(cubics) {
+  return { type: "edge", cubics };
+}
+function transformFeature(feature, fn) {
+  const cubics = feature.cubics.map((c) => c.transformed(fn));
+  if (feature.type === "corner") {
+    return cornerFeature(cubics, feature.convex);
+  }
+  return edgeFeature(cubics);
+}
+
+// src/shapes/math/corner-rounding.ts
+var UNROUNDED = Object.freeze({
+  radius: 0,
+  smoothing: 0
+});
+
+// src/shapes/utils/utils.ts
+var DISTANCE_EPSILON = 1e-4;
+var FLOAT_PI = Math.PI;
+function distance(dx, dy) {
+  return Math.sqrt(dx * dx + dy * dy);
+}
+function distanceSquared(dx, dy) {
+  return dx * dx + dy * dy;
+}
+function radialToCartesian(radius, angle) {
+  return [radius * Math.cos(angle), radius * Math.sin(angle)];
+}
+function interpolate(start, stop, fraction) {
+  return start + (stop - start) * fraction;
+}
+function square(value) {
+  return value * value;
+}
+function convex(prevX, prevY, currX, currY, nextX, nextY) {
+  const v1x = currX - prevX;
+  const v1y = currY - prevY;
+  const v2x = nextX - currX;
+  const v2y = nextY - currY;
+  return v1x * v2y - v1y * v2x > 0;
+}
+
+// src/shapes/math/point.ts
+function point(x, y) {
+  return { x, y };
+}
+
+// src/shapes/math/cubic.ts
+var Cubic = class _Cubic {
+  constructor(points) {
+    if (points.length !== 8)
+      throw new Error("Cubic points array must have exactly 8 elements");
+    this.points = points;
+  }
+  /** First anchor point X */
+  get anchor0X() {
+    return this.points[0];
+  }
+  /** First anchor point Y */
+  get anchor0Y() {
+    return this.points[1];
+  }
+  /** First control point X */
+  get control0X() {
+    return this.points[2];
+  }
+  /** First control point Y */
+  get control0Y() {
+    return this.points[3];
+  }
+  /** Second control point X */
+  get control1X() {
+    return this.points[4];
+  }
+  /** Second control point Y */
+  get control1Y() {
+    return this.points[5];
+  }
+  /** Second anchor point X */
+  get anchor1X() {
+    return this.points[6];
+  }
+  /** Second anchor point Y */
+  get anchor1Y() {
+    return this.points[7];
+  }
+  /**
+   * Returns a point on the curve at parameter t (0=start, 1=end).
+   * Uses the standard cubic Bézier formula.
+   * @param t - Parameter in [0, 1]
+   */
+  pointOnCurve(t) {
+    const u = 1 - t;
+    return point(
+      this.anchor0X * (u * u * u) + this.control0X * (3 * t * u * u) + this.control1X * (3 * t * t * u) + this.anchor1X * (t * t * t),
+      this.anchor0Y * (u * u * u) + this.control0Y * (3 * t * u * u) + this.control1Y * (3 * t * t * u) + this.anchor1Y * (t * t * t)
+    );
+  }
+  /**
+   * Returns true if this curve has (near) zero length.
+   */
+  zeroLength() {
+    return Math.abs(this.anchor0X - this.anchor1X) < DISTANCE_EPSILON && Math.abs(this.anchor0Y - this.anchor1Y) < DISTANCE_EPSILON;
+  }
+  /**
+   * Splits this cubic at parameter t, returning two cubics.
+   * Uses De Casteljau's algorithm.
+   * @param t - Split parameter in [0, 1]
+   * @returns [left, right] pair
+   */
+  split(t) {
+    const u = 1 - t;
+    const mid = this.pointOnCurve(t);
+    const left = new _Cubic([
+      this.anchor0X,
+      this.anchor0Y,
+      this.anchor0X * u + this.control0X * t,
+      this.anchor0Y * u + this.control0Y * t,
+      this.anchor0X * (u * u) + this.control0X * (2 * u * t) + this.control1X * (t * t),
+      this.anchor0Y * (u * u) + this.control0Y * (2 * u * t) + this.control1Y * (t * t),
+      mid.x,
+      mid.y
+    ]);
+    const right = new _Cubic([
+      mid.x,
+      mid.y,
+      this.control0X * (u * u) + this.control1X * (2 * u * t) + this.anchor1X * (t * t),
+      this.control0Y * (u * u) + this.control1Y * (2 * u * t) + this.anchor1Y * (t * t),
+      this.control1X * u + this.anchor1X * t,
+      this.control1Y * u + this.anchor1Y * t,
+      this.anchor1X,
+      this.anchor1Y
+    ]);
+    return [left, right];
+  }
+  /**
+   * Returns a reversed copy of this cubic (anchor0 ↔ anchor1, controls swapped).
+   */
+  reverse() {
+    return new _Cubic([
+      this.anchor1X,
+      this.anchor1Y,
+      this.control1X,
+      this.control1Y,
+      this.control0X,
+      this.control0Y,
+      this.anchor0X,
+      this.anchor0Y
+    ]);
+  }
+  /**
+   * Calculates the axis-aligned bounding box.
+   * @param approximate - If true, uses control point hull (faster). Default: false.
+   * @returns [minX, minY, maxX, maxY]
+   */
+  calculateBounds(approximate = false) {
+    if (this.zeroLength()) {
+      return [this.anchor0X, this.anchor0Y, this.anchor0X, this.anchor0Y];
+    }
+    let minX = Math.min(this.anchor0X, this.anchor1X);
+    let minY = Math.min(this.anchor0Y, this.anchor1Y);
+    let maxX = Math.max(this.anchor0X, this.anchor1X);
+    let maxY = Math.max(this.anchor0Y, this.anchor1Y);
+    if (approximate) {
+      minX = Math.min(minX, this.control0X, this.control1X);
+      minY = Math.min(minY, this.control0Y, this.control1Y);
+      maxX = Math.max(maxX, this.control0X, this.control1X);
+      maxY = Math.max(maxY, this.control0Y, this.control1Y);
+      return [minX, minY, maxX, maxY];
+    }
+    const xa = -this.anchor0X + 3 * this.control0X - 3 * this.control1X + this.anchor1X;
+    const xb = 2 * this.anchor0X - 4 * this.control0X + 2 * this.control1X;
+    const xc = -this.anchor0X + this.control0X;
+    const expandX = (t) => {
+      if (t >= 0 && t <= 1) {
+        const v = this.pointOnCurve(t).x;
+        if (v < minX) minX = v;
+        if (v > maxX) maxX = v;
+      }
+    };
+    if (Math.abs(xa) < DISTANCE_EPSILON) {
+      if (xb !== 0) expandX(2 * xc / (-2 * xb));
+    } else {
+      const xs = xb * xb - 4 * xa * xc;
+      if (xs >= 0) {
+        expandX((-xb + Math.sqrt(xs)) / (2 * xa));
+        expandX((-xb - Math.sqrt(xs)) / (2 * xa));
+      }
+    }
+    const ya = -this.anchor0Y + 3 * this.control0Y - 3 * this.control1Y + this.anchor1Y;
+    const yb = 2 * this.anchor0Y - 4 * this.control0Y + 2 * this.control1Y;
+    const yc = -this.anchor0Y + this.control0Y;
+    const expandY = (t) => {
+      if (t >= 0 && t <= 1) {
+        const v = this.pointOnCurve(t).y;
+        if (v < minY) minY = v;
+        if (v > maxY) maxY = v;
+      }
+    };
+    if (Math.abs(ya) < DISTANCE_EPSILON) {
+      if (yb !== 0) expandY(2 * yc / (-2 * yb));
+    } else {
+      const ys = yb * yb - 4 * ya * yc;
+      if (ys >= 0) {
+        expandY((-yb + Math.sqrt(ys)) / (2 * ya));
+        expandY((-yb - Math.sqrt(ys)) / (2 * ya));
+      }
+    }
+    return [minX, minY, maxX, maxY];
+  }
+  /**
+   * Interpolates between this cubic and another at fraction t.
+   * @param other - Target cubic
+   * @param t - Fraction [0, 1]
+   */
+  interpolateTo(other, t) {
+    return new _Cubic(
+      this.points.map((v, i) => interpolate(v, other.points[i], t))
+    );
+  }
+  /**
+   * Applies a PointTransformer to all anchor and control points.
+   * @param fn - The transform function
+   */
+  transformed(fn) {
+    const p = this.points.slice();
+    for (let i = 0; i < 8; i += 2) {
+      const [tx, ty] = fn(p[i], p[i + 1]);
+      p[i] = tx;
+      p[i + 1] = ty;
+    }
+    return new _Cubic(p);
+  }
+  toString() {
+    return `Cubic(a0=(${this.anchor0X},${this.anchor0Y}) c0=(${this.control0X},${this.control0Y}) c1=(${this.control1X},${this.control1Y}) a1=(${this.anchor1X},${this.anchor1Y}))`;
+  }
+  // ─── Static factories ─────────────────────────────────────────────────────
+  /**
+   * Creates a cubic representing a straight line.
+   * Control points lie at 1/3 and 2/3 of the line.
+   * @param x0 - Start anchor X
+   * @param y0 - Start anchor Y
+   * @param x1 - End anchor X
+   * @param y1 - End anchor Y
+   */
+  static straightLine(x0, y0, x1, y1) {
+    return new _Cubic([
+      x0,
+      y0,
+      interpolate(x0, x1, 1 / 3),
+      interpolate(y0, y1, 1 / 3),
+      interpolate(x0, x1, 2 / 3),
+      interpolate(y0, y1, 2 / 3),
+      x1,
+      y1
+    ]);
+  }
+  /**
+   * Creates a cubic approximating a circular arc.
+   * p0 and p1 must be equidistant from the center.
+   * For arcs > 180°, use multiple cubics.
+   *
+   * @param centerX - Arc center X
+   * @param centerY - Arc center Y
+   * @param x0 - Start point X (on circle)
+   * @param y0 - Start point Y (on circle)
+   * @param x1 - End point X (on circle)
+   * @param y1 - End point Y (on circle)
+   */
+  static circularArc(centerX, centerY, x0, y0, x1, y1) {
+    const p0dx = x0 - centerX;
+    const p0dy = y0 - centerY;
+    const p1dx = x1 - centerX;
+    const p1dy = y1 - centerY;
+    const d0 = Math.sqrt(p0dx * p0dx + p0dy * p0dy);
+    const d1 = Math.sqrt(p1dx * p1dx + p1dy * p1dy);
+    if (d0 < DISTANCE_EPSILON || d1 < DISTANCE_EPSILON) {
+      return _Cubic.straightLine(x0, y0, x1, y1);
+    }
+    const nx0 = p0dx / d0, ny0 = p0dy / d0;
+    const nx1 = p1dx / d1, ny1 = p1dy / d1;
+    const rx0 = -ny0, ry0 = nx0;
+    const rx1 = -ny1, ry1 = nx1;
+    const cosa = nx0 * nx1 + ny0 * ny1;
+    if (cosa > 0.999) return _Cubic.straightLine(x0, y0, x1, y1);
+    const clockwise = rx0 * p1dx + ry0 * p1dy >= 0;
+    const k = d0 * (4 / 3) * (Math.sqrt(2 * (1 - cosa)) - Math.sqrt(1 - square(cosa))) / (1 - cosa) * (clockwise ? 1 : -1);
+    return new _Cubic([
+      x0,
+      y0,
+      x0 + rx0 * k,
+      y0 + ry0 * k,
+      x1 - rx1 * k,
+      y1 - ry1 * k,
+      x1,
+      y1
+    ]);
+  }
+  /**
+   * Creates a zero-length cubic at the given point.
+   * @param x - X coordinate
+   * @param y - Y coordinate
+   */
+  static empty(x, y) {
+    return new _Cubic([x, y, x, y, x, y, x, y]);
+  }
+};
+
+// src/shapes/core/rounded-polygon.ts
+var RoundedCorner = class {
+  constructor(p0, p1, p2, rounding = UNROUNDED) {
+    this.p0 = p0;
+    this.p1 = p1;
+    this.p2 = p2;
+    this.rounding = rounding;
+    this.center = point(0, 0);
+    const v01x = p0.x - p1.x, v01y = p0.y - p1.y;
+    const v21x = p2.x - p1.x, v21y = p2.y - p1.y;
+    const d01 = distance(v01x, v01y);
+    const d21 = distance(v21x, v21y);
+    if (d01 > 0 && d21 > 0) {
+      this.d1 = point(v01x / d01, v01y / d01);
+      this.d2 = point(v21x / d21, v21y / d21);
+      this.cornerRadius = rounding.radius;
+      this.smoothing = rounding.smoothing;
+      const cosA = this.d1.x * this.d2.x + this.d1.y * this.d2.y;
+      this.sinAngle = Math.sqrt(Math.max(0, 1 - square(cosA)));
+      this.expectedRoundCut = this.sinAngle > 1e-3 ? this.cornerRadius * (cosA + 1) / this.sinAngle : 0;
+    } else {
+      this.d1 = point(0, 0);
+      this.d2 = point(0, 0);
+      this.cornerRadius = 0;
+      this.smoothing = 0;
+      this.sinAngle = 0;
+      this.expectedRoundCut = 0;
+    }
+  }
+  get expectedCut() {
+    return (1 + this.smoothing) * this.expectedRoundCut;
+  }
+  getCubics(allowedCut0, allowedCut1 = allowedCut0) {
+    const allowedCut = Math.min(allowedCut0, allowedCut1);
+    if (this.expectedRoundCut < DISTANCE_EPSILON || allowedCut < DISTANCE_EPSILON || this.cornerRadius < DISTANCE_EPSILON) {
+      this.center = this.p1;
+      return [Cubic.straightLine(this.p1.x, this.p1.y, this.p1.x, this.p1.y)];
+    }
+    const actualRoundCut = Math.min(allowedCut, this.expectedRoundCut);
+    const actualSmoothing0 = this.calcSmoothingValue(allowedCut0);
+    const actualSmoothing1 = this.calcSmoothingValue(allowedCut1);
+    const actualR = this.cornerRadius * actualRoundCut / this.expectedRoundCut;
+    const centerDist = Math.sqrt(square(actualR) + square(actualRoundCut));
+    const midDirX = (this.d1.x + this.d2.x) / 2;
+    const midDirY = (this.d1.y + this.d2.y) / 2;
+    const midDist = distance(midDirX, midDirY);
+    this.center = point(
+      this.p1.x + midDirX / midDist * centerDist,
+      this.p1.y + midDirY / midDist * centerDist
+    );
+    const ci0 = point(
+      this.p1.x + this.d1.x * actualRoundCut,
+      this.p1.y + this.d1.y * actualRoundCut
+    );
+    const ci2 = point(
+      this.p1.x + this.d2.x * actualRoundCut,
+      this.p1.y + this.d2.y * actualRoundCut
+    );
+    const flanking0 = this.computeFlankingCurve(
+      actualRoundCut,
+      actualSmoothing0,
+      this.p1,
+      this.p0,
+      ci0,
+      ci2,
+      this.center,
+      actualR
+    );
+    const flanking2 = this.computeFlankingCurve(
+      actualRoundCut,
+      actualSmoothing1,
+      this.p1,
+      this.p2,
+      ci2,
+      ci0,
+      this.center,
+      actualR
+    ).reverse();
+    return [
+      flanking0,
+      Cubic.circularArc(
+        this.center.x,
+        this.center.y,
+        flanking0.anchor1X,
+        flanking0.anchor1Y,
+        flanking2.anchor0X,
+        flanking2.anchor0Y
+      ),
+      flanking2
+    ];
+  }
+  calcSmoothingValue(allowedCut) {
+    if (allowedCut > this.expectedCut) return this.smoothing;
+    if (allowedCut > this.expectedRoundCut) {
+      return this.smoothing * (allowedCut - this.expectedRoundCut) / (this.expectedCut - this.expectedRoundCut);
+    }
+    return 0;
+  }
+  computeFlankingCurve(actualRoundCut, actualSmoothing, corner, sideStart, circleIntersect, otherIntersect, circleCenter, actualR) {
+    var _a;
+    const sdx = sideStart.x - corner.x, sdy = sideStart.y - corner.y;
+    const sd = distance(sdx, sdy);
+    const sideDir = point(sdx / sd, sdy / sd);
+    const curveStart = point(
+      corner.x + sideDir.x * actualRoundCut * (1 + actualSmoothing),
+      corner.y + sideDir.y * actualRoundCut * (1 + actualSmoothing)
+    );
+    const px = interpolate(
+      circleIntersect.x,
+      (circleIntersect.x + otherIntersect.x) / 2,
+      actualSmoothing
+    );
+    const py = interpolate(
+      circleIntersect.y,
+      (circleIntersect.y + otherIntersect.y) / 2,
+      actualSmoothing
+    );
+    const ptoCx = px - circleCenter.x, ptoCy = py - circleCenter.y;
+    const ptoCd = distance(ptoCx, ptoCy);
+    const curveEnd = point(
+      circleCenter.x + ptoCx / ptoCd * actualR,
+      circleCenter.y + ptoCy / ptoCd * actualR
+    );
+    const tangentX = -(curveEnd.y - circleCenter.y);
+    const tangentY = curveEnd.x - circleCenter.x;
+    const anchorEnd = (_a = lineIntersection(
+      sideStart,
+      sideDir,
+      curveEnd,
+      point(tangentX, tangentY)
+    )) != null ? _a : circleIntersect;
+    const anchorStart = point(
+      (curveStart.x + anchorEnd.x * 2) / 3,
+      (curveStart.y + anchorEnd.y * 2) / 3
+    );
+    return new Cubic([
+      curveStart.x,
+      curveStart.y,
+      anchorStart.x,
+      anchorStart.y,
+      anchorEnd.x,
+      anchorEnd.y,
+      curveEnd.x,
+      curveEnd.y
+    ]);
+  }
+};
+function lineIntersection(p0, d0, p1, d1) {
+  const rd1x = -d1.y, rd1y = d1.x;
+  const den = d0.x * rd1x + d0.y * rd1y;
+  if (Math.abs(den) < DISTANCE_EPSILON) return null;
+  const num = (p1.x - p0.x) * rd1x + (p1.y - p0.y) * rd1y;
+  if (Math.abs(den) < DISTANCE_EPSILON * Math.abs(num)) return null;
+  const k = num / den;
+  return point(p0.x + d0.x * k, p0.y + d0.y * k);
+}
+function calculateCenter(vertices) {
+  let cx = 0, cy = 0;
+  for (let i = 0; i < vertices.length; i += 2) {
+    cx += vertices[i];
+    cy += vertices[i + 1];
+  }
+  const n = vertices.length / 2;
+  return point(cx / n, cy / n);
+}
+function verticesFromNumVerts(numVertices, radius, cx, cy) {
+  const result = [];
+  for (let i = 0; i < numVertices; i++) {
+    const angle = FLOAT_PI / numVertices * 2 * i;
+    const [rx, ry] = radialToCartesian(radius, angle);
+    result.push(cx + rx, cy + ry);
+  }
+  return result;
+}
+var RoundedPolygon = class _RoundedPolygon {
+  /** @internal Use static factory methods instead */
+  constructor(features, center) {
+    this.features = features;
+    this.center = center;
+    this.cubics = buildCubicsList(features);
+    validateContiguity(this.cubics);
+  }
+  get centerX() {
+    return this.center.x;
+  }
+  get centerY() {
+    return this.center.y;
+  }
+  // ─── Static factories ────────────────────────────────────────────────
+  /**
+   * Creates a polygon from a vertex count (regular polygon).
+   * @param numVertices - Number of vertices (≥ 3)
+   * @param radius - Circumradius (default: 1)
+   * @param centerX - Center X (default: 0)
+   * @param centerY - Center Y (default: 0)
+   * @param rounding - Corner rounding for all vertices
+   * @param perVertexRounding - Per-vertex rounding overrides
+   */
+  static fromNumVertices(numVertices, radius = 1, centerX = 0, centerY = 0, rounding = UNROUNDED, perVertexRounding) {
+    if (numVertices < 3)
+      throw new Error("Polygon must have at least 3 vertices");
+    const vertices = verticesFromNumVerts(
+      numVertices,
+      radius,
+      centerX,
+      centerY
+    );
+    return _RoundedPolygon.fromVertices(
+      vertices,
+      rounding,
+      perVertexRounding,
+      centerX,
+      centerY
+    );
+  }
+  /**
+   * Creates a polygon from a flat vertex array [x0, y0, x1, y1, ...].
+   * @param vertices - Flat array of x,y pairs (length must be even and ≥ 6)
+   * @param rounding - Corner rounding for all vertices
+   * @param perVertexRounding - Per-vertex rounding overrides
+   * @param centerX - Center X (auto-calculated if not provided)
+   * @param centerY - Center Y (auto-calculated if not provided)
+   */
+  static fromVertices(vertices, rounding = UNROUNDED, perVertexRounding, centerX, centerY) {
+    if (vertices.length < 6)
+      throw new Error("Polygon must have at least 3 vertices");
+    if (vertices.length % 2 !== 0)
+      throw new Error("Vertices array must have even length");
+    if (perVertexRounding && perVertexRounding.length * 2 !== vertices.length) {
+      throw new Error("perVertexRounding must match vertex count");
+    }
+    const n = vertices.length / 2;
+    const roundedCorners = [];
+    for (let i = 0; i < n; i++) {
+      const vtxRounding = perVertexRounding ? perVertexRounding[i] : rounding;
+      const prevIdx = (i + n - 1) % n * 2;
+      const nextIdx = (i + 1) % n * 2;
+      roundedCorners.push(
+        new RoundedCorner(
+          point(vertices[prevIdx], vertices[prevIdx + 1]),
+          point(vertices[i * 2], vertices[i * 2 + 1]),
+          point(vertices[nextIdx], vertices[nextIdx + 1]),
+          vtxRounding
+        )
+      );
+    }
+    const cutAdjusts = [];
+    for (let ix = 0; ix < n; ix++) {
+      const expectedRoundCut = roundedCorners[ix].expectedRoundCut + roundedCorners[(ix + 1) % n].expectedRoundCut;
+      const expectedCut = roundedCorners[ix].expectedCut + roundedCorners[(ix + 1) % n].expectedCut;
+      const vx = vertices[ix * 2], vy = vertices[ix * 2 + 1];
+      const nx = vertices[(ix + 1) % n * 2], ny = vertices[(ix + 1) % n * 2 + 1];
+      const sideSize = distance(vx - nx, vy - ny);
+      if (expectedRoundCut > sideSize) {
+        cutAdjusts.push([sideSize / expectedRoundCut, 0]);
+      } else if (expectedCut > sideSize) {
+        cutAdjusts.push([
+          1,
+          (sideSize - expectedRoundCut) / (expectedCut - expectedRoundCut)
+        ]);
+      } else {
+        cutAdjusts.push([1, 1]);
+      }
+    }
+    const corners = [];
+    for (let i = 0; i < n; i++) {
+      const allowedCuts = [];
+      for (const delta of [0, 1]) {
+        const [roundCutRatio, cutRatio] = cutAdjusts[(i + n - 1 + delta) % n];
+        allowedCuts.push(
+          roundedCorners[i].expectedRoundCut * roundCutRatio + (roundedCorners[i].expectedCut - roundedCorners[i].expectedRoundCut) * cutRatio
+        );
+      }
+      corners.push(roundedCorners[i].getCubics(allowedCuts[0], allowedCuts[1]));
+    }
+    const tempFeatures = [];
+    for (let i = 0; i < n; i++) {
+      const prevIdx = (i + n - 1) % n;
+      const nextIdx = (i + 1) % n;
+      const currV = point(vertices[i * 2], vertices[i * 2 + 1]);
+      const prevV = point(vertices[prevIdx * 2], vertices[prevIdx * 2 + 1]);
+      const nextV = point(vertices[nextIdx * 2], vertices[nextIdx * 2 + 1]);
+      const isConvex = convex(
+        prevV.x,
+        prevV.y,
+        currV.x,
+        currV.y,
+        nextV.x,
+        nextV.y
+      );
+      tempFeatures.push(cornerFeature(corners[i], isConvex));
+      const lastCornerA1 = corners[i][corners[i].length - 1];
+      const nextCornerA0 = corners[(i + 1) % n][0];
+      tempFeatures.push(
+        edgeFeature([
+          Cubic.straightLine(
+            lastCornerA1.anchor1X,
+            lastCornerA1.anchor1Y,
+            nextCornerA0.anchor0X,
+            nextCornerA0.anchor0Y
+          )
+        ])
+      );
+    }
+    const cx = centerX != null ? centerX : calculateCenter(vertices).x;
+    const cy = centerY != null ? centerY : calculateCenter(vertices).y;
+    return new _RoundedPolygon(tempFeatures, point(cx, cy));
+  }
+  /**
+   * Creates a polygon from a pre-built Feature list.
+   * @param features - Feature list (≥ 2 features)
+   * @param centerX - Center X (auto-calculated if NaN)
+   * @param centerY - Center Y (auto-calculated if NaN)
+   */
+  static fromFeatures(features, centerX = Number.NaN, centerY = Number.NaN) {
+    if (features.length < 2)
+      throw new Error("Polygon must have at least 2 features");
+    const allVertices = [];
+    for (const f of features) {
+      for (const c of f.cubics) {
+        allVertices.push(c.anchor0X, c.anchor0Y);
+      }
+    }
+    const cx = Number.isNaN(centerX) ? calculateCenter(allVertices).x : centerX;
+    const cy = Number.isNaN(centerY) ? calculateCenter(allVertices).y : centerY;
+    return new _RoundedPolygon(features, point(cx, cy));
+  }
+  // ─── Instance methods ────────────────────────────────────────────────
+  /**
+   * Returns a new RoundedPolygon with all points transformed.
+   * @param fn - Transform function: (x, y) => [x', y']
+   */
+  transformed(fn) {
+    const [cx, cy] = fn(this.center.x, this.center.y);
+    return new _RoundedPolygon(
+      this.features.map((f) => transformFeature(f, fn)),
+      point(cx, cy)
+    );
+  }
+  /**
+   * Returns a normalized copy: scaled and centered to fit in [0,1] × [0,1].
+   * Maintains aspect ratio by using the larger dimension.
+   */
+  normalized() {
+    const [minX, minY, maxX, maxY] = this.calculateBounds(false);
+    const width = maxX - minX;
+    const height = maxY - minY;
+    const side = Math.max(width, height);
+    const offsetX = (side - width) / 2 - minX;
+    const offsetY = (side - height) / 2 - minY;
+    return this.transformed((x, y) => [
+      (x + offsetX) / side,
+      (y + offsetY) / side
+    ]);
+  }
+  /**
+   * Calculates the axis-aligned bounding box.
+   * @param approximate - If true, uses control point hull (faster). Default: true.
+   * @returns [minX, minY, maxX, maxY]
+   */
+  calculateBounds(approximate = true) {
+    let minX = Number.MAX_VALUE, minY = Number.MAX_VALUE;
+    let maxX = -Number.MAX_VALUE, maxY = -Number.MAX_VALUE;
+    for (const c of this.cubics) {
+      const [cx0, cy0, cx1, cy1] = c.calculateBounds(approximate);
+      if (cx0 < minX) minX = cx0;
+      if (cy0 < minY) minY = cy0;
+      if (cx1 > maxX) maxX = cx1;
+      if (cy1 > maxY) maxY = cy1;
+    }
+    return [minX, minY, maxX, maxY];
+  }
+  /**
+   * Calculates the maximum bounding square (useful for shapes that rotate).
+   * @returns [minX, minY, maxX, maxY] of the max-bounds square
+   */
+  calculateMaxBounds() {
+    let maxDistSq = 0;
+    for (const c of this.cubics) {
+      const ad = distanceSquared(
+        c.anchor0X - this.centerX,
+        c.anchor0Y - this.centerY
+      );
+      const mid = c.pointOnCurve(0.5);
+      const md = distanceSquared(mid.x - this.centerX, mid.y - this.centerY);
+      const m31 = Math.max(ad, md);
+      if (m31 > maxDistSq) maxDistSq = m31;
+    }
+    const d = Math.sqrt(maxDistSq);
+    return [
+      this.centerX - d,
+      this.centerY - d,
+      this.centerX + d,
+      this.centerY + d
+    ];
+  }
+};
+function buildCubicsList(features) {
+  const result = [];
+  let firstCubic = null;
+  let lastCubic = null;
+  let firstFeatureSplitStart = null;
+  let firstFeatureSplitEnd = null;
+  if (features.length > 0 && features[0].cubics.length === 3) {
+    const center = features[0].cubics[1];
+    const [start, end] = center.split(0.5);
+    firstFeatureSplitStart = [features[0].cubics[0], start];
+    firstFeatureSplitEnd = [end, features[0].cubics[2]];
+  }
+  for (let i = 0; i <= features.length; i++) {
+    let featureCubics;
+    if (i === 0 && firstFeatureSplitEnd) {
+      featureCubics = firstFeatureSplitEnd;
+    } else if (i === features.length) {
+      if (firstFeatureSplitStart) featureCubics = firstFeatureSplitStart;
+      else break;
+    } else {
+      featureCubics = features[i].cubics;
+    }
+    for (const cubic of featureCubics) {
+      if (!cubic.zeroLength()) {
+        if (lastCubic) result.push(lastCubic);
+        lastCubic = cubic;
+        if (!firstCubic) firstCubic = cubic;
+      } else if (lastCubic) {
+        const p = lastCubic.points.slice();
+        p[6] = cubic.anchor1X;
+        p[7] = cubic.anchor1Y;
+        lastCubic = new Cubic(p);
+      }
+    }
+  }
+  if (lastCubic && firstCubic) {
+    result.push(
+      new Cubic([
+        lastCubic.anchor0X,
+        lastCubic.anchor0Y,
+        lastCubic.control0X,
+        lastCubic.control0Y,
+        lastCubic.control1X,
+        lastCubic.control1Y,
+        firstCubic.anchor0X,
+        firstCubic.anchor0Y
+      ])
+    );
+  } else {
+    result.push(Cubic.empty(0, 0));
+  }
+  return result;
+}
+function validateContiguity(cubics) {
+  let prev = cubics[cubics.length - 1];
+  for (const cubic of cubics) {
+    if (Math.abs(cubic.anchor0X - prev.anchor1X) > DISTANCE_EPSILON || Math.abs(cubic.anchor0Y - prev.anchor1Y) > DISTANCE_EPSILON) {
+      throw new Error(
+        `RoundedPolygon must be contiguous: gap between (${cubic.anchor0X},${cubic.anchor0Y}) and (${prev.anchor1X},${prev.anchor1Y})`
+      );
+    }
+    prev = cubic;
+  }
+}
+
+// src/shapes/catalog/md3-expressive-shapes.ts
+function createShape(pts) {
+  const cubics = pts.map((p) => new Cubic(p));
+  return RoundedPolygon.fromFeatures(
+    cubics.map((c) => cornerFeature([c], false))
+  );
+}
+var archShape = createShape([
+  [1, 0.83461, 1, 0.8547, 1, 0.86477, 0.99898, 0.87322],
+  [0.99898, 0.87322, 0.99115, 0.93918, 0.93918, 0.99115, 0.87322, 0.99898],
+  [0.87322, 0.99898, 0.86477, 1, 0.8547, 1, 0.83461, 1],
+  [0.83461, 1, 0.61154, 1, 0.38847, 1, 0.1654, 1],
+  [0.1654, 1, 0.14529, 1, 0.13524, 1, 0.12679, 0.99898],
+  [0.12679, 0.99898, 0.06084, 0.99115, 884e-5, 0.93918, 1e-3, 0.87322],
+  [1e-3, 0.87322, 0, 0.86477, 0, 0.8547, 0, 0.83461],
+  [0, 0.83461, 0, 0.72307, 0, 0.61154, 0, 0.5],
+  [0, 0.5, 0, 0.22385, 0.22386, 0, 0.5, 0],
+  [0.5, 0, 0.77615, 0, 1, 0.22385, 1, 0.5],
+  [1, 0.5, 1, 0.61154, 1, 0.72307, 1, 0.83461]
+]);
+var arrowShape = createShape([
+  [0.8594, 0.44684, 0.81504, 0.37855, 0.77068, 0.31016, 0.72632, 0.24187],
+  [0.72632, 0.24187, 0.69754, 0.19753, 0.66825, 0.1526, 0.62934, 0.11738],
+  [0.62934, 0.11738, 0.59043, 0.08209, 0.54003, 0.05716, 0.48834, 0.06041],
+  [0.48834, 0.06041, 0.44296, 0.06333, 0.4009, 0.08773, 0.36769, 0.11959],
+  [0.36769, 0.11959, 0.33449, 0.15146, 0.30869, 0.1907, 0.28332, 0.22956],
+  [0.28332, 0.22956, 0.21469, 0.33456, 0.14598, 0.43956, 0.07736, 0.54462],
+  [0.07736, 0.54462, 0.04474, 0.5945, 0.01128, 0.64655, 226e-5, 0.70598],
+  [226e-5, 0.70598, -864e-5, 0.77779, 0.02074, 0.85092, 0.07284, 0.89867],
+  [0.07284, 0.89867, 0.12733, 0.94861, 0.21563, 0.94456, 0.28196, 0.93089],
+  [0.28196, 0.93089, 0.35467, 0.91586, 0.42576, 0.8876, 0.49992, 0.88769],
+  [0.49992, 0.88769, 0.56344, 0.88769, 0.62483, 0.90858, 0.68664, 0.92377],
+  [0.68664, 0.92377, 0.74837, 0.93886, 0.8147, 0.94817, 0.8743, 0.9257],
+  [0.8743, 0.9257, 0.94829, 0.89788, 1.00142, 0.81877, 0.99997, 0.73757],
+  [0.99997, 0.73757, 0.99861, 0.66348, 0.95714, 0.59731, 0.91721, 0.53567],
+  [0.91721, 0.53567, 0.89797, 0.50608, 0.87873, 0.47643, 0.85948, 0.44684],
+  [0.85948, 0.44684, 0.85946, 0.44684, 0.85943, 0.44684, 0.8594, 0.44684]
+]);
+var boomShape = createShape([
+  [0.49006, 0.03176, 0.49241, 0.01294, 0.49359, 354e-5, 0.49537, 185e-5],
+  [0.49537, 185e-5, 0.49796, -62e-5, 0.50203, -62e-5, 0.50462, 185e-5],
+  [0.50462, 185e-5, 0.50641, 354e-5, 0.50759, 0.01294, 0.50994, 0.03176],
+  [0.50994, 0.03176, 0.51992, 0.11153, 0.5299, 0.1913, 0.53987, 0.27107],
+  [0.53987, 0.27107, 0.54082, 0.27866, 0.5413, 0.28244, 0.54266, 0.28403],
+  [0.54266, 0.28403, 0.54464, 0.28628, 0.54787, 0.287, 0.5506, 0.28572],
+  [0.5506, 0.28572, 0.55248, 0.28485, 0.55445, 0.28157, 0.55839, 0.275],
+  [0.55839, 0.275, 0.59978, 0.20621, 0.64116, 0.13742, 0.68254, 0.06863],
+  [0.68254, 0.06863, 0.69231, 0.05241, 0.69719, 0.04429, 0.6995, 0.04348],
+  [0.6995, 0.04348, 0.70287, 0.04232, 0.70657, 0.04398, 0.70795, 0.04729],
+  [0.70795, 0.04729, 0.70891, 0.04954, 0.70617, 0.05863, 0.70071, 0.07679],
+  [0.70071, 0.07679, 0.67756, 0.15373, 0.6544, 0.23068, 0.63124, 0.30763],
+  [0.63124, 0.30763, 0.62904, 0.31497, 0.62794, 0.31863, 0.62855, 0.3206],
+  [0.62855, 0.3206, 0.62942, 0.32348, 0.6321, 0.32544, 0.63512, 0.32541],
+  [0.63512, 0.32541, 0.63719, 0.32538, 0.64031, 0.32319, 0.64656, 0.31882],
+  [0.64656, 0.31882, 0.7122, 0.2729, 0.77783, 0.22698, 0.84347, 0.18107],
+  [0.84347, 0.18107, 0.85895, 0.17022, 0.86669, 0.16482, 0.86913, 0.16501],
+  [0.86913, 0.16501, 0.87269, 0.16533, 0.87539, 0.16834, 0.87532, 0.17191],
+  [0.87532, 0.17191, 0.87528, 0.17438, 0.86911, 0.18157, 0.85678, 0.19591],
+  [0.85678, 0.19591, 0.80449, 0.25674, 0.75221, 0.31758, 0.69992, 0.37841],
+  [0.69992, 0.37841, 0.69494, 0.38419, 0.69246, 0.3871, 0.69221, 0.38916],
+  [0.69221, 0.38916, 0.69185, 0.39216, 0.6935, 0.39503, 0.69627, 0.39622],
+  [0.69627, 0.39622, 0.69817, 0.39706, 0.70191, 0.39631, 0.70939, 0.39488],
+  [0.70939, 0.39488, 0.78793, 0.37977, 0.86646, 0.36467, 0.945, 0.34957],
+  [0.945, 0.34957, 0.96353, 0.346, 0.9728, 0.34422, 0.97494, 0.34541],
+  [0.97494, 0.34541, 0.97806, 0.34713, 0.97931, 0.351, 0.9778, 0.35425],
+  [0.9778, 0.35425, 0.97676, 0.35647, 0.96822, 0.3605, 0.95115, 0.36856],
+  [0.95115, 0.36856, 0.87878, 0.40276, 0.80641, 0.43696, 0.73403, 0.47116],
+  [0.73403, 0.47116, 0.72714, 0.47441, 0.7237, 0.47603, 0.72263, 0.47781],
+  [0.72263, 0.47781, 0.72109, 0.48041, 0.72144, 0.48372, 0.72348, 0.48594],
+  [0.72348, 0.48594, 0.72489, 0.48747, 0.7286, 0.48834, 0.73601, 0.49006],
+  [0.73601, 0.49006, 0.81387, 0.50839, 0.89173, 0.52671, 0.96959, 0.54503],
+  [0.96959, 0.54503, 0.98796, 0.54934, 0.99715, 0.5515, 0.99862, 0.55347],
+  [0.99862, 0.55347, 1.00077, 0.55631, 1.00035, 0.56037, 0.99766, 0.56272],
+  [0.99766, 0.56272, 0.9958, 0.56431, 0.98638, 0.56453, 0.96751, 0.56491],
+  [0.96751, 0.56491, 0.88757, 0.56654, 0.80762, 0.56818, 0.72767, 0.56981],
+  [0.72767, 0.56981, 0.72006, 0.56997, 0.71626, 0.57006, 0.71456, 0.57125],
+  [0.71456, 0.57125, 0.7121, 0.573, 0.71108, 0.57617, 0.71206, 0.57903],
+  [0.71206, 0.57903, 0.71272, 0.581, 0.71576, 0.58331, 0.72182, 0.58794],
+  [0.72182, 0.58794, 0.78555, 0.6365, 0.84927, 0.68506, 0.91299, 0.73362],
+  [0.91299, 0.73362, 0.92802, 0.74509, 0.93554, 0.75084, 0.93609, 0.75322],
+  [0.93609, 0.75322, 0.93691, 0.7567, 0.93489, 0.76022, 0.93147, 0.76128],
+  [0.93147, 0.76128, 0.92912, 0.762, 0.92043, 0.75831, 0.90304, 0.75097],
+  [0.90304, 0.75097, 0.82934, 0.71977, 0.75565, 0.68857, 0.68195, 0.65737],
+  [0.68195, 0.65737, 0.67493, 0.6544, 0.67142, 0.6529, 0.66939, 0.65331],
+  [0.66939, 0.65331, 0.66644, 0.65391, 0.66423, 0.65637, 0.66396, 0.65937],
+  [0.66396, 0.65937, 0.66378, 0.66144, 0.66561, 0.66481, 0.66928, 0.6715],
+  [0.66928, 0.6715, 0.70784, 0.74193, 0.74641, 0.81237, 0.78497, 0.88281],
+  [0.78497, 0.88281, 0.79407, 0.8994, 0.79862, 0.90771, 0.79815, 0.91015],
+  [0.79815, 0.91015, 0.79748, 0.91366, 0.79421, 0.91604, 0.79067, 0.91562],
+  [0.79067, 0.91562, 0.78824, 0.91531, 0.78179, 0.9084, 0.76888, 0.89456],
+  [0.76888, 0.89456, 0.71418, 0.83591, 0.65947, 0.77727, 0.60477, 0.71862],
+  [0.60477, 0.71862, 0.59956, 0.71306, 0.59695, 0.71025, 0.59494, 0.70981],
+  [0.59494, 0.70981, 0.592, 0.70912, 0.58897, 0.71048, 0.58752, 0.71312],
+  [0.58752, 0.71312, 0.58651, 0.71493, 0.58683, 0.71875, 0.58747, 0.72637],
+  [0.58747, 0.72637, 0.59421, 0.80649, 0.60094, 0.8866, 0.60768, 0.96671],
+  [0.60768, 0.96671, 0.60927, 0.98562, 0.61006, 0.99506, 0.60866, 0.99709],
+  [0.60866, 0.99709, 0.60663, 1.00002, 0.60267, 1.00087, 0.59962, 0.99902],
+  [0.59962, 0.99902, 0.59752, 0.99774, 0.59442, 0.98877, 0.58823, 0.97087],
+  [0.58823, 0.97087, 0.56197, 0.89493, 0.53572, 0.819, 0.50946, 0.74306],
+  [0.50946, 0.74306, 0.50696, 0.73581, 0.50571, 0.73222, 0.50406, 0.73097],
+  [0.50406, 0.73097, 0.50165, 0.72916, 0.49834, 0.72916, 0.49594, 0.73097],
+  [0.49594, 0.73097, 0.49428, 0.73222, 0.49303, 0.73581, 0.49053, 0.74306],
+  [0.49053, 0.74306, 0.46428, 0.819, 0.43803, 0.89493, 0.41177, 0.97087],
+  [0.41177, 0.97087, 0.40558, 0.98877, 0.40248, 0.99774, 0.40038, 0.99902],
+  [0.40038, 0.99902, 0.39733, 1.00087, 0.39338, 1.00002, 0.39134, 0.99709],
+  [0.39134, 0.99709, 0.38994, 0.99506, 0.39073, 0.98562, 0.39232, 0.96671],
+  [0.39232, 0.96671, 0.39906, 0.8866, 0.40579, 0.80649, 0.41253, 0.72637],
+  [0.41253, 0.72637, 0.41317, 0.71875, 0.41349, 0.71493, 0.41248, 0.71312],
+  [0.41248, 0.71312, 0.41104, 0.71048, 0.408, 0.70912, 0.40507, 0.70981],
+  [0.40507, 0.70981, 0.40305, 0.71025, 0.40044, 0.71306, 0.39523, 0.71862],
+  [0.39523, 0.71862, 0.34053, 0.77727, 0.28582, 0.83591, 0.23112, 0.89456],
+  [0.23112, 0.89456, 0.21821, 0.9084, 0.21176, 0.91531, 0.20933, 0.91562],
+  [0.20933, 0.91562, 0.20578, 0.91604, 0.20252, 0.91366, 0.20184, 0.91015],
+  [0.20184, 0.91015, 0.20138, 0.90771, 0.20593, 0.8994, 0.21503, 0.88281],
+  [0.21503, 0.88281, 0.25359, 0.81237, 0.29215, 0.74193, 0.33072, 0.6715],
+  [0.33072, 0.6715, 0.33439, 0.66481, 0.33622, 0.66144, 0.33604, 0.65937],
+  [0.33604, 0.65937, 0.33577, 0.65637, 0.33356, 0.65391, 0.3306, 0.65331],
+  [0.3306, 0.65331, 0.32857, 0.6529, 0.32506, 0.6544, 0.31805, 0.65737],
+  [0.31805, 0.65737, 0.24435, 0.68857, 0.17065, 0.71977, 0.09695, 0.75097],
+  [0.09695, 0.75097, 0.07957, 0.75831, 0.07087, 0.762, 0.06853, 0.76128],
+  [0.06853, 0.76128, 0.06511, 0.76022, 0.06309, 0.7567, 0.06391, 0.75322],
+  [0.06391, 0.75322, 0.06446, 0.75084, 0.07198, 0.74509, 0.08701, 0.73362],
+  [0.08701, 0.73362, 0.15073, 0.68506, 0.21445, 0.6365, 0.27817, 0.58794],
+  [0.27817, 0.58794, 0.28424, 0.58331, 0.28727, 0.581, 0.28794, 0.57903],
+  [0.28794, 0.57903, 0.28892, 0.57617, 0.2879, 0.573, 0.28543, 0.57125],
+  [0.28543, 0.57125, 0.28374, 0.57006, 0.27993, 0.56997, 0.27232, 0.56981],
+  [0.27232, 0.56981, 0.19238, 0.56818, 0.11243, 0.56654, 0.03248, 0.56491],
+  [0.03248, 0.56491, 0.01362, 0.56453, 419e-5, 0.56431, 234e-5, 0.56272],
+  [234e-5, 0.56272, -35e-5, 0.56036, -77e-5, 0.55633, 138e-5, 0.55347],
+  [138e-5, 0.55347, 285e-5, 0.5515, 0.01204, 0.54934, 0.03041, 0.54503],
+  [0.03041, 0.54503, 0.10827, 0.52671, 0.18613, 0.50839, 0.26399, 0.49006],
+  [0.26399, 0.49006, 0.2714, 0.48834, 0.27511, 0.48747, 0.27652, 0.48594],
+  [0.27652, 0.48594, 0.27856, 0.48372, 0.27891, 0.48041, 0.27736, 0.47781],
+  [0.27736, 0.47781, 0.2763, 0.47603, 0.27286, 0.47441, 0.26597, 0.47116],
+  [0.26597, 0.47116, 0.19359, 0.43696, 0.12122, 0.40276, 0.04885, 0.36856],
+  [0.04885, 0.36856, 0.03177, 0.3605, 0.02324, 0.35647, 0.0222, 0.35425],
+  [0.0222, 0.35425, 0.02068, 0.35101, 0.02193, 0.34715, 0.02506, 0.34541],
+  [0.02506, 0.34541, 0.0272, 0.34422, 0.03647, 0.346, 0.055, 0.34957],
+  [0.055, 0.34957, 0.13353, 0.36467, 0.21207, 0.37977, 0.29061, 0.39488],
+  [0.29061, 0.39488, 0.29809, 0.39631, 0.30183, 0.39706, 0.30373, 0.39622],
+  [0.30373, 0.39622, 0.3065, 0.39502, 0.30815, 0.39215, 0.30779, 0.38916],
+  [0.30779, 0.38916, 0.30755, 0.3871, 0.30506, 0.38419, 0.30008, 0.37841],
+  [0.30008, 0.37841, 0.24779, 0.31758, 0.19551, 0.25674, 0.14322, 0.19591],
+  [0.14322, 0.19591, 0.13089, 0.18157, 0.12472, 0.17438, 0.12468, 0.17191],
+  [0.12468, 0.17191, 0.12461, 0.16834, 0.12731, 0.16533, 0.13086, 0.16501],
+  [0.13086, 0.16501, 0.1333, 0.16482, 0.14104, 0.17022, 0.15653, 0.18107],
+  [0.15653, 0.18107, 0.22217, 0.22698, 0.2878, 0.2729, 0.35344, 0.31882],
+  [0.35344, 0.31882, 0.35969, 0.32319, 0.36281, 0.32538, 0.36488, 0.32541],
+  [0.36488, 0.32541, 0.3679, 0.32544, 0.37058, 0.32348, 0.37145, 0.3206],
+  [0.37145, 0.3206, 0.37206, 0.31863, 0.37096, 0.31497, 0.36875, 0.30763],
+  [0.36875, 0.30763, 0.3456, 0.23068, 0.32244, 0.15373, 0.29929, 0.07679],
+  [0.29929, 0.07679, 0.29382, 0.05863, 0.29109, 0.04954, 0.29205, 0.04729],
+  [0.29205, 0.04729, 0.29342, 0.04399, 0.29711, 0.04232, 0.3005, 0.04348],
+  [0.3005, 0.04348, 0.30281, 0.04429, 0.30769, 0.05241, 0.31745, 0.06863],
+  [0.31745, 0.06863, 0.35884, 0.13742, 0.40022, 0.20621, 0.44161, 0.275],
+  [0.44161, 0.275, 0.44555, 0.28157, 0.44752, 0.28485, 0.4494, 0.28572],
+  [0.4494, 0.28572, 0.45212, 0.287, 0.45536, 0.28628, 0.45734, 0.28403],
+  [0.45734, 0.28403, 0.4587, 0.28244, 0.45917, 0.27866, 0.46012, 0.27107],
+  [0.46012, 0.27107, 0.4701, 0.1913, 0.48008, 0.11153, 0.49006, 0.03176]
+]);
+var bunShape = createShape([
+  [0.01546, 0.25425, 0.01545, 0.18682, 0.04224, 0.12214, 0.08992, 0.07446],
+  [0.08992, 0.07446, 0.1376, 0.02678, 0.20228, -1e-5, 0.26971, 0],
+  [0.26971, 0, 0.42313, 0, 0.57654, 0, 0.72996, 0],
+  [0.72996, 0, 0.85665, -17e-5, 0.96413, 0.09297, 0.98198, 0.2184],
+  [0.98198, 0.2184, 0.99983, 0.34383, 0.92261, 0.46325, 0.8009, 0.49844],
+  [0.8009, 0.49844, 0.8002, 0.49863, 0.79972, 0.49927, 0.79974, 0.5],
+  [0.79974, 0.5, 0.79974, 0.50072, 0.80021, 0.50134, 0.8009, 0.50156],
+  [0.8009, 0.50156, 0.92232, 0.537, 0.99924, 0.65629, 0.98142, 0.78152],
+  [0.98142, 0.78152, 0.96359, 0.90675, 0.85645, 0.99984, 0.72996, 1],
+  [0.72996, 1, 0.57654, 1, 0.42313, 1, 0.26971, 1],
+  [0.26971, 1, 0.20228, 1.00001, 0.1376, 0.97322, 0.08992, 0.92554],
+  [0.08992, 0.92554, 0.04224, 0.87786, 0.01545, 0.81318, 0.01546, 0.74575],
+  [0.01546, 0.74575, 0.01548, 0.63344, 0.08915, 0.53444, 0.19671, 0.50216],
+  [0.19671, 0.50216, 0.19766, 0.50187, 0.19832, 0.501, 0.19832, 0.5],
+  [0.19832, 0.5, 0.19832, 0.49901, 0.19766, 0.49813, 0.19671, 0.49784],
+  [0.19671, 0.49784, 0.08915, 0.46556, 0.01548, 0.36656, 0.01546, 0.25425]
+]);
+var burstShape = createShape([
+  [0.49184, 797e-5, 0.49416, 384e-5, 0.49528, 181e-5, 0.49669, 94e-5],
+  [0.49669, 94e-5, 0.49872, -31e-5, 0.50128, -31e-5, 0.50331, 94e-5],
+  [0.50331, 94e-5, 0.50472, 181e-5, 0.50584, 384e-5, 0.50816, 797e-5],
+  [0.50816, 797e-5, 0.53447, 0.055, 0.56078, 0.10203, 0.58709, 0.14906],
+  [0.58709, 0.14906, 0.5885, 0.15159, 0.58922, 0.15287, 0.59019, 0.15362],
+  [0.59019, 0.15362, 0.59156, 0.15475, 0.59334, 0.15522, 0.59509, 0.15494],
+  [0.59509, 0.15494, 0.59631, 0.15475, 0.59756, 0.15403, 0.60003, 0.15253],
+  [0.60003, 0.15253, 0.64634, 0.12496, 0.69266, 0.09739, 0.73897, 0.06981],
+  [0.73897, 0.06981, 0.743, 0.06741, 0.74503, 0.06619, 0.74666, 0.06616],
+  [0.74666, 0.06616, 0.74906, 0.06606, 0.75125, 0.06734, 0.75241, 0.06944],
+  [0.75241, 0.06944, 0.75319, 0.07091, 0.75316, 0.07325, 0.75309, 0.07797],
+  [0.75309, 0.07797, 0.75236, 0.13185, 0.75164, 0.18574, 0.75091, 0.23962],
+  [0.75091, 0.23962, 0.75084, 0.24253, 0.75084, 0.24397, 0.75128, 0.24512],
+  [0.75128, 0.24512, 0.75191, 0.24678, 0.75322, 0.24809, 0.75488, 0.24872],
+  [0.75488, 0.24872, 0.75603, 0.24916, 0.75747, 0.24916, 0.76038, 0.24909],
+  [0.76038, 0.24909, 0.81426, 0.24836, 0.86815, 0.24764, 0.92203, 0.24691],
+  [0.92203, 0.24691, 0.92675, 0.24684, 0.92909, 0.24681, 0.93056, 0.24759],
+  [0.93056, 0.24759, 0.93266, 0.24875, 0.93394, 0.25094, 0.93384, 0.25334],
+  [0.93384, 0.25334, 0.93381, 0.25497, 0.93259, 0.257, 0.93019, 0.26103],
+  [0.93019, 0.26103, 0.90261, 0.30734, 0.87504, 0.35366, 0.84747, 0.39997],
+  [0.84747, 0.39997, 0.84597, 0.40244, 0.84525, 0.40369, 0.84506, 0.40491],
+  [0.84506, 0.40491, 0.84478, 0.40666, 0.84525, 0.40844, 0.84638, 0.40981],
+  [0.84638, 0.40981, 0.84713, 0.41078, 0.84841, 0.4115, 0.85094, 0.41291],
+  [0.85094, 0.41291, 0.89797, 0.43922, 0.945, 0.46553, 0.99203, 0.49184],
+  [0.99203, 0.49184, 0.99616, 0.49416, 0.99819, 0.49528, 0.99906, 0.49669],
+  [0.99906, 0.49669, 1.00031, 0.49872, 1.00031, 0.50128, 0.99906, 0.50331],
+  [0.99906, 0.50331, 0.99819, 0.50472, 0.99616, 0.50584, 0.99203, 0.50816],
+  [0.99203, 0.50816, 0.945, 0.53447, 0.89797, 0.56078, 0.85094, 0.58709],
+  [0.85094, 0.58709, 0.84841, 0.5885, 0.84713, 0.58922, 0.84638, 0.59019],
+  [0.84638, 0.59019, 0.84525, 0.59156, 0.84478, 0.59334, 0.84506, 0.59509],
+  [0.84506, 0.59509, 0.84525, 0.59631, 0.84597, 0.59756, 0.84747, 0.60003],
+  [0.84747, 0.60003, 0.87504, 0.64634, 0.90261, 0.69266, 0.93019, 0.73897],
+  [0.93019, 0.73897, 0.93259, 0.743, 0.93381, 0.74503, 0.93384, 0.74666],
+  [0.93384, 0.74666, 0.93394, 0.74906, 0.93266, 0.75125, 0.93056, 0.75241],
+  [0.93056, 0.75241, 0.92909, 0.75319, 0.92675, 0.75316, 0.92203, 0.75309],
+  [0.92203, 0.75309, 0.86815, 0.75236, 0.81426, 0.75164, 0.76038, 0.75091],
+  [0.76038, 0.75091, 0.75747, 0.75084, 0.75603, 0.75084, 0.75488, 0.75128],
+  [0.75488, 0.75128, 0.75322, 0.75191, 0.75191, 0.75322, 0.75128, 0.75488],
+  [0.75128, 0.75488, 0.75084, 0.75603, 0.75084, 0.75747, 0.75091, 0.76038],
+  [0.75091, 0.76038, 0.75164, 0.81426, 0.75236, 0.86815, 0.75309, 0.92203],
+  [0.75309, 0.92203, 0.75316, 0.92675, 0.75319, 0.92909, 0.75241, 0.93056],
+  [0.75241, 0.93056, 0.75125, 0.93266, 0.74906, 0.93394, 0.74666, 0.93384],
+  [0.74666, 0.93384, 0.74503, 0.93381, 0.743, 0.93259, 0.73897, 0.93019],
+  [0.73897, 0.93019, 0.69266, 0.90261, 0.64634, 0.87504, 0.60003, 0.84747],
+  [0.60003, 0.84747, 0.59756, 0.84597, 0.59631, 0.84525, 0.59509, 0.84506],
+  [0.59509, 0.84506, 0.59334, 0.84478, 0.59156, 0.84525, 0.59019, 0.84638],
+  [0.59019, 0.84638, 0.58922, 0.84713, 0.5885, 0.84841, 0.58709, 0.85094],
+  [0.58709, 0.85094, 0.56078, 0.89797, 0.53447, 0.945, 0.50816, 0.99203],
+  [0.50816, 0.99203, 0.50584, 0.99616, 0.50472, 0.99819, 0.50331, 0.99906],
+  [0.50331, 0.99906, 0.50128, 1.00031, 0.49872, 1.00031, 0.49669, 0.99906],
+  [0.49669, 0.99906, 0.49528, 0.99819, 0.49416, 0.99616, 0.49184, 0.99203],
+  [0.49184, 0.99203, 0.46553, 0.945, 0.43922, 0.89797, 0.41291, 0.85094],
+  [0.41291, 0.85094, 0.4115, 0.84841, 0.41078, 0.84713, 0.40981, 0.84638],
+  [0.40981, 0.84638, 0.40844, 0.84525, 0.40666, 0.84478, 0.40491, 0.84506],
+  [0.40491, 0.84506, 0.40369, 0.84525, 0.40244, 0.84597, 0.39997, 0.84747],
+  [0.39997, 0.84747, 0.35366, 0.87504, 0.30734, 0.90261, 0.26103, 0.93019],
+  [0.26103, 0.93019, 0.257, 0.93259, 0.25497, 0.93381, 0.25334, 0.93384],
+  [0.25334, 0.93384, 0.25094, 0.93394, 0.24875, 0.93266, 0.24759, 0.93056],
+  [0.24759, 0.93056, 0.24681, 0.92909, 0.24684, 0.92675, 0.24691, 0.92203],
+  [0.24691, 0.92203, 0.24764, 0.86815, 0.24836, 0.81426, 0.24909, 0.76038],
+  [0.24909, 0.76038, 0.24916, 0.75747, 0.24916, 0.75603, 0.24872, 0.75488],
+  [0.24872, 0.75488, 0.24809, 0.75322, 0.24678, 0.75191, 0.24513, 0.75128],
+  [0.24513, 0.75128, 0.24397, 0.75084, 0.24253, 0.75084, 0.23963, 0.75091],
+  [0.23963, 0.75091, 0.18574, 0.75164, 0.13185, 0.75236, 0.07797, 0.75309],
+  [0.07797, 0.75309, 0.07325, 0.75316, 0.07091, 0.75319, 0.06944, 0.75241],
+  [0.06944, 0.75241, 0.06734, 0.75127, 0.06607, 0.74904, 0.06616, 0.74666],
+  [0.06616, 0.74666, 0.06619, 0.74503, 0.06741, 0.743, 0.06981, 0.73897],
+  [0.06981, 0.73897, 0.09739, 0.69266, 0.12496, 0.64634, 0.15253, 0.60003],
+  [0.15253, 0.60003, 0.15403, 0.59756, 0.15475, 0.59631, 0.15494, 0.59509],
+  [0.15494, 0.59509, 0.15522, 0.59334, 0.15475, 0.59156, 0.15363, 0.59019],
+  [0.15363, 0.59019, 0.15288, 0.58922, 0.15159, 0.5885, 0.14906, 0.58709],
+  [0.14906, 0.58709, 0.10203, 0.56078, 0.055, 0.53447, 797e-5, 0.50816],
+  [797e-5, 0.50816, 384e-5, 0.50584, 181e-5, 0.50472, 94e-5, 0.50331],
+  [94e-5, 0.50331, -31e-5, 0.50128, -31e-5, 0.49872, 94e-5, 0.49669],
+  [94e-5, 0.49669, 181e-5, 0.49528, 384e-5, 0.49416, 797e-5, 0.49184],
+  [797e-5, 0.49184, 0.055, 0.46553, 0.10203, 0.43922, 0.14906, 0.41291],
+  [0.14906, 0.41291, 0.15159, 0.4115, 0.15287, 0.41078, 0.15362, 0.40981],
+  [0.15362, 0.40981, 0.15475, 0.40844, 0.15522, 0.40666, 0.15494, 0.40491],
+  [0.15494, 0.40491, 0.15475, 0.40369, 0.15403, 0.40244, 0.15253, 0.39997],
+  [0.15253, 0.39997, 0.12496, 0.35366, 0.09739, 0.30734, 0.06981, 0.26103],
+  [0.06981, 0.26103, 0.06741, 0.257, 0.06619, 0.25497, 0.06616, 0.25334],
+  [0.06616, 0.25334, 0.06606, 0.25094, 0.06734, 0.24875, 0.06944, 0.24759],
+  [0.06944, 0.24759, 0.07091, 0.24681, 0.07325, 0.24684, 0.07797, 0.24691],
+  [0.07797, 0.24691, 0.13185, 0.24764, 0.18574, 0.24836, 0.23963, 0.24909],
+  [0.23963, 0.24909, 0.24253, 0.24916, 0.24397, 0.24916, 0.24513, 0.24872],
+  [0.24513, 0.24872, 0.24678, 0.24809, 0.24809, 0.24678, 0.24872, 0.24512],
+  [0.24872, 0.24512, 0.24916, 0.24397, 0.24916, 0.24253, 0.24909, 0.23962],
+  [0.24909, 0.23962, 0.24836, 0.18574, 0.24764, 0.13185, 0.24691, 0.07797],
+  [0.24691, 0.07797, 0.24684, 0.07325, 0.24681, 0.07091, 0.24759, 0.06944],
+  [0.24759, 0.06944, 0.24875, 0.06734, 0.25094, 0.06606, 0.25334, 0.06616],
+  [0.25334, 0.06616, 0.25497, 0.06619, 0.257, 0.06741, 0.26103, 0.06981],
+  [0.26103, 0.06981, 0.30734, 0.09739, 0.35366, 0.12496, 0.39997, 0.15253],
+  [0.39997, 0.15253, 0.40244, 0.15403, 0.40369, 0.15475, 0.40491, 0.15494],
+  [0.40491, 0.15494, 0.40666, 0.15522, 0.40844, 0.15475, 0.40981, 0.15362],
+  [0.40981, 0.15362, 0.41078, 0.15287, 0.4115, 0.15159, 0.41291, 0.14906],
+  [0.41291, 0.14906, 0.43922, 0.10203, 0.46553, 0.055, 0.49184, 797e-5]
+]);
+var circleShape = createShape([
+  [1, 0.5, 1, 0.77614, 0.77614, 1, 0.5, 1],
+  [0.5, 1, 0.22386, 1, 0, 0.77614, 0, 0.5],
+  [0, 0.5, 0, 0.22386, 0.22386, 0, 0.5, 0],
+  [0.5, 0, 0.77614, 0, 1, 0.22386, 1, 0.5]
+]);
+var clamshellShape = createShape([
+  [0.95752, 0.36588, 0.97848, 0.4081, 0.98896, 0.42921, 0.99426, 0.45126],
+  [0.99426, 0.45126, 1.00191, 0.4833, 1.00191, 0.5167, 0.99426, 0.54874],
+  [0.99426, 0.54874, 0.98896, 0.57079, 0.97848, 0.5919, 0.95752, 0.63412],
+  [0.95752, 0.63412, 0.93623, 0.677, 0.91494, 0.71987, 0.89365, 0.76275],
+  [0.89365, 0.76275, 0.87268, 0.80497, 0.8622, 0.82608, 0.84842, 0.84244],
+  [0.84842, 0.84244, 0.8285, 0.86609, 0.80339, 0.88295, 0.77581, 0.89118],
+  [0.77581, 0.89118, 0.75673, 0.89688, 0.73577, 0.89688, 0.69384, 0.89688],
+  [0.69384, 0.89688, 0.56461, 0.89688, 0.43539, 0.89688, 0.30616, 0.89688],
+  [0.30616, 0.89688, 0.26423, 0.89688, 0.24327, 0.89688, 0.22419, 0.89118],
+  [0.22419, 0.89118, 0.19661, 0.88295, 0.1715, 0.86609, 0.15158, 0.84244],
+  [0.15158, 0.84244, 0.1378, 0.82608, 0.12732, 0.80497, 0.10635, 0.76275],
+  [0.10635, 0.76275, 0.08506, 0.71987, 0.06377, 0.677, 0.04248, 0.63412],
+  [0.04248, 0.63412, 0.02152, 0.5919, 0.01104, 0.57079, 574e-5, 0.54874],
+  [574e-5, 0.54874, -191e-5, 0.5167, -191e-5, 0.4833, 574e-5, 0.45126],
+  [574e-5, 0.45126, 0.01104, 0.42921, 0.02152, 0.4081, 0.04248, 0.36588],
+  [0.04248, 0.36588, 0.06377, 0.323, 0.08506, 0.28013, 0.10635, 0.23725],
+  [0.10635, 0.23725, 0.12732, 0.19503, 0.1378, 0.17392, 0.15158, 0.15756],
+  [0.15158, 0.15756, 0.1715, 0.13391, 0.19661, 0.11705, 0.22419, 0.10882],
+  [0.22419, 0.10882, 0.24327, 0.10312, 0.26423, 0.10312, 0.30616, 0.10312],
+  [0.30616, 0.10312, 0.43539, 0.10312, 0.56461, 0.10312, 0.69384, 0.10312],
+  [0.69384, 0.10312, 0.73577, 0.10312, 0.75673, 0.10312, 0.77581, 0.10882],
+  [0.77581, 0.10882, 0.80339, 0.11705, 0.8285, 0.13391, 0.84842, 0.15756],
+  [0.84842, 0.15756, 0.8622, 0.17392, 0.87268, 0.19503, 0.89365, 0.23725],
+  [0.89365, 0.23725, 0.91494, 0.28013, 0.93623, 0.323, 0.95752, 0.36588]
+]);
+var diamondShape = createShape([
+  [0.67951, 0.864, 0.62689, 0.93286, 0.60059, 0.96728, 0.57021, 0.98296],
+  [0.57021, 0.98296, 0.52616, 1.00568, 0.47384, 1.00568, 0.42979, 0.98296],
+  [0.42979, 0.98296, 0.39941, 0.96728, 0.37311, 0.93286, 0.32049, 0.864],
+  [0.32049, 0.864, 0.26225, 0.78778, 0.20401, 0.71156, 0.14577, 0.63534],
+  [0.14577, 0.63534, 0.11377, 0.59346, 0.09777, 0.57252, 0.08984, 0.5501],
+  [0.08984, 0.5501, 0.07838, 0.51768, 0.07838, 0.48232, 0.08984, 0.4499],
+  [0.08984, 0.4499, 0.09777, 0.42748, 0.11377, 0.40654, 0.14577, 0.36466],
+  [0.14577, 0.36466, 0.20401, 0.28844, 0.26225, 0.21222, 0.32049, 0.136],
+  [0.32049, 0.136, 0.37311, 0.06714, 0.39941, 0.03271, 0.42979, 0.01704],
+  [0.42979, 0.01704, 0.47384, -568e-5, 0.52616, -568e-5, 0.57021, 0.01704],
+  [0.57021, 0.01704, 0.60059, 0.03272, 0.62689, 0.06714, 0.67951, 0.136],
+  [0.67951, 0.136, 0.73775, 0.21222, 0.79599, 0.28844, 0.85423, 0.36466],
+  [0.85423, 0.36466, 0.88623, 0.40654, 0.90223, 0.42748, 0.91016, 0.4499],
+  [0.91016, 0.4499, 0.92162, 0.48232, 0.92162, 0.51768, 0.91016, 0.5501],
+  [0.91016, 0.5501, 0.90223, 0.57252, 0.88623, 0.59346, 0.85423, 0.63534],
+  [0.85423, 0.63534, 0.79599, 0.71156, 0.73775, 0.78778, 0.67951, 0.864]
+]);
+var fanShape = createShape([
+  [0, 0.15789, 0, 0.15232, 0, 0.14954, 7e-5, 0.14718],
+  [7e-5, 0.14718, 256e-5, 0.06699, 0.06699, 256e-5, 0.14718, 8e-5],
+  [0.14718, 8e-5, 0.14954, 0, 0.15232, 0, 0.1579, 0],
+  [0.1579, 0, 0.18761, 0, 0.20246, 0, 0.21503, 39e-5],
+  [0.21503, 39e-5, 0.64271, 0.01366, 0.98632, 0.35728, 0.99961, 0.78497],
+  [0.99961, 0.78497, 1, 0.79753, 1, 0.81239, 1, 0.8421],
+  [1, 0.8421, 1, 0.84767, 1, 0.85046, 0.99993, 0.85282],
+  [0.99993, 0.85282, 0.99743, 0.93301, 0.933, 0.99744, 0.85282, 0.99993],
+  [0.85282, 0.99993, 0.85046, 1, 0.84768, 1, 0.84211, 1],
+  [0.84211, 1, 0.63634, 1, 0.43057, 1, 0.2248, 1],
+  [0.2248, 1, 0.15688, 1, 0.12292, 1, 0.09598, 0.98933],
+  [0.09598, 0.98933, 0.05698, 0.97389, 0.02611, 0.94301, 0.01067, 0.90402],
+  [0.01067, 0.90402, 0, 0.87708, 0, 0.84312, 0, 0.7752],
+  [0, 0.7752, 0, 0.56943, 0, 0.36366, 0, 0.15789]
+]);
+var flowerShape = createShape([
+  [0.85353, 0.14645, 0.81641, 0.10934, 0.73184, 0.12769, 0.62984, 0.1865],
+  [0.62984, 0.1865, 0.59928, 0.07277, 0.55247, 0, 0.5, 0],
+  [0.5, 0, 0.4475, 0, 0.40069, 0.07276, 0.37016, 0.18649],
+  [0.37016, 0.18649, 0.26813, 0.12768, 0.18359, 0.10934, 0.14647, 0.14644],
+  [0.14647, 0.14644, 0.10938, 0.18355, 0.12772, 0.26811, 0.18653, 0.37014],
+  [0.18653, 0.37014, 0.07278, 0.40069, 0, 0.44751, 0, 0.5],
+  [0, 0.5, 0, 0.55248, 0.07275, 0.59929, 0.1865, 0.62984],
+  [0.1865, 0.62984, 0.12766, 0.73188, 0.10931, 0.81644, 0.14641, 0.85355],
+  [0.14641, 0.85355, 0.18353, 0.89067, 0.26809, 0.87231, 0.37012, 0.81347],
+  [0.37012, 0.81347, 0.40069, 0.92722, 0.4475, 1, 0.5, 1],
+  [0.5, 1, 0.55247, 1, 0.59928, 0.92722, 0.62984, 0.81346],
+  [0.62984, 0.81346, 0.73191, 0.8723, 0.81647, 0.89066, 0.85359, 0.85355],
+  [0.85359, 0.85355, 0.89069, 0.81644, 0.87234, 0.73188, 0.8135, 0.62984],
+  [0.8135, 0.62984, 0.92725, 0.59929, 1, 0.55248, 1, 0.5],
+  [1, 0.5, 1, 0.44751, 0.92722, 0.40069, 0.81344, 0.37014],
+  [0.81344, 0.37014, 0.87228, 0.26811, 0.89063, 0.18356, 0.85353, 0.14645]
+]);
+var gemShape = createShape([
+  [0.31244, 0.08536, 0.37064, 0.04306, 0.39978, 0.02191, 0.4308, 0.0114],
+  [0.4308, 0.0114, 0.47568, -38e-4, 0.52432, -38e-4, 0.5692, 0.0114],
+  [0.5692, 0.0114, 0.60022, 0.02191, 0.62936, 0.04306, 0.68756, 0.08536],
+  [0.68756, 0.08536, 0.73121, 0.11706, 0.77485, 0.14876, 0.81849, 0.18046],
+  [0.81849, 0.18046, 0.85308, 0.20558, 0.87038, 0.21814, 0.88446, 0.23321],
+  [0.88446, 0.23321, 0.90483, 0.25499, 0.92046, 0.28077, 0.93035, 0.30891],
+  [0.93035, 0.30891, 0.93721, 0.32838, 0.94032, 0.34951, 0.9466, 0.39178],
+  [0.9466, 0.39178, 0.95468, 0.44627, 0.96276, 0.50076, 0.97083, 0.55524],
+  [0.97083, 0.55524, 0.98183, 0.6294, 0.98734, 0.66648, 0.9818, 0.69989],
+  [0.9818, 0.69989, 0.97375, 0.74823, 0.9495, 0.79239, 0.91301, 0.8251],
+  [0.91301, 0.8251, 0.88779, 0.84771, 0.85353, 0.86296, 0.78503, 0.89347],
+  [0.78503, 0.89347, 0.73331, 0.91651, 0.68159, 0.93954, 0.62987, 0.96258],
+  [0.62987, 0.96258, 0.58853, 0.98099, 0.56785, 0.99019, 0.54663, 0.9949],
+  [0.54663, 0.9949, 0.51592, 1.0017, 0.48408, 1.0017, 0.45337, 0.9949],
+  [0.45337, 0.9949, 0.43215, 0.99019, 0.41147, 0.98099, 0.37013, 0.96258],
+  [0.37013, 0.96258, 0.31841, 0.93954, 0.26669, 0.91651, 0.21497, 0.89347],
+  [0.21497, 0.89347, 0.14647, 0.86296, 0.11221, 0.84771, 0.08699, 0.8251],
+  [0.08699, 0.8251, 0.0505, 0.79239, 0.02625, 0.74823, 0.0182, 0.69989],
+  [0.0182, 0.69989, 0.01266, 0.66648, 0.01817, 0.6294, 0.02917, 0.55524],
+  [0.02917, 0.55524, 0.03724, 0.50076, 0.04532, 0.44627, 0.0534, 0.39178],
+  [0.0534, 0.39178, 0.05968, 0.34951, 0.06279, 0.32838, 0.06965, 0.30891],
+  [0.06965, 0.30891, 0.07954, 0.28077, 0.09517, 0.25499, 0.11554, 0.23321],
+  [0.11554, 0.23321, 0.12962, 0.21814, 0.14692, 0.20558, 0.18151, 0.18046],
+  [0.18151, 0.18046, 0.22515, 0.14876, 0.26879, 0.11706, 0.31244, 0.08536]
+]);
+var ghostishShape = createShape([
+  [0, 0.47619, 0, 0.2132, 0.22386, 0, 0.5, 0],
+  [0.5, 0, 0.77614, 0, 1, 0.2132, 1, 0.47619],
+  [1, 0.47619, 1, 0.5873, 1, 0.69841, 1, 0.80952],
+  [1, 0.80952, 1, 0.91472, 0.91046, 1, 0.8, 1],
+  [0.8, 1, 0.76726, 1, 0.73636, 0.99251, 0.70908, 0.97923],
+  [0.70908, 0.97923, 0.69518, 0.97246, 0.68131, 0.96504, 0.66738, 0.95759],
+  [0.66738, 0.95759, 0.61838, 0.93137, 0.56864, 0.90476, 0.51423, 0.90476],
+  [0.51423, 0.90476, 0.50474, 0.90476, 0.49526, 0.90476, 0.48577, 0.90476],
+  [0.48577, 0.90476, 0.43136, 0.90476, 0.38163, 0.93137, 0.33262, 0.95759],
+  [0.33262, 0.95759, 0.31869, 0.96504, 0.30482, 0.97246, 0.29092, 0.97923],
+  [0.29092, 0.97923, 0.26364, 0.99251, 0.23274, 1, 0.2, 1],
+  [0.2, 1, 0.08954, 1, 0, 0.91472, 0, 0.80952],
+  [0, 0.80952, 0, 0.69841, 0, 0.5873, 0, 0.47619]
+]);
+var heartShape = createShape([
+  [0.78469, 0.05353, 0.717, 0.05353, 0.6566, 0.08531, 0.61713, 0.135],
+  [0.61713, 0.135, 0.57809, 0.17803, 0.53904, 0.22106, 0.5, 0.26409],
+  [0.5, 0.26409, 0.5, 0.26396, 0.5, 0.26382, 0.5, 0.26369],
+  [0.5, 0.26369, 0.46096, 0.22065, 0.42191, 0.1776, 0.38287, 0.13456],
+  [0.38287, 0.13456, 0.3434, 0.08491, 0.283, 0.05312, 0.21531, 0.05312],
+  [0.21531, 0.05312, 0.0964, 0.05312, 0, 0.15116, 0, 0.27206],
+  [0, 0.27206, 0, 0.37831, 0.08867, 0.45772, 0.15287, 0.534],
+  [0.15287, 0.534, 0.21684, 0.61003, 0.2808, 0.686, 0.34476, 0.762],
+  [0.34476, 0.762, 0.39262, 0.81887, 0.44049, 0.87575, 0.48835, 0.93263],
+  [0.48835, 0.93263, 0.49224, 0.93722, 0.49611, 0.94184, 0.5, 0.94647],
+  [0.5, 0.94647, 0.5, 0.9466, 0.5, 0.94674, 0.5, 0.94688],
+  [0.5, 0.94688, 0.50389, 0.94225, 0.50776, 0.93766, 0.51165, 0.93303],
+  [0.51165, 0.93303, 0.55951, 0.87616, 0.60737, 0.81931, 0.65524, 0.76244],
+  [0.65524, 0.76244, 0.7192, 0.68644, 0.78317, 0.61044, 0.84713, 0.53444],
+  [0.84713, 0.53444, 0.91133, 0.45816, 1, 0.37875, 1, 0.27247],
+  [1, 0.27247, 1, 0.15156, 0.9036, 0.05353, 0.78469, 0.05353]
+]);
+var clover4LeafShape = createShape([
+  [0.07095, 0.5, 0.02669, 0.44709, 0, 0.37882, 0, 0.30426],
+  [0, 0.30426, 0, 0.13622, 0.13551, 0, 0.3027, 0],
+  [0.3027, 0, 0.37834, 0, 0.44753, 0.02791, 0.50057, 0.07402],
+  [0.50057, 0.07402, 0.55351, 0.02791, 0.62253, 0, 0.69801, 0],
+  [0.69801, 0, 0.8648, 0, 1, 0.13622, 1, 0.30426],
+  [1, 0.30426, 1, 0.37882, 0.97338, 0.44709, 0.92922, 0.5],
+  [0.92922, 0.5, 0.97338, 0.55291, 1, 0.62118, 1, 0.69574],
+  [1, 0.69574, 1, 0.86378, 0.8648, 1, 0.69801, 1],
+  [0.69801, 1, 0.62253, 1, 0.55351, 0.97209, 0.50057, 0.92598],
+  [0.50057, 0.92598, 0.44753, 0.97209, 0.37834, 1, 0.3027, 1],
+  [0.3027, 1, 0.13551, 1, 0, 0.86378, 0, 0.69574],
+  [0, 0.69574, 0, 0.62118, 0.02669, 0.55291, 0.07095, 0.5]
+]);
+var clover8LeafShape = createShape([
+  [0.96431, 0.5, 1.0451, 0.6505, 0.98406, 0.78678, 0.82834, 0.82831],
+  [0.82834, 0.82831, 0.78678, 0.98406, 0.6505, 1.04506, 0.5, 0.96431],
+  [0.5, 0.96431, 0.34947, 1.0451, 0.21319, 0.98406, 0.17166, 0.82834],
+  [0.17166, 0.82834, 0.01594, 0.78678, -0.0451, 0.6505, 0.03569, 0.5],
+  [0.03569, 0.5, -0.0451, 0.34947, 0.01594, 0.21319, 0.17166, 0.17166],
+  [0.17166, 0.17166, 0.21319, 0.01594, 0.34947, -0.0451, 0.5, 0.03569],
+  [0.5, 0.03569, 0.6505, -0.0451, 0.78678, 0.01594, 0.82831, 0.17166],
+  [0.82831, 0.17166, 0.98406, 0.21319, 1.04506, 0.34947, 0.96431, 0.5]
+]);
+var ovalShape = createShape([
+  [0.77103, 0.77103, 0.53902, 1.00303, 0.22959, 1.06979, 0.07991, 0.9201],
+  [0.07991, 0.9201, -0.06978, 0.7704, -304e-5, 0.46097, 0.22897, 0.22897],
+  [0.22897, 0.22897, 0.46098, -303e-5, 0.77041, -0.06979, 0.92009, 0.0799],
+  [0.92009, 0.0799, 1.06978, 0.2296, 1.00304, 0.53903, 0.77103, 0.77103]
+]);
+var pentagonShape = createShape([
+  [0.3426, 0.07617, 0.39138, 0.03842, 0.41575, 0.01954, 0.44181, 0.01017],
+  [0.44181, 0.01017, 0.47942, -336e-5, 0.52058, -336e-5, 0.55819, 0.01017],
+  [0.55819, 0.01017, 0.58425, 0.01954, 0.60862, 0.03842, 0.6574, 0.07617],
+  [0.6574, 0.07617, 0.69296, 0.1037, 0.72853, 0.13123, 0.76409, 0.15876],
+  [0.76409, 0.15876, 0.79963, 0.18455, 0.83517, 0.21034, 0.87071, 0.23613],
+  [0.87071, 0.23613, 0.9213, 0.27285, 0.94662, 0.29123, 0.96352, 0.31429],
+  [0.96352, 0.31429, 0.98796, 0.34769, 1.00083, 0.38872, 0.99996, 0.43069],
+  [0.99996, 0.43069, 0.99933, 0.45972, 0.9893, 0.49006, 0.96918, 0.55072],
+  [0.96918, 0.55072, 0.95522, 0.59283, 0.94126, 0.63495, 0.9273, 0.67706],
+  [0.9273, 0.67706, 0.91443, 0.72021, 0.90155, 0.76335, 0.88868, 0.8065],
+  [0.88868, 0.8065, 0.87052, 0.86724, 0.86146, 0.89762, 0.84562, 0.92124],
+  [0.84562, 0.92124, 0.82268, 0.95543, 0.78934, 0.98055, 0.75099, 0.99259],
+  [0.75099, 0.99259, 0.7245, 1.00093, 0.69393, 1.00043, 0.63281, 0.99946],
+  [0.63281, 0.99946, 0.58854, 0.99876, 0.54427, 0.99806, 0.5, 0.99737],
+  [0.5, 0.99737, 0.45573, 0.99806, 0.41146, 0.99876, 0.36719, 0.99946],
+  [0.36719, 0.99946, 0.30607, 1.00043, 0.2755, 1.00093, 0.24901, 0.99259],
+  [0.24901, 0.99259, 0.21066, 0.98055, 0.17732, 0.95543, 0.15438, 0.92124],
+  [0.15438, 0.92124, 0.13854, 0.89762, 0.12948, 0.86724, 0.11132, 0.8065],
+  [0.11132, 0.8065, 0.09845, 0.76335, 0.08557, 0.72021, 0.0727, 0.67706],
+  [0.0727, 0.67706, 0.05874, 0.63495, 0.04478, 0.59283, 0.03082, 0.55072],
+  [0.03082, 0.55072, 0.0107, 0.49006, 67e-5, 0.45972, 4e-5, 0.43069],
+  [4e-5, 0.43069, -83e-5, 0.38872, 0.01204, 0.34769, 0.03648, 0.31429],
+  [0.03648, 0.31429, 0.05338, 0.29123, 0.0787, 0.27285, 0.12929, 0.23613],
+  [0.12929, 0.23613, 0.16483, 0.21034, 0.20037, 0.18455, 0.23591, 0.15876],
+  [0.23591, 0.15876, 0.27147, 0.13123, 0.30704, 0.1037, 0.3426, 0.07617]
+]);
+var pillShape = createShape([
+  [0.2662, 0.1259, 0.43407, -0.04197, 0.70623, -0.04197, 0.8741, 0.1259],
+  [0.8741, 0.1259, 1.04197, 0.29377, 1.04197, 0.56593, 0.8741, 0.7338],
+  [0.8741, 0.7338, 0.82733, 0.78057, 0.78057, 0.82733, 0.7338, 0.8741],
+  [0.7338, 0.8741, 0.56593, 1.04197, 0.29377, 1.04197, 0.1259, 0.8741],
+  [0.1259, 0.8741, -0.04197, 0.70623, -0.04197, 0.43407, 0.1259, 0.2662],
+  [0.1259, 0.2662, 0.17267, 0.21943, 0.21943, 0.17267, 0.2662, 0.1259]
+]);
+var pixelCircleShape = createShape([
+  [0.70372, 0, 0.56791, 0, 0.43209, 0, 0.29628, 0],
+  [0.29628, 0, 0.29628, 0.0216, 0.29628, 0.04321, 0.29628, 0.06481],
+  [0.29628, 0.06481, 0.24999, 0.06481, 0.2037, 0.06481, 0.15741, 0.06481],
+  [0.15741, 0.06481, 0.15741, 0.09259, 0.15741, 0.12037, 0.15741, 0.14816],
+  [0.15741, 0.14816, 0.12963, 0.14816, 0.10185, 0.14816, 0.07408, 0.14816],
+  [0.07408, 0.14816, 0.07408, 0.19753, 0.07408, 0.24691, 0.07408, 0.29628],
+  [0.07408, 0.29628, 0.04938, 0.29628, 0.02469, 0.29628, 0, 0.29628],
+  [0, 0.29628, 0, 0.43209, 0, 0.56791, 0, 0.70372],
+  [0, 0.70372, 0.02469, 0.70372, 0.04938, 0.70372, 0.07408, 0.70372],
+  [0.07408, 0.70372, 0.07408, 0.75309, 0.07408, 0.80247, 0.07408, 0.85184],
+  [0.07408, 0.85184, 0.10185, 0.85184, 0.12963, 0.85184, 0.15741, 0.85184],
+  [0.15741, 0.85184, 0.15741, 0.87962, 0.15741, 0.90741, 0.15741, 0.93519],
+  [0.15741, 0.93519, 0.2037, 0.93519, 0.24999, 0.93519, 0.29628, 0.93519],
+  [0.29628, 0.93519, 0.29628, 0.95679, 0.29628, 0.9784, 0.29628, 1],
+  [0.29628, 1, 0.43209, 1, 0.56791, 1, 0.70372, 1],
+  [0.70372, 1, 0.70372, 0.9784, 0.70372, 0.95679, 0.70372, 0.93519],
+  [0.70372, 0.93519, 0.75001, 0.93519, 0.7963, 0.93519, 0.84259, 0.93519],
+  [0.84259, 0.93519, 0.84259, 0.90741, 0.84259, 0.87962, 0.84259, 0.85184],
+  [0.84259, 0.85184, 0.87037, 0.85184, 0.89816, 0.85184, 0.92594, 0.85184],
+  [0.92594, 0.85184, 0.92594, 0.80247, 0.92594, 0.75309, 0.92594, 0.70372],
+  [0.92594, 0.70372, 0.95062, 0.70372, 0.97531, 0.70372, 1, 0.70372],
+  [1, 0.70372, 1, 0.56791, 1, 0.43209, 1, 0.29628],
+  [1, 0.29628, 0.97531, 0.29628, 0.95062, 0.29628, 0.92594, 0.29628],
+  [0.92594, 0.29628, 0.92594, 0.24691, 0.92594, 0.19753, 0.92594, 0.14816],
+  [0.92594, 0.14816, 0.89816, 0.14816, 0.87037, 0.14816, 0.84259, 0.14816],
+  [0.84259, 0.14816, 0.84259, 0.12038, 0.84259, 0.09259, 0.84259, 0.06481],
+  [0.84259, 0.06481, 0.7963, 0.06481, 0.75001, 0.06481, 0.70372, 0.06481],
+  [0.70372, 0.06481, 0.70372, 0.04321, 0.70372, 0.0216, 0.70372, 0]
+]);
+var pixelTriangleShape = createShape([
+  [0.28637, 0, 0.22842, 0, 0.17046, 0, 0.1125, 0],
+  [0.1125, 0, 0.1125, 0.33333, 0.1125, 0.66667, 0.1125, 1],
+  [0.1125, 1, 0.17046, 1, 0.22842, 1, 0.28637, 1],
+  [0.28637, 1, 0.28637, 0.97101, 0.28637, 0.94203, 0.28637, 0.91304],
+  [0.28637, 0.91304, 0.33108, 0.91304, 0.37579, 0.91304, 0.4205, 0.91304],
+  [0.4205, 0.91304, 0.4205, 0.88551, 0.4205, 0.85797, 0.4205, 0.83043],
+  [0.4205, 0.83043, 0.46688, 0.83043, 0.51325, 0.83043, 0.55963, 0.83043],
+  [0.55963, 0.83043, 0.55963, 0.79855, 0.55963, 0.76667, 0.55963, 0.73478],
+  [0.55963, 0.73478, 0.59771, 0.73478, 0.63579, 0.73478, 0.67388, 0.73478],
+  [0.67388, 0.73478, 0.67388, 0.70869, 0.67388, 0.68261, 0.67388, 0.65652],
+  [0.67388, 0.65652, 0.71197, 0.65652, 0.75006, 0.65652, 0.78816, 0.65652],
+  [0.78816, 0.65652, 0.78816, 0.62464, 0.78816, 0.59275, 0.78816, 0.56087],
+  [0.78816, 0.56087, 0.82127, 0.56087, 0.85439, 0.56087, 0.8875, 0.56087],
+  [0.8875, 0.56087, 0.8875, 0.52029, 0.8875, 0.47971, 0.8875, 0.43913],
+  [0.8875, 0.43913, 0.85439, 0.43913, 0.82127, 0.43913, 0.78816, 0.43913],
+  [0.78816, 0.43913, 0.78816, 0.40725, 0.78816, 0.37536, 0.78816, 0.34347],
+  [0.78816, 0.34347, 0.75006, 0.34347, 0.71197, 0.34347, 0.67388, 0.34347],
+  [0.67388, 0.34347, 0.67388, 0.31739, 0.67388, 0.2913, 0.67388, 0.26522],
+  [0.67388, 0.26522, 0.63579, 0.26522, 0.59771, 0.26522, 0.55963, 0.26522],
+  [0.55963, 0.26522, 0.55963, 0.23333, 0.55963, 0.20145, 0.55963, 0.16957],
+  [0.55963, 0.16957, 0.51325, 0.16957, 0.46688, 0.16957, 0.4205, 0.16957],
+  [0.4205, 0.16957, 0.4205, 0.14203, 0.4205, 0.11449, 0.4205, 0.08696],
+  [0.4205, 0.08696, 0.37579, 0.08696, 0.33108, 0.08696, 0.28637, 0.08696],
+  [0.28637, 0.08696, 0.28637, 0.05797, 0.28637, 0.02899, 0.28637, 0]
+]);
+var puffyDiamondShape = createShape([
+  [0.77937, 0.78048, 0.81712, 0.7427, 0.8299, 0.6894, 0.81768, 0.64111],
+  [0.81768, 0.64111, 0.86599, 0.65339, 0.91937, 0.64063, 0.95718, 0.60282],
+  [0.95718, 0.60282, 1.01427, 0.54574, 1.01427, 0.45319, 0.95718, 0.39611],
+  [0.95718, 0.39611, 0.91959, 0.35852, 0.86662, 0.34569, 0.81856, 0.3576],
+  [0.81856, 0.3576, 0.82928, 0.31027, 0.81621, 0.25865, 0.77937, 0.2218],
+  [0.77937, 0.2218, 0.7415, 0.18394, 0.68803, 0.17119, 0.63969, 0.18355],
+  [0.63969, 0.18355, 0.6525, 0.13492, 0.63984, 0.08095, 0.60169, 0.04282],
+  [0.60169, 0.04282, 0.54462, -0.01426, 0.45206, -0.01426, 0.395, 0.04282],
+  [0.395, 0.04282, 0.3571, 0.08073, 0.34435, 0.13427, 0.35678, 0.18269],
+  [0.35678, 0.18269, 0.30938, 0.17184, 0.2576, 0.18487, 0.22069, 0.2218],
+  [0.22069, 0.2218, 0.18385, 0.25865, 0.17079, 0.31028, 0.1815, 0.35761],
+  [0.1815, 0.35761, 0.13341, 0.34568, 0.08041, 0.35851, 0.04282, 0.39611],
+  [0.04282, 0.39611, -0.01427, 0.45319, -0.01427, 0.54574, 0.04282, 0.60282],
+  [0.04282, 0.60282, 0.08063, 0.64064, 0.13404, 0.6534, 0.18235, 0.6411],
+  [0.18235, 0.6411, 0.17013, 0.68939, 0.18291, 0.7427, 0.22069, 0.78048],
+  [0.22069, 0.78048, 0.25744, 0.81725, 0.30894, 0.83033, 0.35619, 0.81973],
+  [0.35619, 0.81973, 0.34478, 0.8675, 0.35772, 0.9199, 0.395, 0.95718],
+  [0.395, 0.95718, 0.45206, 1.01426, 0.54462, 1.01426, 0.60169, 0.95718],
+  [0.60169, 0.95718, 0.63919, 0.91968, 0.65206, 0.86688, 0.64028, 0.81888],
+  [0.64028, 0.81888, 0.6885, 0.83098, 0.74165, 0.81817, 0.77937, 0.78048]
+]);
+var puffyShape = createShape([
+  [0.99994, 0.49408, 0.99912, 0.42679, 0.94916, 0.37292, 0.88825, 0.37382],
+  [0.88825, 0.37382, 0.88491, 0.37382, 0.88159, 0.3741, 0.87831, 0.37449],
+  [0.87831, 0.37449, 0.88087, 0.37218, 0.88337, 0.36982, 0.88575, 0.36722],
+  [0.88575, 0.36722, 0.92937, 0.32028, 0.93028, 0.24307, 0.88784, 0.19483],
+  [0.88784, 0.19483, 0.88534, 0.19201, 0.88287, 0.18919, 0.88031, 0.18648],
+  [0.88031, 0.18648, 0.83669, 0.13954, 0.76694, 0.14055, 0.72444, 0.1888],
+  [0.72444, 0.1888, 0.72209, 0.19144, 0.71997, 0.19421, 0.71787, 0.19703],
+  [0.71787, 0.19703, 0.71822, 0.19342, 0.71844, 0.18975, 0.7185, 0.18603],
+  [0.7185, 0.18603, 0.71934, 0.11874, 0.67066, 0.06346, 0.60981, 0.0625],
+  [0.60981, 0.0625, 0.60682, 0.0625, 0.60383, 0.0625, 0.60084, 0.0625],
+  [0.60084, 0.0625, 0.55575, 0.0625, 0.51706, 0.09248, 0.5, 0.13537],
+  [0.5, 0.13537, 0.48294, 0.09248, 0.44422, 0.0625, 0.39916, 0.0625],
+  [0.39916, 0.0625, 0.39617, 0.0625, 0.39318, 0.0625, 0.39019, 0.0625],
+  [0.39019, 0.0625, 0.32934, 0.0634, 0.28066, 0.11869, 0.28147, 0.18603],
+  [0.28147, 0.18603, 0.28147, 0.18975, 0.28172, 0.19342, 0.28206, 0.19703],
+  [0.28206, 0.19703, 0.28, 0.19418, 0.27781, 0.19144, 0.2755, 0.1888],
+  [0.2755, 0.1888, 0.23306, 0.14055, 0.16325, 0.13954, 0.11962, 0.18648],
+  [0.11962, 0.18648, 0.11709, 0.18925, 0.11453, 0.19201, 0.11209, 0.19483],
+  [0.11209, 0.19483, 0.06966, 0.24307, 0.07056, 0.32022, 0.11419, 0.36722],
+  [0.11419, 0.36722, 0.11659, 0.36982, 0.11906, 0.37218, 0.12162, 0.37449],
+  [0.12162, 0.37449, 0.11833, 0.37409, 0.11501, 0.37387, 0.11169, 0.37382],
+  [0.11169, 0.37382, 0.05084, 0.37292, 87e-5, 0.42679, 0, 0.49408],
+  [0, 0.49408, 0, 0.49803, 0, 0.50197, 0, 0.50592],
+  [0, 0.50592, 81e-5, 0.57321, 0.05081, 0.62708, 0.11169, 0.62618],
+  [0.11169, 0.62618, 0.11506, 0.62618, 0.11837, 0.6259, 0.12162, 0.62551],
+  [0.12162, 0.62551, 0.11906, 0.62782, 0.11659, 0.63018, 0.11419, 0.63278],
+  [0.11419, 0.63278, 0.07056, 0.67972, 0.06966, 0.75693, 0.11209, 0.80518],
+  [0.11209, 0.80518, 0.11459, 0.80799, 0.11709, 0.81081, 0.11962, 0.81352],
+  [0.11962, 0.81352, 0.16325, 0.86046, 0.233, 0.85945, 0.2755, 0.8112],
+  [0.2755, 0.8112, 0.27784, 0.80856, 0.28, 0.80579, 0.28206, 0.80297],
+  [0.28206, 0.80298, 0.28171, 0.80663, 0.28151, 0.8103, 0.28147, 0.81397],
+  [0.28147, 0.81397, 0.28066, 0.88126, 0.32931, 0.9366, 0.39019, 0.9375],
+  [0.39019, 0.9375, 0.39318, 0.9375, 0.39617, 0.9375, 0.39916, 0.9375],
+  [0.39916, 0.9375, 0.44425, 0.9375, 0.48294, 0.90752, 0.5, 0.86463],
+  [0.5, 0.86463, 0.51706, 0.90752, 0.55578, 0.9375, 0.60084, 0.9375],
+  [0.60084, 0.9375, 0.60383, 0.9375, 0.60682, 0.9375, 0.60981, 0.9375],
+  [0.60981, 0.9375, 0.67066, 0.9366, 0.71934, 0.88131, 0.71853, 0.81397],
+  [0.71853, 0.81397, 0.71853, 0.81025, 0.71828, 0.80658, 0.71794, 0.80297],
+  [0.71794, 0.80297, 0.72, 0.80579, 0.72216, 0.80856, 0.7245, 0.8112],
+  [0.7245, 0.8112, 0.76694, 0.85945, 0.83675, 0.86046, 0.88037, 0.81352],
+  [0.88037, 0.81352, 0.88291, 0.81075, 0.88547, 0.80799, 0.88791, 0.80518],
+  [0.88791, 0.80518, 0.93034, 0.75693, 0.92944, 0.67978, 0.88581, 0.63278],
+  [0.88581, 0.63278, 0.88341, 0.63018, 0.88094, 0.62782, 0.87838, 0.62551],
+  [0.87838, 0.62551, 0.88167, 0.62591, 0.88499, 0.62613, 0.88831, 0.62618],
+  [0.88831, 0.62618, 0.94916, 0.62708, 0.99919, 0.57327, 1, 0.50592],
+  [1, 0.50592, 1, 0.50197, 1, 0.49803, 1, 0.49408],
+  [1, 0.49408, 0.99998, 0.49408, 0.99996, 0.49408, 0.99994, 0.49408]
+]);
+var semiCircleShape = createShape([
+  [1, 0.70913, 1, 0.76622, 0.95372, 0.8125, 0.89663, 0.8125],
+  [0.89663, 0.8125, 0.63221, 0.8125, 0.36779, 0.8125, 0.10337, 0.8125],
+  [0.10337, 0.8125, 0.04628, 0.8125, 0, 0.76622, 0, 0.70913],
+  [0, 0.70913, 0, 0.70192, 0, 0.69471, 0, 0.6875],
+  [0, 0.6875, 0, 0.41134, 0.22386, 0.1875, 0.5, 0.1875],
+  [0.5, 0.1875, 0.77614, 0.1875, 1, 0.41134, 1, 0.6875],
+  [1, 0.6875, 1, 0.69471, 1, 0.70192, 1, 0.70913]
+]);
+var cookie12SidedShape = createShape([
+  [0.42719, 0.03077, 0.42887, 0.02912, 0.42972, 0.02827, 0.43044, 0.02759],
+  [0.43044, 0.02759, 0.46953, -92e-4, 0.53047, -92e-4, 0.56956, 0.02759],
+  [0.56956, 0.02759, 0.57028, 0.02827, 0.57113, 0.02912, 0.57281, 0.03077],
+  [0.57281, 0.03077, 0.57384, 0.03174, 0.57434, 0.03224, 0.57481, 0.03271],
+  [0.57481, 0.03271, 0.59982, 0.05657, 0.63526, 0.06606, 0.66885, 0.0579],
+  [0.66885, 0.0579, 0.6695, 0.05774, 0.67019, 0.05756, 0.67157, 0.05721],
+  [0.67157, 0.05721, 0.67385, 0.05662, 0.675, 0.05634, 0.67597, 0.05609],
+  [0.67597, 0.05609, 0.72819, 0.04377, 0.781, 0.07424, 0.79644, 0.12565],
+  [0.79644, 0.12565, 0.79672, 0.12662, 0.79704, 0.12774, 0.79769, 0.13003],
+  [0.79769, 0.13003, 0.79807, 0.1314, 0.79825, 0.13209, 0.79844, 0.13274],
+  [0.79844, 0.13274, 0.80817, 0.1659, 0.8341, 0.19183, 0.86726, 0.20156],
+  [0.86726, 0.20156, 0.86791, 0.20175, 0.8686, 0.20193, 0.86997, 0.20231],
+  [0.86997, 0.20231, 0.87226, 0.20296, 0.87338, 0.20328, 0.87435, 0.20356],
+  [0.87435, 0.20356, 0.92576, 0.219, 0.95623, 0.27181, 0.94391, 0.32403],
+  [0.94391, 0.32403, 0.94366, 0.325, 0.94338, 0.32615, 0.94279, 0.32843],
+  [0.94279, 0.32843, 0.94244, 0.32981, 0.94226, 0.3305, 0.9421, 0.33115],
+  [0.9421, 0.33115, 0.93394, 0.36474, 0.94343, 0.40018, 0.96729, 0.42519],
+  [0.96729, 0.42519, 0.96776, 0.42566, 0.96826, 0.42616, 0.96923, 0.42719],
+  [0.96923, 0.42719, 0.97088, 0.42887, 0.97173, 0.42972, 0.97241, 0.43044],
+  [0.97241, 0.43044, 1.0092, 0.46953, 1.0092, 0.53047, 0.97241, 0.56956],
+  [0.97241, 0.56956, 0.97173, 0.57028, 0.97088, 0.57113, 0.96923, 0.57281],
+  [0.96923, 0.57281, 0.96826, 0.57384, 0.96776, 0.57434, 0.96729, 0.57481],
+  [0.96729, 0.57481, 0.94343, 0.59982, 0.93394, 0.63526, 0.9421, 0.66885],
+  [0.9421, 0.66885, 0.94226, 0.6695, 0.94244, 0.67019, 0.94279, 0.67157],
+  [0.94279, 0.67157, 0.94338, 0.67385, 0.94366, 0.675, 0.94391, 0.67597],
+  [0.94391, 0.67597, 0.95623, 0.72819, 0.92576, 0.781, 0.87435, 0.79644],
+  [0.87435, 0.79644, 0.87338, 0.79672, 0.87226, 0.79704, 0.86997, 0.79769],
+  [0.86997, 0.79769, 0.8686, 0.79807, 0.86791, 0.79825, 0.86726, 0.79844],
+  [0.86726, 0.79844, 0.8341, 0.80817, 0.80817, 0.8341, 0.79844, 0.86726],
+  [0.79844, 0.86726, 0.79825, 0.86791, 0.79807, 0.8686, 0.79769, 0.86997],
+  [0.79769, 0.86997, 0.79704, 0.87226, 0.79672, 0.87338, 0.79644, 0.87435],
+  [0.79644, 0.87435, 0.781, 0.92576, 0.72819, 0.95623, 0.67597, 0.94391],
+  [0.67597, 0.94391, 0.675, 0.94366, 0.67385, 0.94338, 0.67157, 0.94279],
+  [0.67157, 0.94279, 0.67019, 0.94244, 0.6695, 0.94226, 0.66885, 0.9421],
+  [0.66885, 0.9421, 0.63526, 0.93394, 0.59982, 0.94343, 0.57481, 0.96729],
+  [0.57481, 0.96729, 0.57434, 0.96776, 0.57384, 0.96826, 0.57281, 0.96923],
+  [0.57281, 0.96923, 0.57113, 0.97088, 0.57028, 0.97173, 0.56956, 0.97241],
+  [0.56956, 0.97241, 0.53047, 1.0092, 0.46953, 1.0092, 0.43044, 0.97241],
+  [0.43044, 0.97241, 0.42972, 0.97173, 0.42887, 0.97088, 0.42719, 0.96923],
+  [0.42719, 0.96923, 0.42616, 0.96826, 0.42566, 0.96776, 0.42519, 0.96729],
+  [0.42519, 0.96729, 0.40018, 0.94343, 0.36474, 0.93394, 0.33115, 0.9421],
+  [0.33115, 0.9421, 0.3305, 0.94226, 0.32981, 0.94244, 0.32843, 0.94279],
+  [0.32843, 0.94279, 0.32615, 0.94338, 0.325, 0.94366, 0.32403, 0.94391],
+  [0.32403, 0.94391, 0.27181, 0.95623, 0.219, 0.92576, 0.20356, 0.87435],
+  [0.20356, 0.87435, 0.20328, 0.87338, 0.20296, 0.87226, 0.20231, 0.86997],
+  [0.20231, 0.86997, 0.20193, 0.8686, 0.20175, 0.86791, 0.20156, 0.86726],
+  [0.20156, 0.86726, 0.19183, 0.8341, 0.1659, 0.80817, 0.13274, 0.79844],
+  [0.13274, 0.79844, 0.13209, 0.79825, 0.1314, 0.79807, 0.13003, 0.79769],
+  [0.13003, 0.79769, 0.12774, 0.79704, 0.12662, 0.79672, 0.12565, 0.79644],
+  [0.12565, 0.79644, 0.07424, 0.781, 0.04377, 0.72819, 0.05609, 0.67597],
+  [0.05609, 0.67597, 0.05634, 0.675, 0.05662, 0.67385, 0.05721, 0.67157],
+  [0.05721, 0.67157, 0.05756, 0.67019, 0.05774, 0.6695, 0.0579, 0.66885],
+  [0.0579, 0.66885, 0.06606, 0.63526, 0.05657, 0.59982, 0.03271, 0.57481],
+  [0.03271, 0.57481, 0.03224, 0.57434, 0.03174, 0.57384, 0.03077, 0.57281],
+  [0.03077, 0.57281, 0.02912, 0.57113, 0.02827, 0.57028, 0.02759, 0.56956],
+  [0.02759, 0.56956, -92e-4, 0.53047, -92e-4, 0.46953, 0.02759, 0.43044],
+  [0.02759, 0.43044, 0.02827, 0.42972, 0.02912, 0.42887, 0.03077, 0.42719],
+  [0.03077, 0.42719, 0.03174, 0.42616, 0.03224, 0.42566, 0.03271, 0.42519],
+  [0.03271, 0.42519, 0.05657, 0.40018, 0.06606, 0.36474, 0.0579, 0.33115],
+  [0.0579, 0.33115, 0.05774, 0.3305, 0.05756, 0.32981, 0.05721, 0.32843],
+  [0.05721, 0.32843, 0.05662, 0.32615, 0.05634, 0.325, 0.05609, 0.32403],
+  [0.05609, 0.32403, 0.04377, 0.27181, 0.07424, 0.219, 0.12565, 0.20356],
+  [0.12565, 0.20356, 0.12662, 0.20328, 0.12774, 0.20296, 0.13003, 0.20231],
+  [0.13003, 0.20231, 0.1314, 0.20193, 0.13209, 0.20175, 0.13274, 0.20156],
+  [0.13274, 0.20156, 0.1659, 0.19183, 0.19183, 0.1659, 0.20156, 0.13274],
+  [0.20156, 0.13274, 0.20175, 0.13209, 0.20193, 0.1314, 0.20231, 0.13003],
+  [0.20231, 0.13003, 0.20296, 0.12774, 0.20328, 0.12662, 0.20356, 0.12565],
+  [0.20356, 0.12565, 0.219, 0.07424, 0.27181, 0.04377, 0.32403, 0.05609],
+  [0.32403, 0.05609, 0.325, 0.05634, 0.32615, 0.05662, 0.32843, 0.05721],
+  [0.32843, 0.05721, 0.32981, 0.05756, 0.3305, 0.05774, 0.33115, 0.0579],
+  [0.33115, 0.0579, 0.36474, 0.06606, 0.40018, 0.05657, 0.42519, 0.03271],
+  [0.42519, 0.03271, 0.42566, 0.03224, 0.42616, 0.03174, 0.42719, 0.03077]
+]);
+var cookie4SidedShape = createShape([
+  [0.63833, 0.02217, 0.85312, -0.07111, 1.07112, 0.14689, 0.97783, 0.36168],
+  [0.97783, 0.36168, 0.97269, 0.37351, 0.96755, 0.38534, 0.9624, 0.39718],
+  [0.9624, 0.39718, 0.93394, 0.46277, 0.93394, 0.53723, 0.9624, 0.60282],
+  [0.9624, 0.60282, 0.96755, 0.61466, 0.97269, 0.62649, 0.97783, 0.63832],
+  [0.97783, 0.63832, 1.07112, 0.85311, 0.85312, 1.07111, 0.63833, 0.97783],
+  [0.63833, 0.97783, 0.6265, 0.97268, 0.61466, 0.96754, 0.60283, 0.9624],
+  [0.60283, 0.9624, 0.53724, 0.93393, 0.46278, 0.93393, 0.39718, 0.9624],
+  [0.39718, 0.9624, 0.38535, 0.96754, 0.37352, 0.97268, 0.36168, 0.97783],
+  [0.36168, 0.97783, 0.14689, 1.07111, -0.07112, 0.85311, 0.02217, 0.63832],
+  [0.02217, 0.63832, 0.02731, 0.62649, 0.03245, 0.61466, 0.03759, 0.60282],
+  [0.03759, 0.60282, 0.06608, 0.53723, 0.06608, 0.46277, 0.03759, 0.39718],
+  [0.03759, 0.39718, 0.03245, 0.38534, 0.02731, 0.37351, 0.02217, 0.36168],
+  [0.02217, 0.36168, -0.07112, 0.14689, 0.14689, -0.07111, 0.36168, 0.02217],
+  [0.36168, 0.02217, 0.37352, 0.02732, 0.38535, 0.03246, 0.39718, 0.0376],
+  [0.39718, 0.0376, 0.46278, 0.06607, 0.53724, 0.06607, 0.60283, 0.0376],
+  [0.60283, 0.0376, 0.61466, 0.03246, 0.6265, 0.02732, 0.63833, 0.02217]
+]);
+var cookie6SidedShape = createShape([
+  [0.32337, 0.07142, 0.42176, -0.02381, 0.57824, -0.02381, 0.67663, 0.07142],
+  [0.67663, 0.07142, 0.70677, 0.10055, 0.74365, 0.12178, 0.78399, 0.13319],
+  [0.78399, 0.13319, 0.91589, 0.17053, 0.99413, 0.30566, 0.96061, 0.4382],
+  [0.96061, 0.4382, 0.95036, 0.47876, 0.95036, 0.52124, 0.96061, 0.5618],
+  [0.96061, 0.5618, 0.99413, 0.69434, 0.91589, 0.82947, 0.78399, 0.86681],
+  [0.78399, 0.86681, 0.74365, 0.87822, 0.70677, 0.89945, 0.67663, 0.92858],
+  [0.67663, 0.92858, 0.57824, 1.02381, 0.42176, 1.02381, 0.32337, 0.92858],
+  [0.32337, 0.92858, 0.29323, 0.89945, 0.25635, 0.87822, 0.21601, 0.86681],
+  [0.21601, 0.86681, 0.08411, 0.82947, 587e-5, 0.69434, 0.03939, 0.5618],
+  [0.03939, 0.5618, 0.04964, 0.52124, 0.04964, 0.47876, 0.03939, 0.4382],
+  [0.03939, 0.4382, 587e-5, 0.30566, 0.08411, 0.17053, 0.21601, 0.13319],
+  [0.21601, 0.13319, 0.25635, 0.12178, 0.29323, 0.10055, 0.32337, 0.07142]
+]);
+var cookie7SidedShape = createShape([
+  [0.35209, 0.06806, 0.36326, 0.05824, 0.36884, 0.05334, 0.37397, 0.04937],
+  [0.37397, 0.04937, 0.4482, -813e-5, 0.5518, -813e-5, 0.62603, 0.04937],
+  [0.62603, 0.04937, 0.63116, 0.05334, 0.63674, 0.05824, 0.64791, 0.06806],
+  [0.64791, 0.06806, 0.65164, 0.07137, 0.65351, 0.07299, 0.65539, 0.07459],
+  [0.65539, 0.07459, 0.68167, 0.09662, 0.71303, 0.11176, 0.74663, 0.11862],
+  [0.74663, 0.11862, 0.74903, 0.11912, 0.75147, 0.11956, 0.75637, 0.12043],
+  [0.75637, 0.12043, 0.771, 0.12306, 0.77831, 0.12434, 0.78461, 0.1259],
+  [0.78461, 0.1259, 0.87573, 0.14821, 0.94032, 0.2294, 0.94176, 0.3234],
+  [0.94176, 0.3234, 0.94186, 0.3299, 0.94151, 0.33734, 0.9408, 0.35221],
+  [0.9408, 0.35221, 0.94057, 0.35721, 0.94045, 0.35968, 0.94039, 0.36215],
+  [0.94039, 0.36215, 0.93958, 0.39649, 0.94732, 0.43049, 0.96293, 0.46109],
+  [0.96293, 0.46109, 0.96404, 0.46328, 0.96523, 0.46546, 0.96759, 0.46987],
+  [0.96759, 0.46987, 0.97467, 0.48296, 0.97821, 0.4895, 0.98093, 0.4954],
+  [0.98093, 0.4954, 1.02032, 0.58071, 0.99727, 0.68196, 0.92484, 0.74168],
+  [0.92484, 0.74168, 0.91984, 0.74584, 0.91381, 0.75018, 0.90177, 0.7589],
+  [0.90177, 0.7589, 0.89774, 0.76184, 0.89572, 0.76328, 0.89377, 0.76478],
+  [0.89377, 0.76478, 0.86646, 0.78557, 0.84476, 0.81284, 0.83064, 0.84412],
+  [0.83064, 0.84412, 0.82963, 0.84637, 0.82865, 0.84865, 0.82671, 0.85325],
+  [0.82671, 0.85325, 0.82091, 0.86696, 0.818, 0.87381, 0.8151, 0.87962],
+  [0.8151, 0.87962, 0.7731, 0.96368, 0.67977, 1.00875, 0.58801, 0.98925],
+  [0.58801, 0.98925, 0.58166, 0.98787, 0.57451, 0.98587, 0.56019, 0.98187],
+  [0.56019, 0.98187, 0.5554, 0.98056, 0.55301, 0.97987, 0.55063, 0.97928],
+  [0.55063, 0.97928, 0.51741, 0.97084, 0.48259, 0.97084, 0.44937, 0.97928],
+  [0.44937, 0.97928, 0.44699, 0.97987, 0.4446, 0.98056, 0.43981, 0.98187],
+  [0.43981, 0.98187, 0.42549, 0.98587, 0.41834, 0.98787, 0.41199, 0.98925],
+  [0.41199, 0.98925, 0.32023, 1.00875, 0.2269, 0.96368, 0.1849, 0.87962],
+  [0.1849, 0.87962, 0.18199, 0.87381, 0.17909, 0.86696, 0.17329, 0.85325],
+  [0.17329, 0.85325, 0.17135, 0.84865, 0.17037, 0.84637, 0.16936, 0.84412],
+  [0.16936, 0.84412, 0.15523, 0.81284, 0.13353, 0.78557, 0.10623, 0.76478],
+  [0.10623, 0.76478, 0.10428, 0.76328, 0.10226, 0.76184, 0.09823, 0.7589],
+  [0.09823, 0.7589, 0.08619, 0.75018, 0.08017, 0.74584, 0.07516, 0.74168],
+  [0.07516, 0.74168, 273e-5, 0.68196, -0.02032, 0.58071, 0.01907, 0.4954],
+  [0.01907, 0.4954, 0.02179, 0.4895, 0.02533, 0.48296, 0.03241, 0.46987],
+  [0.03241, 0.46987, 0.03477, 0.46546, 0.03596, 0.46328, 0.03707, 0.46109],
+  [0.03707, 0.46109, 0.05268, 0.43049, 0.06042, 0.39649, 0.05961, 0.36215],
+  [0.05961, 0.36215, 0.05955, 0.35968, 0.05943, 0.35721, 0.0592, 0.35221],
+  [0.0592, 0.35221, 0.05849, 0.33734, 0.05813, 0.3299, 0.05824, 0.3234],
+  [0.05824, 0.3234, 0.05968, 0.2294, 0.12427, 0.14821, 0.21539, 0.1259],
+  [0.21539, 0.1259, 0.22169, 0.12434, 0.229, 0.12306, 0.24363, 0.12043],
+  [0.24363, 0.12043, 0.24853, 0.11956, 0.25097, 0.11912, 0.25337, 0.11862],
+  [0.25337, 0.11862, 0.28697, 0.11176, 0.31833, 0.09662, 0.34461, 0.07459],
+  [0.34461, 0.07459, 0.34649, 0.07299, 0.34836, 0.07137, 0.35209, 0.06806]
+]);
+var cookie9SidedShape = createShape([
+  [0.39144, 0.04182, 0.39684, 0.03735, 0.39953, 0.03513, 0.402, 0.03326],
+  [0.402, 0.03326, 0.45981, -0.01109, 0.54019, -0.01109, 0.598, 0.03326],
+  [0.598, 0.03326, 0.60047, 0.03513, 0.60316, 0.03735, 0.60856, 0.04182],
+  [0.60856, 0.04182, 0.61097, 0.04379, 0.61216, 0.04479, 0.61334, 0.04576],
+  [0.61334, 0.04576, 0.64056, 0.06743, 0.67404, 0.07974, 0.70881, 0.08085],
+  [0.70881, 0.08085, 0.71031, 0.08088, 0.71187, 0.08091, 0.71497, 0.08094],
+  [0.71497, 0.08094, 0.72194, 0.08104, 0.72544, 0.08107, 0.7285, 0.08123],
+  [0.7285, 0.08123, 0.80112, 0.08494, 0.86243, 0.13694, 0.87865, 0.20854],
+  [0.87865, 0.20854, 0.87934, 0.21157, 0.88, 0.21504, 0.88131, 0.22194],
+  [0.88131, 0.22194, 0.88187, 0.22504, 0.88215, 0.22657, 0.88247, 0.22807],
+  [0.88247, 0.22807, 0.88956, 0.26244, 0.90737, 0.29357, 0.93325, 0.31694],
+  [0.93325, 0.31694, 0.9344, 0.31797, 0.93556, 0.319, 0.93793, 0.32104],
+  [0.93793, 0.32104, 0.94321, 0.32563, 0.94584, 0.32794, 0.94809, 0.33007],
+  [0.94809, 0.33007, 1.00137, 0.38004, 1.01528, 0.45972, 0.98215, 0.5251],
+  [0.98215, 0.5251, 0.98075, 0.52788, 0.97903, 0.53094, 0.97562, 0.53707],
+  [0.97562, 0.53707, 0.97409, 0.53982, 0.97334, 0.54119, 0.97262, 0.54253],
+  [0.97262, 0.54253, 0.9562, 0.57351, 0.95003, 0.60889, 0.955, 0.6436],
+  [0.955, 0.6436, 0.95521, 0.64513, 0.95546, 0.64666, 0.95596, 0.64975],
+  [0.95596, 0.64975, 0.95709, 0.65672, 0.95765, 0.66019, 0.95803, 0.66328],
+  [0.95803, 0.66328, 0.96703, 0.73616, 0.927, 0.80622, 0.86003, 0.83478],
+  [0.86003, 0.83478, 0.85718, 0.836, 0.8539, 0.83725, 0.8474, 0.83975],
+  [0.8474, 0.83975, 0.8445, 0.84084, 0.84303, 0.84141, 0.84162, 0.84197],
+  [0.84162, 0.84197, 0.80937, 0.855, 0.78212, 0.87812, 0.76381, 0.90794],
+  [0.76381, 0.90794, 0.76303, 0.90925, 0.76225, 0.91059, 0.76065, 0.91328],
+  [0.76065, 0.91328, 0.75709, 0.91934, 0.75531, 0.92237, 0.75362, 0.925],
+  [0.75362, 0.925, 0.71415, 0.98665, 0.63894, 1.01434, 0.56944, 0.99272],
+  [0.56944, 0.99272, 0.5665, 0.99181, 0.56319, 0.99065, 0.55662, 0.98831],
+  [0.55662, 0.98831, 0.55369, 0.98728, 0.55222, 0.98675, 0.55078, 0.98628],
+  [0.55078, 0.98628, 0.51782, 0.97531, 0.48218, 0.97531, 0.44922, 0.98628],
+  [0.44922, 0.98628, 0.44778, 0.98675, 0.44631, 0.98728, 0.44338, 0.98831],
+  [0.44338, 0.98831, 0.43681, 0.99065, 0.4335, 0.99181, 0.43056, 0.99272],
+  [0.43056, 0.99272, 0.36106, 1.01434, 0.28585, 0.98665, 0.24638, 0.925],
+  [0.24638, 0.925, 0.24469, 0.92237, 0.24291, 0.91934, 0.23935, 0.91328],
+  [0.23935, 0.91328, 0.23775, 0.91059, 0.23697, 0.90925, 0.23619, 0.90794],
+  [0.23619, 0.90794, 0.21788, 0.87812, 0.19063, 0.855, 0.15838, 0.84197],
+  [0.15838, 0.84197, 0.15697, 0.84141, 0.1555, 0.84084, 0.1526, 0.83975],
+  [0.1526, 0.83975, 0.1461, 0.83725, 0.14282, 0.836, 0.13997, 0.83478],
+  [0.13997, 0.83478, 0.073, 0.80622, 0.03297, 0.73616, 0.04197, 0.66328],
+  [0.04197, 0.66328, 0.04235, 0.66019, 0.04291, 0.65672, 0.04404, 0.64975],
+  [0.04404, 0.64975, 0.04454, 0.64666, 0.04479, 0.64513, 0.045, 0.6436],
+  [0.045, 0.6436, 0.04997, 0.60889, 0.0438, 0.57351, 0.02738, 0.54253],
+  [0.02738, 0.54253, 0.02666, 0.54119, 0.02591, 0.53982, 0.02438, 0.53707],
+  [0.02438, 0.53707, 0.02097, 0.53094, 0.01925, 0.52788, 0.01785, 0.5251],
+  [0.01785, 0.5251, -0.01528, 0.45972, -137e-5, 0.38004, 0.05191, 0.33007],
+  [0.05191, 0.33007, 0.05416, 0.32794, 0.05679, 0.32563, 0.06207, 0.32104],
+  [0.06207, 0.32104, 0.06444, 0.319, 0.0656, 0.31797, 0.06675, 0.31694],
+  [0.06675, 0.31694, 0.0927, 0.29347, 0.11049, 0.26234, 0.11753, 0.22807],
+  [0.11753, 0.22807, 0.11785, 0.22657, 0.11813, 0.22504, 0.11869, 0.22194],
+  [0.11869, 0.22194, 0.12, 0.21504, 0.12066, 0.21157, 0.12135, 0.20854],
+  [0.12135, 0.20854, 0.13757, 0.13694, 0.19888, 0.08494, 0.2715, 0.08123],
+  [0.2715, 0.08123, 0.27456, 0.08107, 0.27806, 0.08104, 0.28503, 0.08094],
+  [0.28503, 0.08094, 0.28813, 0.08091, 0.28969, 0.08088, 0.29119, 0.08085],
+  [0.29119, 0.08085, 0.32596, 0.07974, 0.35944, 0.06743, 0.38666, 0.04576],
+  [0.38666, 0.04576, 0.38784, 0.04479, 0.38903, 0.04379, 0.39144, 0.04182]
+]);
+var slantedShape = createShape([
+  [0.04911, 0.28294, 0.05715, 0.20613, 0.06118, 0.16772, 0.07595, 0.13743],
+  [0.07595, 0.13743, 0.09732, 0.09358, 0.13462, 0.05972, 0.18009, 0.04288],
+  [0.18009, 0.04288, 0.21151, 0.03125, 0.24979, 0.03125, 0.32635, 0.03125],
+  [0.32635, 0.03125, 0.45521, 0.03125, 0.58407, 0.03125, 0.71293, 0.03125],
+  [0.71293, 0.03125, 0.80551, 0.03125, 0.85181, 0.03125, 0.88715, 0.04642],
+  [0.88715, 0.04642, 0.93832, 0.06838, 0.97725, 0.11203, 0.99352, 0.16569],
+  [0.99352, 0.16569, 1.00476, 0.20272, 0.9999, 0.24916, 0.99017, 0.34206],
+  [0.99017, 0.34206, 0.97708, 0.46706, 0.96398, 0.59206, 0.95089, 0.71706],
+  [0.95089, 0.71706, 0.94285, 0.79387, 0.93883, 0.83228, 0.92405, 0.86256],
+  [0.92405, 0.86256, 0.90268, 0.90641, 0.86538, 0.94028, 0.81991, 0.95712],
+  [0.81991, 0.95712, 0.78849, 0.96875, 0.75021, 0.96875, 0.67365, 0.96875],
+  [0.67365, 0.96875, 0.54479, 0.96875, 0.41593, 0.96875, 0.28707, 0.96875],
+  [0.28707, 0.96875, 0.19449, 0.96875, 0.14819, 0.96875, 0.11285, 0.95359],
+  [0.11285, 0.95359, 0.06169, 0.93162, 0.02275, 0.88797, 648e-5, 0.83431],
+  [648e-5, 0.83431, -476e-5, 0.79728, 1e-4, 0.75084, 983e-5, 0.65794],
+  [983e-5, 0.65794, 0.02292, 0.53294, 0.03602, 0.40794, 0.04911, 0.28294]
+]);
+var softBoomShape = createShape([
+  [0.54668, 0.26546, 0.61712, -0.08849, 0.38296, -0.08849, 0.45337, 0.26546],
+  [0.45337, 0.26546, 0.38296, -0.08849, 0.16664, 11e-4, 0.36715, 0.30118],
+  [0.36715, 0.30118, 0.16664, 11e-4, 11e-4, 0.16665, 0.30118, 0.36715],
+  [0.30118, 0.36715, 11e-4, 0.16665, -0.08849, 0.38296, 0.26546, 0.45334],
+  [0.26546, 0.45334, -0.08849, 0.38293, -0.08849, 0.61706, 0.26546, 0.54665],
+  [0.26546, 0.54665, -0.08849, 0.61706, 114e-5, 0.83334, 0.30118, 0.63284],
+  [0.30118, 0.63284, 114e-5, 0.83334, 0.16668, 0.9989, 0.36715, 0.69881],
+  [0.36715, 0.69881, 0.16664, 0.99884, 0.38296, 1.08843, 0.45334, 0.73452],
+  [0.45334, 0.73452, 0.38293, 1.08849, 0.61706, 1.08849, 0.54665, 0.73452],
+  [0.54665, 0.73452, 0.61706, 1.08849, 0.83334, 0.99884, 0.63284, 0.69881],
+  [0.63284, 0.69881, 0.83334, 0.99884, 0.9989, 0.83331, 0.69881, 0.63284],
+  [0.69881, 0.63284, 0.99884, 0.83334, 1.08843, 0.61702, 0.73452, 0.54665],
+  [0.73452, 0.54665, 1.08849, 0.61706, 1.08849, 0.38293, 0.73452, 0.45334],
+  [0.73452, 0.45334, 1.08849, 0.38293, 0.99884, 0.16665, 0.69881, 0.36715],
+  [0.69881, 0.36715, 0.99884, 0.16665, 0.83331, 11e-4, 0.63284, 0.30118],
+  [0.63284, 0.30118, 0.83334, 114e-5, 0.61702, -0.08845, 0.54665, 0.26546],
+  [0.54665, 0.26546, 0.54666, 0.26546, 0.54667, 0.26546, 0.54668, 0.26546]
+]);
+var softBurstShape = createShape([
+  [0.45359, 0.0247, 0.47494, -823e-5, 0.52506, -823e-5, 0.54641, 0.0247],
+  [0.54641, 0.0247, 0.56348, 0.05101, 0.58055, 0.07733, 0.59763, 0.10364],
+  [0.59763, 0.10364, 0.61166, 0.12529, 0.64, 0.1341, 0.66466, 0.12447],
+  [0.66466, 0.12447, 0.69464, 0.11278, 0.72462, 0.10108, 0.7546, 0.08939],
+  [0.7546, 0.08939, 0.79213, 0.07475, 0.83266, 0.10291, 0.82972, 0.14156],
+  [0.82972, 0.14156, 0.82736, 0.17245, 0.82499, 0.20334, 0.82263, 0.23422],
+  [0.82263, 0.23422, 0.82066, 0.25963, 0.83816, 0.28266, 0.86403, 0.28875],
+  [0.86403, 0.28875, 0.89548, 0.29614, 0.92693, 0.30352, 0.95838, 0.31091],
+  [0.95838, 0.31091, 0.99772, 0.32016, 1.01322, 0.36572, 0.98707, 0.39535],
+  [0.98707, 0.39535, 0.96617, 0.41899, 0.94527, 0.44264, 0.92438, 0.46629],
+  [0.92438, 0.46629, 0.90719, 0.48575, 0.90719, 0.51425, 0.92438, 0.53372],
+  [0.92438, 0.53372, 0.94527, 0.55737, 0.96617, 0.58102, 0.98707, 0.60466],
+  [0.98707, 0.60466, 1.01322, 0.63429, 0.99772, 0.67985, 0.95838, 0.6891],
+  [0.95838, 0.6891, 0.92693, 0.69648, 0.89548, 0.70387, 0.86403, 0.71126],
+  [0.86403, 0.71126, 0.83816, 0.71735, 0.82066, 0.74038, 0.82263, 0.76579],
+  [0.82263, 0.76579, 0.82499, 0.79667, 0.82736, 0.82756, 0.82972, 0.85844],
+  [0.82972, 0.85844, 0.83266, 0.8971, 0.79213, 0.92526, 0.7546, 0.91063],
+  [0.7546, 0.91063, 0.72462, 0.89893, 0.69464, 0.88724, 0.66466, 0.87554],
+  [0.66466, 0.87554, 0.64, 0.86591, 0.61166, 0.87473, 0.59763, 0.89638],
+  [0.59763, 0.89638, 0.58055, 0.92269, 0.56348, 0.94901, 0.54641, 0.97532],
+  [0.54641, 0.97532, 0.52506, 1.00823, 0.47494, 1.00823, 0.45359, 0.97532],
+  [0.45359, 0.97532, 0.43652, 0.94901, 0.41945, 0.92269, 0.40237, 0.89638],
+  [0.40237, 0.89638, 0.38834, 0.87473, 0.36, 0.86591, 0.33534, 0.87554],
+  [0.33534, 0.87554, 0.30536, 0.88724, 0.27538, 0.89893, 0.2454, 0.91063],
+  [0.2454, 0.91063, 0.20787, 0.92526, 0.16734, 0.8971, 0.17028, 0.85844],
+  [0.17028, 0.85844, 0.17264, 0.82756, 0.17501, 0.79667, 0.17737, 0.76579],
+  [0.17737, 0.76579, 0.17934, 0.74038, 0.16184, 0.71735, 0.13597, 0.71126],
+  [0.13597, 0.71126, 0.10452, 0.70387, 0.07307, 0.69648, 0.04162, 0.6891],
+  [0.04162, 0.6891, 228e-5, 0.67985, -0.01322, 0.63429, 0.01293, 0.60466],
+  [0.01293, 0.60466, 0.03383, 0.58102, 0.05473, 0.55737, 0.07562, 0.53372],
+  [0.07562, 0.53372, 0.09281, 0.51425, 0.09281, 0.48575, 0.07562, 0.46629],
+  [0.07562, 0.46629, 0.05473, 0.44264, 0.03383, 0.41899, 0.01293, 0.39535],
+  [0.01293, 0.39535, -0.01322, 0.36572, 228e-5, 0.32016, 0.04162, 0.31091],
+  [0.04162, 0.31091, 0.07307, 0.30352, 0.10452, 0.29614, 0.13597, 0.28875],
+  [0.13597, 0.28875, 0.16184, 0.28266, 0.17934, 0.25963, 0.17737, 0.23422],
+  [0.17737, 0.23422, 0.17501, 0.20334, 0.17264, 0.17245, 0.17028, 0.14156],
+  [0.17028, 0.14156, 0.16734, 0.10291, 0.20787, 0.07475, 0.2454, 0.08939],
+  [0.2454, 0.08939, 0.27538, 0.10108, 0.30536, 0.11278, 0.33534, 0.12447],
+  [0.33534, 0.12447, 0.36, 0.1341, 0.38834, 0.12529, 0.40237, 0.10364],
+  [0.40237, 0.10364, 0.41945, 0.07733, 0.43652, 0.05101, 0.45359, 0.0247]
+]);
+var squareShape = createShape([
+  [1, 0.5375, 1, 0.67725, 1, 0.74712, 0.97806, 0.80253],
+  [0.97806, 0.80253, 0.94628, 0.88278, 0.88278, 0.94628, 0.80253, 0.97806],
+  [0.80253, 0.97806, 0.74713, 1, 0.67725, 1, 0.5375, 1],
+  [0.5375, 1, 0.5125, 1, 0.4875, 1, 0.4625, 1],
+  [0.4625, 1, 0.32275, 1, 0.25288, 1, 0.19747, 0.97806],
+  [0.19747, 0.97806, 0.11722, 0.94628, 0.05372, 0.88278, 0.02194, 0.80253],
+  [0.02194, 0.80253, 0, 0.74713, 0, 0.67725, 0, 0.5375],
+  [0, 0.5375, 0, 0.5125, 0, 0.4875, 0, 0.4625],
+  [0, 0.4625, 0, 0.32275, 0, 0.25288, 0.02194, 0.19747],
+  [0.02194, 0.19747, 0.0537, 0.11723, 0.11723, 0.05371, 0.19747, 0.02194],
+  [0.19747, 0.02194, 0.25288, 0, 0.32275, 0, 0.4625, 0],
+  [0.4625, 0, 0.4875, 0, 0.5125, 0, 0.5375, 0],
+  [0.5375, 0, 0.67725, 0, 0.74712, 0, 0.80253, 0.02194],
+  [0.80253, 0.02194, 0.88277, 0.05371, 0.9463, 0.11723, 0.97806, 0.19747],
+  [0.97806, 0.19747, 1, 0.25288, 1, 0.32275, 1, 0.4625],
+  [1, 0.4625, 1, 0.4875, 1, 0.5125, 1, 0.5375]
+]);
+var sunnyShape = createShape([
+  [0.77016, 0.1213, 0.80126, 0.12342, 0.81681, 0.12448, 0.82938, 0.12995],
+  [0.82938, 0.12995, 0.84756, 0.13791, 0.86208, 0.15244, 0.87004, 0.17062],
+  [0.87004, 0.17062, 0.87554, 0.18318, 0.8766, 0.19874, 0.87871, 0.22983],
+  [0.87871, 0.22983, 0.88031, 0.25348, 0.88192, 0.27714, 0.88353, 0.3008],
+  [0.88353, 0.3008, 0.88439, 0.31338, 0.88481, 0.31968, 0.88618, 0.32568],
+  [0.88618, 0.32568, 0.88816, 0.33436, 0.89159, 0.34264, 0.89633, 0.35018],
+  [0.89633, 0.35018, 0.89961, 0.35541, 0.90376, 0.36015, 0.91204, 0.36965],
+  [0.91204, 0.36965, 0.92764, 0.38751, 0.94323, 0.40537, 0.95882, 0.42324],
+  [0.95882, 0.42324, 0.97932, 0.44674, 0.98957, 0.45847, 0.99457, 0.47124],
+  [0.99457, 0.47124, 1.0018, 0.48973, 1.0018, 0.51027, 0.99457, 0.52876],
+  [0.99457, 0.52876, 0.98957, 0.54153, 0.97932, 0.55326, 0.95882, 0.57676],
+  [0.95882, 0.57676, 0.94323, 0.59463, 0.92764, 0.61249, 0.91204, 0.63035],
+  [0.91204, 0.63035, 0.90376, 0.63985, 0.89961, 0.64459, 0.89633, 0.64982],
+  [0.89633, 0.64982, 0.89159, 0.65736, 0.88816, 0.66564, 0.88618, 0.67432],
+  [0.88618, 0.67432, 0.88481, 0.68032, 0.88439, 0.68662, 0.88353, 0.6992],
+  [0.88353, 0.6992, 0.88192, 0.72286, 0.88031, 0.74652, 0.87871, 0.77017],
+  [0.87871, 0.77017, 0.8766, 0.80126, 0.87554, 0.81682, 0.87004, 0.82938],
+  [0.87004, 0.82938, 0.86208, 0.84756, 0.84756, 0.86209, 0.82938, 0.87005],
+  [0.82938, 0.87005, 0.81681, 0.87552, 0.80126, 0.87658, 0.77016, 0.8787],
+  [0.77016, 0.8787, 0.7465, 0.88031, 0.72285, 0.88192, 0.69919, 0.88352],
+  [0.69919, 0.88352, 0.68661, 0.88438, 0.68032, 0.88482, 0.67431, 0.88617],
+  [0.67431, 0.88617, 0.66563, 0.88815, 0.65735, 0.89158, 0.64981, 0.89632],
+  [0.64981, 0.89632, 0.6446, 0.89961, 0.63985, 0.90376, 0.63035, 0.91205],
+  [0.63035, 0.91205, 0.61248, 0.92764, 0.59462, 0.94323, 0.57675, 0.95882],
+  [0.57675, 0.95882, 0.55327, 0.97932, 0.54153, 0.98955, 0.52875, 0.99455],
+  [0.52875, 0.99455, 0.51027, 1.00182, 0.48973, 1.00182, 0.47125, 0.99455],
+  [0.47125, 0.99455, 0.45847, 0.98955, 0.44673, 0.97932, 0.42325, 0.95882],
+  [0.42325, 0.95882, 0.40538, 0.94323, 0.38752, 0.92764, 0.36965, 0.91205],
+  [0.36965, 0.91205, 0.36015, 0.90376, 0.3554, 0.89961, 0.35019, 0.89632],
+  [0.35019, 0.89632, 0.34265, 0.89158, 0.33437, 0.88815, 0.32569, 0.88617],
+  [0.32569, 0.88617, 0.31968, 0.88482, 0.31339, 0.88438, 0.30081, 0.88352],
+  [0.30081, 0.88352, 0.27715, 0.88192, 0.2535, 0.88031, 0.22984, 0.8787],
+  [0.22984, 0.8787, 0.19874, 0.87658, 0.18319, 0.87552, 0.17062, 0.87005],
+  [0.17062, 0.87005, 0.15244, 0.86209, 0.13792, 0.84756, 0.12996, 0.82938],
+  [0.12996, 0.82938, 0.12446, 0.81682, 0.1234, 0.80126, 0.12129, 0.77017],
+  [0.12129, 0.77017, 0.11968, 0.74652, 0.11807, 0.72286, 0.11647, 0.6992],
+  [0.11647, 0.6992, 0.11561, 0.68662, 0.11519, 0.68032, 0.11382, 0.67432],
+  [0.11382, 0.67432, 0.11185, 0.66564, 0.10841, 0.65736, 0.10367, 0.64982],
+  [0.10367, 0.64982, 0.10039, 0.64459, 0.09624, 0.63985, 0.08796, 0.63035],
+  [0.08796, 0.63035, 0.07236, 0.61249, 0.05677, 0.59463, 0.04118, 0.57676],
+  [0.04118, 0.57676, 0.02068, 0.55326, 0.01043, 0.54153, 543e-5, 0.52876],
+  [543e-5, 0.52876, -18e-4, 0.51027, -18e-4, 0.48973, 543e-5, 0.47124],
+  [543e-5, 0.47124, 0.01043, 0.45847, 0.02068, 0.44674, 0.04118, 0.42324],
+  [0.04118, 0.42324, 0.05677, 0.40537, 0.07236, 0.38751, 0.08796, 0.36965],
+  [0.08796, 0.36965, 0.09624, 0.36015, 0.10039, 0.35541, 0.10367, 0.35018],
+  [0.10367, 0.35018, 0.10841, 0.34264, 0.11184, 0.33436, 0.11382, 0.32568],
+  [0.11382, 0.32568, 0.11519, 0.31968, 0.11561, 0.31338, 0.11647, 0.3008],
+  [0.11647, 0.3008, 0.11808, 0.27714, 0.11969, 0.25348, 0.12129, 0.22983],
+  [0.12129, 0.22983, 0.1234, 0.19874, 0.12446, 0.18318, 0.12996, 0.17062],
+  [0.12996, 0.17062, 0.13792, 0.15244, 0.15244, 0.13791, 0.17062, 0.12995],
+  [0.17062, 0.12995, 0.18319, 0.12448, 0.19874, 0.12342, 0.22984, 0.1213],
+  [0.22984, 0.1213, 0.2535, 0.11969, 0.27716, 0.11808, 0.30081, 0.11648],
+  [0.30081, 0.11648, 0.31339, 0.11562, 0.31968, 0.11518, 0.32569, 0.11383],
+  [0.32569, 0.11383, 0.33437, 0.11185, 0.34266, 0.10842, 0.35019, 0.10368],
+  [0.35019, 0.10368, 0.3554, 0.10039, 0.36015, 0.09624, 0.36965, 0.08795],
+  [0.36965, 0.08795, 0.38752, 0.07236, 0.40538, 0.05677, 0.42325, 0.04118],
+  [0.42325, 0.04118, 0.44673, 0.02068, 0.45847, 0.01045, 0.47125, 545e-5],
+  [0.47125, 545e-5, 0.48973, -182e-5, 0.51027, -182e-5, 0.52875, 545e-5],
+  [0.52875, 545e-5, 0.54153, 0.01045, 0.55327, 0.02068, 0.57675, 0.04118],
+  [0.57675, 0.04118, 0.59462, 0.05677, 0.61248, 0.07236, 0.63035, 0.08795],
+  [0.63035, 0.08795, 0.63985, 0.09624, 0.6446, 0.10039, 0.64981, 0.10368],
+  [0.64981, 0.10368, 0.65735, 0.10842, 0.66563, 0.11185, 0.67431, 0.11383],
+  [0.67431, 0.11383, 0.68032, 0.11518, 0.68661, 0.11562, 0.69919, 0.11648],
+  [0.69919, 0.11648, 0.72285, 0.11808, 0.7465, 0.11969, 0.77016, 0.1213]
+]);
+var triangleShape = createShape([
+  [0.33058, 0.2095, 0.37847, 0.12601, 0.40242, 0.08427, 0.43146, 0.06665],
+  [0.43146, 0.06665, 0.47358, 0.04108, 0.52643, 0.04108, 0.56854, 0.06665],
+  [0.56854, 0.06665, 0.59758, 0.08427, 0.62153, 0.12601, 0.66943, 0.2095],
+  [0.66943, 0.2095, 0.75568, 0.35983, 0.84194, 0.51017, 0.92819, 0.66051],
+  [0.92819, 0.66051, 0.97563, 0.7432, 0.99935, 0.78452, 0.99998, 0.81829],
+  [0.99998, 0.81829, 1.00088, 0.86728, 0.97451, 0.91273, 0.93153, 0.93626],
+  [0.93153, 0.93626, 0.90188, 0.95253, 0.85417, 0.95253, 0.75877, 0.95253],
+  [0.75877, 0.95253, 0.58626, 0.95253, 0.41375, 0.95253, 0.24124, 0.95253],
+  [0.24124, 0.95253, 0.14583, 0.95253, 0.09812, 0.95253, 0.06847, 0.93626],
+  [0.06847, 0.93626, 0.02548, 0.91274, -89e-5, 0.86729, 2e-5, 0.81829],
+  [2e-5, 0.81829, 65e-5, 0.78452, 0.02437, 0.7432, 0.07181, 0.66051],
+  [0.07181, 0.66051, 0.15807, 0.51017, 0.24432, 0.35983, 0.33058, 0.2095]
+]);
+var verySunnyShape = createShape([
+  [0.42725, 0.04123, 0.46018, -0.01374, 0.53981, -0.01374, 0.57275, 0.04123],
+  [0.57275, 0.04123, 0.58508, 0.06182, 0.59741, 0.08241, 0.60974, 0.10301],
+  [0.60974, 0.10301, 0.62896, 0.13504, 0.66687, 0.15076, 0.70309, 0.14166],
+  [0.70309, 0.14166, 0.72638, 0.13583, 0.74967, 0.13, 0.77296, 0.12416],
+  [0.77296, 0.12416, 0.83512, 0.1086, 0.8914, 0.16488, 0.87583, 0.22704],
+  [0.87583, 0.22704, 0.87, 0.25033, 0.86417, 0.27362, 0.85833, 0.29691],
+  [0.85833, 0.29691, 0.84924, 0.33313, 0.86496, 0.37103, 0.89699, 0.39025],
+  [0.89699, 0.39025, 0.91758, 0.40258, 0.93818, 0.41492, 0.95877, 0.42725],
+  [0.95877, 0.42725, 1.01374, 0.46019, 1.01374, 0.53981, 0.95877, 0.57275],
+  [0.95877, 0.57275, 0.93818, 0.58508, 0.91758, 0.59742, 0.89699, 0.60975],
+  [0.89699, 0.60975, 0.86496, 0.62897, 0.84924, 0.66687, 0.85833, 0.70309],
+  [0.85833, 0.70309, 0.86417, 0.72638, 0.87, 0.74967, 0.87583, 0.77296],
+  [0.87583, 0.77296, 0.8914, 0.83512, 0.83512, 0.8914, 0.77296, 0.87584],
+  [0.77296, 0.87584, 0.74967, 0.87, 0.72638, 0.86417, 0.70309, 0.85834],
+  [0.70309, 0.85834, 0.66687, 0.84924, 0.62896, 0.86496, 0.60974, 0.89699],
+  [0.60974, 0.89699, 0.59741, 0.91759, 0.58508, 0.93818, 0.57275, 0.95877],
+  [0.57275, 0.95877, 0.53981, 1.01374, 0.46018, 1.01374, 0.42725, 0.95877],
+  [0.42725, 0.95877, 0.41491, 0.93818, 0.40258, 0.91759, 0.39025, 0.89699],
+  [0.39025, 0.89699, 0.37103, 0.86496, 0.33312, 0.84924, 0.29691, 0.85834],
+  [0.29691, 0.85834, 0.27361, 0.86417, 0.25031, 0.87, 0.22702, 0.87584],
+  [0.22702, 0.87584, 0.16489, 0.8914, 0.10859, 0.83512, 0.12416, 0.77296],
+  [0.12416, 0.77296, 0.12999, 0.74967, 0.13583, 0.72638, 0.14167, 0.70309],
+  [0.14167, 0.70309, 0.15075, 0.66687, 0.13505, 0.62897, 0.103, 0.60975],
+  [0.103, 0.60975, 0.08241, 0.59742, 0.06181, 0.58508, 0.04121, 0.57275],
+  [0.04121, 0.57275, -0.01373, 0.53981, -0.01373, 0.46019, 0.04121, 0.42725],
+  [0.04121, 0.42725, 0.06181, 0.41492, 0.08241, 0.40258, 0.103, 0.39025],
+  [0.103, 0.39025, 0.13505, 0.37103, 0.15075, 0.33313, 0.14167, 0.29691],
+  [0.14167, 0.29691, 0.13583, 0.27362, 0.12999, 0.25033, 0.12416, 0.22704],
+  [0.12416, 0.22704, 0.10859, 0.16488, 0.16489, 0.1086, 0.22702, 0.12416],
+  [0.22702, 0.12416, 0.25031, 0.13, 0.27361, 0.13583, 0.29691, 0.14166],
+  [0.29691, 0.14166, 0.33312, 0.15076, 0.37103, 0.13504, 0.39025, 0.10301],
+  [0.39025, 0.10301, 0.40258, 0.08241, 0.41491, 0.06182, 0.42725, 0.04123]
+]);
+function reversePolygon(polygon) {
+  const reversedFeatures = polygon.features.map((f) => {
+    const reversedCubics = f.cubics.map((c) => c.reverse()).reverse();
+    if (f.type === "corner") {
+      return cornerFeature(reversedCubics, f.convex);
+    } else {
+      return edgeFeature(reversedCubics);
+    }
+  }).reverse();
+  return RoundedPolygon.fromFeatures(
+    reversedFeatures,
+    polygon.centerX,
+    polygon.centerY
+  );
+}
+function rotate180(polygon) {
+  return polygon.transformed((x, y) => [1 - x, 1 - y]);
+}
+function flipV(polygon) {
+  const flipped = polygon.transformed((x, y) => [x, 1 - y]);
+  return reversePolygon(flipped);
+}
+var MD3Shapes = {
+  arch: flipV(archShape),
+  arrow: flipV(arrowShape),
+  boom: boomShape,
+  bun: bunShape,
+  burst: burstShape,
+  circle: circleShape,
+  clamshell: clamshellShape,
+  diamond: diamondShape,
+  fan: rotate180(fanShape),
+  flower: flowerShape,
+  gem: flipV(gemShape),
+  ghostish: flipV(ghostishShape),
+  heart: flipV(heartShape),
+  clover4Leaf: clover4LeafShape,
+  clover8Leaf: clover8LeafShape,
+  oval: flipV(ovalShape),
+  pentagon: flipV(pentagonShape),
+  pill: flipV(pillShape),
+  pixelCircle: pixelCircleShape,
+  pixelTriangle: pixelTriangleShape,
+  puffyDiamond: puffyDiamondShape,
+  puffy: puffyShape,
+  semiCircle: flipV(semiCircleShape),
+  cookie12Sided: cookie12SidedShape,
+  cookie4Sided: cookie4SidedShape,
+  cookie6Sided: cookie6SidedShape,
+  cookie7Sided: cookie7SidedShape,
+  cookie9Sided: cookie9SidedShape,
+  slanted: flipV(slantedShape),
+  softBoom: softBoomShape,
+  softBurst: softBurstShape,
+  square: squareShape,
+  sunny: sunnyShape,
+  triangle: flipV(triangleShape),
+  verySunny: verySunnyShape
+};
+
+// src/shapes/render/shape-rendering.ts
+function toSvgPath(cubics, width = 1, height = 1) {
+  if (cubics.length === 0) return "";
+  const paddingX = width * 0.015;
+  const paddingY = height * 0.015;
+  const sx = width - 2 * paddingX;
+  const sy = height - 2 * paddingY;
+  const flipY = (y) => paddingY + sy * (1 - y);
+  const parts = [
+    `M ${fmt(paddingX + cubics[0].anchor0X * sx)} ${fmt(flipY(cubics[0].anchor0Y))}`
+  ];
+  for (const c of cubics) {
+    parts.push(
+      `C ${fmt(paddingX + c.control0X * sx)} ${fmt(flipY(c.control0Y))},${fmt(paddingX + c.control1X * sx)} ${fmt(flipY(c.control1Y))},${fmt(paddingX + c.anchor1X * sx)} ${fmt(flipY(c.anchor1Y))}`
+    );
+  }
+  parts.push("Z");
+  return parts.join(" ");
+}
+function toClipPath(polygon, width, height) {
+  const pathData = toSvgPath(polygon.cubics, width, height);
+  return `path('${pathData}')`;
+}
+function fmt(v) {
+  return Number(v.toFixed(4)).toString();
+}
+
+// src/ui/navigation/navigation-shape-utils.ts
+function getNavigationShapeStyle(shape, width = 56, height = 56) {
+  if (!shape || shape === "pill" || shape === "circle") {
+    return void 0;
+  }
+  const polygon = MD3Shapes[shape];
+  if (!polygon) {
+    return void 0;
+  }
+  return {
+    clipPath: toClipPath(polygon, width, height)
+  };
+}
+function isSquareShape(shape) {
+  return Boolean(shape && shape !== "pill");
+}
+var NavigationBarContext = React37.createContext({ variant: "flexible" });
 function cloneIconWithFill(icon, selected) {
-  if (!React36.isValidElement(icon)) return icon;
+  if (!React37.isValidElement(icon)) return icon;
   if (icon.type === Icon) {
-    return React36.cloneElement(
+    return React37.cloneElement(
       icon,
       { fill: selected ? 1 : 0, animateFill: true }
     );
   }
   return icon;
 }
-function ActivePill() {
-  const { activeIndicatorTransition } = React36.useContext(NavigationBarContext);
+function ActivePill({
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const { activeIndicatorTransition } = React37.useContext(NavigationBarContext);
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
   return /* @__PURE__ */ jsx(
     m.div,
     {
-      className: "absolute inset-0 bg-m3-secondary-container pointer-events-none",
-      style: {
-        borderRadius: 9999,
+      className: cn(
+        "bg-m3-secondary-container pointer-events-none",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : shape === "circle" ? "absolute inset-0 rounded-full" : "absolute inset-0 rounded-full"
+      ),
+      style: __spreadValues(__spreadValues({
         zIndex: 0
-      },
+      }, shapeStyle ? { width, height } : {}), shapeStyle),
       initial: { opacity: 0, scale: 0.5 },
       animate: { opacity: 1, scale: 1 },
       exit: { opacity: 0, scale: 0.5 },
@@ -2631,11 +4547,42 @@ function ActivePill() {
     }
   );
 }
-function HoverStateLayer() {
-  return /* @__PURE__ */ jsx("div", { className: "absolute inset-0 rounded-full bg-m3-on-surface opacity-0 group-hover:opacity-[0.08] group-focus-visible:opacity-[0.10] active:opacity-[0.10] transition-opacity duration-200 pointer-events-none z-0" });
+function HoverStateLayer({
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "bg-m3-on-surface opacity-0 group-hover:opacity-[0.08] group-focus-visible:opacity-[0.10] active:opacity-[0.10] transition-opacity duration-200 pointer-events-none z-0",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : shape === "circle" ? "absolute inset-0 rounded-full" : "absolute inset-0 rounded-[16px]"
+      ),
+      style: __spreadValues(__spreadValues({}, shapeStyle ? { width, height } : {}), shapeStyle)
+    }
+  );
 }
-function RippleLayer({ ripples, onRippleDone }) {
-  return /* @__PURE__ */ jsx("div", { className: "absolute inset-0 rounded-full overflow-hidden pointer-events-none z-0", children: /* @__PURE__ */ jsx(Ripple, { ripples, onRippleDone }) });
+function RippleLayer({
+  ripples,
+  onRippleDone,
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden pointer-events-none z-0",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : shape === "circle" ? "absolute inset-0 rounded-full" : "absolute inset-0 rounded-[16px]"
+      ),
+      style: __spreadValues(__spreadValues({}, shapeStyle ? { width, height } : {}), shapeStyle),
+      children: /* @__PURE__ */ jsx(Ripple, { ripples, onRippleDone })
+    }
+  );
 }
 function IconContainer({ selected, badge, children }) {
   return /* @__PURE__ */ jsxs(
@@ -2653,7 +4600,7 @@ function IconContainer({ selected, badge, children }) {
     }
   );
 }
-var NavigationBarItemComponent = React36.forwardRef(
+var NavigationBarItemComponent = React37.forwardRef(
   ({
     selected,
     icon,
@@ -2661,23 +4608,37 @@ var NavigationBarItemComponent = React36.forwardRef(
     onClick,
     disabled = false,
     badge,
+    shape: shapeProp,
+    shapeSize: shapeSizeProp,
+    hideLabel = false,
     className,
     "aria-label": ariaLabelProp,
     asChild = false,
     children
   }, ref) => {
-    var _a;
+    var _a, _b, _c;
     const {
       variant,
       itemLayout,
+      shape: contextShape,
+      labelVisibility: contextLabelVisibility,
+      shapeSize: contextShapeSize,
       itemClassName: contextItemClassName
-    } = React36.useContext(NavigationBarContext);
+    } = React37.useContext(NavigationBarContext);
+    const activeShape = (_a = shapeProp != null ? shapeProp : contextShape) != null ? _a : "pill";
+    const isSquare = isSquareShape(activeShape);
+    const resolvedShapeSize = (_b = shapeSizeProp != null ? shapeSizeProp : contextShapeSize) != null ? _b : 56;
     const isForcedHorizontal = itemLayout === "horizontal";
     const isResponsiveHorizontal = (variant === "flexible" || variant === "xr") && itemLayout === void 0;
+    const shouldShowLabel = !hideLabel && (() => {
+      if (contextLabelVisibility === "unlabeled") return false;
+      if (contextLabelVisibility === "auto") return selected;
+      return true;
+    })();
     const { ripples, onPointerDown, removeRipple } = useRippleState({
       disabled
     });
-    const handleClick = React36.useCallback(
+    const handleClick = React37.useCallback(
       (e) => {
         if (disabled) {
           e.preventDefault();
@@ -2701,8 +4662,10 @@ var NavigationBarItemComponent = React36.forwardRef(
       contextItemClassName,
       className
     );
+    const iconPillWidth = isSquare ? resolvedShapeSize : 56;
+    const iconPillHeight = isSquare ? resolvedShapeSize : 32;
     if (asChild && children) {
-      const child = React36.Children.only(children);
+      const child = React37.Children.only(children);
       const innerContent = /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs(
           "div",
@@ -2710,10 +4673,12 @@ var NavigationBarItemComponent = React36.forwardRef(
             className: cn(
               "relative flex items-center justify-center flex-col gap-y-1 w-full px-1 py-1.5",
               isResponsiveHorizontal && "min-[600px]:flex-row min-[600px]:gap-y-0 min-[600px]:gap-x-1.5 min-[600px]:h-10 min-[600px]:px-4 min-[600px]:py-0 min-[600px]:rounded-full min-[600px]:w-auto",
-              isForcedHorizontal && "flex-row gap-y-0 gap-x-1.5 h-10 px-4 py-0 rounded-full w-auto"
+              isForcedHorizontal && "flex-row gap-y-0 gap-x-1.5 h-10 px-4 py-0 rounded-full w-auto",
+              // When label is hidden and not horizontal, remove bottom gap
+              !shouldShowLabel && !isForcedHorizontal && "gap-y-0"
             ),
             children: [
-              /* @__PURE__ */ jsxs(
+              !isSquare && /* @__PURE__ */ jsxs(
                 "div",
                 {
                   className: cn(
@@ -2722,9 +4687,18 @@ var NavigationBarItemComponent = React36.forwardRef(
                     isForcedHorizontal && "block!"
                   ),
                   children: [
-                    /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, {}) }),
-                    /* @__PURE__ */ jsx(HoverStateLayer, {}),
-                    /* @__PURE__ */ jsx(RippleLayer, { ripples, onRippleDone: removeRipple })
+                    /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, { shape: activeShape, width: 56, height: 40 }) }),
+                    /* @__PURE__ */ jsx(HoverStateLayer, { shape: activeShape, width: 56, height: 40 }),
+                    /* @__PURE__ */ jsx(
+                      RippleLayer,
+                      {
+                        ripples,
+                        onRippleDone: removeRipple,
+                        shape: activeShape,
+                        width: 56,
+                        height: 40
+                      }
+                    )
                   ]
                 }
               ),
@@ -2733,23 +4707,47 @@ var NavigationBarItemComponent = React36.forwardRef(
                 {
                   className: cn(
                     "relative flex items-center justify-center shrink-0 z-10",
-                    "h-8 w-16 mx-auto rounded-full",
-                    isResponsiveHorizontal && "min-[600px]:size-6 min-[600px]:w-auto min-[600px]:h-auto",
-                    isForcedHorizontal && "size-6 w-auto h-auto"
+                    isSquare ? "mx-auto" : "h-8 w-14 mx-auto rounded-[16px]",
+                    !isSquare && isResponsiveHorizontal && "min-[600px]:size-6 min-[600px]:w-auto min-[600px]:h-auto",
+                    !isSquare && isForcedHorizontal && "size-6 w-auto h-auto"
                   ),
+                  style: isSquare ? { width: resolvedShapeSize, height: resolvedShapeSize } : void 0,
                   children: [
                     /* @__PURE__ */ jsxs(
                       "div",
                       {
                         className: cn(
                           "absolute inset-0 z-0",
-                          isResponsiveHorizontal && "min-[600px]:hidden",
-                          isForcedHorizontal && "hidden"
+                          !isSquare && isResponsiveHorizontal && "min-[600px]:hidden",
+                          !isSquare && isForcedHorizontal && "hidden"
                         ),
                         children: [
-                          /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, {}) }),
-                          /* @__PURE__ */ jsx(HoverStateLayer, {}),
-                          /* @__PURE__ */ jsx(RippleLayer, { ripples, onRippleDone: removeRipple })
+                          /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                            ActivePill,
+                            {
+                              shape: activeShape,
+                              width: iconPillWidth,
+                              height: iconPillHeight
+                            }
+                          ) }),
+                          /* @__PURE__ */ jsx(
+                            HoverStateLayer,
+                            {
+                              shape: activeShape,
+                              width: iconPillWidth,
+                              height: iconPillHeight
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            RippleLayer,
+                            {
+                              ripples,
+                              onRippleDone: removeRipple,
+                              shape: activeShape,
+                              width: iconPillWidth,
+                              height: iconPillHeight
+                            }
+                          )
                         ]
                       }
                     ),
@@ -2757,15 +4755,19 @@ var NavigationBarItemComponent = React36.forwardRef(
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", children: /* @__PURE__ */ jsx(
-                "span",
+              label && /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", initial: false, children: shouldShowLabel && /* @__PURE__ */ jsx(
+                m.span,
                 {
+                  initial: { opacity: 0, height: 0, scale: 0.85, y: -2 },
+                  animate: { opacity: 1, height: "auto", scale: 1, y: 0 },
+                  exit: { opacity: 0, height: 0, scale: 0.85, y: -2 },
+                  transition: SPRING_TRANSITION_EXPRESSIVE,
                   className: cn(
-                    "z-10 transition-all duration-200 truncate px-1",
-                    selected ? "text-m3-on-surface" : "text-m3-on-surface-variant",
-                    "font-medium text-[12px] leading-4 tracking-[0.5px]"
+                    "z-10 transition-colors duration-200 truncate px-1 inline-block overflow-hidden",
+                    selected ? "text-m3-on-surface font-medium" : "text-m3-on-surface-variant font-medium",
+                    "text-[12px] leading-4 tracking-[0.5px]"
                   ),
-                  children: (_a = child.props.children) != null ? _a : label
+                  children: (_c = child.props.children) != null ? _c : label
                 },
                 "nav-label"
               ) })
@@ -2781,11 +4783,14 @@ var NavigationBarItemComponent = React36.forwardRef(
           role: "menuitem",
           "aria-current": selected ? "page" : void 0,
           "aria-disabled": disabled ? true : void 0,
-          "aria-label": ariaLabelProp || (typeof label === "string" ? label : void 0),
+          "aria-label": (
+            // Always provide aria-label even when label is visually hidden
+            ariaLabelProp || (typeof label === "string" ? label : void 0)
+          ),
           onClick: handleClick,
           onPointerDown,
           className: itemClassName,
-          children: React36.cloneElement(child, { children: innerContent })
+          children: React37.cloneElement(child, { children: innerContent })
         }
       );
     }
@@ -2797,7 +4802,10 @@ var NavigationBarItemComponent = React36.forwardRef(
         role: "menuitem",
         "aria-current": selected ? "page" : void 0,
         "aria-disabled": disabled ? true : void 0,
-        "aria-label": ariaLabelProp || (typeof label === "string" ? label : void 0),
+        "aria-label": (
+          // Always provide aria-label even when label is visually hidden
+          ariaLabelProp || (typeof label === "string" ? label : void 0)
+        ),
         onClick: handleClick,
         onPointerDown,
         className: itemClassName,
@@ -2808,10 +4816,12 @@ var NavigationBarItemComponent = React36.forwardRef(
               className: cn(
                 "relative flex items-center justify-center flex-col gap-y-1 w-full px-1 py-1.5",
                 isResponsiveHorizontal && "min-[600px]:flex-row min-[600px]:gap-y-0 min-[600px]:gap-x-1.5 min-[600px]:h-10 min-[600px]:px-4 min-[600px]:py-0 min-[600px]:rounded-full min-[600px]:w-auto",
-                isForcedHorizontal && "flex-row gap-y-0 gap-x-1.5 h-10 px-4 py-0 rounded-full w-auto"
+                isForcedHorizontal && "flex-row gap-y-0 gap-x-1.5 h-10 px-4 py-0 rounded-full w-auto",
+                // When label is hidden and not horizontal, remove bottom gap
+                !shouldShowLabel && !isForcedHorizontal && "gap-y-0"
               ),
               children: [
-                /* @__PURE__ */ jsxs(
+                !isSquare && /* @__PURE__ */ jsxs(
                   "div",
                   {
                     className: cn(
@@ -2820,9 +4830,18 @@ var NavigationBarItemComponent = React36.forwardRef(
                       isForcedHorizontal && "block!"
                     ),
                     children: [
-                      /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, {}) }),
-                      /* @__PURE__ */ jsx(HoverStateLayer, {}),
-                      /* @__PURE__ */ jsx(RippleLayer, { ripples, onRippleDone: removeRipple })
+                      /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, { shape: activeShape, width: 56, height: 40 }) }),
+                      /* @__PURE__ */ jsx(HoverStateLayer, { shape: activeShape, width: 56, height: 40 }),
+                      /* @__PURE__ */ jsx(
+                        RippleLayer,
+                        {
+                          ripples,
+                          onRippleDone: removeRipple,
+                          shape: activeShape,
+                          width: 56,
+                          height: 40
+                        }
+                      )
                     ]
                   }
                 ),
@@ -2831,23 +4850,47 @@ var NavigationBarItemComponent = React36.forwardRef(
                   {
                     className: cn(
                       "relative flex items-center justify-center shrink-0 z-10",
-                      "h-8 w-16 mx-auto rounded-full",
-                      isResponsiveHorizontal && "min-[600px]:size-6 min-[600px]:w-auto min-[600px]:h-auto",
-                      isForcedHorizontal && "size-6 w-auto h-auto"
+                      isSquare ? "mx-auto" : "h-8 w-14 mx-auto rounded-[16px]",
+                      !isSquare && isResponsiveHorizontal && "min-[600px]:size-6 min-[600px]:w-auto min-[600px]:h-auto",
+                      !isSquare && isForcedHorizontal && "size-6 w-auto h-auto"
                     ),
+                    style: isSquare ? { width: resolvedShapeSize, height: resolvedShapeSize } : void 0,
                     children: [
                       /* @__PURE__ */ jsxs(
                         "div",
                         {
                           className: cn(
                             "absolute inset-0 z-0",
-                            isResponsiveHorizontal && "min-[600px]:hidden",
-                            isForcedHorizontal && "hidden"
+                            !isSquare && isResponsiveHorizontal && "min-[600px]:hidden",
+                            !isSquare && isForcedHorizontal && "hidden"
                           ),
                           children: [
-                            /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill, {}) }),
-                            /* @__PURE__ */ jsx(HoverStateLayer, {}),
-                            /* @__PURE__ */ jsx(RippleLayer, { ripples, onRippleDone: removeRipple })
+                            /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                              ActivePill,
+                              {
+                                shape: activeShape,
+                                width: iconPillWidth,
+                                height: iconPillHeight
+                              }
+                            ) }),
+                            /* @__PURE__ */ jsx(
+                              HoverStateLayer,
+                              {
+                                shape: activeShape,
+                                width: iconPillWidth,
+                                height: iconPillHeight
+                              }
+                            ),
+                            /* @__PURE__ */ jsx(
+                              RippleLayer,
+                              {
+                                ripples,
+                                onRippleDone: removeRipple,
+                                shape: activeShape,
+                                width: iconPillWidth,
+                                height: iconPillHeight
+                              }
+                            )
                           ]
                         }
                       ),
@@ -2855,13 +4898,17 @@ var NavigationBarItemComponent = React36.forwardRef(
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", children: /* @__PURE__ */ jsx(
-                  "span",
+                label && /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", initial: false, children: shouldShowLabel && /* @__PURE__ */ jsx(
+                  m.span,
                   {
+                    initial: { opacity: 0, height: 0, scale: 0.85, y: -2 },
+                    animate: { opacity: 1, height: "auto", scale: 1, y: 0 },
+                    exit: { opacity: 0, height: 0, scale: 0.85, y: -2 },
+                    transition: SPRING_TRANSITION_EXPRESSIVE,
                     className: cn(
-                      "z-10 transition-all duration-200 truncate px-1",
-                      selected ? "text-m3-on-surface" : "text-m3-on-surface-variant",
-                      "font-medium text-[12px] leading-4 tracking-[0.5px]"
+                      "z-10 transition-colors duration-200 truncate px-1 inline-block overflow-hidden",
+                      selected ? "text-m3-on-surface font-medium" : "text-m3-on-surface-variant font-medium",
+                      "text-[12px] leading-4 tracking-[0.5px]"
                     ),
                     children: label
                   },
@@ -2877,15 +4924,15 @@ var NavigationBarItemComponent = React36.forwardRef(
   }
 );
 NavigationBarItemComponent.displayName = "NavigationBarItem";
-var NavigationBarItem = React36.memo(NavigationBarItemComponent);
+var NavigationBarItem = React37.memo(NavigationBarItemComponent);
 var navContainerVariants = cva(
   "flex items-center justify-center select-none transition-transform duration-300 z-50",
   {
     variants: {
       variant: {
-        flexible: "bottom-0 left-0 right-0 w-full h-16 pb-safe",
-        baseline: "bottom-0 left-0 right-0 w-full h-20 pb-safe",
-        xr: "bottom-6 left-1/2 -translate-x-1/2 w-auto max-w-[calc(100%-2rem)] min-[600px]:max-w-fit h-20 min-[600px]:h-16 rounded-[48px] px-2"
+        flexible: "bottom-0 left-0 right-0 w-full min-h-16 py-1 pb-safe",
+        baseline: "bottom-0 left-0 right-0 w-full min-h-20 py-1 pb-safe",
+        xr: "bottom-6 left-1/2 -translate-x-1/2 w-auto max-w-[calc(100%-2rem)] min-[600px]:max-w-fit min-h-20 min-[600px]:min-h-16 rounded-[48px] px-2 py-1"
       },
       position: {
         fixed: "fixed",
@@ -2903,10 +4950,13 @@ var navContainerVariants = cva(
     }
   }
 );
-var NavigationBarComponent = React36.forwardRef(
+var NavigationBarComponent = React37.forwardRef(
   ({
     variant = "flexible",
     itemLayout,
+    shape,
+    labelVisibility,
+    shapeSize,
     hideOnScroll = false,
     elevated = false,
     fixed = true,
@@ -2917,11 +4967,18 @@ var NavigationBarComponent = React36.forwardRef(
     className,
     style
   }, ref) => {
-    const [isVisible, setIsVisible] = React36.useState(true);
-    const lastScrollY = React36.useRef(
+    const [isVisible, setIsVisible] = React37.useState(true);
+    const lastScrollY = React37.useRef(
       typeof window !== "undefined" ? window.scrollY : 0
     );
-    React36.useEffect(() => {
+    const isSquare = isSquareShape(shape);
+    const effectiveShapeSize = shapeSize != null ? shapeSize : isSquare ? 56 : 32;
+    const computedMinHeight = React37.useMemo(() => {
+      const baseHeight = variant === "baseline" ? 80 : 64;
+      const requiredHeight = itemLayout === "horizontal" || labelVisibility === "unlabeled" ? effectiveShapeSize + 16 : effectiveShapeSize + 32;
+      return Math.max(baseHeight, requiredHeight);
+    }, [variant, itemLayout, labelVisibility, effectiveShapeSize]);
+    React37.useEffect(() => {
       if (typeof window === "undefined" || !hideOnScroll) {
         setIsVisible(true);
         return;
@@ -2967,6 +5024,9 @@ var NavigationBarComponent = React36.forwardRef(
         value: {
           variant,
           itemLayout,
+          shape,
+          labelVisibility,
+          shapeSize,
           activeIndicatorTransition,
           itemClassName
         },
@@ -2977,7 +5037,7 @@ var NavigationBarComponent = React36.forwardRef(
             role: "navigation",
             "aria-label": "Main navigation",
             className: navBaseClasses,
-            style,
+            style: __spreadValues({ minHeight: computedMinHeight }, style),
             initial: false,
             animate: {
               y: isVisible ? "0%" : variant === "xr" ? "calc(100% + 40px)" : "100%"
@@ -2989,8 +5049,8 @@ var NavigationBarComponent = React36.forwardRef(
                 role: "menubar",
                 "aria-orientation": "horizontal",
                 className: cn(
-                  "flex w-full h-full mx-auto",
-                  variant === "xr" ? "gap-0 min-[600px]:gap-1.5 items-center justify-center px-1" : "max-w-7xl gap-1.5"
+                  "flex w-full h-full mx-auto items-center justify-center",
+                  variant === "xr" ? "gap-0 min-[600px]:gap-1.5 px-1" : "max-w-7xl gap-1.5"
                 ),
                 children
               }
@@ -3002,8 +5062,12 @@ var NavigationBarComponent = React36.forwardRef(
   }
 );
 NavigationBarComponent.displayName = "NavigationBar";
-var NavigationBar = React36.memo(NavigationBarComponent);
-var NavigationRailContext = React36.createContext({ variant: "collapsed", labelVisibility: "labeled" });
+var NavigationBar = React37.memo(NavigationBarComponent);
+var NavigationRailContext = React37.createContext({
+  variant: "collapsed",
+  labelVisibility: "labeled",
+  activeIndicatorWidth: "hug"
+});
 var MD3_MODAL_TRANSITION = {
   type: "tween",
   ease: [0.05, 0.7, 0.1, 1],
@@ -3014,9 +5078,9 @@ var railContainerVariants = cva(
   {
     variants: {
       variant: {
-        collapsed: "items-center h-full pt-11 pb-4 shadow-none bg-m3-surface rounded-none",
-        expanded: "items-start h-full pt-11 pb-4 shadow-none bg-m3-surface rounded-none",
-        modal: "bg-m3-surface shadow-lg rounded-r-[var(--m3-shape-corner-large)] h-full pt-11 pb-4",
+        collapsed: "items-center h-full pt-11 pb-14 shadow-none bg-m3-surface rounded-none",
+        expanded: "items-start h-full pt-11 pb-14 shadow-none bg-m3-surface rounded-none",
+        modal: "bg-m3-surface shadow-lg rounded-r-[var(--m3-shape-corner-large)] h-full pt-11 pb-14",
         xr: "h-fit py-5 rounded-[48px] shadow-xl bg-m3-surface border border-white/5"
       },
       narrow: {
@@ -3035,9 +5099,9 @@ var railContainerVariants = cva(
   }
 );
 function cloneIconWithFill2(icon, selected) {
-  if (!React36.isValidElement(icon)) return icon;
+  if (!React37.isValidElement(icon)) return icon;
   if (icon.type === Icon) {
-    return React36.cloneElement(
+    return React37.cloneElement(
       icon,
       { fill: selected ? 1 : 0, animateFill: true }
     );
@@ -3059,14 +5123,28 @@ function setFocusedItem(items, index) {
     target.focus();
   }
 }
-function ActivePill2({ layoutId, disableInitial = false }) {
-  const { activeIndicatorTransition } = React36.useContext(NavigationRailContext);
+function ActivePill2({
+  layoutId,
+  disableInitial = false,
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const { activeIndicatorTransition } = React37.useContext(NavigationRailContext);
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
   return /* @__PURE__ */ jsx(
     m.div,
     {
       layoutId,
-      className: "absolute inset-0 bg-m3-secondary-container pointer-events-none",
-      style: { borderRadius: 9999, zIndex: 0, originX: 0.5, originY: 0.5 },
+      className: cn(
+        "bg-m3-secondary-container pointer-events-none",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : "absolute inset-0 rounded-full"
+      ),
+      style: __spreadValues(__spreadValues({
+        zIndex: 0,
+        originX: 0.5,
+        originY: 0.5
+      }, shapeStyle ? { width, height } : {}), shapeStyle),
       initial: disableInitial ? false : { opacity: 0, scale: 0.5 },
       animate: { opacity: 1, scale: 1 },
       exit: { opacity: 0, scale: 0.5, transition: { duration: 0.15 } },
@@ -3074,11 +5152,42 @@ function ActivePill2({ layoutId, disableInitial = false }) {
     }
   );
 }
-function HoverStateLayer2() {
-  return /* @__PURE__ */ jsx("div", { className: "absolute inset-0 rounded-full bg-m3-on-surface opacity-0 group-hover:opacity-[0.08] transition-opacity duration-200 pointer-events-none z-0" });
+function HoverStateLayer2({
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "bg-m3-on-surface opacity-0 group-hover:opacity-[0.08] transition-opacity duration-200 pointer-events-none z-0",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : "absolute inset-0 rounded-full"
+      ),
+      style: __spreadValues(__spreadValues({}, shapeStyle ? { width, height } : {}), shapeStyle)
+    }
+  );
 }
-function RippleLayer2({ ripples, onRippleDone }) {
-  return /* @__PURE__ */ jsx("div", { className: "absolute inset-0 rounded-full overflow-hidden pointer-events-none z-0", children: /* @__PURE__ */ jsx(Ripple, { ripples, onRippleDone }) });
+function RippleLayer2({
+  ripples,
+  onRippleDone,
+  shape = "pill",
+  width = 56,
+  height = 32
+}) {
+  const shapeStyle = getNavigationShapeStyle(shape, width, height);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden pointer-events-none z-0",
+        shapeStyle ? "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-none" : "absolute inset-0 rounded-full"
+      ),
+      style: __spreadValues(__spreadValues({}, shapeStyle ? { width, height } : {}), shapeStyle),
+      children: /* @__PURE__ */ jsx(Ripple, { ripples, onRippleDone })
+    }
+  );
 }
 function IconContainer2({ selected, badge, children }) {
   return /* @__PURE__ */ jsxs(
@@ -3096,7 +5205,7 @@ function IconContainer2({ selected, badge, children }) {
     }
   );
 }
-var NavigationRailItemComponent = React36.forwardRef(
+var NavigationRailItemComponent = React37.forwardRef(
   ({
     selected,
     icon,
@@ -3104,24 +5213,37 @@ var NavigationRailItemComponent = React36.forwardRef(
     onClick,
     disabled = false,
     badge,
+    shape: shapeProp,
+    shapeSize: shapeSizeProp,
+    activeIndicatorWidth: activeIndicatorWidthProp,
     className,
     "aria-label": ariaLabelProp,
     asChild = false,
     children
   }, ref) => {
-    var _a;
-    const { variant, labelVisibility } = React36.useContext(
-      NavigationRailContext
-    );
+    var _a, _b, _c, _d;
+    const {
+      variant,
+      labelVisibility,
+      shape: contextShape,
+      shapeSize: contextShapeSize,
+      activeIndicatorWidth: contextActiveIndicatorWidth
+    } = React37.useContext(NavigationRailContext);
+    const activeShape = (_a = shapeProp != null ? shapeProp : contextShape) != null ? _a : "pill";
+    const isSquare = isSquareShape(activeShape);
+    const resolvedShapeSize = (_b = shapeSizeProp != null ? shapeSizeProp : contextShapeSize) != null ? _b : 56;
+    const activeIndicatorWidth = (_c = activeIndicatorWidthProp != null ? activeIndicatorWidthProp : contextActiveIndicatorWidth) != null ? _c : "hug";
     const isExpanded = variant === "expanded" || variant === "modal";
     const isModal = variant === "modal";
     const enableLayout = !isModal;
-    const activePillId = `rail-pill-${React36.useId()}`;
+    const isExpandedPill = isExpanded && !isSquare;
+    const expandedPillWidthClass = activeIndicatorWidth === "fill" ? "w-full" : "w-fit";
+    const activePillId = `rail-pill-${React37.useId()}`;
     const { ripples, onPointerDown, removeRipple } = useRippleState({
       disabled
     });
     const showLabel = isExpanded || labelVisibility === "labeled" || labelVisibility === "auto" && selected;
-    const handleClick = React36.useCallback(
+    const handleClick = React37.useCallback(
       (e) => {
         if (disabled) {
           e.preventDefault();
@@ -3140,8 +5262,10 @@ var NavigationRailItemComponent = React36.forwardRef(
       isExpanded ? "w-full flex-row items-center px-3 h-14" : "w-full flex-col justify-center h-14",
       className
     );
+    const iconPillWidth = isSquare ? resolvedShapeSize : 56;
+    const iconPillHeight = isSquare ? resolvedShapeSize : 32;
     if (asChild && children) {
-      const child = React36.Children.only(children);
+      const child = React37.Children.only(children);
       const innerContent = /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs(
           m.div,
@@ -3149,31 +5273,71 @@ var NavigationRailItemComponent = React36.forwardRef(
             layout: enableLayout,
             className: cn(
               "relative flex z-10",
-              isExpanded ? "flex-row items-center w-fit h-14 px-4 gap-x-3 rounded-full" : "flex-col items-center justify-center w-full gap-y-1 rounded-full"
+              isExpanded ? cn(
+                "flex-row items-center h-14 px-4 gap-x-3 rounded-full",
+                expandedPillWidthClass
+              ) : "flex-col items-center justify-center w-full gap-y-1 rounded-full"
             ),
             children: [
-              isExpanded && /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
-                ActivePill2,
-                {
-                  layoutId: activePillId,
-                  disableInitial: isModal
-                }
-              ) }),
-              isExpanded && /* @__PURE__ */ jsx(HoverStateLayer2, {}),
-              isExpanded && /* @__PURE__ */ jsx(RippleLayer2, { ripples, onRippleDone: removeRipple }),
+              isExpandedPill && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                  ActivePill2,
+                  {
+                    layoutId: activePillId,
+                    disableInitial: isModal,
+                    shape: activeShape
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(HoverStateLayer2, { shape: activeShape }),
+                /* @__PURE__ */ jsx(
+                  RippleLayer2,
+                  {
+                    ripples,
+                    onRippleDone: removeRipple,
+                    shape: activeShape
+                  }
+                )
+              ] }),
               /* @__PURE__ */ jsxs(
                 m.div,
                 {
                   layout: enableLayout,
                   className: cn(
                     "relative flex items-center justify-center shrink-0 z-10",
-                    isExpanded ? "size-6" : "h-8 w-14 mx-auto"
+                    isSquare ? "mx-auto" : isExpandedPill ? "size-6" : "h-8 w-14 mx-auto rounded-full"
                   ),
-                  style: { borderRadius: 9999 },
+                  style: isSquare ? { width: resolvedShapeSize, height: resolvedShapeSize } : void 0,
                   children: [
-                    !isExpanded && /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill2, { layoutId: activePillId }) }),
-                    !isExpanded && /* @__PURE__ */ jsx(HoverStateLayer2, {}),
-                    !isExpanded && /* @__PURE__ */ jsx(RippleLayer2, { ripples, onRippleDone: removeRipple }),
+                    !isExpandedPill && /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                        ActivePill2,
+                        {
+                          layoutId: activePillId,
+                          disableInitial: isModal,
+                          shape: activeShape,
+                          width: iconPillWidth,
+                          height: iconPillHeight
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(
+                        HoverStateLayer2,
+                        {
+                          shape: activeShape,
+                          width: iconPillWidth,
+                          height: iconPillHeight
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        RippleLayer2,
+                        {
+                          ripples,
+                          onRippleDone: removeRipple,
+                          shape: activeShape,
+                          width: iconPillWidth,
+                          height: iconPillHeight
+                        }
+                      )
+                    ] }),
                     /* @__PURE__ */ jsx(
                       m.div,
                       {
@@ -3195,10 +5359,10 @@ var NavigationRailItemComponent = React36.forwardRef(
                   transition: SPRING_TRANSITION,
                   className: cn(
                     "z-10 transition-colors duration-200 whitespace-nowrap",
-                    selected ? "text-m3-on-surface" : "text-m3-on-surface-variant",
-                    isExpanded ? "text-sm font-medium tracking-wide text-left" : "text-xs font-medium tracking-wide"
+                    selected ? isExpandedPill ? "text-m3-on-secondary-container font-medium" : "text-m3-on-surface font-medium" : "text-m3-on-surface-variant font-medium",
+                    isExpanded ? "text-sm tracking-wide text-left" : "text-xs tracking-wide"
                   ),
-                  children: (_a = child.props.children) != null ? _a : label
+                  children: (_d = child.props.children) != null ? _d : label
                 },
                 "rail-label"
               ) })
@@ -3219,7 +5383,7 @@ var NavigationRailItemComponent = React36.forwardRef(
           onPointerDown,
           className: itemClassName,
           tabIndex: -1,
-          children: React36.cloneElement(child, { children: innerContent })
+          children: React37.cloneElement(child, { children: innerContent })
         }
       ) });
     }
@@ -3244,31 +5408,71 @@ var NavigationRailItemComponent = React36.forwardRef(
               layout: enableLayout,
               className: cn(
                 "relative flex z-10",
-                isExpanded ? "flex-row items-center w-fit h-14 px-4 gap-x-3 rounded-full" : "flex-col items-center justify-center w-full gap-y-1 rounded-full"
+                isExpanded ? cn(
+                  "flex-row items-center h-14 px-4 gap-x-3 rounded-full",
+                  expandedPillWidthClass
+                ) : "flex-col items-center justify-center w-full gap-y-1 rounded-full"
               ),
               children: [
-                isExpanded && /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
-                  ActivePill2,
-                  {
-                    layoutId: activePillId,
-                    disableInitial: isModal
-                  }
-                ) }),
-                isExpanded && /* @__PURE__ */ jsx(HoverStateLayer2, {}),
-                isExpanded && /* @__PURE__ */ jsx(RippleLayer2, { ripples, onRippleDone: removeRipple }),
+                isExpandedPill && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                    ActivePill2,
+                    {
+                      layoutId: activePillId,
+                      disableInitial: isModal,
+                      shape: activeShape
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(HoverStateLayer2, { shape: activeShape }),
+                  /* @__PURE__ */ jsx(
+                    RippleLayer2,
+                    {
+                      ripples,
+                      onRippleDone: removeRipple,
+                      shape: activeShape
+                    }
+                  )
+                ] }),
                 /* @__PURE__ */ jsxs(
                   m.div,
                   {
                     layout: enableLayout,
                     className: cn(
                       "relative flex items-center justify-center shrink-0 z-10",
-                      isExpanded ? "size-6" : "h-8 w-14 mx-auto"
+                      isSquare ? "mx-auto" : isExpandedPill ? "size-6" : "h-8 w-14 mx-auto rounded-full"
                     ),
-                    style: { borderRadius: 9999 },
+                    style: isSquare ? { width: resolvedShapeSize, height: resolvedShapeSize } : void 0,
                     children: [
-                      !isExpanded && /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(ActivePill2, { layoutId: activePillId }) }),
-                      !isExpanded && /* @__PURE__ */ jsx(HoverStateLayer2, {}),
-                      !isExpanded && /* @__PURE__ */ jsx(RippleLayer2, { ripples, onRippleDone: removeRipple }),
+                      !isExpandedPill && /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: selected && /* @__PURE__ */ jsx(
+                          ActivePill2,
+                          {
+                            layoutId: activePillId,
+                            disableInitial: isModal,
+                            shape: activeShape,
+                            width: iconPillWidth,
+                            height: iconPillHeight
+                          }
+                        ) }),
+                        /* @__PURE__ */ jsx(
+                          HoverStateLayer2,
+                          {
+                            shape: activeShape,
+                            width: iconPillWidth,
+                            height: iconPillHeight
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          RippleLayer2,
+                          {
+                            ripples,
+                            onRippleDone: removeRipple,
+                            shape: activeShape,
+                            width: iconPillWidth,
+                            height: iconPillHeight
+                          }
+                        )
+                      ] }),
                       /* @__PURE__ */ jsx(
                         m.div,
                         {
@@ -3290,8 +5494,8 @@ var NavigationRailItemComponent = React36.forwardRef(
                     transition: SPRING_TRANSITION,
                     className: cn(
                       "z-10 transition-colors duration-200 whitespace-nowrap",
-                      selected ? "text-m3-on-surface" : "text-m3-on-surface-variant",
-                      isExpanded ? "text-sm font-medium tracking-wide text-left" : "text-xs font-medium tracking-wide"
+                      selected ? isExpandedPill ? "text-m3-on-secondary-container font-medium" : "text-m3-on-surface font-medium" : "text-m3-on-surface-variant font-medium",
+                      isExpanded ? "text-sm tracking-wide text-left" : "text-xs tracking-wide"
                     ),
                     children: label
                   },
@@ -3307,9 +5511,9 @@ var NavigationRailItemComponent = React36.forwardRef(
   }
 );
 NavigationRailItemComponent.displayName = "NavigationRailItem";
-var NavigationRailItem = React36.memo(NavigationRailItemComponent);
+var NavigationRailItem = React37.memo(NavigationRailItemComponent);
 function useRoving(navRef) {
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (!navRef.current) return;
     const items = getMenuItems(navRef.current);
     const selected = items.find(
@@ -3319,7 +5523,7 @@ function useRoving(navRef) {
     const firstFocusable = selected != null ? selected : items[0];
     if (firstFocusable) firstFocusable.tabIndex = 0;
   }, [navRef]);
-  return React36.useCallback(
+  return React37.useCallback(
     (e) => {
       if (!navRef.current) return;
       const items = getMenuItems(navRef.current);
@@ -3347,10 +5551,13 @@ function useRoving(navRef) {
     [navRef]
   );
 }
-var NavigationRailComponent = React36.forwardRef(
+var NavigationRailComponent = React37.forwardRef(
   ({
     variant = "collapsed",
     labelVisibility = "labeled",
+    shape,
+    shapeSize,
+    activeIndicatorWidth = "hug",
     header,
     fab,
     fabPlacement = "contained",
@@ -3364,12 +5571,13 @@ var NavigationRailComponent = React36.forwardRef(
     style
   }, ref) => {
     const isModal = variant === "modal";
+    const isExpanded = variant === "expanded" || variant === "modal";
     const isXr = variant === "xr";
     const isSpatial = isXr && fabPlacement === "spatialized";
     const applyAnimation = !isXr || !isSpatial;
-    const navRef = React36.useRef(null);
+    const navRef = React37.useRef(null);
     const handleKeyDown = useRoving(navRef);
-    const setRefs = React36.useCallback(
+    const setRefs = React37.useCallback(
       (node) => {
         navRef.current = node;
         if (typeof ref === "function") ref(node);
@@ -3405,10 +5613,12 @@ var NavigationRailComponent = React36.forwardRef(
         transition: isModal ? MD3_MODAL_TRANSITION : SPRING_TRANSITION,
         children: [
           (header || fab && !isSpatial) && /* @__PURE__ */ jsxs(
-            "div",
+            m.div,
             {
+              layout: true,
               className: cn(
-                "flex w-full flex-col items-center justify-start shrink-0 empty:hidden",
+                "flex w-full flex-col justify-start shrink-0 empty:hidden",
+                isExpanded ? "items-start px-3" : "items-center",
                 navHeaderSpacing
               ),
               children: [
@@ -3460,7 +5670,7 @@ var NavigationRailComponent = React36.forwardRef(
               children: fab
             }
           ),
-          React36.cloneElement(
+          React37.cloneElement(
             navElement,
             {
               className: cn(navBaseClasses, "pointer-events-auto")
@@ -3474,6 +5684,9 @@ var NavigationRailComponent = React36.forwardRef(
     const contextValue = {
       variant,
       labelVisibility,
+      shape,
+      shapeSize,
+      activeIndicatorWidth,
       activeIndicatorTransition
     };
     if (isModal) {
@@ -3502,7 +5715,7 @@ var NavigationRailComponent = React36.forwardRef(
   }
 );
 NavigationRailComponent.displayName = "NavigationRail";
-var NavigationRail = React36.memo(NavigationRailComponent);
+var NavigationRail = React37.memo(NavigationRailComponent);
 function useSearchKeyboard({
   active,
   onActiveChange,
@@ -3511,14 +5724,14 @@ function useSearchKeyboard({
   itemCount,
   onSelectSuggestion
 }) {
-  const [activeIndex, setActiveIndex] = React36.useState(-1);
-  const resetKeyRef = React36.useRef(`${active}:${query}`);
+  const [activeIndex, setActiveIndex] = React37.useState(-1);
+  const resetKeyRef = React37.useRef(`${active}:${query}`);
   const currentKey = `${active}:${query}`;
   if (resetKeyRef.current !== currentKey) {
     resetKeyRef.current = currentKey;
     setActiveIndex(-1);
   }
-  const handleKeyDown = React36.useCallback(
+  const handleKeyDown = React37.useCallback(
     (e) => {
       if (!active) return;
       switch (e.key) {
@@ -3558,7 +5771,7 @@ function useSearchKeyboard({
       query
     ]
   );
-  const resetActiveIndex = React36.useCallback(() => {
+  const resetActiveIndex = React37.useCallback(() => {
     setActiveIndex(-1);
   }, []);
   return { activeIndex, handleKeyDown, resetActiveIndex };
@@ -3626,10 +5839,10 @@ function AnimatedPlaceholder({
   className
 }) {
   const shouldReduceMotion = useReducedMotion();
-  const containerRef = React36.useRef(null);
-  const spanRef = React36.useRef(null);
-  const [xOffset, setXOffset] = React36.useState(0);
-  const recalculate = React36.useCallback(() => {
+  const containerRef = React37.useRef(null);
+  const spanRef = React37.useRef(null);
+  const [xOffset, setXOffset] = React37.useState(0);
+  const recalculate = React37.useCallback(() => {
     const container = containerRef.current;
     const span = spanRef.current;
     if (!container || !span || textAlign === "left") {
@@ -3644,10 +5857,10 @@ function AnimatedPlaceholder({
       setXOffset(Math.max(0, containerWidth - textWidth));
     }
   }, [textAlign]);
-  React36.useLayoutEffect(() => {
+  React37.useLayoutEffect(() => {
     recalculate();
   }, [recalculate]);
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     const observer = new ResizeObserver(recalculate);
@@ -3716,10 +5929,10 @@ function SearchBar({
   activeIndex
 }) {
   const shouldReduceMotion = useReducedMotion();
-  const inputRef = React36.useRef(null);
-  const prevActiveRef = React36.useRef(active);
-  const isRestoringFocusRef = React36.useRef(false);
-  React36.useEffect(() => {
+  const inputRef = React37.useRef(null);
+  const prevActiveRef = React37.useRef(active);
+  const isRestoringFocusRef = React37.useRef(false);
+  React37.useEffect(() => {
     var _a;
     let rafId;
     if (prevActiveRef.current === true && active === false) {
@@ -3838,7 +6051,7 @@ function SearchBar({
     ) })
   );
 }
-var SearchContext = React36.createContext(null);
+var SearchContext = React37.createContext(null);
 function SearchProvider({
   children,
   value
@@ -3846,7 +6059,7 @@ function SearchProvider({
   return /* @__PURE__ */ jsx(SearchContext.Provider, { value, children });
 }
 function useSearch() {
-  const context = React36.useContext(SearchContext);
+  const context = React37.useContext(SearchContext);
   if (!context) {
     return { listboxId: "", activeIndex: -1 };
   }
@@ -3873,7 +6086,7 @@ function useClickOutside(handler, enabled = true) {
   return ref;
 }
 function useSearchViewFocus(inputRef, active) {
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (!active) return;
     let raf2;
     const raf1 = requestAnimationFrame(() => {
@@ -3933,11 +6146,11 @@ var ROTATE_KEY_SPLINES = [
 var ROTATE_VALUES = "0 24 24; 154 24 24; 309 24 24; 463 24 24; 617 24 24; 771 24 24; 926 24 24; 1080 24 24";
 var DETERMINATE_CIRCLE = "M24 7 C34.49 7 41 13.51 41 24 C41 34.49 34.49 41 24 41 C13.51 41 7 34.49 7 24 C7 13.51 13.51 7 24 7 Z";
 var DETERMINATE_SOFT_BURST = "M20.9 10.4 21.4 9.5 21.9 8.7 22.5 7.8 23.2 7.2 24.2 7 25.1 7.4 25.7 8.1 26.2 9 26.8 9.8 27.3 10.6 28.1 11.2 29 11.3 30 11 30.9 10.6 31.8 10.3 32.8 9.9 33.7 10 34.5 10.6 34.9 11.5 34.8 12.5 34.8 13.5 34.7 14.5 34.7 15.5 35.2 16.3 36 16.8 37 17.1 37.9 17.3 38.9 17.5 39.8 17.9 40.4 18.7 40.5 19.7 40 20.5 39.4 21.3 38.7 22 38.1 22.8 37.6 23.7 37.7 24.6 38.3 25.5 38.9 26.2 39.6 27 40.2 27.7 40.5 28.7 40.3 29.6 39.5 30.3 38.6 30.6 37.6 30.8 36.7 31 35.7 31.3 35 31.9 34.6 32.8 34.7 33.8 34.8 34.8 34.9 35.8 34.8 36.8 34.3 37.6 33.4 38.1 32.4 38 31.5 37.6 30.6 37.2 29.7 36.9 28.7 36.6 27.8 36.9 27.1 37.6 26.6 38.5 26.1 39.3 25.5 40.2 24.8 40.8 23.8 41 22.9 40.6 22.3 39.9 21.8 39 21.2 38.2 20.7 37.4 19.9 36.8 19 36.7 18 37 17.1 37.4 16.2 37.7 15.2 38.1 14.3 38 13.5 37.4 13.1 36.5 13.2 35.5 13.2 34.5 13.3 33.5 13.3 32.5 12.8 31.7 12 31.2 11 31 10.1 30.7 9.1 30.5 8.2 30.1 7.6 29.3 7.5 28.3 8 27.5 8.7 26.7 9.3 26 9.9 25.2 10.4 24.3 10.3 23.4 9.7 22.5 9.1 21.8 8.4 21 7.8 20.3 7.5 19.3 7.7 18.4 8.5 17.7 9.4 17.4 10.4 17.2 11.3 17 12.3 16.7 13 16.1 13.4 15.2 13.3 14.2 13.2 13.2 13.1 12.2 13.2 11.2 13.7 10.4 14.6 9.9 15.6 10 16.5 10.4 17.4 10.8 18.3 11.1 19.3 11.4 20.2 11.1Z";
-var IndeterminateSvg = React36.memo(function IndeterminateSvg2({
+var IndeterminateSvg = React37.memo(function IndeterminateSvg2({
   size
 }) {
-  const [ready, setReady] = React36.useState(false);
-  React36.useEffect(() => {
+  const [ready, setReady] = React37.useState(false);
+  React37.useEffect(() => {
     const raf = requestAnimationFrame(() => setReady(true));
     return () => cancelAnimationFrame(raf);
   }, []);
@@ -3982,7 +6195,7 @@ var IndeterminateSvg = React36.memo(function IndeterminateSvg2({
     }
   );
 });
-var DeterminateSvg = React36.memo(function DeterminateSvg2({
+var DeterminateSvg = React37.memo(function DeterminateSvg2({
   size,
   progress
 }) {
@@ -4007,7 +6220,7 @@ var DeterminateSvg = React36.memo(function DeterminateSvg2({
     }
   );
 });
-var LoadingIndicator = React36.forwardRef(
+var LoadingIndicator = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "uncontained",
@@ -4122,7 +6335,7 @@ function getSinePath(startX, endX, phase, wl, amp) {
   d += ` L ${endX.toFixed(2)} ${yEnd.toFixed(2)}`;
   return d;
 }
-var CircularProgress = React36.forwardRef(
+var CircularProgress = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value,
@@ -4160,15 +6373,15 @@ var CircularProgress = React36.forwardRef(
     const isWavy = shape === "wavy";
     const BASELINE_SIZE = 48;
     const scaleFactor = size / BASELINE_SIZE;
-    const effectiveAmplitude = React36.useMemo(
+    const effectiveAmplitude = React37.useMemo(
       () => amplitude != null ? amplitude : 1.6 * scaleFactor,
       [amplitude, scaleFactor]
     );
-    const effectiveWavelength = React36.useMemo(
+    const effectiveWavelength = React37.useMemo(
       () => wavelength != null ? wavelength : 15 * scaleFactor,
       [wavelength, scaleFactor]
     );
-    const wavyActivePath = React36.useMemo(
+    const wavyActivePath = React37.useMemo(
       () => isWavy ? generateWavyCircularPath(
         center,
         radius,
@@ -4177,8 +6390,8 @@ var CircularProgress = React36.forwardRef(
       ) : null,
       [isWavy, center, radius, effectiveAmplitude, effectiveWavelength]
     );
-    const circumference = React36.useMemo(() => 2 * Math.PI * radius, [radius]);
-    const gapForTrack = React36.useMemo(
+    const circumference = React37.useMemo(() => 2 * Math.PI * radius, [radius]);
+    const gapForTrack = React37.useMemo(
       () => (gapSize + trackHeight) / circumference,
       [gapSize, trackHeight, circumference]
     );
@@ -4367,9 +6580,9 @@ var CircularProgress = React36.forwardRef(
 );
 CircularProgress.displayName = "CircularProgress";
 function useContainerWidth() {
-  const [width, setWidth] = React36.useState(0);
-  const observerRef = React36.useRef(null);
-  const ref = React36.useCallback((node) => {
+  const [width, setWidth] = React37.useState(0);
+  const observerRef = React37.useRef(null);
+  const ref = React37.useCallback((node) => {
     if (observerRef.current) {
       observerRef.current.disconnect();
       observerRef.current = null;
@@ -4383,7 +6596,7 @@ function useContainerWidth() {
       observerRef.current = obs;
     }
   }, []);
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     return () => {
       if (observerRef.current) {
         observerRef.current.disconnect();
@@ -4393,7 +6606,7 @@ function useContainerWidth() {
   return [ref, width];
 }
 function useMergedRef(...refs) {
-  return React36.useCallback(
+  return React37.useCallback(
     (node) => {
       for (const ref of refs) {
         if (typeof ref === "function") {
@@ -4407,7 +6620,7 @@ function useMergedRef(...refs) {
     [refs]
   );
 }
-var FlatLinearTrack = React36.memo(function FlatLinearTrack2({
+var FlatLinearTrack = React37.memo(function FlatLinearTrack2({
   trackHeight,
   activeColor,
   trackColor,
@@ -4483,7 +6696,7 @@ var FlatLinearTrack = React36.memo(function FlatLinearTrack2({
     }
   );
 });
-var WavyLinearTrack = React36.memo(function WavyLinearTrack2({
+var WavyLinearTrack = React37.memo(function WavyLinearTrack2({
   trackHeight,
   svgHeight,
   amplitude,
@@ -4502,13 +6715,13 @@ var WavyLinearTrack = React36.memo(function WavyLinearTrack2({
 }) {
   const isDeterminate = typeof value === "number";
   const clampedValue = isDeterminate ? Math.max(0, Math.min(100, value)) : 100;
-  const titleId = React36.useId();
+  const titleId = React37.useId();
   const [containerRef, width] = useContainerWidth();
-  const activePathRef = React36.useRef(null);
-  const trackPathRef = React36.useRef(null);
+  const activePathRef = React37.useRef(null);
+  const trackPathRef = React37.useRef(null);
   const amplitudeMV = useMotionValue(amplitude);
   const fractionMV = useMotionValue(isDeterminate ? clampedValue / 100 : 1);
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (isDeterminate) {
       const fraction = clampedValue / 100;
       let targetAmp = amplitude;
@@ -4679,7 +6892,7 @@ var WavyLinearTrack = React36.memo(function WavyLinearTrack2({
     }
   );
 });
-var LinearProgress = React36.forwardRef(
+var LinearProgress = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       value,
@@ -4720,10 +6933,10 @@ var LinearProgress = React36.forwardRef(
     ]);
     const isDeterminate = value !== void 0;
     const clampedValue = isDeterminate ? Math.min(100, Math.max(0, value)) : 0;
-    const containerRef = React36.useRef(null);
+    const containerRef = React37.useRef(null);
     const mergedRef = useMergedRef(ref, containerRef);
-    const [isRtl, setIsRtl] = React36.useState(false);
-    React36.useEffect(() => {
+    const [isRtl, setIsRtl] = React37.useState(false);
+    React37.useEffect(() => {
       if (containerRef.current) {
         const dir = getComputedStyle(containerRef.current).direction;
         setIsRtl(dir === "rtl");
@@ -4731,16 +6944,16 @@ var LinearProgress = React36.forwardRef(
     }, []);
     const isWavy = shape === "wavy";
     const resolvedTrackShape = trackShape != null ? trackShape : shape;
-    const effectiveAmplitude = React36.useMemo(() => amplitude != null ? amplitude : 3, [amplitude]);
-    const svgHeight = React36.useMemo(
+    const effectiveAmplitude = React37.useMemo(() => amplitude != null ? amplitude : 3, [amplitude]);
+    const svgHeight = React37.useMemo(
       () => isWavy ? trackHeight + effectiveAmplitude * 2 : trackHeight,
       [isWavy, trackHeight, effectiveAmplitude]
     );
-    const shouldShowStop = React36.useMemo(
+    const shouldShowStop = React37.useMemo(
       () => isDeterminate && resolvedTrackShape === "flat" && (showStopIndicator === true || showStopIndicator === "auto" && isDeterminate),
       [isDeterminate, resolvedTrackShape, showStopIndicator]
     );
-    const stopSize = React36.useMemo(
+    const stopSize = React37.useMemo(
       () => Math.max(2, trackHeight > 4 ? 4 : trackHeight / 2),
       [trackHeight]
     );
@@ -4813,7 +7026,7 @@ var LinearProgress = React36.forwardRef(
   }
 );
 LinearProgress.displayName = "LinearProgress";
-var ProgressIndicator = React36.forwardRef((props, ref) => {
+var ProgressIndicator = React37.forwardRef((props, ref) => {
   if (props.variant === "circular") {
     return /* @__PURE__ */ jsx(CircularProgress, __spreadValues({ ref }, props));
   }
@@ -4945,7 +7158,7 @@ function resolveDisabledBgClass(colorStyle) {
   }
   return "disabled:text-m3-on-surface/[0.38]";
 }
-var IconButtonComponent = React36.forwardRef(
+var IconButtonComponent = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       className,
@@ -4987,18 +7200,18 @@ var IconButtonComponent = React36.forwardRef(
     var _a2, _b2, _c, _d, _e;
     const isToggle = variant === "toggle";
     const isSelected = isToggle && !!selected;
-    const resolvedColorClass = React36.useMemo(
+    const resolvedColorClass = React37.useMemo(
       () => isSelected ? colorStyles[colorStyle].selected : colorStyles[colorStyle].default,
       [isSelected, colorStyle]
     );
-    const outlineWidthClass = React36.useMemo(
+    const outlineWidthClass = React37.useMemo(
       () => {
         var _a3;
         return colorStyle === "outlined" && !isSelected ? (_a3 = SIZE_OUTLINE_WIDTH[size]) != null ? _a3 : "border" : "";
       },
       [colorStyle, isSelected, size]
     );
-    const disabledBgClass = React36.useMemo(
+    const disabledBgClass = React37.useMemo(
       () => resolveDisabledBgClass(colorStyle),
       [colorStyle]
     );
@@ -5021,7 +7234,7 @@ var IconButtonComponent = React36.forwardRef(
     const { ripples, onPointerDown, removeRipple } = useRippleState({
       disabled: loading
     });
-    const handleClick = React36.useCallback(
+    const handleClick = React37.useCallback(
       (e) => {
         if (loading) {
           e.preventDefault();
@@ -5031,7 +7244,7 @@ var IconButtonComponent = React36.forwardRef(
       },
       [loading, onClick]
     );
-    const handleKeyDown = React36.useCallback(
+    const handleKeyDown = React37.useCallback(
       (e) => {
         if (loading) return;
         if ((e.key === "Enter" || e.key === " ") && onClick) {
@@ -5087,7 +7300,7 @@ var IconButtonComponent = React36.forwardRef(
             width: isCustomSize ? `${iconSize}px` : void 0,
             height: isCustomSize ? `${iconSize}px` : void 0
           },
-          children: isSelected && selectedIcon ? selectedIcon : asChild ? React36.Children.only(children).props.children : children
+          children: isSelected && selectedIcon ? selectedIcon : asChild ? React37.Children.only(children).props.children : children
         }),
         isSelected && selectedIcon ? "selected-content" : "content"
       ) })
@@ -5104,7 +7317,7 @@ var IconButtonComponent = React36.forwardRef(
       className
     );
     if (asChild) {
-      const child = React36.Children.only(children);
+      const child = React37.Children.only(children);
       return /* @__PURE__ */ jsx(LazyMotion, { features: domMax, strict: true, children: /* @__PURE__ */ jsx(
         Slot,
         __spreadProps(__spreadValues({
@@ -5121,7 +7334,7 @@ var IconButtonComponent = React36.forwardRef(
           }),
           className: containerClassName
         }, restProps), {
-          children: React36.cloneElement(child, { children: innerContent })
+          children: React37.cloneElement(child, { children: innerContent })
         })
       ) });
     }
@@ -5149,7 +7362,7 @@ var IconButtonComponent = React36.forwardRef(
   }
 );
 IconButtonComponent.displayName = "IconButton";
-var IconButton = React36.memo(IconButtonComponent);
+var IconButton = React37.memo(IconButtonComponent);
 function TrailingAction({
   query,
   trailingIcon,
@@ -5209,7 +7422,7 @@ function SearchViewDocked({
   activeIndex
 }) {
   const shouldReduceMotion = useReducedMotion();
-  const inputRef = React36.useRef(null);
+  const inputRef = React37.useRef(null);
   useSearchViewFocus(inputRef, active);
   const dropdownRef = useClickOutside(() => {
     onActiveChange(false);
@@ -5355,10 +7568,10 @@ function SearchViewFullScreen({
   activeIndex
 }) {
   const shouldReduceMotion = useReducedMotion();
-  const inputRef = React36.useRef(null);
+  const inputRef = React37.useRef(null);
   useSearchViewFocus(inputRef, active);
-  const [mounted, setMounted] = React36.useState(false);
-  React36.useEffect(() => {
+  const [mounted, setMounted] = React37.useState(false);
+  React37.useEffect(() => {
     setMounted(true);
   }, []);
   const handleFormSubmit = (e) => {
@@ -5516,10 +7729,10 @@ function SearchComponent({
   className,
   viewClassName
 }) {
-  const generatedId = React36.useId();
+  const generatedId = React37.useId();
   const searchId = id != null ? id : generatedId;
   const listboxId = `${searchId}-listbox`;
-  const itemCount = React36.Children.count(children);
+  const itemCount = React37.Children.count(children);
   const { activeIndex, handleKeyDown } = useSearchKeyboard({
     active,
     onActiveChange,
@@ -5578,9 +7791,9 @@ function formatBadgeLabel(children, max) {
   return "";
 }
 function detectBadgeHasContent(badge) {
-  return React36.isValidElement(badge) && badge.props.children != null;
+  return React37.isValidElement(badge) && badge.props.children != null;
 }
-var BadgeImpl = React36.forwardRef(
+var BadgeImpl = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       children,
@@ -5634,7 +7847,7 @@ var BadgeImpl = React36.forwardRef(
   }
 );
 BadgeImpl.displayName = "Badge";
-React36.memo(BadgeImpl);
+React37.memo(BadgeImpl);
 function BadgedBox({
   badge,
   children,
@@ -5655,9 +7868,9 @@ function BadgedBox({
     )
   ] });
 }
-var TabsContext = React36.createContext(null);
+var TabsContext = React37.createContext(null);
 function useTabsContext() {
-  const ctx = React36.useContext(TabsContext);
+  const ctx = React37.useContext(TabsContext);
   if (!ctx) {
     throw new Error(
       "[MD3 Tabs] Component must be used within a <Tabs> root. Ensure <TabsList>, <Tab>, and <TabsContent> are descendants of <Tabs>."
@@ -5665,7 +7878,7 @@ function useTabsContext() {
   }
   return ctx;
 }
-var TabsComponent = React36.forwardRef(
+var TabsComponent = React37.forwardRef(
   ({
     value: controlledValue,
     defaultValue = "",
@@ -5674,35 +7887,35 @@ var TabsComponent = React36.forwardRef(
     children,
     className
   }, ref) => {
-    const [internalValue, setInternalValue] = React36.useState(defaultValue);
+    const [internalValue, setInternalValue] = React37.useState(defaultValue);
     const isControlled = controlledValue !== void 0;
     const value = isControlled ? controlledValue : internalValue;
-    const handleValueChange = React36.useCallback(
+    const handleValueChange = React37.useCallback(
       (newValue) => {
         if (!isControlled) setInternalValue(newValue);
         onValueChange == null ? void 0 : onValueChange(newValue);
       },
       [isControlled, onValueChange]
     );
-    const [focusedValue, setFocusedValue] = React36.useState(value);
-    React36.useEffect(() => {
+    const [focusedValue, setFocusedValue] = React37.useState(value);
+    React37.useEffect(() => {
       setFocusedValue(value);
     }, [value]);
-    const [tabValues, setTabValues] = React36.useState([]);
-    const registerTab = React36.useCallback((tabValue) => {
+    const [tabValues, setTabValues] = React37.useState([]);
+    const registerTab = React37.useCallback((tabValue) => {
       setTabValues((prev) => {
         if (prev.includes(tabValue)) return prev;
         return [...prev, tabValue];
       });
     }, []);
-    const unregisterTab = React36.useCallback((tabValue) => {
+    const unregisterTab = React37.useCallback((tabValue) => {
       setTabValues((prev) => prev.filter((v) => v !== tabValue));
     }, []);
-    const hasAutoSelected = React36.useRef(false);
-    const [disabledValues, setDisabledValues] = React36.useState(
+    const hasAutoSelected = React37.useRef(false);
+    const [disabledValues, setDisabledValues] = React37.useState(
       /* @__PURE__ */ new Set()
     );
-    const markTabDisabled = React36.useCallback(
+    const markTabDisabled = React37.useCallback(
       (tabValue, disabled) => {
         setDisabledValues((prev) => {
           const next = new Set(prev);
@@ -5716,7 +7929,7 @@ var TabsComponent = React36.forwardRef(
       },
       []
     );
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       if (isControlled || hasAutoSelected.current || tabValues.length === 0) {
         return;
       }
@@ -5731,9 +7944,9 @@ var TabsComponent = React36.forwardRef(
         setFocusedValue(firstEnabled);
       }
     }, [tabValues, disabledValues, isControlled, value]);
-    const id = React36.useId();
+    const id = React37.useId();
     const layoutGroupId = `tabs-${id}`;
-    const contextValue = React36.useMemo(
+    const contextValue = React37.useMemo(
       () => ({
         value,
         onValueChange: handleValueChange,
@@ -5764,12 +7977,12 @@ var TabsComponent = React36.forwardRef(
   }
 );
 TabsComponent.displayName = "Tabs";
-var Tabs = React36.memo(TabsComponent);
-var TabsListContext = React36.createContext(
+var Tabs = React37.memo(TabsComponent);
+var TabsListContext = React37.createContext(
   null
 );
 function useTabsListContext() {
-  const ctx = React36.useContext(TabsListContext);
+  const ctx = React37.useContext(TabsListContext);
   return ctx != null ? ctx : { variant: "primary", scrollable: false };
 }
 
@@ -5853,7 +8066,7 @@ var TABS_CONTENT_TRANSITION = {
   ease: "easeInOut"
 };
 var INDICATOR_MIN_WIDTH = 24;
-var TabComponent = React36.forwardRef(
+var TabComponent = React37.forwardRef(
   ({
     value,
     icon,
@@ -5883,9 +8096,9 @@ var TabComponent = React36.forwardRef(
     const isFocused = focusedValue === value;
     const hasIcon = icon != null;
     const isStackedIcon = hasIcon && !inlineIcon;
-    const buttonRef = React36.useRef(null);
-    const isFirstMount = React36.useRef(true);
-    const mergedRef = React36.useCallback(
+    const buttonRef = React37.useRef(null);
+    const isFirstMount = React37.useRef(true);
+    const mergedRef = React37.useCallback(
       (node) => {
         buttonRef.current = node;
         if (typeof ref === "function") ref(node);
@@ -5893,15 +8106,15 @@ var TabComponent = React36.forwardRef(
       },
       [ref]
     );
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       registerTab(value);
       return () => unregisterTab(value);
     }, [value, registerTab, unregisterTab]);
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       markTabDisabled(value, disabled);
       return () => markTabDisabled(value, false);
     }, [value, disabled, markTabDisabled]);
-    const handleKeyDown = React36.useCallback(
+    const handleKeyDown = React37.useCallback(
       (e) => {
         const isRtl = buttonRef.current ? getComputedStyle(buttonRef.current).direction === "rtl" : false;
         const enabledValues = tabValues.filter((v) => !disabledValues.has(v));
@@ -5955,7 +8168,7 @@ var TabComponent = React36.forwardRef(
         autoActivate
       ]
     );
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       if (isFirstMount.current) {
         isFirstMount.current = false;
         return;
@@ -5964,7 +8177,7 @@ var TabComponent = React36.forwardRef(
         buttonRef.current.focus({ preventScroll: true });
       }
     }, [isFocused]);
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       if (!isActive || !scrollable || !buttonRef.current) return;
       const btn = buttonRef.current;
       let container = btn.parentElement;
@@ -6101,8 +8314,8 @@ var TabComponent = React36.forwardRef(
   }
 );
 TabComponent.displayName = "Tab";
-var Tab = React36.memo(TabComponent);
-var TabsContentComponent = React36.forwardRef(
+var Tab = React37.memo(TabComponent);
+var TabsContentComponent = React37.forwardRef(
   ({ value, className, children }, ref) => {
     var _a;
     const { value: selectedValue, layoutGroupId } = useTabsContext();
@@ -6136,8 +8349,8 @@ var TabsContentComponent = React36.forwardRef(
   }
 );
 TabsContentComponent.displayName = "TabsContent";
-var TabsContent = React36.memo(TabsContentComponent);
-var TabsListComponent = React36.forwardRef(
+var TabsContent = React37.memo(TabsContentComponent);
+var TabsListComponent = React37.forwardRef(
   ({
     variant,
     scrollable = false,
@@ -6148,12 +8361,12 @@ var TabsListComponent = React36.forwardRef(
   }, ref) => {
     const { layoutGroupId, value, setFocusedValue } = useTabsContext();
     const listLayoutId = `${layoutGroupId}-list`;
-    const listContextValue = React36.useMemo(
+    const listContextValue = React37.useMemo(
       () => ({ variant, scrollable }),
       [variant, scrollable]
     );
     const bgColor = backgroundColor != null ? backgroundColor : "var(--md-sys-color-surface)";
-    const handleBlur = React36.useCallback(
+    const handleBlur = React37.useCallback(
       (e) => {
         const listEl = e.currentTarget;
         if (listEl.contains(e.relatedTarget)) return;
@@ -6202,7 +8415,7 @@ var TabsListComponent = React36.forwardRef(
   }
 );
 TabsListComponent.displayName = "TabsList";
-var TabsList = React36.memo(TabsListComponent);
+var TabsList = React37.memo(TabsListComponent);
 
 // src/ui/toolbar/toolbar-colors.ts
 var standardFloatingToolbarColors = {
@@ -6258,13 +8471,13 @@ function getToolbarColors(variant = "standard", customColors) {
       return standardFloatingToolbarColors;
   }
 }
-var ToolbarContext = React36.createContext(
+var ToolbarContext = React37.createContext(
   null
 );
 function useToolbarContext() {
-  return React36.useContext(ToolbarContext);
+  return React37.useContext(ToolbarContext);
 }
-var BottomDockedToolbar = React36.forwardRef(
+var BottomDockedToolbar = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       variant = "standard",
@@ -6297,8 +8510,8 @@ var BottomDockedToolbar = React36.forwardRef(
     const { scrollY } = useScroll(
       scrollContainerRef ? { container: scrollContainerRef } : void 0
     );
-    const [isHidden, setIsHidden] = React36.useState(false);
-    const lastScrollY = React36.useRef(0);
+    const [isHidden, setIsHidden] = React37.useState(false);
+    const lastScrollY = React37.useRef(0);
     useMotionValueEvent(scrollY, "change", (latest) => {
       if (!hideOnScroll) return;
       const diff = latest - lastScrollY.current;
@@ -6408,6 +8621,10 @@ var ToolbarToggleButtonTokens = {
   PaddingX: 16,
   Gap: 8
 };
+var ToolbarToggleButtonRadiusTokens = {
+  pillRadius: 24,
+  pressedRadius: 12
+};
 var ALIGNMENT_CLASS = {
   start: "justify-start",
   center: "justify-center",
@@ -6453,15 +8670,15 @@ function buildSlotVariants(xHidden, yHidden, isHorizontal) {
   };
 }
 function applyItemClassName(nodes, itemClassName) {
-  return React36.Children.map(nodes, (child) => {
-    if (!React36.isValidElement(child)) return child;
+  return React37.Children.map(nodes, (child) => {
+    if (!React37.isValidElement(child)) return child;
     const element = child;
-    return React36.cloneElement(element, {
+    return React37.cloneElement(element, {
       className: cn(element.props.className, itemClassName)
     });
   });
 }
-var FloatingToolbarBase = React36.forwardRef(
+var FloatingToolbarBase = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       expanded,
@@ -6633,11 +8850,11 @@ var FloatingToolbarBase = React36.forwardRef(
   }
 );
 FloatingToolbarBase.displayName = "FloatingToolbarBase";
-var HorizontalFloatingToolbar = React36.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarBase, __spreadValues({ ref, orientation: "horizontal" }, props)));
+var HorizontalFloatingToolbar = React37.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarBase, __spreadValues({ ref, orientation: "horizontal" }, props)));
 HorizontalFloatingToolbar.displayName = "HorizontalFloatingToolbar";
-var VerticalFloatingToolbar = React36.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarBase, __spreadValues({ ref, orientation: "vertical" }, props)));
+var VerticalFloatingToolbar = React37.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarBase, __spreadValues({ ref, orientation: "vertical" }, props)));
 VerticalFloatingToolbar.displayName = "VerticalFloatingToolbar";
-var FloatingToolbarWithFabBase = React36.forwardRef(
+var FloatingToolbarWithFabBase = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       expanded,
@@ -6765,9 +8982,9 @@ var FloatingToolbarWithFabBase = React36.forwardRef(
   }
 );
 FloatingToolbarWithFabBase.displayName = "FloatingToolbarWithFabBase";
-var HorizontalFloatingToolbarWithFab = React36.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarWithFabBase, __spreadValues({ ref, orientation: "horizontal" }, props)));
+var HorizontalFloatingToolbarWithFab = React37.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarWithFabBase, __spreadValues({ ref, orientation: "horizontal" }, props)));
 HorizontalFloatingToolbarWithFab.displayName = "HorizontalFloatingToolbarWithFab";
-var VerticalFloatingToolbarWithFab = React36.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarWithFabBase, __spreadValues({ ref, orientation: "vertical" }, props)));
+var VerticalFloatingToolbarWithFab = React37.forwardRef((props, ref) => /* @__PURE__ */ jsx(FloatingToolbarWithFabBase, __spreadValues({ ref, orientation: "vertical" }, props)));
 VerticalFloatingToolbarWithFab.displayName = "VerticalFloatingToolbarWithFab";
 var ToolbarDivider = ({
   orientation: propsOrientation,
@@ -6803,7 +9020,7 @@ var VARIANT_TO_COLOR_STYLE = {
   tonal: "tonal",
   filled: "filled"
 };
-var ToolbarIconButton = React36.forwardRef(
+var ToolbarIconButton = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       emphasis = "standard",
@@ -6924,6 +9141,34 @@ function useFloatingToolbarScrollBehavior(options = {}) {
     exitDirection
   };
 }
+var BUTTON_RADIUS_SPRING = FAST_EFFECTS_SPRING;
+({
+  xs: {
+    // 1dp
+    squareShapeRadius: cornerRadius.medium,
+    // 12dp
+    pressedShapeRadius: cornerRadius.small},
+  sm: {
+    // 1dp
+    squareShapeRadius: cornerRadius.medium,
+    // 12dp
+    pressedShapeRadius: cornerRadius.small},
+  md: {
+    // 1dp
+    squareShapeRadius: cornerRadius.large,
+    // 16dp
+    pressedShapeRadius: cornerRadius.medium},
+  lg: {
+    // 2dp
+    squareShapeRadius: cornerRadius.extraLarge,
+    // 28dp
+    pressedShapeRadius: cornerRadius.large},
+  xl: {
+    // 3dp
+    squareShapeRadius: cornerRadius.extraLarge,
+    // 28dp
+    pressedShapeRadius: cornerRadius.large}
+});
 var MOTION_PROP_KEYS = [
   "animate",
   "exit",
@@ -6947,36 +9192,41 @@ var MOTION_PROP_KEYS = [
   "layoutId",
   "onLayoutAnimationComplete"
 ];
-var ToolbarToggleButton = React36.forwardRef(
+var ToolbarToggleButton = React37.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       emphasis = "standard",
       selected = false,
       icon,
       children,
-      pressScale = 0.95,
-      pressBounceOffset = 6,
+      pressExpand = true,
+      pressExpandRatio = 0.06,
       ripple = true,
       asChild = false,
       className,
       type = "button",
       disabled,
-      onPointerDown: onPointerDownProp
+      onPointerDown: onPointerDownProp,
+      onPointerUp: onPointerUpProp,
+      onPointerLeave: onPointerLeaveProp
     } = _b, props = __objRest(_b, [
       "emphasis",
       "selected",
       "icon",
       "children",
-      "pressScale",
-      "pressBounceOffset",
+      "pressExpand",
+      "pressExpandRatio",
       "ripple",
       "asChild",
       "className",
       "type",
       "disabled",
-      "onPointerDown"
+      "onPointerDown",
+      "onPointerUp",
+      "onPointerLeave"
     ]);
     const context = useToolbarContext();
+    const [isPressed, setIsPressed] = React37.useState(false);
     const {
       ripples,
       onPointerDown: handleRipplePointerDown,
@@ -6984,8 +9234,9 @@ var ToolbarToggleButton = React36.forwardRef(
     } = useRippleState({
       disabled: Boolean(disabled) || !ripple
     });
-    const handlePointerDown = React36.useCallback(
+    const handlePointerDown = React37.useCallback(
       (e) => {
+        setIsPressed(true);
         if (!disabled && ripple) {
           handleRipplePointerDown(e);
         }
@@ -6993,7 +9244,21 @@ var ToolbarToggleButton = React36.forwardRef(
       },
       [disabled, ripple, handleRipplePointerDown, onPointerDownProp]
     );
-    const baseClasses = "relative overflow-hidden inline-flex items-center justify-center min-w-[95px] h-[48px] px-4 rounded-full text-sm font-medium transition-colors select-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/40 disabled:pointer-events-none disabled:opacity-38";
+    const handlePointerUp = React37.useCallback(
+      (e) => {
+        setIsPressed(false);
+        onPointerUpProp == null ? void 0 : onPointerUpProp(e);
+      },
+      [onPointerUpProp]
+    );
+    const handlePointerLeave = React37.useCallback(
+      (e) => {
+        setIsPressed(false);
+        onPointerLeaveProp == null ? void 0 : onPointerLeaveProp(e);
+      },
+      [onPointerLeaveProp]
+    );
+    const baseClasses = "relative overflow-hidden inline-flex items-center justify-center min-w-[95px] h-[48px] px-4 text-sm font-medium select-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/40 disabled:pointer-events-none disabled:opacity-38";
     const variantClasses = {
       standard: selected ? "bg-current/16 text-current hover:bg-current/20 active:bg-current/24" : "bg-transparent text-current hover:bg-current/8 active:bg-current/12",
       tonal: selected ? "bg-m3-secondary-container text-m3-on-secondary-container hover:shadow-sm" : "bg-m3-surface-container-high text-m3-on-surface hover:bg-m3-surface-container-highest",
@@ -7005,27 +9270,17 @@ var ToolbarToggleButton = React36.forwardRef(
       context == null ? void 0 : context.itemClassName,
       className
     );
-    const whileTapConfig = React36.useMemo(
+    const animateConfig = React37.useMemo(
       () => ({
-        scale: pressScale,
-        x: pressBounceOffset ? [
-          0,
-          -pressBounceOffset,
-          pressBounceOffset,
-          -pressBounceOffset / 2,
-          pressBounceOffset / 2,
-          0
-        ] : 0
+        scaleX: pressExpand && isPressed ? 1 + pressExpandRatio : 1,
+        borderRadius: isPressed ? ToolbarToggleButtonRadiusTokens.pressedRadius : ToolbarToggleButtonRadiusTokens.pillRadius
       }),
-      [pressScale, pressBounceOffset]
+      [pressExpand, pressExpandRatio, isPressed]
     );
-    const transitionConfig = React36.useMemo(
-      () => __spreadProps(__spreadValues({}, TOOLBAR_SPRING_TRANSITION), {
-        scale: TOOLBAR_SPRING_TRANSITION,
-        x: {
-          duration: 0.35,
-          ease: "easeInOut"
-        }
+    const transitionConfig = React37.useMemo(
+      () => ({
+        scaleX: FAST_SPATIAL_SPRING,
+        borderRadius: BUTTON_RADIUS_SPRING
       }),
       []
     );
@@ -7044,7 +9299,7 @@ var ToolbarToggleButton = React36.forwardRef(
       children && (typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ jsx("span", { children }) : children)
     ] });
     if (asChild) {
-      const child = React36.Children.only(children);
+      const child = React37.Children.only(children);
       const childContent = child.props.children;
       const innerChildContent = /* @__PURE__ */ jsxs(Fragment, { children: [
         ripple && /* @__PURE__ */ jsx(
@@ -7079,9 +9334,11 @@ var ToolbarToggleButton = React36.forwardRef(
           ref,
           "aria-pressed": selected,
           className: combinedClassName,
-          onPointerDown: handlePointerDown
+          onPointerDown: handlePointerDown,
+          onPointerUp: handlePointerUp,
+          onPointerLeave: handlePointerLeave
         }, strippedProps), {
-          children: React36.cloneElement(child, { children: innerChildContent })
+          children: React37.cloneElement(child, { children: innerChildContent })
         })
       ) });
     }
@@ -7092,9 +9349,13 @@ var ToolbarToggleButton = React36.forwardRef(
         type,
         "aria-pressed": selected,
         disabled,
-        whileTap: whileTapConfig,
+        animate: animateConfig,
         transition: transitionConfig,
+        initial: false,
+        style: { transformOrigin: "center" },
         onPointerDown: handlePointerDown,
+        onPointerUp: handlePointerUp,
+        onPointerLeave: handlePointerLeave,
         className: combinedClassName
       }, props), {
         children: [
@@ -7114,6 +9375,6 @@ var ToolbarToggleButton = React36.forwardRef(
 );
 ToolbarToggleButton.displayName = "ToolbarToggleButton";
 
-export { APP_BAR_BOTTOM_SPRING, APP_BAR_COLORS, APP_BAR_COLOR_TRANSITION, APP_BAR_ENTER_ALWAYS_SPRING, APP_BAR_TITLE_FADE, AppBarColumn, AppBarOverflowIndicator, AppBarRow, AppBarTokens, BottomAppBar, BottomDockedToolbar, CHECK_ICON_VARIANTS, ContextMenu, ContextMenuContent, ContextMenuTrigger, DIVIDER_COLOR, DIVIDER_PADDING, DockedToolbar, FAST_EFFECTS_TRANSITION, FAST_SPATIAL_SPRING, GROUP_SHAPES, HorizontalFloatingToolbar, HorizontalFloatingToolbarWithFab, ITEM_SHAPE_CLASSES, LargeFlexibleAppBar, MENU_CHECK_ICON_SIZE, MENU_CONTAINER_VARIANTS, MENU_GROUP_GAP, MENU_ICON_SIZE, MENU_ITEM_MIN_HEIGHT, MENU_MAX_WIDTH, MENU_MIN_WIDTH, MediumFlexibleAppBar, Menu, MenuContent, MenuDivider, MenuGroup, MenuItem, MenuProvider, MenuTrigger, NavigationBar, NavigationBarComponent, NavigationBarItem, NavigationRail, NavigationRailItem, SEARCH_BAR_EXIT_SPRING, SEARCH_BAR_EXPAND_SPRING, SEARCH_COLORS, SEARCH_DOCKED_REVEAL_SPRING, SEARCH_FULLSCREEN_SPRING, SEARCH_TYPOGRAPHY, SEARCH_VIEW_SPRING, STANDARD_COLORS, SUBMENU_CONTAINER_VARIANTS, Search, SearchAppBar, SearchBar, SearchTokens, SearchView, SearchViewContainer, SearchViewDocked, SearchViewFullScreen, SmallAppBar, SubMenu, Tab, Tabs, TabsColors, TabsContent, TabsList, TabsTokens, ToolbarDivider, ToolbarDividerTokens, ToolbarIconButton, ToolbarIconButtonTokens, ToolbarToggleButton, ToolbarToggleButtonTokens, VIBRANT_COLORS, VerticalFloatingToolbar, VerticalFloatingToolbarWithFab, VerticalMenu, VerticalMenuContent, VerticalMenuDivider, VerticalMenuGroup, appBarTypography, getToolbarColors, standardFloatingToolbarColors, surfaceContainerHighFloatingToolbarColors, surfaceContainerHighestFloatingToolbarColors, tertiaryContainerFloatingToolbarColors, useAppBarScroll, useFloatingToolbarScrollBehavior, useMenuContext, useSearch, useSearchKeyboard, vibrantFloatingToolbarColors, xrFloatingToolbarColors };
+export { APP_BAR_BOTTOM_SPRING, APP_BAR_COLORS, APP_BAR_COLOR_TRANSITION, APP_BAR_ENTER_ALWAYS_SPRING, APP_BAR_TITLE_FADE, AppBarColumn, AppBarOverflowIndicator, AppBarRow, AppBarTokens, BottomAppBar, BottomDockedToolbar, CHECK_ICON_VARIANTS, ContextMenu, ContextMenuContent, ContextMenuTrigger, DIVIDER_COLOR, DIVIDER_PADDING, DockedToolbar, FAST_EFFECTS_TRANSITION, FAST_SPATIAL_SPRING, GROUP_SHAPES, HorizontalFloatingToolbar, HorizontalFloatingToolbarWithFab, ITEM_SHAPE_CLASSES, LargeFlexibleAppBar, MENU_CHECK_ICON_SIZE, MENU_CONTAINER_VARIANTS, MENU_GROUP_GAP, MENU_ICON_SIZE, MENU_ITEM_MIN_HEIGHT, MENU_MAX_WIDTH, MENU_MIN_WIDTH, MediumFlexibleAppBar, Menu, MenuContent, MenuDivider, MenuGroup, MenuItem, MenuProvider, MenuTrigger, NavigationBar, NavigationBarComponent, NavigationBarItem, NavigationRail, NavigationRailItem, SEARCH_BAR_EXIT_SPRING, SEARCH_BAR_EXPAND_SPRING, SEARCH_COLORS, SEARCH_DOCKED_REVEAL_SPRING, SEARCH_FULLSCREEN_SPRING, SEARCH_TYPOGRAPHY, SEARCH_VIEW_SPRING, STANDARD_COLORS, SUBMENU_CONTAINER_VARIANTS, Search, SearchAppBar, SearchBar, SearchTokens, SearchView, SearchViewContainer, SearchViewDocked, SearchViewFullScreen, SmallAppBar, SubMenu, Tab, Tabs, TabsColors, TabsContent, TabsList, TabsTokens, ToolbarDivider, ToolbarDividerTokens, ToolbarIconButton, ToolbarIconButtonTokens, ToolbarToggleButton, ToolbarToggleButtonTokens, VIBRANT_COLORS, VerticalFloatingToolbar, VerticalFloatingToolbarWithFab, VerticalMenu, VerticalMenuContent, VerticalMenuDivider, VerticalMenuGroup, appBarTypography, getNavigationShapeStyle, getToolbarColors, isSquareShape, standardFloatingToolbarColors, surfaceContainerHighFloatingToolbarColors, surfaceContainerHighestFloatingToolbarColors, tertiaryContainerFloatingToolbarColors, useAppBarScroll, useFloatingToolbarScrollBehavior, useMenuContext, useSearch, useSearchKeyboard, vibrantFloatingToolbarColors, xrFloatingToolbarColors };
 //# sourceMappingURL=navigation.mjs.map
 //# sourceMappingURL=navigation.mjs.map