highcharts 13.0.0 → 13.0.2

package/standalone-navigator.src.js

@@ -1,6 +1,6 @@
 // SPDX-License-Identifier: LicenseRef-Highcharts
 /**
- * @license Highcharts JS v13.0.0 (2026-06-11)
+ * @license Highcharts JS v13.0.2 (2026-08-27)
  * @module highcharts/standalone-navigator
  *
  * Standalone Navigator for Highcharts.
@@ -23,16 +23,31 @@
 return /******/ (() => { // webpackBootstrap
 /******/ 	"use strict";
 /******/ 	// The require scope
-/******/ 	var __webpack_require__ = {};
+/******/ 	const __webpack_require__ = {};
 /******/ 	
 /************************************************************************/
 /******/ 	/* webpack/runtime/define property getters */
 /******/ 	(() => {
-/******/ 		// define getter functions for harmony exports
+/******/ 		// define getter/value functions for harmony exports
 /******/ 		__webpack_require__.d = (exports, definition) => {
-/******/ 			for(var key in definition) {
-/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
-/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 			if(Array.isArray(definition)) {
+/******/ 				var i = 0;
+/******/ 				while(i < definition.length) {
+/******/ 					var key = definition[i++];
+/******/ 					var binding = definition[i++];
+/******/ 					if(!__webpack_require__.o(exports, key)) {
+/******/ 						if(binding === 0) {
+/******/ 							Object.defineProperty(exports, key, { enumerable: true, value: definition[i++] });
+/******/ 						} else {
+/******/ 							Object.defineProperty(exports, key, { enumerable: true, get: binding });
+/******/ 						}
+/******/ 					} else if(binding === 0) { i++; }
+/******/ 				}
+/******/ 			} else {
+/******/ 				for(var key in definition) {
+/******/ 					if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 						Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 					}
 /******/ 				}
 /******/ 			}
 /******/ 		};
@@ -44,7 +59,7 @@ return /******/ (() => { // webpackBootstrap
 /******/ 	})();
 /******/ 	
 /************************************************************************/
-var __webpack_exports__ = {};
+let __webpack_exports__ = {};
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, {
@@ -80,7 +95,7 @@ var Globals;
      *  Constants
      *
      * */
-    Globals.SVG_NS = 'http://www.w3.org/2000/svg', Globals.product = 'Highcharts', Globals.version = '13.0.0', Globals.win = (typeof window !== 'undefined' ?
+    Globals.SVG_NS = 'http://www.w3.org/2000/svg', Globals.product = 'Highcharts', Globals.version = '13.0.2', Globals.win = (typeof window !== 'undefined' ?
         window :
         {}), // eslint-disable-line node/no-unsupported-features/es-builtins
     Globals.doc = Globals.win.document, Globals.svg = !!Globals.doc?.createElementNS?.(Globals.SVG_NS, 'svg')?.createSVGRect, Globals.pageLang = Globals.doc?.documentElement?.closest('[lang]')?.lang, Globals.userAgent = Globals.win.navigator?.userAgent || '', Globals.isChrome = Globals.win.chrome, Globals.isFirefox = Globals.userAgent.indexOf('Firefox') !== -1, Globals.isMS = /(edge|msie|trident)/i.test(Globals.userAgent) && !Globals.win.opera, Globals.isSafari = !Globals.isChrome && Globals.userAgent.indexOf('Safari') !== -1, Globals.isTouchDevice = /(Mobile|Android|Windows Phone)/.test(Globals.userAgent), Globals.isWebKit = Globals.userAgent.indexOf('AppleWebKit') !== -1, Globals.deg2rad = Math.PI * 2 / 360, Globals.marginNames = [
@@ -407,6 +422,29 @@ const ChartDefaults = {
      * @context   Highcharts.Chart
      * @apioption chart.events.load
      */
+    /**
+     * Fires while the chart is panned by mouse drag. Panning must be
+     * enabled through [chart.panning](#chart.panning). One parameter,
+     * `event`, is passed to the function, containing common event
+     * information as well as `event.originalEvent`, the underlying pointer
+     * event. Note that the event fires for every mouse move during the
+     * drag, not once per gesture.
+     *
+     * Calling `event.preventDefault()` or returning false prevents the
+     * default panning of the axes. In Highcharts Maps, and on ordinal axes
+     * in Highcharts Stock, the panning is applied outside the default
+     * action and is not prevented.
+     *
+     * Panning by touch does not fire this event, unless
+     * [chart.zooming.singleTouch](#chart.zooming.singleTouch) is enabled and
+     * no zoom type is set. Single-finger drags are then handled as mouse
+     * drags and fire this event.
+     *
+     * @type      {Highcharts.ChartPanCallbackFunction}
+     * @since     7.0.2
+     * @context   Highcharts.Chart
+     * @apioption chart.events.pan
+     */
     /**
      * Fires when the chart is redrawn, either after a call to
      * `chart.redraw()` or after an axis, series or point is modified with
@@ -995,7 +1033,7 @@ const ChartDefaults = {
      * @type      {Highcharts.ColorType}
      * @since     2.1.7
      */
-    selectionMarkerFill: 'color-mix(var(--highcharts-highlight-color-80) 25%, transparent)', // eslint-disable-line max-len
+    selectionMarkerFill: 'color-mix(in srgb, var(--highcharts-highlight-color-80) 25%, transparent)', // eslint-disable-line max-len
     /**
      * Whether to apply a drop shadow to the global series group. This causes
      * all the series to have the same shadow. Contrary to the `series.shadow`
@@ -2421,7 +2459,7 @@ function getStyle(el, prop, toInt) {
     const css = win.getComputedStyle(el, void 0); // eslint-disable-line no-undefined
     if (css) {
         style = css.getPropertyValue(prop);
-        if (pick(toInt, prop !== 'opacity')) {
+        if (toInt ?? prop !== 'opacity') {
             style = pInt(style);
         }
     }
@@ -2671,7 +2709,7 @@ function merge(extendOrSource, ...sources) {
 function normalizeTickInterval(interval, multiples, magnitude, allowDecimals, hasTickAmount) {
     let i, retInterval = interval;
     // Round to a tenfold of 1, 2, 2.5 or 5
-    magnitude = pick(magnitude, getMagnitude(interval));
+    magnitude = (magnitude ?? getMagnitude(interval));
     const normalized = interval / magnitude;
     // Multiples for a linear scale
     if (!multiples) {
@@ -2784,20 +2822,22 @@ function pad(number, length, padder) {
             .replace('-', '')
             .length).join(padder || '0') + number;
 }
-/* eslint-disable jsdoc/check-param-names */
+/* eslint-disable valid-jsdoc */
 /**
  * Return the first value that is not null or undefined.
  *
+ * @deprecated 13.0.2
+ * Use nullish coalescing (`??`) or explicit fallback logic instead.
+ *
  * @function Highcharts.pick<T>
  *
- * @param {...Array<T|null|undefined>} items
+ * @param {...(T|null|undefined)} args
  *        Variable number of arguments to inspect.
  *
  * @return {T}
  *         The value of the first argument that is not null or undefined.
  */
-function pick() {
-    const args = arguments;
+function pick(...args) {
     const length = args.length;
     for (let i = 0; i < length; i++) {
         const arg = args[i];
@@ -2806,7 +2846,7 @@ function pick() {
         }
     }
 }
-/* eslint-enable jsdoc/check-param-names */
+/* eslint-enable valid-jsdoc */
 /**
  * Shortcut for parseInt
  *
@@ -3189,7 +3229,8 @@ function insertItem(item, collection) {
         !collection[i] ||
             // Handle index option, the element to insert has lower index
             (isNumber(indexOption) &&
-                indexOption < pick(collection[i].options.index, collection[i]._i)) ||
+                indexOption < (collection[i].options.index ??
+                    collection[i]._i)) ||
             // Insert the new item before other internal items
             // (navigator)
             collection[i].options.isInternal) {
@@ -3275,7 +3316,7 @@ const uniqueKey = (function () {
  * State of the serial mode.
  */
 function useSerialIds(mode) {
-    return (serialMode = pick(mode, serialMode));
+    return (serialMode = (mode ?? serialMode));
 }
 /* *
  *
@@ -3741,6 +3782,10 @@ const isDateTimeFormatOptions = (obj) => obj.main === void 0;
  *
  * @param {Highcharts.TimeOptions} [options] Time options as defined in
  * [chart.options.time](/highcharts/time).
+ *
+ * @param {Highcharts.LangOptions} [lang]
+ * Language options. When `options.locale` is not set, `lang.locale` is used as
+ * the locale fallback for locale-aware date formatting.
  */
 class TimeBase {
     /* *
@@ -3759,8 +3804,8 @@ class TimeBase {
         };
         this.variableTimezone = false;
         this.Date = TimeBase_win.Date;
-        this.update(options);
         this.lang = lang;
+        this.update(options);
     }
     /* *
      *
@@ -3872,7 +3917,9 @@ class TimeBase {
     /**
      * Shorthand to get a cached `Intl.DateTimeFormat` instance.
      */
-    dateTimeFormat(options, timestamp, locale = this.options.locale || pageLang) {
+    dateTimeFormat(options, timestamp, locale = (this.options.locale ||
+        this.lang?.locale ||
+        pageLang)) {
         const cacheKey = JSON.stringify(options) + locale;
         if (isString(options)) {
             options = this.str2dtf(options);
@@ -3958,17 +4005,16 @@ class TimeBase {
         // eslint-disable-next-line new-cap
         let d = this.Date.UTC(year, month, date, hours, minutes || 0, seconds || 0, milliseconds || 0);
         if (this.timezone !== 'UTC') {
-            const offset = this.getTimezoneOffset(d);
+            const offset = this.getTimezoneOffset(d), localHours = (hours - offset / timeUnits.hour + 24) % 24;
             d += offset;
-            // Adjustments close to DST transitions
             if (
-            // Optimize for speed by limiting the number of calls to
-            // `getTimezoneOffset`. According to
+            // Limit the number of calls to `getTimezoneOffset` to months
+            // where DST changes may occur. According to
             // https://en.wikipedia.org/wiki/Daylight_saving_time_by_country,
             // DST change may only occur in these months.
             [2, 3, 8, 9, 10, 11].indexOf(month) !== -1 &&
-                // DST transitions occur only in the night-time
-                (hours < 5 || hours > 20)) {
+                // DST changes only occur at night (#24420)
+                (localHours < 5 || localHours > 20)) {
                 const newOffset = this.getTimezoneOffset(d);
                 if (offset !== newOffset) {
                     d += newOffset - offset;
@@ -6705,6 +6751,9 @@ const defaultOptions = {
          * below the column, but as `followTouchMove` is true, the tooltip will
          * jump from column to column as the user swipes across the plot area.
          *
+         * @sample {highcharts} highcharts/tooltip/followtouchmove/
+         *         Tooltip follows touch move
+         *
          * @type      {boolean}
          * @default   {highcharts} true
          * @default   {highstock} true
@@ -7487,10 +7536,14 @@ const defaultOptions = {
          * @type {Highcharts.CSSObject}
          */
         style: {
-            /** @type {Highcharts.ColorType} */
+            /**
+             * @type {Highcharts.ColorType}
+             */
             color: 'var(--highcharts-neutral-color-80)',
             cursor: 'default',
-            /** @type {number|string} */
+            /**
+             * @type {number|string}
+             */
             fontSize: '0.8em'
         },
         /**
@@ -7806,6 +7859,41 @@ const DefaultOptions = {
  * @param {global.Event} event
  *        The event that occurred.
  */
+/**
+ * Gets fired while the chart is panned by mouse drag. Calling
+ * `event.preventDefault()` or returning `false` prevents the default panning
+ * of the axes.
+ *
+ * @callback Highcharts.ChartPanCallbackFunction
+ *
+ * @param {Highcharts.Chart} this
+ *        The chart on which the event occurred.
+ *
+ * @param {Highcharts.ChartPanEventObject} event
+ *        The event that occurred.
+ */
+/**
+ * Contains common event information. Through the `originalEvent` property you
+ * can access the pointer event that triggered the panning.
+ *
+ * @interface Highcharts.ChartPanEventObject
+ */ /**
+* The pointer event that triggered the panning.
+* @name Highcharts.ChartPanEventObject#originalEvent
+* @type {Highcharts.PointerEventObject}
+*/ /**
+* Prevents the default behavior of the event.
+* @name Highcharts.ChartPanEventObject#preventDefault
+* @type {Function}
+*/ /**
+* The event target.
+* @name Highcharts.ChartPanEventObject#target
+* @type {Highcharts.Chart}
+*/ /**
+* The event type.
+* @name Highcharts.ChartPanEventObject#type
+* @type {"pan"}
+*/
 /**
  * Fires when the chart is redrawn, either after a call to `chart.redraw()` or
  * after an axis, series or point is modified with the `redraw` option set to
@@ -8181,7 +8269,9 @@ Color.None = new Color(''); // Must be last static for init
  */
 /**
  * A valid color type than can be parsed and handled by Highcharts. It can be a
- * color string, a gradient object, or a pattern object.
+ * color string (including CSS expressions), a gradient object, or a pattern
+ * object. Read more about colors in the [Highcharts
+ * documentation](https://www.highcharts.com/docs/chart-design-and-style/colors).
  *
  * @typedef {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject} Highcharts.ColorType
  */
@@ -8413,24 +8503,22 @@ class Fx {
      */
     update() {
         const elem = this.elem, prop = this.prop, // If destroyed, it is null
-        now = this.now, step = this.options.step;
+        now = this.now ?? 1, step = this.options.step;
         // Animation setter defined from outside
         if (this[prop + 'Setter']) {
             this[prop + 'Setter']();
             // Other animations on SVGElement
         }
-        else if (elem.attr) {
+        else if (elem && elem.attr) {
             if (elem.element) {
-                elem.attr(prop, now, null, true);
+                elem.attr(prop, now, void 0, true);
             }
             // HTML styles, raw HTML content like container size
         }
-        else {
-            elem.style[prop] = now + this.unit;
-        }
-        if (step) {
-            step.call(elem, now, this);
+        else if (elem) {
+            elem.style[prop] = now + (this.unit || '');
         }
+        step?.call(elem, now, this);
     }
     /**
      * Run an animation.
@@ -8448,12 +8536,10 @@ class Fx {
      *
      */
     run(from, to, unit) {
-        const self = this, options = self.options, timer = function (gotoEnd) {
-            return timer.stopped ? false : self.step(gotoEnd);
-        }, requestAnimationFrame = Fx_win.requestAnimationFrame ||
+        const { elem, options } = this, { complete, curAnim = {} } = options, timer = (gotoEnd) => (timer.stopped ? false : this.step(gotoEnd)), requestAnimationFrame = Fx_win.requestAnimationFrame ||
             function (step) {
                 setTimeout(step, 13);
-            }, step = function () {
+            }, step = () => {
             for (let i = 0; i < Fx.timers.length; i++) {
                 if (!Fx.timers[i]()) {
                     Fx.timers.splice(i--, 1);
@@ -8463,11 +8549,11 @@ class Fx {
                 requestAnimationFrame(step);
             }
         };
-        if (from === to && !this.elem['forceAnimate:' + this.prop]) {
-            delete options.curAnim[this.prop];
-            if (options.complete &&
-                Object.keys(options.curAnim).length === 0) {
-                options.complete.call(this.elem);
+        if (from === to && !elem['forceAnimate:' + this.prop]) {
+            delete curAnim[this.prop];
+            if (complete &&
+                Object.keys(curAnim).length === 0) {
+                complete.call(elem);
             }
         }
         else { // #7166
@@ -8477,7 +8563,7 @@ class Fx {
             this.unit = unit;
             this.now = this.start;
             this.pos = 0;
-            timer.elem = this.elem;
+            timer.elem = elem;
             timer.prop = this.prop;
             if (timer() && Fx.timers.push(timer) === 1) {
                 requestAnimationFrame(step);
@@ -8498,7 +8584,8 @@ class Fx {
     step(gotoEnd) {
         const t = +new Date(), options = this.options, elem = this.elem, complete = options.complete, duration = options.duration, curAnim = options.curAnim;
         let ret, done;
-        if (!!elem.attr && !elem.element) { // #2616, element is destroyed
+        // #2616, element is destroyed
+        if (elem?.attr && !elem.element) {
             ret = false;
         }
         else if (gotoEnd || t >= duration + this.startTime) {
@@ -8727,7 +8814,8 @@ Fx.timers = [];
  * so it should be moved to the SVGRenderer.
  */
 function setAnimation(animation, chart) {
-    chart.renderer.globalAnimation = pick(animation, chart.options.chart.animation, true);
+    chart.renderer.globalAnimation =
+        animation ?? chart.options.chart.animation ?? true;
 }
 /**
  * Get the animation in object form, where a disabled animation is always
@@ -8788,6 +8876,11 @@ function getDeferredAnimation(chart, animation, series) {
 /**
  * The global animate method, which uses Fx to create individual animators.
  *
+ * @sample highcharts/members/renderer-basic
+ *         SVG elements with animation
+ * @sample highcharts/members/animate
+ *         Animation without an owner element
+ *
  * @function Highcharts.animate
  *
  * @param {Highcharts.HTMLDOMElement|Highcharts.SVGElement} el
@@ -8803,14 +8896,12 @@ function getDeferredAnimation(chart, animation, series) {
  *
  * @return {void}
  */
-function animate(el, params, opt) {
-    let start, unit = '', end, fx, args;
+function animate(el, params = { pos: 1 }, opt) {
     if (!isObject(opt)) { // Number or undefined/null
-        args = arguments;
         opt = {
-            duration: args[2],
-            easing: args[3],
-            complete: args[4]
+            duration: arguments[2],
+            easing: arguments[3],
+            complete: arguments[4]
         };
     }
     if (!isNumber(opt.duration)) {
@@ -8820,22 +8911,23 @@ function animate(el, params, opt) {
         opt.easing :
         (Math[opt.easing] || Math.easeInOutSine);
     opt.curAnim = merge(params);
-    objectEach(params, function (val, prop) {
+    objectEach(params, (val, prop) => {
         // Stop current running animation of this property
-        stop(el, prop);
-        fx = new Animation_Fx(el, opt, prop);
-        end = void 0;
-        if (prop === 'd' && isArray(params.d)) {
-            fx.paths = fx.initPath(el, el.pathArray, params.d);
-            fx.toD = params.d;
-            start = 0;
+        if (el) {
+            stop(el, prop);
+        }
+        const fx = new Animation_Fx(el, opt, prop), d = params.d;
+        let start = 0, end = void 0, unit = '';
+        if (prop === 'd' && isArray(d)) {
+            fx.paths = fx.initPath(el, el.pathArray, d);
+            fx.toD = d;
             end = 1;
         }
-        else if (el.attr) {
+        else if (el?.attr) {
             start = el.attr(prop);
         }
-        else {
-            start = parseFloat(getStyle(el, prop)) || 0;
+        else if (el) {
+            start = +(getStyle(el, prop) || 0);
             if (prop !== 'opacity') {
                 unit = 'px';
             }
@@ -8846,7 +8938,10 @@ function animate(el, params, opt) {
         if (typeof end === 'string' && end.match('px')) {
             end = end.replace(/px/g, ''); // #4351
         }
-        fx.run(start, end, unit);
+        // Empty dashstyle animation crashes treemap on hover
+        if (defined(end)) {
+            fx.run(start, end, unit);
+        }
     });
 }
 /**
@@ -8870,28 +8965,11 @@ function animate(el, params, opt) {
  * improvement in all cases where we stop the animation from .attr. Instead of
  * stopping everything, we can just stop the actual attributes we're setting.
  */
-function stop(el, prop) {
-    let i = Animation_Fx.timers.length;
-    // Remove timers related to this element (#4519)
-    while (i--) {
-        if (Animation_Fx.timers[i].elem === el && (!prop || prop === Animation_Fx.timers[i].prop)) {
-            Animation_Fx.timers[i].stopped = true; // #4667
-        }
+const stop = (el, prop) => Animation_Fx.timers.forEach((timer) => {
+    if (timer.elem === el && (!prop || prop === timer.prop)) {
+        timer.stopped = true; // #4667
     }
-}
-const animationExports = {
-    animate,
-    animObject,
-    getDeferredAnimation,
-    setAnimation,
-    stop
-};
-/* *
- *
- *  Default Export
- *
- * */
-/* harmony default export */ const AnimationUtilities = (animationExports);
+});
 /* *
  *
  *  API Options
@@ -9196,7 +9274,9 @@ class AST {
             doc = { body };
         }
         const appendChildNodes = (node, addTo) => {
-            const tagName = node.nodeName.toLowerCase();
+            // Preserve the camelCase of SVG tags via localName (#24702).
+            const tagName = node.localName ||
+                node.nodeName.toLowerCase();
             // Add allowed tags
             const astNode = {
                 tagName
@@ -9310,6 +9390,8 @@ AST.allowedAttributes = [
     'src',
     'startOffset',
     'stdDeviation',
+    'stop-color',
+    'stop-opacity',
     'stroke-linecap',
     'stroke-width',
     'stroke',
@@ -9796,7 +9878,7 @@ function format(str = '', ctx, owner) {
                 replacement = `"${replacement}"`;
             }
         }
-        str = str.replace(match.find, pick(replacement, ''));
+        str = str.replace(match.find, (replacement ?? ''));
     });
     return hasSub ? format(str, ctx, owner) : str;
 }
@@ -9913,9 +9995,7 @@ const Templating = {
  * API Declarations
  * */
 /**
- * @interface Highcharts.Templating
- *
- * The Highcharts.Templating interface provides a structure for defining
+ * The Highcharts.TemplatingObject interface provides a structure for defining
  * helpers. Helpers can be used as conditional blocks or functions within
  * expressions. Highcharts includes several built-in helpers and supports
  * the addition of custom helpers.
@@ -9923,16 +10003,21 @@ const Templating = {
  * @see [More information](
  * https://www.highcharts.com/docs/chart-concepts/templating#helpers)
  *
- * @example
- * // Define a custom helper to return the absolute value of a number
- * Highcharts.Templating.helpers.abs = value => Math.abs(value);
- *
- * // Usage in a format string
- * format: 'Absolute value: {abs point.y}'
- *
- * @name Highcharts.Templating#helpers
- * @type {Record<string, Function>}
- */
+ * @interface Highcharts.TemplatingObject
+ */ /**
+* @example
+* // Define a custom helper to return the absolute value of a number
+* Highcharts.Templating.helpers.abs = value => Math.abs(value);
+*
+* // Usage in a format string
+* format: 'Absolute value: {abs point.y}'
+*
+* @name Highcharts.TemplatingObject#helpers
+* @type {Record<string, Function>}
+*/ /**
+* @name Highcharts.Templating
+* @type {Highcharts.TemplatingObject}
+*/
 (''); // Keeps doclets above in file
 
 ;// ./code/es-modules/Core/Renderer/RendererUtilities.js
@@ -10042,7 +10127,7 @@ var RendererUtilities;
         boxes = boxes.map((box) => ({
             size: box.size,
             targets: [box.target],
-            align: pick(box.align, 0.5)
+            align: (box.align ?? 0.5)
         }));
         while (overlapping) {
             // Initial positions: target centered in box
@@ -10141,7 +10226,6 @@ var RendererUtilities;
  * */
 
 
-const { animate: SVGElement_animate, animObject: SVGElement_animObject, stop: SVGElement_stop } = AnimationUtilities;
 
 
 const { deg2rad, doc: SVGElement_doc, svg, SVG_NS: SVGElement_SVG_NS, win: SVGElement_win, isFirefox } = Core_Globals;
@@ -10201,8 +10285,10 @@ class SVGElement {
      * Property value.
      */
     _defaultGetter(key) {
-        let ret = pick(this[key + 'Value'], // Align getter
-        this[key], this.element ? this.element.getAttribute(key) : null, 0);
+        let ret = (this[key + 'Value'] ??
+            this[key] ??
+            (this.element ? this.element.getAttribute(key) : null) ??
+            0);
         if (/^-?[\d\.]+$/.test(ret)) { // Is numerical
             ret = parseFloat(ret);
         }
@@ -10365,7 +10451,7 @@ class SVGElement {
             }
             alignTo = void 0; // Do not use the box
         }
-        const alignToBox = pick(alignTo, renderer[alignToKey], renderer), 
+        const alignToBox = alignTo ?? renderer[alignToKey] ?? renderer, 
         // Default: left align
         x = (alignToBox.x || 0) + (alignOptions.x || 0) +
             ((alignToBox.width || 0) - (alignOptions.width || 0)) *
@@ -10425,7 +10511,7 @@ class SVGElement {
      * Returns the SVGElement for chaining.
      */
     animate(params, options, complete) {
-        const animOptions = SVGElement_animObject(pick(options, this.renderer.globalAnimation, true)), deferTime = animOptions.defer;
+        const animOptions = animObject((options ?? this.renderer.globalAnimation ?? true)), deferTime = animOptions.defer;
         // When the page is hidden save resources in the background by not
         // running animation at all (#9749).
         if (SVGElement_doc.hidden) {
@@ -10440,7 +10526,7 @@ class SVGElement {
             // If defer option is defined delay the animation #12901
             syncTimeout(() => {
                 if (this.element) {
-                    SVGElement_animate(this, params, animOptions);
+                    animate(this, params, animOptions);
                 }
             }, deferTime);
         }
@@ -10614,7 +10700,7 @@ class SVGElement {
                 // Unless .attr is from the animator update, stop current
                 // running animation of this property
                 if (!continueAnimation) {
-                    SVGElement_stop(this, key);
+                    stop(this, key);
                 }
                 // Special handling of symbol attributes
                 if (this.symbolName &&
@@ -10917,7 +11003,7 @@ class SVGElement {
                 .split(','); // Ending comma
             i = v.length;
             while (i--) {
-                v[i] = '' + (pInt(v[i]) * pick(strokeWidth, NaN));
+                v[i] = '' + (pInt(v[i]) * (strokeWidth ?? NaN));
             }
             value = v.join(',').replace(/NaN/g, 'none'); // #3226
             this.element.setAttribute('stroke-dasharray', value);
@@ -10934,7 +11020,7 @@ class SVGElement {
         // Remove events
         element.onclick = element.onmouseout = element.onmouseover =
             element.onmousemove = element.point = null;
-        SVGElement_stop(wrapper); // Stop running animations
+        stop(wrapper); // Stop running animations
         if (wrapper.clipPath && ownerSVGElement) {
             const clipPath = wrapper.clipPath;
             // Look for existing references to this clipPath and remove them
@@ -11057,7 +11143,7 @@ class SVGElement {
      *         The bounding box with `x`, `y`, `width` and `height` properties.
      */
     getBBox(reload, rot) {
-        const wrapper = this, { element, renderer, styles, textStr } = wrapper, { cache, cacheKeys } = renderer, isSVG = element.namespaceURI === wrapper.SVG_NS, rotation = pick(rot, wrapper.rotation, 0), fontSize = renderer.styledMode ? (element &&
+        const wrapper = this, { element, renderer, styles, textStr } = wrapper, { cache, cacheKeys } = renderer, isSVG = element.namespaceURI === wrapper.SVG_NS, rotation = (rot ?? wrapper.rotation ?? 0), fontSize = renderer.styledMode ? (element &&
             SVGElement.prototype.getStyle.call(element, 'font-size')) : (styles.fontSize), cacheKey = this.getBBoxCacheKey([
             renderer.rootFontSize,
             this.textWidth, // #7874, also useHTML
@@ -11583,7 +11669,7 @@ class SVGElement {
     symbolAttr(hash) {
         const wrapper = this;
         SVGElement.symbolCustomAttribs.forEach(function (key) {
-            wrapper[key] = pick(hash[key], wrapper[key]);
+            wrapper[key] = (hash[key] ?? wrapper[key]);
         });
         wrapper.attr({
             d: wrapper.renderer.symbols[wrapper.symbolName](wrapper.x, wrapper.y, wrapper.width, wrapper.height, wrapper)
@@ -11623,7 +11709,7 @@ class SVGElement {
         }
         // Replace text content and escape markup
         titleNode.textContent = replaceNested(// Scan #[73]
-        pick(value, ''), // #3276, #3895
+        (value ?? ''), // #3276, #3895
         [/<[^>]*>/g, '']).replace(/&lt;/g, '<').replace(/&gt;/g, '>');
     }
     /**
@@ -12401,7 +12487,7 @@ class SVGLabel extends SVG_SVGElement {
         if ((this.textStr && this.bBox.width === 0 && this.bBox.height === 0) || this.rotation) {
             this.updateBoxSize();
         }
-        const { padding, height = 0, translateX = 0, translateY = 0, width = 0 } = this, paddingLeft = pick(this.paddingLeft, padding), rotation = rot ?? (this.rotation || 0);
+        const { padding, height = 0, translateX = 0, translateY = 0, width = 0 } = this, paddingLeft = (this.paddingLeft ?? padding), rotation = rot ?? (this.rotation || 0);
         let bBox = {
             width,
             height,
@@ -12454,7 +12540,7 @@ class SVGLabel extends SVG_SVGElement {
         this.attr({
             // Alignment is available now  (#3295, 0 not rendered if given
             // as a value)
-            text: pick(this.textStr, ''),
+            text: (this.textStr ?? ''),
             x: this.x || 0,
             y: this.y || 0
         });
@@ -12610,8 +12696,8 @@ class SVGLabel extends SVG_SVGElement {
     /** @internal */
     getPaddedWidth() {
         const padding = this.padding;
-        const paddingLeft = pick(this.paddingLeft, padding);
-        const paddingRight = pick(this.paddingRight, padding);
+        const paddingLeft = (this.paddingLeft ?? padding);
+        const paddingRight = (this.paddingRight ?? padding);
         return ((this.widthSetting || this.bBox.width || 0) +
             paddingLeft +
             paddingRight);
@@ -12712,7 +12798,7 @@ function arc(cx, cy, w, h, options) {
     const arc = [];
     if (options) {
         let start = options.start || 0, end = options.end || 0;
-        const rx = pick(options.r, w), ry = pick(options.r, h || w), 
+        const rx = (options.r ?? w), ry = (options.r ?? (h || w)), 
         // Subtract a small number to prevent cos and sin of start and end
         // from becoming equal on 360 arcs (#1561). See "Arc proximity"
         // tests at samples/unit-tests/svgrenderer/symbol/demo.js
@@ -12722,16 +12808,17 @@ function arc(cx, cy, w, h, options) {
             start = Math.PI / 2;
             end = Math.PI * 2.5 - proximity;
         }
-        const innerRadius = options.innerR, open = pick(options.open, fullCircle), cosStart = fullCircle ? 0 : Math.cos(start), sinStart = fullCircle ? 1 : Math.sin(start), cosEnd = fullCircle ? 0 : Math.cos(end), sinEnd = fullCircle ? 1 : Math.sin(end), 
+        const innerRadius = options.innerR, open = (options.open ?? fullCircle), cosStart = fullCircle ? 0 : Math.cos(start), sinStart = fullCircle ? 1 : Math.sin(start), cosEnd = fullCircle ? 0 : Math.cos(end), sinEnd = fullCircle ? 1 : Math.sin(end), 
         // Proximity takes care of rounding errors around PI (#6971)
-        longArc = pick(options.longArc, end - start - Math.PI < proximity ? 0 : 1);
+        longArc = options.longArc ??
+            (end - start - Math.PI < proximity ? 0 : 1);
         let arcSegment = [
             'A', // ArcTo
             rx, // X radius
             ry, // Y radius
             0, // Slanting
             longArc, // Long or short arc
-            pick(options.clockwise, 1), // Clockwise
+            (options.clockwise ?? 1), // Clockwise
             // Use a static pixel offset for full circle (#21701)
             cx + (fullCircle ? 0.001 : rx * cosEnd),
             cy + ry * sinEnd
@@ -13262,7 +13349,7 @@ class TextBuilder {
      * @internal
      */
     buildSVG() {
-        const wrapper = this.svgElement, textNode = wrapper.element, renderer = wrapper.renderer, textStr = pick(wrapper.textStr, '').toString(), hasMarkup = textStr.indexOf('<') !== -1, childNodes = textNode.childNodes, tempParent = !wrapper.added && renderer.box, regexMatchBreaks = /<br.*?>/g, 
+        const wrapper = this.svgElement, textNode = wrapper.element, renderer = wrapper.renderer, textStr = (wrapper.textStr ?? '').toString(), hasMarkup = textStr.indexOf('<') !== -1, childNodes = textNode.childNodes, tempParent = !wrapper.added && renderer.box, regexMatchBreaks = /<br.*?>/g, 
         // The buildText code is quite heavy, so if we're not changing
         // something that affects the text, skip it (#6113).
         textCache = [
@@ -13846,7 +13933,7 @@ class SVGRenderer {
         this.url = this.getReferenceURL();
         // Add description
         const desc = this.createElement('desc').add();
-        desc.element.appendChild(SVGRenderer_doc.createTextNode('Created with Highcharts 13.0.0'));
+        desc.element.appendChild(SVGRenderer_doc.createTextNode('Created with Highcharts 13.0.2'));
         this.defs = this.createElement('defs').add();
         this.allowHTML = allowHTML;
         this.forExport = forExport;
@@ -14632,7 +14719,7 @@ class SVGRenderer {
                         this.attr('height')
                 });
             },
-            duration: pick(animate, true) ? void 0 : 0
+            duration: (animate ?? true) ? void 0 : 0
         });
         renderer.alignElements();
     }
@@ -14790,8 +14877,8 @@ class SVGRenderer {
             // The image width is not always the same as the symbol width. The
             // image may be centered within the symbol, as is the case when
             // image shapes are used as label backgrounds, for example in flags.
-            img.imgwidth = pick(options?.width, symbolSizes[imageSrc]?.width);
-            img.imgheight = pick(options?.height, symbolSizes[imageSrc]?.height);
+            img.imgwidth = (options?.width ?? symbolSizes[imageSrc]?.width);
+            img.imgheight = (options?.height ?? symbolSizes[imageSrc]?.height);
             /**
              * Set the size and position
              */
@@ -15637,7 +15724,11 @@ class HTMLElement extends SVG_SVGElement {
                     .attr({
                     text: str,
                     x: Math.round(x),
-                    y: Math.round(y)
+                    y: Math.round(y),
+                    // The namespace attribute is required for serialization
+                    // (export and side-by-side comparison), otherwise it
+                    // inherits the SVG namespace from foreignObject.
+                    xmlns: 'http://www.w3.org/1999/xhtml'
                 });
             };
         }
@@ -15817,8 +15908,10 @@ class HTMLElement extends SVG_SVGElement {
             foreignObject.attr({
                 x: x + (this.xCorr || 0),
                 y: y + (this.yCorr || 0),
-                // Add 4px to avoid ellipsis, since the body adds 3 px right
-                // margin. We need one more because of rounding.
+                // Add 4px to avoid ellipsis. In v13.0.0 we had a body inside
+                // the foreignObject with a 3px right margin. This was later
+                // removed, but we still need to add a few pixels to avoid
+                // ellipsis.
                 width: element.offsetWidth + 4,
                 // Add 1px to account for subpixel bounding boxes
                 height: element.offsetHeight + 1,
@@ -15838,25 +15931,16 @@ class HTMLElement extends SVG_SVGElement {
         this.cTT = currentTextTransform;
     }
     /**
-     * Add the element to a group wrapper. For HTML elements, a parallel div
-     * will be created for each ancestor SVG `g` element.
+     * Add the element to the foreign object
      *
      * @internal
      */
     add(parentGroup) {
-        const { foreignObject, renderer } = this;
+        const { foreignObject } = this;
         // Foreign object
         foreignObject.add(parentGroup);
-        super.add(
-        // Create a body inside the foreignObject
-        renderer.createElement('body')
-            .attr({ xmlns: 'http://www.w3.org/1999/xhtml' })
-            .css({
-            background: 'transparent',
-            // 3px is to avoid clipping on the right
-            margin: '0 3px 0 0'
-        })
-            .add(foreignObject));
+        // Add this.element to the foreign objct
+        super.add(foreignObject);
         if (this.alignOnAdd) {
             this.updateTransform();
         }
@@ -15891,10 +15975,20 @@ class HTMLElement extends SVG_SVGElement {
         this[key] = value;
         this.doTransform = true;
     }
+    /**
+     * Apply visibility/opacity to the foreignObject; the HTML element
+     * ignores them.
+     * @internal
+     */
+    visibilitySetter(value, key) {
+        this.foreignObject.attr({ [key]: value });
+        this[key] = value;
+    }
 }
 // Some shared setters
 const proto = HTMLElement.prototype;
 proto.ySetter = proto.xSetter;
+proto.opacitySetter = proto.visibilitySetter;
 /* *
  *
  *  Default Export
@@ -16435,6 +16529,7 @@ var AxisDefaults;
          */
         dateTimeLabelFormats: {
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             millisecond: {
@@ -16460,6 +16555,7 @@ var AxisDefaults;
                 range: false
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             second: {
@@ -16485,6 +16581,7 @@ var AxisDefaults;
                 range: false
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             minute: {
@@ -16510,6 +16607,7 @@ var AxisDefaults;
                 range: false
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             hour: {
@@ -16542,6 +16640,7 @@ var AxisDefaults;
                 range: false
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             day: {
@@ -16564,6 +16663,7 @@ var AxisDefaults;
                 boundary: '%[eb]'
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             week: {
@@ -16579,6 +16679,7 @@ var AxisDefaults;
                 main: '%[eb]'
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             month: {
@@ -16601,6 +16702,7 @@ var AxisDefaults;
                 boundary: void 0
             },
             /**
+             * @type {Highcharts.AxisDateTimeLabelFormatsOptionsObject|string}
              * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject
              */
             year: {
@@ -17416,7 +17518,7 @@ var AxisDefaults;
          * @sample {highstock} stock/xaxis/offset/
          *         Y axis offset by 70 px
          *
-         * @type {number}
+         * @type {number|string}
          */
         offset: void 0,
         /**
@@ -19066,7 +19168,9 @@ var AxisDefaults;
              * @product highcharts
              */
             style: {
-                /** @type {Highcharts.ColorType} */
+                /**
+                 * @type {Highcharts.ColorType}
+                 */
                 color: 'var(--highcharts-neutral-color-100)',
                 /**
                  * @type {number|string}
@@ -19253,11 +19357,11 @@ class Tick {
      * @function Highcharts.Tick#addLabel
      */
     addLabel() {
-        const tick = this, axis = tick.axis, options = axis.options, chart = axis.chart, categories = axis.categories, log = axis.logarithmic, names = axis.names, pos = tick.pos, labelOptions = pick(tick.options?.labels, options.labels), tickPositions = axis.tickPositions, isFirst = pos === tickPositions[0], isLast = pos === tickPositions[tickPositions.length - 1], tickPositionInfo = tickPositions.info, boundary = tickPositionInfo?.boundaryTicks[pos], DTLFormats = options.dateTimeLabelFormats;
+        const tick = this, axis = tick.axis, options = axis.options, chart = axis.chart, categories = axis.categories, log = axis.logarithmic, names = axis.names, pos = tick.pos, labelOptions = (tick.options?.labels ?? options.labels), tickPositions = axis.tickPositions, isFirst = pos === tickPositions[0], isLast = pos === tickPositions[tickPositions.length - 1], tickPositionInfo = tickPositions.info, boundary = tickPositionInfo?.boundaryTicks[pos], DTLFormats = options.dateTimeLabelFormats;
         let label = tick.label, dateTimeLabelFormat, dateTimeLabelFormats, i;
         // The context value
         let value = this.parameters.category || (categories ?
-            pick(categories[pos], names[pos], pos) :
+            (categories[pos] ?? names[pos] ?? pos) :
             pos);
         if (log && isNumber(value)) {
             value = correctFloat(log.lin2log(value));
@@ -19504,7 +19608,7 @@ class Tick {
                 labelOptions.y;
         }
         x = x +
-            pick(labelOptions.x, [0, 1, 0, -1][axis.side] * distance) +
+            (labelOptions.x ?? [0, 1, 0, -1][axis.side] * distance) +
             labelOffsetCorrection +
             rotCorr.x -
             (tickmarkOffset && horiz ?
@@ -19559,7 +19663,7 @@ class Tick {
      * @function Highcharts.Tick#handleOverflow
      */
     handleOverflow(xy) {
-        const tick = this, axis = this.axis, labelOptions = axis.options.labels, pxPos = xy.x, chartWidth = axis.chart.chartWidth, spacing = axis.chart.spacing, leftBound = pick(axis.labelLeft, Math.min(axis.pos, spacing[3])), rightBound = pick(axis.labelRight, Math.max(!axis.isRadial ? axis.pos + axis.len : 0, chartWidth - spacing[1])), label = this.label, rotation = this.rotation, factor = getAlignFactor(axis.labelAlign || label.attr('align')), labelWidth = label.getBBox().width, slotWidth = axis.getSlotWidth(tick), xCorrection = factor, css = {};
+        const tick = this, axis = this.axis, labelOptions = axis.options.labels, pxPos = xy.x, chartWidth = axis.chart.chartWidth, spacing = axis.chart.spacing, leftBound = axis.labelLeft ?? Math.min(axis.pos, spacing[3]), rightBound = (axis.labelRight ?? Math.max(!axis.isRadial ? axis.pos + axis.len : 0, chartWidth - spacing[1])), label = this.label, rotation = this.rotation, factor = getAlignFactor(axis.labelAlign || label.attr('align')), labelWidth = label.getBBox().width, slotWidth = axis.getSlotWidth(tick), xCorrection = factor, css = {};
         let modifiedSlotWidth = slotWidth, goRight = 1, leftPos, rightPos, textWidth;
         // Check if the label overshoots the chart spacing box. If it does, move
         // it. If it now overshoots the slotWidth, add ellipsis.
@@ -19626,9 +19730,8 @@ class Tick {
      * @param {number} [opacity]
      */
     render(index, old, opacity) {
-        const tick = this, axis = tick.axis, horiz = axis.horiz, pos = tick.pos, tickmarkOffset = pick(tick.tickmarkOffset, axis.tickmarkOffset), xy = tick.getPosition(horiz, pos, tickmarkOffset, old), x = xy.x, y = xy.y, axisStart = axis.pos, axisEnd = axisStart + axis.len, pxPos = horiz ? x : y;
-        const labelOpacity = pick(opacity, tick.label?.newOpacity, // #15528
-        1);
+        const tick = this, axis = tick.axis, horiz = axis.horiz, pos = tick.pos, tickmarkOffset = (tick.tickmarkOffset ?? axis.tickmarkOffset), xy = tick.getPosition(horiz, pos, tickmarkOffset, old), x = xy.x, y = xy.y, axisStart = axis.pos, axisEnd = axisStart + axis.len, pxPos = horiz ? x : y;
+        const labelOpacity = (opacity ?? tick.label?.newOpacity ?? 1);
         // Anything that is not between `axis.pos` and `axis.pos + axis.length`
         // should not be visible (#20166). The `correctFloat` is for reversed
         // axes in Safari.
@@ -19656,7 +19759,7 @@ class Tick {
      * @param {number} opacity  The opacity of the grid line
      */
     renderGridLine(old, opacity) {
-        const tick = this, axis = tick.axis, options = axis.options, attribs = {}, pos = tick.pos, type = tick.type, tickmarkOffset = pick(tick.tickmarkOffset, axis.tickmarkOffset), renderer = axis.chart.renderer;
+        const tick = this, axis = tick.axis, options = axis.options, attribs = {}, pos = tick.pos, type = tick.type, tickmarkOffset = (tick.tickmarkOffset ?? axis.tickmarkOffset), renderer = axis.chart.renderer;
         let gridLine = tick.gridLine, gridLinePath, gridLineWidth = options.gridLineWidth, gridLineColor = options.gridLineColor, dashStyle = options.gridLineDashStyle;
         if (tick.type === 'minor') {
             gridLineWidth = options.minorGridLineWidth;
@@ -19712,7 +19815,7 @@ class Tick {
      * @param {number} opacity  The opacity of the mark
      */
     renderMark(xy, opacity) {
-        const tick = this, axis = tick.axis, options = axis.options, renderer = axis.chart.renderer, type = tick.type, tickSize = axis.tickSize(type ? type + 'Tick' : 'tick'), x = xy.x, y = xy.y, tickWidth = pick(options[type !== 'minor' ? 'tickWidth' : 'minorTickWidth'], !type && axis.isXAxis ? 1 : 0), // X axis defaults to 1
+        const tick = this, axis = tick.axis, options = axis.options, renderer = axis.chart.renderer, type = tick.type, tickSize = axis.tickSize(type ? type + 'Tick' : 'tick'), x = xy.x, y = xy.y, tickWidth = options[type !== 'minor' ? 'tickWidth' : 'minorTickWidth'] ?? (!type && axis.isXAxis ? 1 : 0), // X axis defaults to 1
         tickColor = options[type !== 'minor' ? 'tickColor' : 'minorTickColor'];
         let mark = tick.mark;
         const isNewMark = !mark;
@@ -19757,7 +19860,7 @@ class Tick {
      * @param {number} index  The index of the tick
      */
     renderLabel(xy, old, opacity, index) {
-        const tick = this, axis = tick.axis, horiz = axis.horiz, options = axis.options, label = tick.label, labelOptions = options.labels, step = labelOptions.step, tickmarkOffset = pick(tick.tickmarkOffset, axis.tickmarkOffset), x = xy.x, y = xy.y;
+        const tick = this, axis = tick.axis, horiz = axis.horiz, options = axis.options, label = tick.label, labelOptions = options.labels, step = labelOptions.step, tickmarkOffset = (tick.tickmarkOffset ?? axis.tickmarkOffset), x = xy.x, y = xy.y;
         let show = true;
         if (label && isNumber(x)) {
             label.xy = xy = tick.getLabelPosition(x, y, label, horiz, labelOptions, tickmarkOffset, index, step);
@@ -19849,7 +19952,6 @@ class Tick {
  * */
 
 
-const { animObject: Axis_animObject } = AnimationUtilities;
 
 const { xAxis, yAxis } = Axis_AxisDefaults;
 
@@ -19863,12 +19965,7 @@ const { deg2rad: Axis_deg2rad } = Core_Globals;
 
 
 
-const getNormalizedTickInterval = (axis, tickInterval) => normalizeTickInterval(tickInterval, void 0, void 0, pick(axis.options.allowDecimals, 
-// If the tick interval is greater than 0.5, avoid decimals, as
-// linear axes are often used to render discrete values (#3363). If
-// a tick amount is set, allow decimals by default, as it increases
-// the chances for a good fit.
-tickInterval < 0.5 || axis.tickAmount !== void 0), !!axis.tickAmount);
+const getNormalizedTickInterval = (axis, tickInterval) => normalizeTickInterval(tickInterval, void 0, void 0, (axis.options.allowDecimals ?? (tickInterval < 0.5 || axis.tickAmount !== void 0)), !!axis.tickAmount);
 extend(Axis_defaultOptions, { xAxis, yAxis: merge(xAxis, yAxis) });
 /* *
  *
@@ -19976,7 +20073,7 @@ class Axis {
         axis.coll = coll;
         fireEvent(this, 'init', { userOptions: userOptions });
         // Needed in setOptions
-        axis.opposite = pick(userOptions.opposite, axis.opposite);
+        axis.opposite = (userOptions.opposite ?? axis.opposite);
         /**
          * The side on which the axis is rendered. 0 is top, 1 is right, 2
          * is bottom and 3 is left.
@@ -19984,10 +20081,9 @@ class Axis {
          * @name Highcharts.Axis#side
          * @type {number}
          */
-        axis.side = pick(userOptions.side, axis.side, (horiz ?
+        axis.side = (userOptions.side ?? axis.side ?? (horiz ?
             (axis.opposite ? 0 : 2) : // Top : bottom
-            (axis.opposite ? 1 : 3)) // Right : left
-        );
+            (axis.opposite ? 1 : 3)));
         /**
          * Current options for the axis after merge of defaults and user's
          * options.
@@ -20016,7 +20112,7 @@ class Axis {
          * @name Highcharts.Axis#reversed
          * @type {boolean}
          */
-        axis.reversed = pick(options.reversed, axis.reversed);
+        axis.reversed = (options.reversed ?? axis.reversed);
         axis.visible = options.visible;
         axis.zoomEnabled = options.zoomEnabled;
         // Initial categories
@@ -20104,7 +20200,7 @@ class Axis {
          * @name Highcharts.Axis#crosshair
          * @type {boolean|Highcharts.AxisCrosshairOptions}
          */
-        const crosshair = pick(options.crosshair, splat(chart.options.tooltip.crosshairs)[isXAxis ? 0 : 1]);
+        const crosshair = options.crosshair ?? splat(chart.options.tooltip.crosshairs)[isXAxis ? 0 : 1];
         axis.crosshair = crosshair === true ? {} : crosshair;
         // Register. Don't add it again on Axis.update().
         if (chart.axes.indexOf(axis) === -1) { //
@@ -20288,8 +20384,8 @@ class Axis {
                                 seriesDataMax = xExtremes.max;
                             }
                             if (xData.length) {
-                                axis.dataMin = Math.min(pick(axis.dataMin, seriesDataMin), seriesDataMin);
-                                axis.dataMax = Math.max(pick(axis.dataMax, seriesDataMax), seriesDataMax);
+                                axis.dataMin = Math.min((axis.dataMin ?? seriesDataMin), seriesDataMin);
+                                axis.dataMax = Math.max((axis.dataMax ?? seriesDataMax), seriesDataMax);
                             }
                         }
                         // Get dataMin and dataMax for Y axes, as well as handle
@@ -20304,11 +20400,11 @@ class Axis {
                         // doesn't have active y data, we continue with nulls
                         if (isNumber(dataExtremes.dataMin)) {
                             seriesDataMin = dataExtremes.dataMin;
-                            axis.dataMin = Math.min(pick(axis.dataMin, seriesDataMin), seriesDataMin);
+                            axis.dataMin = Math.min((axis.dataMin ?? seriesDataMin), seriesDataMin);
                         }
                         if (isNumber(dataExtremes.dataMax)) {
                             seriesDataMax = dataExtremes.dataMax;
-                            axis.dataMax = Math.max(pick(axis.dataMax, seriesDataMax), seriesDataMax);
+                            axis.dataMax = Math.max((axis.dataMax ?? seriesDataMax), seriesDataMax);
                         }
                         // Adjust to threshold
                         if (defined(threshold)) {
@@ -20463,7 +20559,7 @@ class Axis {
             translatedValue
         };
         fireEvent(this, 'getPlotLinePath', evt, function (e) {
-            translatedValue = pick(translatedValue, axis.translate(value, void 0, void 0, old));
+            translatedValue = translatedValue ?? axis.translate(value, void 0, void 0, old);
             // Keep the translated value within sane bounds, and avoid Infinity
             // to fail the isNumber test (#7709).
             translatedValue = clamp(translatedValue, -1e9, 1e9);
@@ -20552,7 +20648,7 @@ class Axis {
     getMinorTickInterval() {
         const { minorTicks, minorTickInterval } = this.options;
         if (minorTicks === true) {
-            return pick(minorTickInterval, 'auto');
+            return (minorTickInterval ?? 'auto');
         }
         if (minorTicks === false) {
             return;
@@ -20835,7 +20931,9 @@ class Axis {
                     const seriesPointRange = hasCategories ?
                         1 :
                         (isXAxis ?
-                            pick(series.options.pointRange, closestPointRange, 0) :
+                            (series.options.pointRange ??
+                                closestPointRange ??
+                                0) :
                             (axis.axisPointRange || 0)), // #2806
                     pointPlacement = series.options.pointPlacement;
                     pointRange = Math.max(pointRange, seriesPointRange);
@@ -20919,14 +21017,16 @@ class Axis {
             this.getTickAmount();
         }
         // Min or max set either by zooming/setExtremes or initial options
-        hardMin = pick(axis.userMin, time.parse(options.min));
-        hardMax = pick(axis.userMax, time.parse(options.max));
+        hardMin = (axis.userMin ?? time.parse(options.min));
+        hardMax = (axis.userMax ?? time.parse(options.max));
         // Linked axis gets the extremes from the parent axis
         if (linkedParent) {
             axis.linkedParent = linkedParent;
             linkedParentExtremes = linkedParent.getExtremes();
-            axis.min = pick(linkedParentExtremes.min, linkedParentExtremes.dataMin);
-            axis.max = pick(linkedParentExtremes.max, linkedParentExtremes.dataMax);
+            axis.min =
+                linkedParentExtremes.min ?? linkedParentExtremes.dataMin;
+            axis.max =
+                linkedParentExtremes.max ?? linkedParentExtremes.dataMax;
             if (this.type !== linkedParent.type) {
                 // Can't link axes of different type
                 error(11, true, chart);
@@ -20948,14 +21048,14 @@ class Axis {
                     maxPadding = 0;
                 }
             }
-            axis.min = pick(hardMin, thresholdMin, dataMin);
-            axis.max = pick(hardMax, thresholdMax, dataMax);
+            axis.min = (hardMin ?? thresholdMin ?? dataMin);
+            axis.max = (hardMax ?? thresholdMax ?? dataMax);
         }
         if (isNumber(axis.max) && isNumber(axis.min)) {
             if (logarithmic) {
                 if (axis.positiveValuesOnly &&
                     !secondPass &&
-                    Math.min(axis.min, pick(dataMin, axis.min)) <= 0) { // #978
+                    Math.min(axis.min, (dataMin ?? axis.min)) <= 0) { // #978
                     // Can't plot negative values on log axis
                     error(10, true, chart);
                 }
@@ -21061,16 +21161,13 @@ class Axis {
             axis.tickInterval = tickIntervalOption = linkedParent.tickInterval;
         }
         else {
-            axis.tickInterval = pick(tickIntervalOption, this.tickAmount ?
+            axis.tickInterval = tickIntervalOption ?? (this.tickAmount ?
                 range / Math.max(this.tickAmount - 1, 1) :
-                void 0, 
-            // For categorized axis, 1 is default, for linear axis use
-            // tickPix
-            categories ?
-                1 :
-                // Don't let it be more than the data range
-                range * tickPixelIntervalOption /
-                    Math.max(axis.len, tickPixelIntervalOption));
+                categories ?
+                    1 :
+                    // Don't let it be more than the data range
+                    range * tickPixelIntervalOption /
+                        Math.max(axis.len, tickPixelIntervalOption));
         }
         // Now we're finished detecting min and max, crop and group series data.
         // This is in turn needed in order to find tick positions in ordinal
@@ -21100,12 +21197,9 @@ class Axis {
         }
         // Before normalizing the tick interval, handle minimum tick interval.
         // This applies only if tickInterval is not defined.
-        const minTickInterval = pick(options.minTickInterval, 
-        // In datetime axes, don't go below the data interval, except when
-        // there are scatter-like series involved (#13369).
-        dateTime &&
-            !axis.series.some((s) => !s.sorted) ?
-            axis.closestPointRange : 0);
+        const minTickInterval = options.minTickInterval ?? (dateTime && !axis.series.some((s) => !s.sorted) ?
+            axis.closestPointRange :
+            0);
         if (!tickIntervalOption &&
             minTickInterval &&
             axis.tickInterval < minTickInterval) {
@@ -21435,7 +21529,7 @@ class Axis {
      * @function Highcharts.Axis#adjustTickAmount
      */
     adjustTickAmount() {
-        const axis = this, { finalTickAmt, max, min, options, tickPositions, tickAmount, thresholdAlignment } = axis, currentTickAmount = tickPositions?.length, threshold = pick(axis.threshold, axis.softThreshold ? 0 : null);
+        const axis = this, { finalTickAmt, max, min, options, tickPositions, tickAmount, thresholdAlignment } = axis, currentTickAmount = tickPositions?.length, threshold = axis.threshold ?? (axis.softThreshold ? 0 : null);
         let len, i, tickInterval = axis.tickInterval, thresholdTickIndex;
         const 
         // Extend the tickPositions by appending a position
@@ -21671,7 +21765,8 @@ class Axis {
         offsets = options.offsets || [0, 0, 0, 0], horiz = this.horiz, 
         // Check for percentage based input values. Rounding fixes problems
         // with column overflow and plot line filtering (#4898, #4899)
-        width = this.width = Math.round(relativeLength(pick(options.width, chart.plotWidth - offsets[3] + offsets[1]), chart.plotWidth)), height = this.height = Math.round(relativeLength(pick(options.height, chart.plotHeight - offsets[0] + offsets[2]), chart.plotHeight)), top = this.top = Math.round(relativeLength(pick(options.top, chart.plotTop + offsets[0]), chart.plotHeight, chart.plotTop)), left = this.left = Math.round(relativeLength(pick(options.left, chart.plotLeft + offsets[3]), chart.plotWidth, chart.plotLeft));
+        width = this.width = Math.round(relativeLength((options.width ?? chart.plotWidth - offsets[3] + offsets[1]), chart.plotWidth)), height = this.height = Math.round(relativeLength((options.height ??
+            chart.plotHeight - offsets[0] + offsets[2]), chart.plotHeight)), top = this.top = Math.round(relativeLength((options.top ?? chart.plotTop + offsets[0]), chart.plotHeight, chart.plotTop)), left = this.left = Math.round(relativeLength((options.left ?? chart.plotLeft + offsets[3]), chart.plotWidth, chart.plotLeft));
         // Expose basic values to use in Series object and navigator
         this.bottom = chart.chartHeight - height - top;
         this.right = chart.chartWidth - width - left;
@@ -21782,9 +21877,7 @@ class Axis {
      * An array of tickLength and tickWidth
      */
     tickSize(prefix) {
-        const options = this.options, tickWidth = pick(options[prefix === 'tick' ? 'tickWidth' : 'minorTickWidth'], 
-        // Default to 1 on linear and datetime X axes
-        prefix === 'tick' && this.isXAxis && !this.categories ? 1 : 0);
+        const options = this.options, tickWidth = options[prefix === 'tick' ? 'tickWidth' : 'minorTickWidth'] ?? (prefix === 'tick' && this.isXAxis && !this.categories ? 1 : 0);
         let tickLength = options[prefix === 'tick' ? 'tickLength' : 'minorTickLength'], tickSize;
         if (tickWidth && tickLength) {
             // Negate the length
@@ -21871,7 +21964,7 @@ class Axis {
             newTickInterval = getStep(lineHeight * 0.75);
         }
         this.autoRotation = autoRotation;
-        this.labelRotation = pick(rotation, isNumber(rotationOption) ? rotationOption : 0);
+        this.labelRotation = rotation ?? (isNumber(rotationOption) ? rotationOption : 0);
         return labelOptions.step ? tickInterval : newTickInterval;
     }
     /**
@@ -22223,7 +22316,7 @@ class Axis {
                 titleOffsetOption = axisTitleOptions.offset;
                 titleMargin = defined(titleOffsetOption) ?
                     0 :
-                    pick(axisTitleOptions.margin, horiz ? 5 : 10);
+                    axisTitleOptions.margin ?? (horiz ? 5 : 10);
             }
         }
         // Render the axis line
@@ -22455,7 +22548,7 @@ class Axis {
      * @emits Highcharts.Axis#event:afterRender
      */
     render() {
-        const axis = this, chart = axis.chart, log = axis.logarithmic, renderer = chart.renderer, options = axis.options, isLinked = axis.isLinked, tickPositions = axis.tickPositions, axisTitle = axis.axisTitle, ticks = axis.ticks, minorTicks = axis.minorTicks, alternateBands = axis.alternateBands, stackLabelOptions = options.stackLabels, alternateGridColor = options.alternateGridColor, crossing = options.crossing, tickmarkOffset = axis.tickmarkOffset, axisLine = axis.axisLine, showAxis = axis.showAxis, animation = Axis_animObject(renderer.globalAnimation);
+        const axis = this, chart = axis.chart, log = axis.logarithmic, renderer = chart.renderer, options = axis.options, isLinked = axis.isLinked, tickPositions = axis.tickPositions, axisTitle = axis.axisTitle, ticks = axis.ticks, minorTicks = axis.minorTicks, alternateBands = axis.alternateBands, stackLabelOptions = options.stackLabels, alternateGridColor = options.alternateGridColor, crossing = options.crossing, tickmarkOffset = axis.tickmarkOffset, axisLine = axis.axisLine, showAxis = axis.showAxis, animation = animObject(renderer.globalAnimation);
         let from, to;
         // Reset
         axis.labelEdge.length = 0;
@@ -22734,9 +22827,9 @@ class Axis {
             }
             else if (defined(point)) {
                 // #3834
-                pos = pick(this.coll !== 'colorAxis' ?
-                    point.crosshairPos : // 3D axis extension
-                    null, this.isXAxis ?
+                pos = (this.coll !== 'colorAxis' ?
+                    point.crosshairPos :
+                    null) ?? (this.isXAxis ?
                     point.plotX :
                     this.len - point.plotY);
             }
@@ -22745,7 +22838,7 @@ class Axis {
                     // Value, only used on radial
                     value: point && (this.isXAxis ?
                         point.x :
-                        pick(point.stackY, point.y)),
+                        (point.stackY ?? point.y ?? void 0)),
                     translatedValue: pos
                 };
                 if (chart.polar) {
@@ -22778,7 +22871,7 @@ class Axis {
                         (categorized ? 'category ' : 'thin ') +
                         (options.className || ''))
                         .attr({
-                        zIndex: pick(options.zIndex, 2)
+                        zIndex: (options.zIndex ?? 2)
                     })
                         .clip(options.clip === false ?
                         void 0 :
@@ -22793,7 +22886,7 @@ class Axis {
                                     // eslint-disable-next-line max-len
                                     'var(--highcharts-highlight-color-20)').setOpacity(0.25).get() :
                                     'var(--highcharts-neutral-color-20)'),
-                            'stroke-width': pick(options.width, 1)
+                            'stroke-width': (options.width ?? 1)
                         }).css({
                             'pointer-events': 'none'
                         });
@@ -22806,7 +22899,7 @@ class Axis {
                 }
                 cross
                     .show()
-                    .animate({ d: path }, Axis_animObject(options?.animation));
+                    .animate({ d: path }, animObject(options?.animation));
                 if (categorized && !options.width) {
                     cross.attr({
                         'stroke-width': this.transA
@@ -22859,7 +22952,7 @@ class Axis {
         this.destroy(true);
         this.init(chart, options);
         chart.isDirtyBox = true;
-        if (pick(redraw, true)) {
+        if (redraw ?? true) {
             chart.redraw();
         }
     }
@@ -22889,7 +22982,7 @@ class Axis {
         chart.orderItems(coll);
         this.destroy();
         chart.isDirtyBox = true;
-        if (pick(redraw, true)) {
+        if (redraw ?? true) {
             chart.redraw();
         }
     }
@@ -23545,8 +23638,10 @@ var LogarithmicAxis;
                     tickIntervalOption, tickPixelIntervalOption = options.tickPixelInterval / (minor ? 5 : 1), totalPixelLength = minor ?
                     axisLength / axis.tickPositions.length :
                     axisLength;
-                interval = pick(filteredTickIntervalOption, log.minorAutoInterval, (realMax - realMin) *
-                    tickPixelIntervalOption / (totalPixelLength || 1));
+                interval = filteredTickIntervalOption ??
+                    log.minorAutoInterval ??
+                    (realMax - realMin) * tickPixelIntervalOption /
+                        (totalPixelLength || 1);
                 interval = normalizeTickInterval(interval);
                 positions = axis.getLinearTickPositions(interval, realMin, realMax).map(log.log2lin);
                 if (!minor) {
@@ -23975,7 +24070,8 @@ class PlotLineOrBand {
         if (!chart.styledMode) {
             if (isLine) {
                 attribs.stroke = color || 'var(--highcharts-neutral-color-40)';
-                attribs['stroke-width'] = pick(options.width, 1);
+                attribs['stroke-width'] =
+                    options.width ?? 1;
                 if (options.dashStyle) {
                     attribs.dashstyle = options.dashStyle;
                 }
@@ -24844,7 +24940,6 @@ class PlotLineOrBand {
  * */
 
 
-const { animObject: Tooltip_animObject } = AnimationUtilities;
 
 const { format: Tooltip_format } = Core_Templating;
 
@@ -25108,7 +25203,8 @@ class Tooltip {
             'highcharts-label',
             isHeader && 'highcharts-tooltip-header',
             isSplit ? 'highcharts-tooltip-box' : 'highcharts-tooltip',
-            !isHeader && 'highcharts-color-' + pick(point.colorIndex, series.colorIndex),
+            !isHeader &&
+                'highcharts-color-' + (point.colorIndex ?? series.colorIndex),
             seriesOptions?.className
         ].filter(isString).join(' ');
     }
@@ -25293,7 +25389,8 @@ class Tooltip {
         }
         // The far side is right or bottom
         const preferFarSide = !this.followPointer &&
-            pick(point.ttBelow, polar ? false : !inverted === flipped), // #4984
+            (point.ttBelow ??
+                (polar ? false : !inverted === flipped)), // #4984
         /*
          * Handle the preferred dimension. When the preferred dimension is
          * tooltip on top or bottom of the point, it will look for space
@@ -25420,7 +25517,7 @@ class Tooltip {
         const tooltip = this;
         // Disallow duplicate timers (#1728, #1766)
         clearTimeouts(this);
-        delay = pick(delay, this.options.hideDelay);
+        delay = (delay ?? this.options.hideDelay);
         if (!this.isHidden) {
             this.hideTimer = syncTimeout(function () {
                 const label = tooltip.getLabel();
@@ -25523,7 +25620,9 @@ class Tooltip {
          * Split tooltip does not support outside in the first iteration. Should
          * not be too complicated to implement.
          */
-        this.outside = pick(options.outside, Boolean(chart.scrollablePixelsX || chart.scrollablePixelsY));
+        this.outside =
+            options.outside ??
+                Boolean(chart.scrollablePixelsX || chart.scrollablePixelsY);
     }
     shouldStickOnContact(pointerEvent) {
         return !!(!this.followPointer &&
@@ -25545,7 +25644,7 @@ class Tooltip {
      * @param {number} anchorY
      */
     move(x, y, anchorX, anchorY) {
-        const { followPointer, options } = this, animation = Tooltip_animObject(!followPointer &&
+        const { followPointer, options } = this, animation = animObject(!followPointer &&
             !this.isHidden &&
             !options.fixed &&
             options.animation), skipAnchor = followPointer || (this.len || 0) > 1, attr = { x, y };
@@ -25603,7 +25702,7 @@ class Tooltip {
         point.points = void 0;
         // Register the current series
         const currentSeries = point.series;
-        this.distance = pick(currentSeries.tooltipOptions.distance, 16);
+        this.distance = (currentSeries.tooltipOptions.distance ?? 16);
         // Update the inner HTML
         if (text === false) {
             this.hide();
@@ -25876,7 +25975,7 @@ class Tooltip {
                         anchorY,
                         boxWidth,
                         point,
-                        rank: pick(boxPosition.rank, isHeader ? 1 : 0),
+                        rank: boxPosition.rank ?? (isHeader ? 1 : 0),
                         size,
                         target: boxPosition.y,
                         tt,
@@ -26293,7 +26392,6 @@ class Tooltip {
 
 
 
-const { animObject: Point_animObject } = AnimationUtilities;
 
 const { defaultOptions: Point_defaultOptions } = Defaults;
 
@@ -26633,10 +26731,15 @@ class Point {
      *
      * @internal
      * @function Highcharts.Point#destroy
+     *
+     * @param {boolean} [sync]
+     *        Whether to destroy the point synchronously. Used internally from
+     *        series.destroy, where condemned points may cause animation errors
+     *        (#24976).
      */
-    destroy() {
-        if (!this.condemned) {
-            const point = this, series = point.series, chart = series.chart, hoverPoints = chart.hoverPoints, globalAnimation = point.series.chart.renderer.globalAnimation, { duration } = Point_animObject(globalAnimation);
+    destroy(sync) {
+        if (!this.destroyed && !this.condemned) {
+            const point = this, series = point.series, chart = series.chart, hoverPoints = chart.hoverPoints, globalAnimation = point.series.chart.renderer.globalAnimation, { duration } = animObject(globalAnimation);
             /**
              * Allow to call after animation.
              * @internal
@@ -26653,6 +26756,7 @@ class Point {
                 for (const prop in point) { // eslint-disable-line guard-for-in
                     delete point[prop];
                 }
+                this.destroyed = true;
             };
             if (point.legendItem) {
                 // Pies have legend items
@@ -26669,7 +26773,7 @@ class Point {
                 point.onMouseOut();
             }
             // Remove properties after animation
-            if (duration && series.condemnedPoints) {
+            if (duration && !sync && series.condemnedPoints) {
                 series.condemnedPoints.push(this);
                 this.graphic?.addClass('highcharts-point-condemned');
                 setTimeout(destroyPoint, duration);
@@ -26792,14 +26896,15 @@ class Point {
      *
      * @function Highcharts.Point#getZone
      *
-     * @return {Highcharts.SeriesZonesOptionsObject}
-     *         The zone item.
+     * @return {Highcharts.SeriesZonesOptionsObject|undefined}
+     *         The zone item, or `undefined` if the series has no zones.
      */
     getZone() {
         const series = this.series, zones = series.zones, zoneAxis = series.zoneAxis || 'y';
         let zone, i = 0;
         zone = zones[i];
-        while (this[zoneAxis] >= zone.value) {
+        while (i < zones.length &&
+            this[zoneAxis] >= zone.value) {
             zone = zones[++i];
         }
         // For resetting or reusing the point (#8100)
@@ -27215,7 +27320,7 @@ class Point {
      */
     select(selected, accumulate) {
         const point = this, series = point.series, chart = series.chart;
-        selected = pick(selected, !point.selected);
+        selected = (selected ?? !point.selected);
         this.selectedStaging = selected;
         // Fire the event with the default handler
         point.firePointEvent(selected ? 'select' : 'unselect', { accumulate: accumulate }, function () {
@@ -27339,9 +27444,8 @@ class Point {
      * @emits Highcharts.Point#event:afterSetState
      */
     setState(state, move) {
-        const point = this, series = point.series, previousState = point.state, stateOptions = (series.options.states[state || 'normal'] ||
-            {}), markerOptions = (Point_defaultOptions.plotOptions[series.type].marker &&
-            series.options.marker), normalDisabled = (markerOptions && markerOptions.enabled === false), markerStateOptions = markerOptions?.states?.[state || 'normal'] ||
+        const point = this, series = point.series, previousState = point.state, stateOptions = series.options.states?.[state || 'normal'] || {}, markerOptions = (Point_defaultOptions.plotOptions?.[series.type]?.marker &&
+            series.options.marker), normalDisabled = markerOptions?.enabled === false, markerStateOptions = markerOptions?.states?.[state || 'normal'] ||
             {}, stateDisabled = markerStateOptions.enabled === false, pointMarker = point.marker || {}, chart = series.chart, hasMarkers = (markerOptions && series.markerAttribs);
         let halo = series.halo, markerAttribs, pointAttribs, pointAttribsAnimation, stateMarkerGraphic = series.stateMarkerGraphic, newSymbol;
         state = state || ''; // Empty string
@@ -27354,13 +27458,10 @@ class Point {
             (stateOptions.enabled === false) ||
             // General point marker's state options is disabled
             (state && (stateDisabled ||
-                (normalDisabled &&
-                    markerStateOptions.enabled === false))) ||
+                (normalDisabled && markerStateOptions.enabled === false))) ||
             // Individual point marker's state options is disabled
             (state &&
-                pointMarker.states &&
-                pointMarker.states[state] &&
-                pointMarker.states[state].enabled === false) // #1610
+                pointMarker.states?.[state]?.enabled === false) // #1610
         ) {
             return;
         }
@@ -27379,7 +27480,8 @@ class Point {
             }
             if (!chart.styledMode) {
                 pointAttribs = series.pointAttribs(point, state);
-                pointAttribsAnimation = pick(chart.options.chart.animation, stateOptions.animation);
+                pointAttribsAnimation = (chart.options.chart.animation ??
+                    stateOptions.animation);
                 const opacity = pointAttribs.opacity;
                 // Some inactive points (e.g. slices in pie) should apply
                 // opacity also for their labels
@@ -27397,9 +27499,11 @@ class Point {
                 point.graphic.animate(pointAttribs, pointAttribsAnimation);
             }
             if (markerAttribs) {
-                point.graphic.animate(markerAttribs, pick(
+                point.graphic.animate(markerAttribs, (
                 // Turn off globally:
-                chart.options.chart.animation, markerStateOptions.animation, markerOptions.animation));
+                chart.options.chart.animation ??
+                    markerStateOptions.animation ??
+                    markerOptions.animation));
             }
             // Zooming in from a range with no markers to a range with markers
             if (stateMarkerGraphic) {
@@ -27448,10 +27552,12 @@ class Point {
             }
         }
         // Show me your halo
-        const haloOptions = stateOptions.halo;
+        const haloOptions = isObject(stateOptions.halo) ?
+            stateOptions.halo :
+            {};
         const markerGraphic = (point.graphic || stateMarkerGraphic);
         const markerVisibility = markerGraphic?.visibility || 'inherit';
-        if (haloOptions?.size &&
+        if (haloOptions.size &&
             markerGraphic &&
             markerVisibility !== 'hidden' &&
             !point.isCluster) {
@@ -27465,7 +27571,7 @@ class Point {
             });
             halo.attr({
                 'class': 'highcharts-halo highcharts-color-' +
-                    pick(point.colorIndex, series.colorIndex) +
+                    (point.colorIndex ?? series.colorIndex) +
                     (point.className ? ' ' + point.className : ''),
                 'visibility': markerVisibility,
                 'zIndex': -1 // #4929, #8276
@@ -27981,6 +28087,11 @@ class Pointer {
                 }
             }
         }
+        // Run a final transform with a drop trigger to display the reset
+        // zoom button after a pinch gesture (#22128)
+        if (e?.type === 'touchend' && this.hasDragged) {
+            chart.transform({ trigger: 'drop' });
+        }
         if (redraw) {
             chart.redraw();
         }
@@ -28193,7 +28304,7 @@ class Pointer {
         const hoverPoints = [], useExisting = !!(isDirectTouch && existingHoverPoint), filter = function (s) {
             return (s.visible &&
                 !(!shared && s.directTouch) && // #3821
-                pick(s.options.enableMouseTracking, true));
+                (s.options.enableMouseTracking ?? true));
         };
         let hoverSeries = existingHoverSeries, 
         // Which series to look in for the hover point
@@ -28379,8 +28490,8 @@ class Pointer {
         const ePos = (touches ?
             touches.length ?
                 touches.item(0) :
-                (pick(// #13534
-                touches.changedTouches, e.changedTouches))[0] :
+                (touches.changedTouches ??
+                    e.changedTouches)[0] :
             e);
         // Get mouse position
         if (!chartPosition) {
@@ -28454,7 +28565,7 @@ class Pointer {
      * @function Highcharts.Pointer#onContainerMouseLeave
      */
     onContainerMouseLeave(e) {
-        const { pointer } = Pointer_charts[pick(Pointer.hoverChartIndex, -1)] || {};
+        const { pointer } = Pointer_charts[(Pointer.hoverChartIndex ?? -1)] || {};
         e = this.normalize(e);
         this.onContainerMouseMove(e);
         // #4886, MS Touch end fires mouseleave but with no related target
@@ -28554,7 +28665,7 @@ class Pointer {
         if (e?.touches && this.hasPinchMoved) {
             e?.preventDefault?.();
         }
-        Pointer_charts[pick(Pointer.hoverChartIndex, -1)]
+        Pointer_charts[(Pointer.hoverChartIndex ?? -1)]
             ?.pointer
             ?.drop(e);
     }
@@ -28624,6 +28735,9 @@ class Pointer {
                     from: boxFromTouches(lastTouches),
                     trigger: e.type
                 });
+                // Record a truthy value in order to trigger the final transform
+                // in the drop function
+                pointer.hasDragged = 1;
             });
             if (pointer.res) {
                 pointer.res = false;
@@ -29058,7 +29172,7 @@ class Pointer {
      */
     setHoverChartIndex(e) {
         const chart = this.chart;
-        const hoverChart = Core_Globals.charts[pick(Pointer.hoverChartIndex, -1)];
+        const hoverChart = Core_Globals.charts[(Pointer.hoverChartIndex ?? -1)];
         if (hoverChart &&
             hoverChart !== chart) {
             const relatedTargetObj = { relatedTarget: chart.container };
@@ -29104,7 +29218,7 @@ class Pointer {
                             Math.pow(pinchDown[0].chartY - e.chartY, 2)) >= 16 :
                         false;
                 }
-                if (pick(hasMoved, true)) {
+                if (hasMoved ?? true) {
                     this.pinch(e);
                 }
             }
@@ -29115,7 +29229,9 @@ class Pointer {
             // If inside, capture touch-drag and display tooltip. If not inside,
             // allow dragging the finger to scroll the page
             if ((chart.tooltip?.options.followTouchMove ?? true) &&
-                isInside) {
+                isInside &&
+                e.type === 'touchmove' &&
+                !(chart.scrollablePixelsX || chart.scrollablePixelsY)) {
                 e.preventDefault();
             }
         }
@@ -29145,7 +29261,7 @@ class Pointer {
         let zoomType = chart.zooming.type || '', zoomX, zoomY;
         // Look for the pinchType option
         if (/touch/.test(e.type)) {
-            zoomType = pick(chart.zooming.pinchType, zoomType);
+            zoomType = (chart.zooming.pinchType ?? zoomType);
         }
         this.zoomX = zoomX = /x/.test(zoomType);
         this.zoomY = zoomY = /y/.test(zoomType);
@@ -29587,7 +29703,7 @@ class DataTableCore {
      * Fetches the given column by the canonical column ID. Simplified version
      * of the full `DataTable.getRow` method, always returning by reference.
      *
-     * @function Highcharts.DataTable#setColumn
+     * @function Highcharts.DataTable#getColumn
      *
      * @param {string} columnId
      * ID of the column to get.
@@ -29919,7 +30035,7 @@ var LegendSymbol;
         // Draw the marker
         if (markerOptions && markerOptions.enabled !== false && symbolWidth) {
             // Do not allow the marker to be larger than the symbolHeight
-            let radius = Math.min(pick(markerOptions.radius, generalRadius), generalRadius);
+            let radius = Math.min((markerOptions.radius ?? generalRadius), generalRadius);
             // Restrict symbol markers size
             if (symbol.indexOf('url') === 0) {
                 markerOptions = merge(markerOptions, {
@@ -30323,6 +30439,10 @@ const seriesDefaults = {
      * ```
      *
      * @type    {Highcharts.DataMappingOptionsObject}
+     * @sample highcharts/datatable/datamapping
+     *         Basic data mapping
+     * @sample highcharts/datatable/datamapping-dynamic
+     *         Data mapping with dynamic updates
      * @sample {highcharts} highcharts/datatable/series-datatable-multiple
      *         Series with two data tables
      * @sample {highcharts} highcharts/datatable/nested-keys
@@ -30333,6 +30453,29 @@ const seriesDefaults = {
      * @since     13.0.0
      * @apioption plotOptions.series.dataMapping
      */
+    /**
+     * Options for a specific series-level data table or an array of data
+     * tables. The `dataTable` option can be either a configuration object or an
+     * instance of the `DataTable` class. If a `DataTable` instance is passed,
+     * it will be used directly. If a configuration object or an array is
+     * passed, a new `DataTable` instance will be created based on the provided
+     * configuration.
+     *
+     * @type   {Highcharts.DataTable|Highcharts.DataTableOptionsObject|Array<Highcharts.DataTable|Highcharts.DataTableOptionsObject>}
+     * @sample {highcharts} highcharts/datatable/series-datatable/
+     *         Series with one data table each
+     * @sample {highcharts} highcharts/datatable/series-datatable-multiple/
+     *         Series with two data tables
+     * @sample {highstock} stock/datatable/series-datatable/
+     *         Series with one data table each
+     * @sample {highstock} stock/datatable/series-datatable-multiple/
+     *         Series with two data tables
+     * @sample {highmaps} maps/datatable/series-datatable
+     *         Series-level data table
+     *
+     * @since 13.0.0
+     * @apioption plotOptions.series.dataTable
+     */
     /**
      * Enable or disable the mouse tracking for a specific series. This
      * includes point tooltips and click events on graphs and points. For
@@ -31216,6 +31359,7 @@ const seriesDefaults = {
              * `series.allowPointSelect` option to true.
              *
              * @declare Highcharts.PointStatesSelectOptionsObject
+             * @extends plotOptions.series.marker.states.hover
              */
             select: {
                 /**
@@ -31792,6 +31936,7 @@ const seriesDefaults = {
          * @sample {highmaps} maps/plotoptions/series-datalabels-box/
          *         Data labels box options
          *
+         * @type  {number|Array<number>}
          * @since 2.2.1
          */
         padding: [1, 3],
@@ -31993,6 +32138,9 @@ const seriesDefaults = {
     /**
      * A collection of options for different series states.
      *
+     * In addition to the options documented under each state, any option from
+     * the parent series type can be set, with exception of `data` and `states`.
+     *
      * @declare Highcharts.SeriesStatesOptionsObject
      */
     states: {
@@ -32166,6 +32314,7 @@ const seriesDefaults = {
          *         Disabled inactive state
          *
          * @declare Highcharts.SeriesStatesInactiveOptionsObject
+         * @extends plotOptions.series.states.hover
          */
         inactive: {
             /**
@@ -32566,7 +32715,6 @@ var SeriesRegistry;
  * */
 
 
-const { animObject: Series_animObject, setAnimation: Series_setAnimation } = AnimationUtilities;
 
 
 const { defaultOptions: Series_defaultOptions } = Defaults;
@@ -32704,6 +32852,13 @@ class Series {
      * @type {number|undefined}
      * @readonly
      */
+    /**
+     * The main group for the series' graphics.
+     *
+     * @name Highcharts.Series#group
+     * @type {Highcharts.SVGElement}
+     * @readonly
+     */
     /**
      * Contains the series' index in the `Chart.series` array.
      *
@@ -32836,10 +32991,12 @@ class Series {
          */
         series.options = series.setOptions(userOptions);
         const options = series.options, visible = options.visible !== false;
-        // Create the data table
-        this.dataTable ?? (this.dataTable = options.dataTable?.isDataTable ?
-            options.dataTable :
-            new Data_DataTableCore(options.dataTable));
+        // Create the data table or use the one passed as option
+        this.dataTable ?? (this.dataTable = isArray(options.dataTable) ?
+            new Data_DataTableCore() :
+            options.dataTable?.isDataTable ?
+                options.dataTable :
+                new Data_DataTableCore(options.dataTable));
         /**
          * All child series that are linked to the current series through the
          * [linkedTo](https://api.highcharts.com/highcharts/series.line.linkedTo)
@@ -32899,7 +33056,7 @@ class Series {
         if (chartSeries.length) {
             lastSeries = chartSeries[chartSeries.length - 1];
         }
-        series._i = pick(lastSeries?._i, -1) + 1;
+        series._i = (lastSeries?._i ?? -1) + 1;
         series.opacity = series.options.opacity;
         // Insert the series and re-order all series above the insertion
         // point.
@@ -32946,7 +33103,7 @@ class Series {
                     // Apply if the series xAxis or yAxis option matches
                     // the number of the axis, or if undefined, use the
                     // first axis
-                    if (pick(seriesOptions[coll], 0) === axis.index ||
+                    if ((seriesOptions[coll] ?? 0) === axis.index ||
                         (typeof seriesOptions[coll] !==
                             'undefined' &&
                             seriesOptions[coll] === axisOptions.id)) {
@@ -32989,8 +33146,12 @@ class Series {
      * @function Highcharts.Series#hasMarkerChanged
      */
     hasMarkerChanged(options, oldOptions) {
-        const marker = options.marker, oldMarker = oldOptions.marker || {};
-        return marker && ((oldMarker.enabled && !marker.enabled) ||
+        const marker = options.marker, oldMarker = oldOptions.marker;
+        // Note that `marker` holds the full, merged object including
+        // `plotOptions`, while `oldMarker` is the user-defined series-level
+        // options only. We may need to refactor that in the future if more
+        // issues like #24057 arise.
+        return marker && oldMarker && ((oldMarker.enabled && !marker.enabled) ||
             oldMarker.symbol !== marker.symbol || // #10870, #15946
             oldMarker.height !== marker.height || // #16274
             oldMarker.width !== marker.width // #16274
@@ -33009,7 +33170,8 @@ class Series {
             time.parse(options.pointStart) ??
             0;
         let pointInterval;
-        this.pointInterval = pointInterval = pick(this.pointInterval, options.pointInterval, 1);
+        this.pointInterval = pointInterval =
+            this.pointInterval ?? options.pointInterval ?? 1;
         if (relativeXValue && isNumber(x)) {
             pointInterval *= x;
         }
@@ -33081,9 +33243,13 @@ class Series {
         );
         // When shared tooltip, stickyTracking is true by default,
         // unless user says otherwise.
-        this.stickyTracking = pick(seriesUserOptions.stickyTracking, userPlotOptionsType.stickyTracking, userPlotOptionsSeries.stickyTracking, (this.tooltipOptions.shared && !this.noSharedTooltip ?
-            true :
-            options.stickyTracking));
+        this.stickyTracking =
+            seriesUserOptions.stickyTracking ??
+                userPlotOptionsType.stickyTracking ??
+                userPlotOptionsSeries.stickyTracking ??
+                (this.tooltipOptions.shared && !this.noSharedTooltip ?
+                    true :
+                    options.stickyTracking);
         // Delete marker object if not allowed (#1125)
         if (typeOptions.marker === null) {
             delete options.marker;
@@ -33161,7 +33327,9 @@ class Series {
         if (!value) {
             // Pick up either the colorIndex option, or the series.colorIndex
             // after Series.update()
-            setting = pick(prop === 'color' ? this.options.colorIndex : void 0, this[indexName]);
+            setting = prop === 'color' ?
+                (this.options.colorIndex ?? this[indexName]) :
+                this[indexName];
             if (defined(setting)) { // After Series.update()
                 i = setting;
             }
@@ -33221,7 +33389,7 @@ class Series {
      */
     getSymbol() {
         const seriesMarkerOption = this.options.marker;
-        this.getCyclic('symbol', seriesMarkerOption.symbol, this.chart.options.symbols);
+        this.getCyclic('symbol', seriesMarkerOption?.symbol, this.chart.options.symbols);
     }
     /**
      * Shorthand to get one of the series' data columns from `Series.dataTable`.
@@ -33417,9 +33585,10 @@ class Series {
                 if (!oldData[i].destroyed && !oldData[i].condemned) {
                     const pOptions = dataTable.getRowObject(i);
                     if (pOptions) {
+                        // Remove undefined properties, but preserve explicit
+                        // nulls (#24872)
                         Object.keys(pOptions).forEach((key) => {
-                            if (!defined(pOptions[key]) /* ||
-                            pOptions[key] === oldData[i].options[key]*/) {
+                            if (pOptions[key] === void 0) {
                                 delete pOptions[key];
                             }
                         });
@@ -33824,8 +33993,12 @@ class Series {
                 }
             }
         }
-        // Find the closest distance between processed points
-        xData = this.getColumn('x', true);
+        // Find the closest distance between processed points. When the data was
+        // cropped (or set out of range), read x from the freshly cropped local
+        // `modified` table, #24858.
+        if (modified !== table) {
+            xData = modified.getColumn('x', true) || [];
+        }
         const closestPointRange = getClosestDistance([
             logarithmic ?
                 xData.map(logarithmic.log2lin) :
@@ -34030,9 +34203,9 @@ class Series {
      * Force getting extremes of a total series data range.
      */
     getExtremes(yData, forceExtremesFromAll) {
-        const { xAxis, yAxis } = this, getExtremesFromAll = forceExtremesFromAll ||
+        const { options, xAxis, yAxis } = this, getExtremesFromAll = forceExtremesFromAll ||
             this.getExtremesFromAll ||
-            this.options.getExtremesFromAll, // #4599, #21003
+            options.getExtremesFromAll, // #4599, #21003
         table = getExtremesFromAll && this.cropped ?
             this.dataTable :
             this.dataTable.getModified(), rowCount = table.rowCount, customData = yData || this.stackedYData, yAxisData = customData ?
@@ -34042,7 +34215,12 @@ class Series {
         // non-sorted data like scatter (#7639).
         shoulder = this.requireSorting && !this.is('column') ?
             1 : 0, 
-        // #2117, need to compensate for log X axis
+        // Used only for `cumulativeStart` (#24608)
+        excludeShoulder = options.cumulative &&
+            options.cumulativeStart &&
+            shoulder &&
+            !getExtremesFromAll, 
+        // Compensate for log X axis (#2117)
         positiveValuesOnly = yAxis ? yAxis.positiveValuesOnly : false, doAll = getExtremesFromAll ||
             this.cropped ||
             !xAxis; // For colorAxis support
@@ -34054,10 +34232,10 @@ class Series {
         }
         for (i = 0; i < rowCount; i++) {
             x = xData[i];
-            // Check if it is within the selected x axis range
-            if (doAll ||
+            // Check if it is within the selected x-axis range
+            if ((doAll ||
                 ((xData[i + shoulder] || x) >= xMin &&
-                    (xData[i - shoulder] || x) <= xMax)) {
+                    (xData[i - shoulder] || x) <= xMax)) && (!excludeShoulder || x >= xMin)) {
                 for (const values of yAxisData) {
                     const val = values[i];
                     // For points within the visible range, including the
@@ -34126,7 +34304,7 @@ class Series {
      */
     translate() {
         this.generatePoints();
-        const series = this, { options, xAxis, yAxis } = series, { stacking, threshold } = options, { hasRendered, polar } = series.chart, points = series.points.concat(series.condemnedPoints), dataLength = points.length, pointPlacement = series.pointPlacementToXValue(), // #7860
+        const series = this, { hasRendered, options, xAxis, yAxis } = series, { stacking, threshold } = options, { polar } = series.chart, points = series.points.concat(series.condemnedPoints), dataLength = points.length, pointPlacement = series.pointPlacementToXValue(), // #7860
         dynamicallyPlaced = Boolean(pointPlacement), stackThreshold = options.startFromThreshold ? threshold : 0, nullYSubstitute = (options?.nullInteraction &&
             yAxis.len);
         let i, plotX, lastPlotX, stackIndicator, closestPointRangePx = Number.MAX_VALUE;
@@ -34178,7 +34356,9 @@ class Series {
                     yValue = stackValues[1];
                     if (lowValue === stackThreshold &&
                         stackIndicator.key === stacks[xValue].base) {
-                        lowValue = pick(isNumber(threshold) ? threshold : yAxis.min);
+                        lowValue = isNumber(threshold) ?
+                            threshold :
+                            yAxis.min;
                     }
                     // #1200, #1232
                     if (yAxis.positiveValuesOnly &&
@@ -34186,7 +34366,7 @@ class Series {
                         lowValue <= 0) {
                         lowValue = void 0;
                     }
-                    point.total = point.stackTotal = pick(stackItem.total);
+                    point.total = point.stackTotal = stackItem.total ?? void 0;
                     point.percentage = defined(point.y) && stackItem.total ?
                         (point.y / stackItem.total * 100) : void 0;
                     point.stackY = yValue;
@@ -34319,7 +34499,7 @@ class Series {
      * Initialize the animation.
      */
     animate(init) {
-        const { chart, group, markerGroup } = this, inverted = chart.inverted, animation = Series_animObject(this.options.animation), 
+        const { chart, group, markerGroup } = this, inverted = chart.inverted, animation = animObject(this.options.animation), 
         // The key for temporary animation clips
         animationClipKey = [
             this.getSharedClipKey(),
@@ -34415,10 +34595,11 @@ class Series {
      */
     drawPoints(points) {
         points || (points = this.points.concat(this.condemnedPoints));
-        const series = this, chart = series.chart, styledMode = chart.styledMode, { colorAxis, options } = series, seriesMarkerOptions = options.marker, nullInteraction = options.nullInteraction, markerGroup = series[series.specialGroup || 'markerGroup'], xAxis = series.xAxis, globallyEnabled = pick(seriesMarkerOptions.enabled, !xAxis || xAxis.isRadial ? true : null, 
-        // Use larger or equal as radius is null in bubbles (#6321)
-        series.closestPointRangePx >= (seriesMarkerOptions.enabledThreshold *
-            seriesMarkerOptions.radius));
+        const series = this, chart = series.chart, styledMode = chart.styledMode, { colorAxis, options } = series, seriesMarkerOptions = options.marker || {}, nullInteraction = options.nullInteraction, markerGroup = series[series.specialGroup || 'markerGroup'], xAxis = series.xAxis, globallyEnabled = seriesMarkerOptions.enabled ??
+            (!xAxis || xAxis.isRadial ? true : null) ??
+            // Use larger or equal as radius is null in bubbles (#6321)
+            ((series.closestPointRangePx ?? -Infinity) >= ((seriesMarkerOptions.enabledThreshold ?? 2) *
+                seriesMarkerOptions.radius));
         let i, point, graphic, verb, pointMarkerOptions, hasPointMarker, markerAttribs;
         if (seriesMarkerOptions.enabled !== false ||
             series._hasPointMarkers) {
@@ -34435,8 +34616,10 @@ class Series {
                 // Only draw the point if y is defined
                 if (shouldDrawMarker) {
                     // Shortcuts
-                    const symbol = pick(pointMarkerOptions.symbol, series.symbol, 'rect');
-                    markerAttribs = series.markerAttribs(point, (point.selected && 'select'));
+                    const symbol = pointMarkerOptions.symbol ??
+                        series.symbol ??
+                        'rect';
+                    markerAttribs = series.markerAttribs(point, point.selected ? 'select' : '');
                     const isInside = point.isInside !== false;
                     if (!graphic &&
                         isInside &&
@@ -34501,15 +34684,17 @@ class Series {
      * A hash containing those attributes that are not settable from CSS.
      */
     markerAttribs(point, state) {
-        const seriesOptions = this.options, seriesMarkerOptions = seriesOptions.marker, pointMarkerOptions = point.marker || {}, symbol = (pointMarkerOptions.symbol ||
+        const seriesOptions = this.options, seriesMarkerOptions = seriesOptions.marker ?? {}, pointMarkerOptions = point.marker || {}, symbol = (pointMarkerOptions.symbol ||
             seriesMarkerOptions.symbol), attribs = {};
-        let seriesStateOptions, pointStateOptions, radius = pick(pointMarkerOptions.radius, seriesMarkerOptions?.radius);
+        let seriesStateOptions, pointStateOptions, radius = pointMarkerOptions.radius ??
+            seriesMarkerOptions.radius;
         // Handle hover and select states
         if (state) {
-            seriesStateOptions = seriesMarkerOptions?.states?.[state];
+            seriesStateOptions = seriesMarkerOptions.states?.[state];
             pointStateOptions = pointMarkerOptions.states?.[state];
-            radius = pick(pointStateOptions?.radius, seriesStateOptions?.radius, radius && radius + (seriesStateOptions?.radiusPlus ||
-                0));
+            radius = pointStateOptions?.radius ??
+                seriesStateOptions?.radius ??
+                (radius && radius + (seriesStateOptions?.radiusPlus || 0));
         }
         point.hasImage = symbol && symbol.indexOf('url') === 0;
         if (point.hasImage) {
@@ -34522,7 +34707,7 @@ class Series {
                     0 :
                     symbol === 'rect' ?
                         // Rectangle symbols need crisp edges, others don't
-                        seriesMarkerOptions?.lineWidth || 0 :
+                        seriesMarkerOptions.lineWidth || 0 :
                         1);
             }
             attribs.x = pos[0] - radius;
@@ -34553,8 +34738,9 @@ class Series {
      * The presentational attributes to be set on the point.
      */
     pointAttribs(point, state) {
-        const options = this.options, seriesMarkerOptions = options.marker, pointOptions = point?.options, pointMarkerOptions = pointOptions?.marker || {}, pointColorOption = pointOptions?.color, pointColor = point?.color, zoneColor = point?.zone?.color;
-        let seriesStateOptions, pointStateOptions, color = this.color, fill, stroke, strokeWidth = pick(pointMarkerOptions.lineWidth, seriesMarkerOptions.lineWidth), opacity = (point?.isNull && options.nullInteraction) ? 0 : 1;
+        const options = this.options, seriesMarkerOptions = options.marker ?? {}, pointOptions = point?.options, pointMarkerOptions = pointOptions?.marker || {}, pointColorOption = pointOptions?.color, pointColor = point?.color, zoneColor = point?.zone?.color;
+        let color = this.color, fill, stroke, strokeWidth = pointMarkerOptions.lineWidth ??
+            seriesMarkerOptions.lineWidth, opacity = (point?.isNull && options.nullInteraction) ? 0 : 1;
         color = (pointColorOption ||
             zoneColor ||
             pointColor ||
@@ -34567,19 +34753,22 @@ class Series {
             color);
         // Handle hover and select states
         state = state || 'normal';
-        if (state) {
-            seriesStateOptions = (seriesMarkerOptions.states[state] || {});
-            pointStateOptions = (pointMarkerOptions.states &&
-                pointMarkerOptions.states[state]) || {};
-            strokeWidth = pick(pointStateOptions.lineWidth, seriesStateOptions.lineWidth, strokeWidth + pick(pointStateOptions.lineWidthPlus, seriesStateOptions.lineWidthPlus, 0));
-            fill = (pointStateOptions.fillColor ||
-                seriesStateOptions.fillColor ||
-                fill);
-            stroke = (pointStateOptions.lineColor ||
-                seriesStateOptions.lineColor ||
-                stroke);
-            opacity = pick(pointStateOptions.opacity, seriesStateOptions.opacity, opacity);
-        }
+        const seriesStateOptions = seriesMarkerOptions.states?.[state] || {};
+        const pointStateOptions = pointMarkerOptions.states?.[state] || {};
+        strokeWidth = pointStateOptions.lineWidth ??
+            seriesStateOptions.lineWidth ??
+            (strokeWidth || 0) + (pointStateOptions.lineWidthPlus ??
+                seriesStateOptions.lineWidthPlus ??
+                0);
+        fill = (pointStateOptions.fillColor ||
+            seriesStateOptions.fillColor ||
+            fill);
+        stroke = (pointStateOptions.lineColor ||
+            seriesStateOptions.lineColor ||
+            stroke);
+        opacity = (pointStateOptions.opacity ??
+            seriesStateOptions.opacity ??
+            opacity);
         return {
             'stroke': stroke,
             'stroke-width': strokeWidth,
@@ -34618,7 +34807,7 @@ class Series {
         // Destroy all points with their elements
         i = data.length;
         while (i--) {
-            data[i]?.destroy?.();
+            data[i]?.destroy?.(true);
         }
         for (const zone of series.zones || []) {
             // Destroy SVGElement's but preserve primitive props (#20426)
@@ -34645,7 +34834,7 @@ class Series {
         erase(chart.series, series);
         chart.orderItems('series');
         // Clear all members
-        objectEach(series, function (val, prop) {
+        objectEach(series, function (_val, prop) {
             if (!keepEventsForUpdate || prop !== 'hcEvents') {
                 delete series[prop];
             }
@@ -34697,7 +34886,7 @@ class Series {
             // Reset
             zones.forEach((zone) => {
                 zone.lineClip = [];
-                zone.translated = clamp(axis.toPixels(pick(zone.value, axisMax), true) || 0, 0, len);
+                zone.translated = clamp(axis.toPixels((zone.value ?? axisMax), true) || 0, 0, len);
             });
             // The use of the Color Threshold assumes there are no gaps so it is
             // safe to hide the original graph and area unless it is not
@@ -34921,7 +35110,7 @@ class Series {
      * @emits Highcharts.Series#event:afterRender
      */
     render() {
-        const series = this, { chart, options, hasRendered } = series, animOptions = Series_animObject(options.animation), visibility = series.visible ?
+        const series = this, { chart, options, hasRendered } = series, animOptions = animObject(options.animation), visibility = series.visible ?
             'inherit' : 'hidden', // #2597
         zIndex = options.zIndex, chartSeriesGroup = chart.seriesGroup;
         let animDuration = series.finishedAnimating ?
@@ -35023,7 +35212,7 @@ class Series {
      *
      * @function Highcharts.Series#searchPoint
      *
-     * @param {Highcharts.PointerEvent} e
+     * @param {PointerEvent} e
      *        The normalized pointer event
      * @param {boolean} [compareX=false]
      *        Search only by the X value, not Y
@@ -35055,7 +35244,7 @@ class Series {
         // Prevent multiple k-d-trees from being built simultaneously
         // (#6235)
         this.buildingKdTree = true;
-        const series = this, seriesOptions = series.options, dimensions = seriesOptions.findNearestPointBy
+        const series = this, seriesOptions = series.options, dimensions = (seriesOptions.findNearestPointBy ?? '')
             .indexOf('y') > -1 ? 2 : 1;
         /**
          * Internal function
@@ -35105,7 +35294,7 @@ class Series {
      *        The point to search for.
      * @param {boolean} [compareX=false]
      *        Search only by the X value, not Y.
-     * @param {Highcharts.PointerEvent} [e]
+     * @param {PointerEvent} [e]
      *        The normalized pointer event.
      * @param {Function} [suppliedPointEvaluator]
      *        A custom point evaluator function.
@@ -35311,11 +35500,13 @@ class Series {
      *         Both X and Y values given
      * @sample highcharts/members/series-addpoint-pie/
      *         Append pie slice
-     * @sample stock/members/series-addpoint/
+     * @sample highcharts/datatable/datamapping-dynamic
+     *         Alternative approach with data table
+     * @sample {highstock} stock/members/series-addpoint/
      *         Append 100 points in Highcharts Stock
-     * @sample stock/members/series-addpoint-shift/
+     * @sample {highstock} stock/members/series-addpoint-shift/
      *         Append and shift in Highcharts Stock
-     * @sample maps/members/series-addpoint/
+     * @sample {highmaps} maps/members/series-addpoint/
      *         Add a point in Highmaps
      *
      * @function Highcharts.Series#addPoint
@@ -35351,7 +35542,7 @@ class Series {
         const series = this, seriesOptions = series.options, { chart, data, dataTable: table, xAxis } = series, names = xAxis?.hasNames && xAxis.names, dataOptions = seriesOptions.data, xData = series.getColumn('x');
         let isInTheMiddle, i;
         // Optional redraw, defaults to true
-        redraw = pick(redraw, true);
+        redraw = (redraw ?? true);
         // Get options and push the point to xData, yData and series.options. In
         // series.generatePoints the Point instance will be created on demand
         // and pushed to the series.data array.
@@ -35461,8 +35652,8 @@ class Series {
                 chart.redraw();
             }
         };
-        Series_setAnimation(animation, chart);
-        redraw = pick(redraw, true);
+        setAnimation(animation, chart);
+        redraw = (redraw ?? true);
         // Fire the event with a default handler of removing the point
         if (point) {
             point.firePointEvent('remove', null, remove);
@@ -35505,7 +35696,7 @@ class Series {
             // Redraw
             chart.isDirtyLegend = chart.isDirtyBox = true;
             chart.linkSeries(keepEvents);
-            if (pick(redraw, true)) {
+            if (redraw ?? true) {
                 chart.redraw(animation);
             }
         }
@@ -35722,7 +35913,7 @@ class Series {
             series.isDirtyData = true;
         }
         fireEvent(this, 'afterUpdate');
-        if (pick(redraw, true)) {
+        if (redraw ?? true) {
             chart.redraw(keepPoints ? void 0 : false);
         }
     }
@@ -35739,12 +35930,12 @@ class Series {
      * @internal
      */
     hasOptionChanged(optionName) {
-        const chart = this.chart, option = this.options[optionName], plotOptions = chart.options.plotOptions, oldOption = this.userOptions[optionName], plotOptionsOption = pick(plotOptions?.[this.type]?.[optionName], plotOptions?.series?.[optionName]);
+        const chart = this.chart, option = this.options[optionName], plotOptions = chart.options.plotOptions, oldOption = this.userOptions[optionName], plotOptionsOption = (plotOptions?.[this.type]?.[optionName] ?? plotOptions?.series?.[optionName]);
         // Check if `plotOptions` are defined already, #19203
         if (oldOption && !defined(plotOptionsOption)) {
             return option !== oldOption;
         }
-        return option !== pick(plotOptionsOption, option);
+        return option !== (plotOptionsOption ?? option);
     }
     /**
      * Runs on mouse over the series graphical items.
@@ -35815,10 +36006,11 @@ class Series {
      *        Determines if state should be inherited by points too.
      */
     setState(state, inherit) {
-        const series = this, { graph, options } = series, { inactiveOtherPoints, states: stateOptions } = options, 
+        const series = this, { graph, options } = series, { inactiveOtherPoints, states: stateOptions = {} } = options, 
         // By default a quick animation to hover/inactive,
         // slower to un-hover
-        stateAnimation = pick(stateOptions?.[state || 'normal']?.animation, series.chart.options.chart.animation);
+        stateAnimation = stateOptions[state || 'normal']?.animation ??
+            series.chart.options.chart.animation;
         let { lineWidth, opacity } = options;
         state = state || '';
         if (series.state !== state) {
@@ -35845,9 +36037,13 @@ class Series {
                     return;
                 }
                 if (state) {
-                    lineWidth = (stateOptions[state].lineWidth ||
-                        lineWidth + (stateOptions[state].lineWidthPlus || 0)); // #4035
-                    opacity = pick(stateOptions[state].opacity, opacity);
+                    lineWidth = stateOptions[state]?.lineWidth ?? (!isNumber(lineWidth) ?
+                        void 0 :
+                        // Increase by lineWidthPlus only when lineWidth
+                        // is a number.
+                        (lineWidth +
+                            (stateOptions?.[state]?.lineWidthPlus || 0))); // #4035
+                    opacity = stateOptions[state]?.opacity ?? opacity;
                 }
                 if (graph && !graph.dashstyle && isNumber(lineWidth)) {
                     // Animate the graph stroke-width
@@ -35891,11 +36087,7 @@ class Series {
      *        Can be either `hover` or undefined to set to normal state.
      */
     setAllPointsToState(state) {
-        this.points.forEach(function (point) {
-            if (point.setState) {
-                point.setState(state);
-            }
-        });
+        this.points.forEach((point) => point.setState?.(state));
     }
     /**
      * Show or hide the series.
@@ -36576,7 +36768,6 @@ Series_SeriesRegistry.series = Series;
  * */
 
 
-const { animObject: Legend_animObject, setAnimation: Legend_setAnimation } = AnimationUtilities;
 
 const { registerEventOptions: Legend_registerEventOptions } = Core_Foundation;
 
@@ -36705,7 +36896,7 @@ class Legend {
      * @param {Highcharts.LegendOptions} options
      */
     setOptions(options) {
-        const padding = pick(options.padding, 8);
+        const padding = (options.padding ?? 8);
         /**
          * Legend options.
          *
@@ -36722,7 +36913,7 @@ class Legend {
         this.itemMarginBottom = options.itemMarginBottom;
         this.padding = padding;
         this.initialItemY = padding - 5; // 5 is pixels above the text
-        this.symbolWidth = pick(options.symbolWidth, 16);
+        this.symbolWidth = (options.symbolWidth ?? 16);
         this.pages = [];
         this.proximate = options.layout === 'proximate' && !this.chart.inverted;
         // #12705: baseline has to be reset on every update
@@ -36756,7 +36947,7 @@ class Legend {
         }
         this.destroy();
         chart.isDirtyLegend = chart.isDirtyBox = true;
-        if (pick(redraw, true)) {
+        if (redraw ?? true) {
             chart.redraw();
         }
         fireEvent(this, 'afterUpdate', { redraw });
@@ -36994,7 +37185,7 @@ class Legend {
      * The item to render.
      */
     renderItem(item) {
-        const legend = this, legendItem = item.legendItem = item.legendItem || {}, chart = legend.chart, renderer = chart.renderer, options = legend.options, horizontal = options.layout === 'horizontal', symbolWidth = legend.symbolWidth, symbolPadding = options.symbolPadding || 0, itemStyle = legend.itemStyle, itemHiddenStyle = legend.itemHiddenStyle, itemDistance = horizontal ? pick(options.itemDistance, 20) : 0, ltr = !options.rtl, isSeries = !item.series, series = !isSeries && item.series.drawLegendSymbol ?
+        const legend = this, legendItem = item.legendItem = item.legendItem || {}, chart = legend.chart, renderer = chart.renderer, options = legend.options, horizontal = options.layout === 'horizontal', symbolWidth = legend.symbolWidth, symbolPadding = options.symbolPadding || 0, itemStyle = legend.itemStyle, itemHiddenStyle = legend.itemHiddenStyle, itemDistance = horizontal ? (options.itemDistance ?? 20) : 0, ltr = !options.rtl, isSeries = !item.series, series = !isSeries && item.series.drawLegendSymbol ?
             item.series :
             item, seriesOptions = series.options, showCheckbox = (!!legend.createCheckboxForItem &&
             seriesOptions &&
@@ -37040,9 +37231,11 @@ class Legend {
                     legend.fontMetrics.f + 3 + legend.itemMarginTop;
                 label.attr('y', legend.baseline);
                 legend.symbolHeight =
-                    pick(options.symbolHeight, legend.fontMetrics.f);
+                    (options.symbolHeight ?? legend.fontMetrics.f);
                 if (options.squareSymbol) {
-                    legend.symbolWidth = pick(options.symbolWidth, Math.max(legend.symbolHeight, 16));
+                    legend.symbolWidth =
+                        options.symbolWidth ??
+                            Math.max(legend.symbolHeight, 16);
                     itemExtraWidth = legend.symbolWidth + symbolPadding +
                         itemDistance + (showCheckbox ? 20 : 0);
                     if (ltr) {
@@ -37094,7 +37287,7 @@ class Legend {
      * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item
      */
     layoutItem(item) {
-        const options = this.options, padding = this.padding, horizontal = options.layout === 'horizontal', itemHeight = item.itemHeight, itemMarginBottom = this.itemMarginBottom, itemMarginTop = this.itemMarginTop, itemDistance = horizontal ? pick(options.itemDistance, 20) : 0, maxLegendWidth = this.maxLegendWidth, itemWidth = (options.alignColumns &&
+        const options = this.options, padding = this.padding, horizontal = options.layout === 'horizontal', itemHeight = item.itemHeight, itemMarginBottom = this.itemMarginBottom, itemMarginTop = this.itemMarginTop, itemDistance = horizontal ? (options.itemDistance ?? 20) : 0, maxLegendWidth = this.maxLegendWidth, itemWidth = (options.alignColumns &&
             this.totalItemWidth > maxLegendWidth) ?
             this.maxItemWidth :
             item.itemWidth, legendItem = item.legendItem || {};
@@ -37148,7 +37341,9 @@ class Legend {
             const seriesOptions = series?.options;
             // Handle showInLegend. If the series is linked to another series,
             // defaults to false.
-            if (series && pick(seriesOptions.showInLegend, !defined(seriesOptions.linkedTo) ? void 0 : false, true)) {
+            if (series &&
+                (seriesOptions.showInLegend ??
+                    (!defined(seriesOptions.linkedTo)))) {
                 // Use points or series for the legend item depending on
                 // legendType
                 allItems = allItems.concat(series.legendItem?.labels ||
@@ -37430,7 +37625,7 @@ class Legend {
      * @function Highcharts.Legend#handleOverflow
      */
     handleOverflow(legendHeight) {
-        const legend = this, chart = this.chart, renderer = chart.renderer, options = this.options, optionsY = options.y, alignTop = options.verticalAlign === 'top', padding = this.padding, maxHeight = options.maxHeight, navOptions = options.navigation, animation = pick(navOptions.animation, true), arrowSize = navOptions.arrowSize || 12, pages = this.pages, allItems = this.allItems, clipToHeight = function (height) {
+        const legend = this, chart = this.chart, renderer = chart.renderer, options = this.options, optionsY = options.y, alignTop = options.verticalAlign === 'top', padding = this.padding, maxHeight = options.maxHeight, navOptions = options.navigation, animation = (navOptions.animation ?? true), arrowSize = navOptions.arrowSize || 12, pages = this.pages, allItems = this.allItems, clipToHeight = function (height) {
             if (typeof height === 'number') {
                 clipRect.attr({
                     height: height
@@ -37476,7 +37671,7 @@ class Legend {
             navOptions.enabled !== false) {
             this.clipHeight = clipHeight =
                 Math.max(spaceHeight - 20 - this.titleHeight - padding, 0);
-            this.currentPage = pick(this.currentPage, 1);
+            this.currentPage = (this.currentPage ?? 1);
             this.fullHeight = legendHeight;
             // Fill pages with Y positions so that the top of each a legend item
             // defines the scroll top for each page (#2098)
@@ -37579,7 +37774,7 @@ class Legend {
         }
         if (currentPage > 0) {
             if (typeof animation !== 'undefined') {
-                Legend_setAnimation(animation, chart);
+                setAnimation(animation, chart);
             }
             this.nav.attr({
                 translateX: padding,
@@ -37636,7 +37831,7 @@ class Legend {
             this.currentPage = currentPage;
             this.positionCheckboxes();
             // Fire event after scroll animation is complete
-            const animOptions = Legend_animObject(pick(animation, chart.renderer.globalAnimation, true));
+            const animOptions = animObject((animation ?? chart.renderer.globalAnimation ?? true));
             syncTimeout(() => {
                 fireEvent(this, 'afterScroll', { currentPage });
             }, animOptions.duration);
@@ -37846,7 +38041,7 @@ class Legend {
  */ /**
 * Related browser event.
 * @name Highcharts.LegendItemClickEventObject#browserEvent
-* @type {Highcharts.PointerEvent}
+* @type {PointerEvent}
 */ /**
 * Prevent the default action of toggle the visibility of the series or point.
 * @name Highcharts.LegendItemClickEventObject#preventDefault
@@ -37897,7 +38092,7 @@ class Legend {
  */ /**
 * Related browser event.
 * @name Highcharts.PointLegendItemClickEventObject#browserEvent
-* @type {Highcharts.PointerEvent}
+* @type {PointerEvent}
 */ /**
 * Whether the default action has been prevented (`true`) or not.
 * @name Highcharts.PointLegendItemClickEventObject#defaultPrevented
@@ -37953,7 +38148,7 @@ class Legend {
  */ /**
 * Related browser event.
 * @name Highcharts.SeriesLegendItemClickEventObject#browserEvent
-* @type {Highcharts.PointerEvent}
+* @type {PointerEvent}
 */ /**
 * Whether the default action has been prevented (`true`) or not.
 * @name Highcharts.SeriesLegendItemClickEventObject#defaultPrevented
@@ -37987,7 +38182,6 @@ class Legend {
  * */
 
 
-const { animate: Chart_animate, animObject: Chart_animObject, setAnimation: Chart_setAnimation } = AnimationUtilities;
 
 
 const { defaultOptions: Chart_defaultOptions } = Defaults;
@@ -38078,7 +38272,7 @@ class Chart {
      */
     static chart(a, b, c) {
         const chart = new Chart(a, b, c);
-        return chart.promise || chart;
+        return chart.promise ?? chart;
     }
     // Implementation
     constructor(a, 
@@ -38119,10 +38313,10 @@ class Chart {
         const chart = this, options = chart.options.chart, zooming = options.zooming;
         chart.zooming = {
             ...zooming,
-            type: pick(options.zoomType, zooming.type),
-            key: pick(options.zoomKey, zooming.key),
-            pinchType: pick(options.pinchType, zooming.pinchType),
-            singleTouch: pick(options.zoomBySingleTouch, zooming.singleTouch, false),
+            type: (options.zoomType ?? zooming.type),
+            key: (options.zoomKey ?? zooming.key),
+            pinchType: (options.pinchType ?? zooming.pinchType),
+            singleTouch: options.zoomBySingleTouch ?? zooming.singleTouch ?? false,
             resetButton: merge(zooming.resetButton, options.resetZoomButton)
         };
     }
@@ -38465,7 +38659,7 @@ class Chart {
     redraw(animation) {
         fireEvent(this, 'beforeRedraw');
         const chart = this, axes = chart.hasCartesianSeries ? chart.axes : chart.colorAxis || [], series = chart.series, pointer = chart.pointer, legend = chart.legend, legendUserOptions = chart.userOptions.legend, renderer = chart.renderer, isHiddenChart = renderer.isHidden(), afterRedraw = [];
-        let hasDirtyStacks, hasStackedSeries, i, isDirtyBox = chart.isDirtyBox, redrawLegend = chart.isDirtyLegend, serie;
+        let hasDirtyStacks, hasStackedSeries, i, redrawLegend = chart.isDirtyLegend, serie;
         renderer.rootFontSize = renderer.boxWrapper.getStyle('font-size');
         // Handle responsive rules, not only on resize (#6130)
         if (chart.setResponsive) {
@@ -38474,7 +38668,7 @@ class Chart {
         // Set the global animation. When chart.hasRendered is not true, the
         // redraw call comes from a responsive rule and animation should not
         // occur.
-        Chart_setAnimation(chart.hasRendered ? animation : false, chart);
+        setAnimation(chart.hasRendered ? animation : false, chart);
         if (isHiddenChart) {
             chart.temporaryDisplay();
         }
@@ -38537,6 +38731,7 @@ class Chart {
         });
         chart.getMargins(); // #3098
         // If one axis is dirty, all axes must be redrawn (#792, #2169)
+        let isDirtyBox = chart.isDirtyBox;
         axes.forEach(function (axis) {
             if (axis.isDirty) {
                 isDirtyBox = true;
@@ -38673,7 +38868,7 @@ class Chart {
             // inspect the generated series.points.
             series.getPointsCollection()
                 .forEach((point) => {
-                if (pick(point.selectedStaging, point.selected)) {
+                if (point.selectedStaging ?? point.selected) {
                     acc.push(point);
                 }
             });
@@ -39072,11 +39267,8 @@ class Chart {
         const chartHeight = chart.chartHeight;
         let chartWidth = chart.chartWidth;
         // Allow table cells and flex-boxes to shrink without the chart
-        // blocking them out (#6427) but skip in styled mode so inline styles
-        // don't override user CSS on renderTo
-        if (!chart.styledMode) {
-            css(renderTo, { overflow: 'hidden' });
-        }
+        // blocking them out (#6427)
+        css(renderTo, { overflow: 'hidden' });
         // Create the inner container
         if (!chart.styledMode) {
             containerStyle = extend({
@@ -39114,7 +39306,7 @@ class Chart {
             chartWidth = chart.chartWidth;
             if (!chart.styledMode) {
                 css(container, {
-                    width: pick(optionsChart.style?.width, chartWidth + 'px')
+                    width: (optionsChart.style?.width ?? chartWidth + 'px')
                 });
             }
         }
@@ -39133,7 +39325,7 @@ class Chart {
         // first ResizeObserver reflow
         chart.containerBox = chart.getContainerBox();
         // Set the initial animation from the options
-        Chart_setAnimation(void 0, chart);
+        setAnimation(void 0, chart);
         chart.setClassName(optionsChart.className);
         if (!chart.styledMode) {
             chart.renderer.setStyle(optionsChart.style);
@@ -39328,7 +39520,7 @@ class Chart {
         // Handle the isResizing counter
         chart.isResizing += 1;
         // Set the animation for the current process
-        Chart_setAnimation(animation, chart);
+        setAnimation(animation, chart);
         const globalAnimation = renderer.globalAnimation;
         chart.oldChartHeight = chart.chartHeight;
         chart.oldChartWidth = chart.chartWidth;
@@ -39347,7 +39539,7 @@ class Chart {
             // Resize the container with the global animation applied if enabled
             // (#2503)
             if (!chart.styledMode) {
-                (globalAnimation ? Chart_animate : css)(chart.container, {
+                (globalAnimation ? animate : css)(chart.container, {
                     width: `${chartWidth + scrollablePixelsX}px`,
                     height: `${chartHeight + scrollablePixelsY}px`
                 }, globalAnimation);
@@ -39373,7 +39565,7 @@ class Chart {
                 if (chart) {
                     fireEvent(chart, 'endResize');
                 }
-            }, Chart_animObject(globalAnimation).duration);
+            }, animObject(globalAnimation).duration);
         }
         // Handle resizing counter even if we've re-rendered or not (#20548).
         chart.isResizing -= 1;
@@ -39757,7 +39949,7 @@ class Chart {
                 const mockTick = new Axis_Tick(axis, 0, '', true), label = mockTick.createLabel('x', labels);
                 mockTick.destroy();
                 if (label &&
-                    pick(labels.reserveSpace, !isNumber(options.crossing))) {
+                    (labels.reserveSpace ?? !isNumber(options.crossing))) {
                     expectedSpace = label.getBBox().height +
                         labels.distance +
                         Math.max(isNumber(offset) ? offset : 0, 0);
@@ -40092,7 +40284,7 @@ class Chart {
         const chart = this;
         let series;
         if (options) { // <- not necessary
-            redraw = pick(redraw, true); // Defaults to true
+            redraw = (redraw ?? true); // Defaults to true
             fireEvent(chart, 'addSeries', { options: options }, function () {
                 series = chart.initSeries(options);
                 chart.isDirtyLegend = true;
@@ -40183,7 +40375,7 @@ class Chart {
      */
     createAxis(coll, options) {
         const axis = new Axis_Axis(this, options.axis, coll);
-        if (pick(options.redraw, true)) {
+        if (options.redraw ?? true) {
             this.redraw(options.animation);
         }
         return axis;
@@ -40231,7 +40423,7 @@ class Chart {
         }
         loadingDiv.className = 'highcharts-loading';
         // Update text
-        HTML_AST.setElementHTML(loadingSpan, pick(str, options.lang.loading, ''));
+        HTML_AST.setElementHTML(loadingSpan, (str ?? options.lang.loading ?? ''));
         if (!chart.styledMode) {
             // Update visuals
             css(loadingDiv, extend(loadingStyle, { zIndex: 10 }));
@@ -40242,7 +40434,7 @@ class Chart {
                     opacity: 0,
                     display: ''
                 });
-                Chart_animate(loadingDiv, {
+                animate(loadingDiv, {
                     opacity: loadingStyle.opacity ?? 0.5
                 }, {
                     duration: loadingOptions?.showDuration ?? 0
@@ -40270,7 +40462,7 @@ class Chart {
             loadingDiv.className =
                 'highcharts-loading highcharts-loading-hidden';
             if (!this.styledMode) {
-                Chart_animate(loadingDiv, {
+                animate(loadingDiv, {
                     opacity: 0
                 }, {
                     duration: options.loading?.hideDuration ?? 100,
@@ -40302,6 +40494,9 @@ class Chart {
      * Note that when changing series data, `chart.update` may mutate the passed
      * data options.
      *
+     * If the given options don't differ from the current chart options, the
+     * update is skipped and the `afterUpdate` event is not emitted.
+     *
      * See also the
      * [responsive option set](https://api.highcharts.com/highcharts/responsive).
      * Switching between `responsive.rules` basically runs `chart.update` under
@@ -40346,14 +40541,24 @@ class Chart {
             caption: 'setCaption'
         }, isResponsiveOptions = options.isResponsiveOptions, itemsForRemoval = [];
         let updateAllAxes, updateAllSeries, runSetSize;
-        fireEvent(chart, 'update', { options: options });
+        options = diffObjects(options, chart.options);
+        const e = {
+            options,
+            // Event handlers can turn this on or off to control further
+            // processing
+            hasChanged: !!Object.keys(options).length
+        };
+        fireEvent(chart, 'update', e);
+        // If no changes are detected, stop further processing (#24805).
+        if (!e.hasChanged) {
+            return;
+        }
         // If there are responsive rules in action, undo the responsive rules
         // before we apply the updated options and replay the responsive rules
         // on top from the chart.redraw function (#9617).
         if (!isResponsiveOptions) {
             chart.setResponsive(false, true);
         }
-        options = diffObjects(options, chart.options);
         chart.userOptions = merge(chart.userOptions, options);
         // If the top-level chart option is present, some special updates are
         // required
@@ -40456,7 +40661,7 @@ class Chart {
                     }
                     // No match by id found, match by index instead
                     if (!item && chart[coll]) {
-                        item = chart[coll][pick(newOptions.index, i)];
+                        item = chart[coll][(newOptions.index ?? i)];
                         // Check if we grabbed an item with an existing but
                         // different id (#13541). Check that the item in this
                         // position is not internal (navigator).
@@ -40532,7 +40737,7 @@ class Chart {
             (isNumber(newHeight) && newHeight !== chart.chartHeight)) {
             chart.setSize(newWidth, newHeight, animation);
         }
-        else if (pick(redraw, true)) {
+        else if (redraw ?? true) {
             chart.redraw(animation);
         }
         fireEvent(chart, 'afterUpdate', {
@@ -40581,15 +40786,11 @@ class Chart {
     showResetZoom() {
         const chart = this, lang = chart.options.lang, btnOptions = chart.zooming.resetButton, theme = btnOptions.theme, alignTo = (btnOptions.relativeTo === 'chart' ||
             btnOptions.relativeTo === 'spacingBox' ?
-            null :
+            void 0 :
             'plotBox');
-        /** @internal */
-        function zoomOut() {
-            chart.zoomOut();
-        }
-        fireEvent(this, 'beforeShowResetZoom', null, function () {
+        fireEvent(this, 'beforeShowResetZoom', void 0, () => {
             chart.resetZoomButton = chart.renderer
-                .button(lang.resetZoom, null, null, zoomOut, theme)
+                .button(lang.resetZoom, 0, 0, () => chart.zoomOut(), theme)
                 .attr({
                 align: btnOptions.position.align,
                 title: lang.resetZoomTitle
@@ -40667,21 +40868,21 @@ class Chart {
      * @function Highcharts.Chart#transform
      */
     transform(params) {
-        const { axes = this.axes, event, from = {}, reset, selection, to = {}, trigger, allowResetButton = true } = params, { inverted, time } = this;
+        const { axes = this.axes, event, from = {}, reset, selection, to = {}, trigger, allowResetButton = true } = params, { time } = this;
         // Remove active points for shared tooltip
         this.hoverPoints?.forEach((point) => point.setState());
         fireEvent(this, 'transform', params);
         let hasZoomed = params.hasZoomed || false, displayButton, isAnyAxisPanning;
         for (const axis of axes) {
-            const { horiz, len, minPointOffset = 0, options, reversed } = axis, wh = horiz ? 'width' : 'height', xy = horiz ? 'x' : 'y', toLength = pick(to[wh], axis.len), fromLength = pick(from[wh], axis.len), 
+            const { horiz, len, minPointOffset = 0, options, reversed } = axis, wh = horiz ? 'width' : 'height', xy = horiz ? 'x' : 'y', toLength = (to[wh] ?? axis.len), fromLength = (from[wh] ?? axis.len), 
             // If fingers pinched very close on this axis, treat as pan
             scale = Math.abs(toLength) < 10 ?
                 1 :
                 toLength / fromLength, fromCenter = (from[xy] || 0) + fromLength / 2 - axis.pos, toCenter = (to[xy] ?? axis.pos) +
-                toLength / 2 - axis.pos, move = fromCenter - toCenter / scale, pointRangeDirection = (reversed && !inverted) ||
-                (!reversed && inverted) ?
-                -1 :
-                1, minPx = move;
+                toLength / 2 - axis.pos, move = fromCenter - toCenter / scale, pointRangeDirection = ((horiz && !reversed) ||
+                (!horiz && reversed)) ?
+                1 :
+                -1, minPx = move;
             // Zooming in multiple panes, zoom only in the pane that receives
             // the input
             if (!reset && (fromCenter < 0 || fromCenter > axis.len)) {
@@ -40690,17 +40891,11 @@ class Chart {
             // Adjust offset to ensure selection zoom triggers correctly
             // (#22945)
             // Set offset to 0 for ordinal axis only when zooming out, (#24545).
-            const offset = (axis.chart.polar || (axis.isOrdinal && scale <= 1)) ?
+            const offset = (selection || axis.chart.polar ||
+                (axis.isOrdinal && scale <= 1)) ?
                 0 :
                 (minPointOffset * pointRangeDirection || 0), eventMin = axis.toValue(minPx, true), eventMax = axis.toValue(minPx + len / scale, true);
             let newMin = eventMin + offset, newMax = eventMax - offset, allExtremes = axis.allExtremes;
-            if (selection) {
-                selection[axis.coll].push({
-                    axis,
-                    min: Math.min(eventMin, eventMax),
-                    max: Math.max(eventMin, eventMax)
-                });
-            }
             if (newMin > newMax) {
                 [newMin, newMax] = [newMax, newMin];
             }
@@ -40757,14 +40952,15 @@ class Chart {
                 }
                 // Set new extremes if they are actually new
                 if (reset || (axis.series.length &&
-                    (newMin !== min || newMax !== max) &&
-                    newMin >= floor &&
-                    newMax <= ceiling)) {
+                    (selection ||
+                        ((newMin !== min || newMax !== max) &&
+                            newMin >= floor &&
+                            newMax <= ceiling)))) {
                     if (selection) {
                         selection[axis.coll].push({
                             axis,
-                            min: newMin,
-                            max: newMax
+                            min: Math.min(eventMin, eventMax),
+                            max: Math.max(eventMin, eventMax)
                         });
                     }
                     else {
@@ -40772,11 +40968,14 @@ class Chart {
                         // disallow certain axis padding options that would make
                         // panning/zooming hard. Reset and redraw after the
                         // operation has finished.
-                        axis.isPanning = trigger !== 'zoom';
+                        axis.isPanning = trigger !== 'zoom' &&
+                            trigger !== 'drop';
                         if (axis.isPanning && trigger !== 'mousewheel') {
                             isAnyAxisPanning = true; // #21319
                         }
-                        axis.setExtremes(reset ? void 0 : newMin, reset ? void 0 : newMax, false, false, { move, trigger, scale });
+                        if (trigger !== 'drop') {
+                            axis.setExtremes(reset ? void 0 : newMin, reset ? void 0 : newMax, false, false, { move, trigger, scale });
+                        }
                         if (!reset &&
                             (newMin > floor || newMax < ceiling)) {
                             displayButton = allowResetButton;
@@ -40807,7 +41006,8 @@ class Chart {
                 });
             }
             else {
-                // Show or hide the Reset zoom button, but not while panning
+                // Show or hide the Reset zoom button, but not while
+                // panning.
                 if (displayButton &&
                     !isAnyAxisPanning &&
                     !this.resetZoomButton) {
@@ -41049,7 +41249,6 @@ extend(Chart.prototype, {
  */
 
 
-const { stop: ScrollablePlotArea_stop } = AnimationUtilities;
 
 const { composed: ScrollablePlotArea_composed } = Core_Globals;
 
@@ -41215,7 +41414,7 @@ class ScrollablePlotArea {
             this.moveFixedElements();
         }
         // Increase the size of the scrollable renderer and background
-        ScrollablePlotArea_stop(chart.container);
+        stop(chart.container);
         css(container, {
             width: `${scrollableWidth}px`,
             height: `${scrollableHeight}px`
@@ -41372,6 +41571,13 @@ ScrollablePlotArea.fixedSelectors = [
  * vertical scrolling, depending on whether the `minWidth` or `minHeight`
  * option is set.
  *
+ * **Note:** Because native browser scrollbars are used, they may
+ * overlap with fixed chart elements such as credits or the chart
+ * border. To avoid this collision, it is recommended to manually add
+ * extra space to the corresponding side using `chart.spacingBottom`
+ * (for horizontal scrollbars) or `chart.spacingRight` (for vertical
+ * scrollbars).
+ *
  * @sample highcharts/chart/scrollable-plotarea
  *         Scrollable plot area
  * @sample highcharts/chart/scrollable-plotarea-vertical
@@ -41532,7 +41738,7 @@ class StackItem {
                 r: options.borderRadius || 0,
                 text: str,
                 // Set default padding to 5 as it is in dataLabels #12308
-                padding: pick(options.padding, 5),
+                padding: (options.padding ?? 5),
                 visibility: 'hidden' // Hidden until setOffset is called
             };
             if (!chart.styledMode) {
@@ -41566,7 +41772,7 @@ class StackItem {
         }), { verticalAlign } = alignOptions;
         if (label && stackBox) {
             const labelBox = label.getBBox(void 0, 0), padding = label.padding;
-            let isJustify = pick(options.overflow, 'justify') === 'justify', visible;
+            let isJustify = (options.overflow ?? 'justify') === 'justify', visible;
             // Reset alignOptions property after justify #12337
             alignOptions.x = options.x || 0;
             alignOptions.y = options.y || 0;
@@ -41603,7 +41809,7 @@ class StackItem {
                 rotationOriginY: labelBox.height / 2
             });
             // Check if the dataLabel should be visible.
-            if (pick(!isJustify && options.crop, true)) {
+            if (((!isJustify && options.crop) ?? true)) {
                 visible =
                     isNumber(label.x) &&
                         isNumber(label.y) &&
@@ -41637,7 +41843,7 @@ class StackItem {
     getStackBox(stackBoxProps) {
         const stackItem = this, axis = this.axis, chart = axis.chart, { boxTop, defaultX, xOffset, width, boxBottom } = stackBoxProps, totalStackValue = axis.stacking.usePercentage ?
             100 :
-            pick(boxTop, this.total, 0), y = axis.toPixels(totalStackValue), xAxis = stackBoxProps.xAxis || chart.xAxis[0], x = pick(defaultX, xAxis.translate(this.x)) + xOffset, yZero = axis.toPixels(boxBottom ||
+            (boxTop ?? this.total ?? 0), y = axis.toPixels(totalStackValue), xAxis = stackBoxProps.xAxis || chart.xAxis[0], x = (defaultX ?? xAxis.translate(this.x)) + xOffset, yZero = axis.toPixels(boxBottom ||
             (isNumber(axis.min) &&
                 axis.logarithmic &&
                 axis.logarithmic.lin2log(axis.min)) ||
@@ -41722,7 +41928,6 @@ class StackItem {
  * */
 
 
-const { getDeferredAnimation: StackingAxis_getDeferredAnimation } = AnimationUtilities;
 
 const { series: { prototype: seriesProto } } = Series_SeriesRegistry;
 
@@ -41751,7 +41956,7 @@ function chartGetStacks() {
         if (series.options.stacking && series.reserveSpace()) {
             series.stackKey = [
                 series.type,
-                pick(series.options.stack, ''),
+                (series.options.stack ?? ''),
                 inverted ? xAxisOptions.top : xAxisOptions.left,
                 inverted ? xAxisOptions.height : xAxisOptions.width
             ].join(',');
@@ -41914,7 +42119,7 @@ function seriesSetStackedPoints(axis, stackingParam) {
         stack = stacks[key][x];
         if (y !== null) {
             stack.points[pointKey] = stack.points[series.index] = [
-                pick(stack.cumulative, stackThreshold)
+                (stack.cumulative ?? stackThreshold)
             ];
             // Record the base of the stack
             if (!defined(stack.cumulative)) {
@@ -41962,7 +42167,7 @@ function seriesSetStackedPoints(axis, stackingParam) {
             stack.cumulative = (total || 1) - 1;
         }
         else {
-            stack.cumulative = correctFloat(pick(stack.cumulative, stackThreshold) + yNumber);
+            stack.cumulative = correctFloat((stack.cumulative ?? stackThreshold) + yNumber);
         }
         stack.total = total;
         if (y !== null) {
@@ -42066,7 +42271,7 @@ class AxisAdditions {
     }
     /** @internal */
     renderStackTotals() {
-        const stacking = this, axis = stacking.axis, chart = axis.chart, renderer = chart.renderer, stacks = stacking.stacks, stackLabelsAnim = axis.options.stackLabels?.animation, animationConfig = StackingAxis_getDeferredAnimation(chart, stackLabelsAnim || false), stackTotalGroup = stacking.stackTotalGroup = (stacking.stackTotalGroup ||
+        const stacking = this, axis = stacking.axis, chart = axis.chart, renderer = chart.renderer, stacks = stacking.stacks, stackLabelsAnim = axis.options.stackLabels?.animation, animationConfig = getDeferredAnimation(chart, stackLabelsAnim || false), stackTotalGroup = stacking.stackTotalGroup = (stacking.stackTotalGroup ||
             renderer
                 .g('stack-labels')
                 .attr({
@@ -42977,8 +43182,7 @@ class AreaSeries extends AreaSeries_LineSeries {
      */
     getGraphPath(points) {
         const getGraphPath = AreaSeries_LineSeries.prototype.getGraphPath, options = this.options, stacking = options.stacking, yAxis = this.yAxis, bottomPoints = [], graphPoints = [], seriesIndex = this.index, stacks = yAxis.stacking.stacks[this.stackKey], threshold = options.threshold, translatedThreshold = Math.round(// #10909
-        yAxis.getThreshold(options.threshold)), connectNulls = pick(// #10574
-        options.connectNulls, stacking === 'percent'), 
+        yAxis.getThreshold(options.threshold)), connectNulls = (options.connectNulls ?? stacking === 'percent'), 
         // To display null points in underlying stacked series, this
         // series graph must be broken, and the area also fall down to
         // fill the gap left by the null point. #2069
@@ -43031,9 +43235,9 @@ class AreaSeries extends AreaSeries_LineSeries {
             // Treat points with undefined plotY as null (e.g. non-positive
             // values on logarithmic axis, #18422)
             isNull = points[i].isNull || !defined(points[i].plotY);
-            plotX = pick(points[i].rectPlotX, points[i].plotX);
+            plotX = (points[i].rectPlotX ?? points[i].plotX);
             yBottom = stacking ?
-                pick(points[i].yBottom, translatedThreshold) :
+                (points[i].yBottom ?? translatedThreshold) :
                 translatedThreshold;
             if (!isNull || connectNulls) {
                 if (!connectNulls) {
@@ -43371,10 +43575,10 @@ class SplineSeries extends SplineSeries_LineSeries {
         }
         const ret = [
             'C',
-            pick(lastPoint.rightContX, lastPoint.plotX, 0),
-            pick(lastPoint.rightContY, lastPoint.plotY, 0),
-            pick(leftContX, plotX, 0),
-            pick(leftContY, plotY, 0),
+            (lastPoint.rightContX ?? lastPoint.plotX ?? 0),
+            (lastPoint.rightContY ?? lastPoint.plotY ?? 0),
+            (leftContX ?? plotX ?? 0),
+            (leftContY ?? plotY ?? 0),
             plotX,
             plotY
         ];
@@ -43819,6 +44023,8 @@ const ColumnSeriesDefaults = {
      *          0.25
      * @sample {highcharts} highcharts/plotoptions/column-pointpadding-none/
      *         0 for tightly packed columns
+     * @sample {highcharts} highcharts/plotoptions/pie-pointpadding/
+     *         Pie point padding plugin
      *
      * @product highcharts highstock gantt
      */
@@ -44150,12 +44356,12 @@ const ColumnSeriesDefaults = {
  */
 /**
  * @excluding halo, lineWidth, lineWidthPlus, marker
- * @product   highcharts highstock
+ * @product   highcharts highstock gantt
  * @apioption series.column.states.hover
  */
 /**
  * @excluding halo, lineWidth, lineWidthPlus, marker
- * @product   highcharts highstock
+ * @product   highcharts highstock gantt
  * @apioption series.column.states.select
  */
 /**
@@ -44185,7 +44391,6 @@ const ColumnSeriesDefaults = {
  * */
 
 
-const { animObject: ColumnSeries_animObject } = AnimationUtilities;
 
 const { parse: ColumnSeries_color } = Color_Color;
 
@@ -44256,7 +44461,7 @@ class ColumnSeries extends Series_Series {
         }
         else { // Run the animation
             translateStart = Number(series.group.attr(translateProp));
-            series.group.animate({ scaleY: 1 }, extend(ColumnSeries_animObject(series.options.animation), {
+            series.group.animate({ scaleY: 1 }, extend(animObject(series.options.animation), {
                 // Do the scale synchronously to ensure smooth
                 // updating (#5030, #7228)
                 step: function (val, fx) {
@@ -44342,7 +44547,7 @@ class ColumnSeries extends Series_Series {
             xAxis.tickInterval ||
             1), // #2610
         xAxis.len // #1535
-        ), groupPadding = categoryWidth * options.groupPadding, groupWidth = categoryWidth - 2 * groupPadding, pointOffsetWidth = groupWidth / (columnCount || 1), pointWidth = Math.min(options.maxPointWidth || xAxis.len, pick(options.pointWidth, pointOffsetWidth * (1 - 2 * options.pointPadding))), pointPadding = (pointOffsetWidth - pointWidth) / 2, 
+        ), groupPadding = categoryWidth * options.groupPadding, groupWidth = categoryWidth - 2 * groupPadding, pointOffsetWidth = groupWidth / (columnCount || 1), pointWidth = Math.min(options.maxPointWidth || xAxis.len, (options.pointWidth ?? pointOffsetWidth * (1 - 2 * options.pointPadding))), pointPadding = (pointOffsetWidth - pointWidth) / 2, 
         // #1251, #3737
         colIndex = (series.columnIndex || 0) + (reverseStacks ? 1 : 0), pointXOffset = pointPadding +
             (groupPadding +
@@ -44592,11 +44797,11 @@ class ColumnSeries extends Series_Series {
      */
     pointAttribs(point, state) {
         const options = this.options, p2o = this.pointAttrToOptions || {}, strokeOption = p2o.stroke || 'borderColor', strokeWidthOption = p2o['stroke-width'] || 'borderWidth';
-        let stateOptions, zone, brightness, fill = (point && point.color) || this.color, 
+        let stateOptions, zone, brightness, fill = point?.color || this.color, 
         // Set to fill when borderColor null:
-        stroke = ((point && point[strokeOption]) ||
+        stroke = (point?.[strokeOption] ||
             options[strokeOption] ||
-            fill), dashstyle = (point && point.options.dashStyle) || options.dashStyle, strokeWidth = (point?.[strokeWidthOption]) ??
+            fill), dashstyle = point?.options.dashStyle || options.dashStyle, strokeWidth = point?.[strokeWidthOption] ??
             options[strokeWidthOption] ??
             this[strokeWidthOption] ?? 1, opacity = (point?.isNull && options.nullInteraction) ?
             0 :
@@ -44617,7 +44822,7 @@ class ColumnSeries extends Series_Series {
         }
         // Select or hover states
         if (state && point) {
-            stateOptions = merge(options.states[state], 
+            stateOptions = merge(options.states?.[state], 
             // #6401
             point.options.states?.[state] || {});
             brightness = stateOptions.brightness;
@@ -44627,14 +44832,13 @@ class ColumnSeries extends Series_Series {
                         .brighten(stateOptions.brightness)
                         .get()) || fill;
             stroke = stateOptions[strokeOption] || stroke;
-            strokeWidth =
-                stateOptions[strokeWidthOption] || strokeWidth;
+            strokeWidth = stateOptions[strokeWidthOption] || strokeWidth;
             dashstyle = stateOptions.dashStyle || dashstyle;
-            opacity = pick(stateOptions.opacity, opacity);
+            opacity = stateOptions.opacity ?? opacity;
         }
         const ret = {
-            fill: fill,
-            stroke: stroke,
+            fill,
+            stroke,
             'stroke-width': strokeWidth,
             opacity: point?.condemned ? 0 : opacity
         };
@@ -44675,6 +44879,7 @@ class ColumnSeries extends Series_Series {
                         initialAttr = merge(shapeArgs, point.getOrigin(point.origin, shapeArgs));
                         if (!styledMode) {
                             initialAttr.opacity = 0;
+                            initialAttr['stroke-width'] = 0;
                         }
                         shouldUpdate = true;
                         verb = 'animate';
@@ -44690,7 +44895,7 @@ class ColumnSeries extends Series_Series {
                 }
                 // Presentational
                 if (!styledMode) {
-                    graphic[verb](series.pointAttribs(point, (point.selected && 'select')))
+                    graphic[verb](series.pointAttribs(point, point.selected ? 'select' : ''))
                         .shadow(point.allowShadow !== false && options.shadow);
                 }
                 graphic
@@ -44814,6 +45019,7 @@ Series_SeriesRegistry.registerSeriesType('column', ColumnSeries);
  *  Default Export
  *
  * */
+/** @internal */
 /* harmony default export */ const Column_ColumnSeries = (ColumnSeries);
 /* *
  *
@@ -44850,7 +45056,6 @@ Series_SeriesRegistry.registerSeriesType('column', ColumnSeries);
  * */
 
 
-const { getDeferredAnimation: DataLabel_getDeferredAnimation } = AnimationUtilities;
 
 const { format: DataLabel_format } = Core_Templating;
 
@@ -44906,7 +45111,7 @@ var DataLabel;
                 // that parts of the align box is inside the plot area
                 // (#12370). When stacking, it is always inside regardless
                 // of the option (#15148).
-                pick(options.inside, !!this.options.stacking) &&
+                (options.inside ?? !!this.options.stacking) &&
                     alignTo &&
                     chart.isInsidePlot(plotX, inverted ?
                         alignTo.x + 1 :
@@ -45009,8 +45214,8 @@ var DataLabel;
             //     zIndex: 20
             // }).add();
             // chart.renderer.circle(
-            //     chart.plotLeft + pick(dataLabel.alignAttr.x, 0),
-            //     chart.plotTop + pick(dataLabel.alignAttr.y, 0),
+            //     chart.plotLeft + (dataLabel.alignAttr.x ?? 0),
+            //     chart.plotTop + (dataLabel.alignAttr.y ?? 0),
             //     2
             // ).attr({
             //     fill: 'red',
@@ -45167,7 +45372,7 @@ var DataLabel;
             'var(--highcharts-background-color)'), groupByIndex = [], seriesDlOptions = mergedDataLabelOptions(series);
         // Resolve the animation
         const { animation, defer } = seriesDlOptions[0], animationConfig = defer ?
-            DataLabel_getDeferredAnimation(chart, animation, series) :
+            getDeferredAnimation(chart, animation, series) :
             { defer: 0, duration: 0 };
         fireEvent(this, 'drawDataLabels');
         if (series.hasDataLabels?.()) {
@@ -45193,7 +45398,7 @@ var DataLabel;
                     if (labelEnabled) {
                         // Create individual options structure that can be
                         // extended without affecting others
-                        formatString = pick(labelOptions[point.formatPrefix + 'Format'], labelOptions.format);
+                        formatString = (labelOptions[point.formatPrefix + 'Format'] ?? labelOptions.format);
                         labelText = defined(formatString) ?
                             DataLabel_format(formatString, point, chart) :
                             (labelOptions[point.formatPrefix + 'Formatter'] ||
@@ -45201,7 +45406,9 @@ var DataLabel;
                         rotation = labelOptions.rotation;
                         if (!chart.styledMode) {
                             // Determine the color
-                            style.color = pick(labelOptions.color, style.color, isString(series.color) ? series.color : void 0, 'var(--highcharts-neutral-color-100)');
+                            style.color = (isString(labelOptions.color) ?
+                                labelOptions.color :
+                                void 0) ?? style.color ?? (isString(series.color) ? series.color : void 0) ?? 'var(--highcharts-neutral-color-100)';
                             // Get automated contrast color
                             if (style.color === 'contrast') {
                                 if (backgroundColor !== 'none') {
@@ -45933,6 +46140,8 @@ const ScatterSeriesDefaults = {
  *         Arrays of datetime x and y
  * @sample {highcharts} highcharts/series/data-array-of-name-value/
  *         Arrays of point.name and y
+ * @sample {highcharts} highcharts/series-scatter/scatter-cluster/
+ *         Computed clusters
  * @sample {highcharts} highcharts/series/data-array-of-objects/
  *         Config objects
  *
@@ -46000,14 +46209,15 @@ class ScatterSeries extends ScatterSeries_LineSeries {
             return rand - Math.floor(rand);
         }
         if (jitter) {
-            this.points.forEach(function (point, i) {
-                ['x', 'y'].forEach(function (dim, j) {
+            this.points.forEach((point, i) => {
+                ['x', 'y'].forEach((dim, j) => {
                     if (jitter[dim] && !point.isNull) {
-                        const plotProp = `plot${dim.toUpperCase()}`, axis = series[`${dim}Axis`], translatedJitter = jitter[dim] *
-                            axis.transA;
+                        const plotProp = `plot${dim.toUpperCase()}`, axis = series[`${dim}Axis`];
                         if (axis && !axis.logarithmic) {
                             // Identify the outer bounds of the jitter range
-                            const min = Math.max(0, (point[plotProp] || 0) - translatedJitter), max = Math.min(axis.len, (point[plotProp] || 0) + translatedJitter);
+                            // (#25054)
+                            const translatedJitter = jitter[dim] * axis.transA *
+                                (axis.reversed ? -1 : 1), min = (point[plotProp] || 0) - translatedJitter, max = (point[plotProp] || 0) + translatedJitter;
                             // Find a random position within this range
                             point[plotProp] = min +
                                 (max - min) * unrandom(i + j * len);
@@ -46081,7 +46291,7 @@ Series_SeriesRegistry.registerSeriesType('scatter', ScatterSeries);
 const { deg2rad: CenteredUtilities_deg2rad } = Core_Globals;
 
 /**
- * @private
+ * @internal
  */
 var CenteredUtilities;
 (function (CenteredUtilities) {
@@ -46099,7 +46309,7 @@ var CenteredUtilities;
      * Get the center of the pie based on the size and center options relative
      * to the plot area. Borrowed by the polar and gauge series types.
      *
-     * @private
+     * @internal
      * @function Highcharts.CenteredSeriesMixin.getCenter
      */
     function getCenter() {
@@ -46112,11 +46322,13 @@ var CenteredUtilities;
             innerSize = parseFloat(innerSize);
         }
         const positions = [
-            pick(centerOption?.[0], '50%'),
-            pick(centerOption?.[1], '50%'),
+            (centerOption?.[0] ?? '50%'),
+            (centerOption?.[1] ?? '50%'),
             // Prevent from negative values
-            pick(size && size < 0 ? void 0 : options.size, '100%'),
-            pick(innerSize && innerSize < 0 ? void 0 : options.innerSize || 0, '0%')
+            ((size && size < 0 ? void 0 : options.size) ?? '100%'),
+            ((innerSize && innerSize < 0 ?
+                void 0 :
+                options.innerSize || 0) ?? '0%')
         ];
         for (i = 0; i < 4; ++i) {
             value = positions[i];
@@ -46144,7 +46356,7 @@ var CenteredUtilities;
      * GetStartAndEndRadians - Calculates start and end angles in radians.
      * Used in series types such as pie and sunburst.
      *
-     * @private
+     * @internal
      * @function Highcharts.CenteredSeriesMixin.getStartAndEndRadians
      *
      * @param {number} [start]
@@ -46176,6 +46388,7 @@ var CenteredUtilities;
  *  Default Export
  *
  * */
+/** @internal */
 /* harmony default export */ const Series_CenteredUtilities = (CenteredUtilities);
 /* *
  *
@@ -46183,7 +46396,7 @@ var CenteredUtilities;
  *
  * */
 /**
- * @private
+ * @internal
  * @interface Highcharts.RadianAngles
  */ /**
 * @name Highcharts.RadianAngles#end
@@ -46208,7 +46421,6 @@ var CenteredUtilities;
  * */
 
 
-const { setAnimation: PiePoint_setAnimation } = AnimationUtilities;
 
 
 /* *
@@ -46316,9 +46528,9 @@ class PiePoint extends Series_Point {
      */
     slice(sliced, redraw, animation) {
         const series = this.series, chart = series.chart;
-        PiePoint_setAnimation(animation, chart);
+        setAnimation(animation, chart);
         // Redraw is true by default
-        redraw = pick(redraw, true);
+        redraw = (redraw ?? true);
         this.sliced = this.options.sliced = sliced ?? !this.sliced;
         // Update options.data
         if (series.options.data) {
@@ -47123,7 +47335,8 @@ class PieSeries extends Series_Series {
                     // Start values
                     graphic.attr({
                         // Animate from inner radius (#779)
-                        r: pick(point.startR, (series.center && series.center[3] / 2)),
+                        r: point.startR ??
+                            (series.center && series.center[3] / 2),
                         start: startAngleRad,
                         end: startAngleRad
                     });
@@ -47764,7 +47977,7 @@ var PieDataLabel_ColumnDataLabel;
                         labelPosition.computed.x = x;
                         labelPosition.computed.y = y - topOffset;
                         // Detect overflowing data labels
-                        if (pick(dataLabelOptions.crop, true)) {
+                        if (dataLabelOptions.crop ?? true) {
                             dataLabelWidth = dataLabel.getBBox().width;
                             let sideOverflow;
                             // Overflow left
@@ -48280,7 +48493,10 @@ function OverlappingDataLabels_onChartRender() {
                     if (point.visible) {
                         (point.dataLabels || []).forEach((label) => {
                             const options = label.options || {};
-                            label.labelrank = pick(options.labelrank, point.labelrank, point.shapeArgs?.height); // #4118
+                            label.labelrank =
+                                options.labelrank ??
+                                    point.labelrank ??
+                                    point.shapeArgs?.height; // #4118
                             // #21725: Sync target positions for generic overlap
                             // checking. During animations (e.g., toggling a
                             // point), DOM positions may overlap. We force
@@ -48454,7 +48670,7 @@ function BorderRadius_arc(x, y, w, h, options = {}) {
     if (options.open || !options.borderRadius) {
         return path;
     }
-    const alpha = end - start, sinHalfAlpha = Math.sin(alpha / 2), borderRadius = Math.max(Math.min(relativeLength(options.borderRadius || 0, r - innerR), 
+    const alpha = end - start, sinHalfAlpha = Math.sin(alpha / 2), borderRadius = Math.max(Math.min(relativeLength(borderRadiusObject(options.borderRadius).radius, r - innerR), 
     // Cap to half the sector radius
     (r - innerR) / 2, 
     // For smaller pie slices, cap to the largest small circle that
@@ -48480,7 +48696,7 @@ function seriesOnAfterColumnTranslate() {
     if (this.options.borderRadius &&
         !(this.chart.is3d && this.chart.is3d())) {
         const { options, yAxis } = this, percent = options.stacking === 'percent', seriesDefault = BorderRadius_defaultOptions.plotOptions?.[this.type]
-            ?.borderRadius, borderRadius = optionsToObject(options.borderRadius, isObject(seriesDefault) ? seriesDefault : {}), reversed = yAxis.options.reversed;
+            ?.borderRadius, borderRadius = borderRadiusObject(options.borderRadius, isObject(seriesDefault) ? seriesDefault : {}), reversed = yAxis.options.reversed;
         for (const point of this.points) {
             const { shapeArgs } = point;
             if (point.shapeType === 'roundedRect' && shapeArgs) {
@@ -48552,8 +48768,12 @@ function composeBorderRadius(SeriesClass, SVGElementClass, SVGRendererClass) {
         symbols.roundedRect = BorderRadius_roundedRect;
     }
 }
-/** @internal */
-function optionsToObject(options, seriesBROptions) {
+/**
+ * Utility function to get the full border radius options object, from a simple
+ * number or a partial options object.
+ * @internal
+ */
+function borderRadiusObject(options, seriesBROptions) {
     if (!isObject(options)) {
         options = { radius: options || 0 };
     }
@@ -48561,7 +48781,7 @@ function optionsToObject(options, seriesBROptions) {
 }
 /** @internal */
 function pieSeriesOnAfterTranslate() {
-    const borderRadius = optionsToObject(this.options.borderRadius);
+    const borderRadius = borderRadiusObject(this.options.borderRadius);
     for (const point of this.points) {
         const shapeArgs = point.shapeArgs;
         if (shapeArgs) {
@@ -48680,7 +48900,7 @@ function BorderRadius_roundedRect(x, y, width, height, options = {}) {
 *          Column and pie with rounded border
 *
 * @name Highcharts.BorderRadiusOptionsObject#radius
-* @type {string|number}
+* @type {string|number|undefined}
 */ /**
 * The scope of the rounding for column charts or plot bands. In a stacked
 * column chart, the value `point` means each single point will get rounded
@@ -48695,8 +48915,7 @@ function BorderRadius_roundedRect(x, y, width, height, options = {}) {
 *          Rounded columns
 *
 * @name Highcharts.BorderRadiusOptionsObject#scope
-* @validvalue ["individual", "point", "stack"]
-* @type {string}
+* @type {"individual"|"point"|"stack"|undefined}
 */ /**
 * For column charts, where in the point or stack to apply rounding. The `end`
 * value means only those corners at the point value will be rounded, leaving
@@ -48707,8 +48926,7 @@ function BorderRadius_roundedRect(x, y, width, height, options = {}) {
 *          Rounding on all corners
 *
 * @name Highcharts.BorderRadiusOptionsObject#where
-* @validvalue ["all", "end"]
-* @type {string}
+* @type {"all"|"end"|undefined}
 * @default end
 */
 (''); // Keeps doclets above in JS file
@@ -48767,10 +48985,12 @@ var Responsive;
      */
     function matchResponsiveRule(rule, matches) {
         const condition = rule.condition, fn = condition.callback || function () {
-            return (this.chartWidth <= pick(condition.maxWidth, Number.MAX_VALUE) &&
-                this.chartHeight <= pick(condition.maxHeight, Number.MAX_VALUE) &&
-                this.chartWidth >= pick(condition.minWidth, 0) &&
-                this.chartHeight >= pick(condition.minHeight, 0));
+            return (this.chartWidth <=
+                (condition.maxWidth ?? Number.MAX_VALUE) &&
+                this.chartHeight <=
+                    (condition.maxHeight ?? Number.MAX_VALUE) &&
+                this.chartWidth >= (condition.minWidth ?? 0) &&
+                this.chartHeight >= (condition.minHeight ?? 0));
         };
         if (fn.call(this, this)) {
             matches.push(rule._id);
@@ -48984,7 +49204,7 @@ var Responsive;
 ;// ./code/es-modules/masters/highcharts.src.js
 // SPDX-License-Identifier: LicenseRef-Highcharts
 /**
- * @license Highcharts JS v13.0.0 (2026-06-11)
+ * @license Highcharts JS v13.0.2 (2026-08-27)
  * @module highcharts/highcharts
  *
  * (c) 2009-2026 Highsoft AS
@@ -49061,12 +49281,17 @@ G.SVGElement = SVG_SVGElement;
 G.SVGRenderer = SVG_SVGRenderer;
 G.Templating = Core_Templating;
 G.Tick = Axis_Tick;
-G.Time = Core_Time;
+G.Time = class extends Core_Time {
+    constructor(options, lang) {
+        const defaultOptions = Defaults.getOptions();
+        super(options ?? defaultOptions.time, lang ?? defaultOptions.lang);
+    }
+};
 G.Tooltip = Core_Tooltip;
 // Utilities
 G.addEvent = addEvent;
-G.animObject = AnimationUtilities.animObject;
-G.animate = AnimationUtilities.animate;
+G.animObject = animObject;
+G.animate = animate;
 G.arrayMax = arrayMax;
 G.arrayMin = arrayMin;
 G.attr = attr;
@@ -49093,7 +49318,7 @@ G.fireEvent = fireEvent;
 G.format = Core_Templating.format;
 G.getAlignFactor = getAlignFactor;
 G.getClosestDistance = getClosestDistance;
-G.getDeferredAnimation = AnimationUtilities.getDeferredAnimation;
+G.getDeferredAnimation = getDeferredAnimation;
 G.getMagnitude = getMagnitude;
 G.getNestedProperty = getNestedProperty;
 G.getOptions = Defaults.getOptions;
@@ -49120,11 +49345,11 @@ G.relativeLength = relativeLength;
 G.removeEvent = removeEvent;
 G.replaceNested = replaceNested;
 G.seriesType = Series_SeriesRegistry.seriesType;
-G.setAnimation = AnimationUtilities.setAnimation;
+G.setAnimation = setAnimation;
 G.setOptions = Defaults.setOptions;
 G.splat = splat;
 G.stableSort = stableSort;
-G.stop = AnimationUtilities.stop;
+G.stop = stop;
 G.syncTimeout = syncTimeout;
 G.time = Defaults.defaultTime;
 G.ucfirst = ucfirst;
@@ -49233,7 +49458,7 @@ function onChartAfterSetChartSize() {
             navigator.top = this.plotTop + scrollButtonSize;
         }
         else {
-            navigator.left = pick(xAxis.left, this.plotLeft + scrollButtonSize);
+            navigator.left = (xAxis.left ?? this.plotLeft + scrollButtonSize);
             navigator.top = navigator.navigatorOptions.top ||
                 this.chartHeight -
                     navigator.height -
@@ -49249,7 +49474,7 @@ function onChartAfterSetChartSize() {
                         legendOptions.enabled &&
                         !legendOptions.floating) ?
                         legend.legendHeight +
-                            pick(legendOptions.margin, 10) :
+                            (legendOptions.margin ?? 10) :
                         0) -
                     (this.titleOffset ? this.titleOffset[2] : 0);
         }
@@ -49274,7 +49499,7 @@ function onChartAfterUpdate(event) {
         (this.options.navigator.enabled ||
             this.options.scrollbar.enabled)) {
         this.scroller = this.navigator = new NavigatorConstructor(this);
-        if (pick(event.redraw, true)) {
+        if (event.redraw ?? true) {
             this.redraw(event.animation); // #7067
         }
     }
@@ -49452,7 +49677,7 @@ class NavigatorAxisAdditions {
      */
     toFixedRange(pxMin, pxMax, fixedMin, fixedMax) {
         const axis = this.axis, halfPointRange = (axis.pointRange || 0) / 2;
-        let newMin = pick(fixedMin, axis.translate(pxMin, true, !axis.horiz)), newMax = pick(fixedMax, axis.translate(pxMax, true, !axis.horiz));
+        let newMin = fixedMin ?? axis.translate(pxMin, true, !axis.horiz), newMax = fixedMax ?? axis.translate(pxMax, true, !axis.horiz);
         // Add/remove half point range to/from the extremes (#1172)
         if (!defined(fixedMin)) {
             newMin = correctFloat(newMin + halfPointRange);
@@ -49676,7 +49901,7 @@ const NavigatorDefaults = {
      *
      * @type    {Highcharts.ColorType}
      */
-    maskFill: 'color-mix(var(--highcharts-highlight-color-60) 30%, transparent)',
+    maskFill: 'color-mix(in srgb, var(--highcharts-highlight-color-60) 30%, transparent)', // eslint-disable-line max-len
     /**
      * The color of the line marking the currently zoomed area in the
      * navigator.
@@ -49815,11 +50040,18 @@ const NavigatorDefaults = {
         id: 'highcharts-navigator-series',
         className: 'highcharts-navigator-series',
         /**
-         * Sets the fill color of the navigator series.
+         * Sets the color of the navigator series.
          *
          * @type      {Highcharts.ColorType}
          * @apioption navigator.series.color
          */
+        /**
+         * Sets the fill color of the navigator series. Applies to series
+         * types with a filled area, like the default `areaspline`.
+         *
+         * @type      {Highcharts.ColorType}
+         * @apioption navigator.series.fillColor
+         */
         /**
          * Line color for the navigator series. Allows setting the color
          * while disallowing the default candlestick setting.
@@ -50019,6 +50251,7 @@ const NavigatorDefaults = {
 
 
 
+
 /* *
  *
  *  Constants
@@ -50029,7 +50262,7 @@ const NavigatorDefaults = {
  * @internal
  */
 function navigatorHandle(_x, _y, width, height, options = {}) {
-    const halfWidth = options.width ? options.width / 2 : width, markerPosition = 1.5, r = relativeLength(options.borderRadius || 0, Math.min(halfWidth * 2, height));
+    const halfWidth = options.width ? options.width / 2 : width, markerPosition = 1.5, r = relativeLength(borderRadiusObject(options.borderRadius).radius, Math.min(halfWidth * 2, height));
     height = options.height || height;
     return [
         ['M', -markerPosition, height / 2 - 3.5],
@@ -50219,8 +50452,8 @@ var ScrollbarAxis;
     ScrollbarAxis.compose = compose;
     /** @internal */
     function getExtremes(axis) {
-        const axisMin = pick(axis.options?.min, axis.min);
-        const axisMax = pick(axis.options?.max, axis.max);
+        const axisMin = (axis.options?.min ?? axis.min);
+        const axisMax = (axis.options?.max ?? axis.max);
         return {
             axisMin,
             axisMax,
@@ -50759,7 +50992,7 @@ class Scrollbar {
     buttonToMaxClick(e) {
         const scroller = this;
         const range = ((scroller.to - scroller.from) *
-            pick(scroller.options.step, 0.2));
+            (scroller.options.step ?? 0.2));
         scroller.updatePosition(scroller.from + range, scroller.to + range);
         fireEvent(scroller, 'changed', {
             from: scroller.from,
@@ -50771,7 +51004,7 @@ class Scrollbar {
     buttonToMinClick(e) {
         const scroller = this;
         const range = correctFloat(scroller.to - scroller.from) *
-            pick(scroller.options.step, 0.2);
+            (scroller.options.step ?? 0.2);
         scroller.updatePosition(correctFloat(scroller.from - range), correctFloat(scroller.to - range));
         fireEvent(scroller, 'changed', {
             from: scroller.from,
@@ -50903,10 +51136,11 @@ class Scrollbar {
         scroller.renderer = renderer;
         scroller.userOptions = options;
         scroller.options = merge(Scrollbar_ScrollbarDefaults, Scrollbar_defaultOptions.scrollbar, options);
-        scroller.options.margin = pick(scroller.options.margin, 10);
+        scroller.options.margin = (scroller.options.margin ?? 10);
         scroller.chart = chart;
         // Backward compatibility
-        scroller.size = pick(scroller.options.size, scroller.options.height);
+        scroller.size = scroller.options.size ??
+            scroller.options.height;
         // Init
         if (options.enabled) {
             scroller.render();
@@ -51196,9 +51430,9 @@ class Scrollbar {
      * @function Highcharts.Scrollbar#shouldUpdateExtremes
      */
     shouldUpdateExtremes(eventType) {
-        return (pick(this.options.liveRedraw, Core_Globals.svg &&
+        return ((this.options.liveRedraw ?? (Core_Globals.svg &&
             !Core_Globals.isTouchDevice &&
-            !this.chart.boosted) ||
+            !this.chart.boosted)) ||
             // Mouseup always should change extremes
             eventType === 'mouseup' ||
             eventType === 'touchend' ||
@@ -51718,18 +51952,18 @@ class Navigator {
             // it. For example hidden series, but visible navigator (#6022).
             if (rendered) {
                 pxMin = 0;
-                pxMax = pick(xAxis.width, scrollbarXAxis.width);
+                pxMax = (xAxis.width ?? scrollbarXAxis.width);
             }
             else {
                 return;
             }
         }
-        navigator.left = pick(xAxis.left, 
-        // In case of scrollbar only, without navigator
-        chart.plotLeft + scrollButtonSize +
+        navigator.left = (xAxis.left ?? chart.plotLeft + scrollButtonSize +
             (inverted ? chart.plotWidth : 0));
-        let zoomedMax = navigator.size = navigatorSize = pick(xAxis.len, (inverted ? chart.plotHeight : chart.plotWidth) -
-            2 * scrollButtonSize);
+        let zoomedMax = navigator.size = navigatorSize =
+            xAxis.len ??
+                (inverted ? chart.plotHeight : chart.plotWidth) -
+                    2 * scrollButtonSize;
         if (inverted) {
             navigatorWidth = scrollbarHeight;
         }
@@ -51737,8 +51971,8 @@ class Navigator {
             navigatorWidth = navigatorSize + 2 * scrollButtonSize;
         }
         // Get the pixel position of the handles
-        pxMin = pick(pxMin, xAxis.toPixels(min, true));
-        pxMax = pick(pxMax, xAxis.toPixels(max, true));
+        pxMin = (pxMin ?? xAxis.toPixels(min, true));
+        pxMax = (pxMax ?? xAxis.toPixels(max, true));
         // Verify (#1851, #2238)
         if (!isNumber(pxMin) || Math.abs(pxMin) === Infinity) {
             pxMin = 0;
@@ -52017,11 +52251,10 @@ class Navigator {
                 navigator.render(0, 0, chartX - dragOffset, chartX - dragOffset + range);
             }
             if (navigator.hasDragged &&
-                pick(navigator.scrollbarOptions?.liveRedraw, 
+                (navigator.scrollbarOptions?.liveRedraw ?? (
                 // By default, don't run live redraw on touch
                 // devices or if the chart is in boost.
-                !Navigator_isTouchDevice &&
-                    !this.chart.boosted)) {
+                !Navigator_isTouchDevice && !this.chart.boosted))) {
                 e.DOMType = e.type;
                 setTimeout(function () {
                     navigator.onMouseUp(e);
@@ -52210,8 +52443,10 @@ class Navigator {
                 offset: 0,
                 index: yAxisIndex,
                 isInternal: true,
-                reversed: pick((navigatorOptions.yAxis &&
-                    navigatorOptions.yAxis.reversed), (chart.yAxis[0] && chart.yAxis[0].reversed), false), // #14060
+                reversed: ((navigatorOptions.yAxis &&
+                    navigatorOptions.yAxis.reversed) ??
+                    (chart.yAxis[0] && chart.yAxis[0].reversed) ??
+                    false), // #14060
                 zoomEnabled: false
             }, chart.inverted ? {
                 width: height
@@ -52297,7 +52532,9 @@ class Navigator {
      */
     setOpposite() {
         const navigatorOptions = this.navigatorOptions, navigatorEnabled = this.navigatorEnabled, chart = this.chart;
-        this.opposite = pick(navigatorOptions.opposite, Boolean(!navigatorEnabled && chart.inverted)); // #6262
+        this.opposite =
+            navigatorOptions.opposite ??
+                Boolean(!navigatorEnabled && chart.inverted); // #6262
     }
     /**
      * Get the union data extremes of the chart - the outer data extremes of the
@@ -52311,9 +52548,8 @@ class Navigator {
         let ret;
         if (!returnFalseOnNoBaseSeries || baseAxis.dataMin !== null) {
             ret = {
-                dataMin: pick(// #4053
-                time.parse(navAxisOptions?.min), numExt('min', time.parse(baseAxisOptions.min), baseAxis.dataMin, navAxis.dataMin, navAxis.min)),
-                dataMax: pick(time.parse(navAxisOptions?.max), numExt('max', time.parse(baseAxisOptions.max), baseAxis.dataMax, navAxis.dataMax, navAxis.max))
+                dataMin: (time.parse(navAxisOptions?.min) ?? numExt('min', time.parse(baseAxisOptions.min), baseAxis.dataMin, navAxis.dataMin, navAxis.min)),
+                dataMax: (time.parse(navAxisOptions?.max) ?? numExt('max', time.parse(baseAxisOptions.max), baseAxis.dataMax, navAxis.dataMax, navAxis.max))
             };
         }
         return ret;
@@ -52428,11 +52664,9 @@ class Navigator {
                 userNavOptions.dataLabels = splat(userNavOptions.dataLabels);
                 mergedNavSeriesOptions = merge(baseOptions, navSeriesMixin, userNavOptions, baseNavigatorOptions);
                 // Once nav series type is resolved, pick correct pointRange
-                mergedNavSeriesOptions.pointRange = pick(
-                // Strictly set pointRange in options
-                userNavOptions.pointRange, baseNavigatorOptions.pointRange, 
-                // Fallback to default values, e.g. `null` for column
-                Navigator_defaultOptions.plotOptions[mergedNavSeriesOptions.type || 'line']?.pointRange);
+                mergedNavSeriesOptions.pointRange = (userNavOptions.pointRange ??
+                    baseNavigatorOptions.pointRange ??
+                    Navigator_defaultOptions.plotOptions[mergedNavSeriesOptions.type || 'line']?.pointRange);
                 // Merge data separately. Do a slice to avoid mutating the
                 // navigator options from base series (#4923).
                 const navigatorSeriesData = baseNavigatorOptions.data || userNavOptions.data, navigatorSeriesDataTable = baseNavigatorOptions.dataTable ||
@@ -52592,7 +52826,7 @@ class Navigator {
      * @function Highcharts.Navigator#modifyBaseAxisExtremes
      */
     modifyBaseAxisExtremes() {
-        const baseXAxis = this, navigator = baseXAxis.chart.navigator, baseExtremes = baseXAxis.getExtremes(), baseMin = baseExtremes.min, baseMax = baseExtremes.max, baseDataMin = baseExtremes.dataMin, baseDataMax = baseExtremes.dataMax, range = baseMax - baseMin, stickToMin = navigator?.stickToMin, stickToMax = navigator?.stickToMax, overscroll = pick(baseXAxis.ordinal?.convertOverscroll(baseXAxis.options.overscroll), 0), navigatorSeries = navigator.series && navigator.series[0], hasSetExtremes = !!baseXAxis.setExtremes, 
+        const baseXAxis = this, navigator = baseXAxis.chart.navigator, baseExtremes = baseXAxis.getExtremes(), baseMin = baseExtremes.min, baseMax = baseExtremes.max, baseDataMin = baseExtremes.dataMin, baseDataMax = baseExtremes.dataMax, range = baseMax - baseMin, stickToMin = navigator?.stickToMin, stickToMax = navigator?.stickToMax, overscroll = (baseXAxis.ordinal?.convertOverscroll(baseXAxis.options.overscroll) ?? 0), navigatorSeries = navigator.series && navigator.series[0], hasSetExtremes = !!baseXAxis.setExtremes, 
         // When the extremes have been set by range selector button, don't
         // stick to min or max. The range selector buttons will handle the
         // extremes. (#5489)
@@ -52644,8 +52878,8 @@ class Navigator {
             Math.round(navigator.zoomedMax) >= Math.round(navigator.size);
         // If the scrollbar is scrolled all the way to the right, keep right as
         // new data comes in, unless user set navigator.stickToMax to false.
-        navigator.stickToMax = pick(this.chart.options.navigator &&
-            this.chart.options.navigator.stickToMax, shouldStickToMax);
+        navigator.stickToMax = (this.chart.options.navigator &&
+            this.chart.options.navigator.stickToMax) ?? shouldStickToMax;
         navigator.stickToMin = navigator.shouldStickToMin(baseSeries, navigator);
         // Set the navigator series data to the new data of the base series
         if (navigatorSeries && !navigator.hasNavigatorData) {
@@ -52959,7 +53193,7 @@ class StandaloneNavigator {
         if (!(axis instanceof Axis_Axis)) {
             return;
         }
-        const { min, max } = this.navigator.xAxis, removeEventCallbacks = [];
+        const navigator = this.navigator, { min, max } = navigator.xAxis, removeEventCallbacks = [];
         if (twoWay) {
             const removeSetExtremesEvent = addEvent(axis, 'setExtremes', (e) => {
                 if (e.trigger === 'pan' ||
@@ -52972,7 +53206,7 @@ class StandaloneNavigator {
             });
             removeEventCallbacks.push(removeSetExtremesEvent);
         }
-        const removeSetRangeEvent = addEvent(this.navigator, 'setRange', (e) => {
+        const removeSetRangeEvent = addEvent(navigator, 'setRange', (e) => {
             axis.setExtremes(e.min, e.max, e.redraw, e.animation);
         });
         removeEventCallbacks.push(removeSetRangeEvent);
@@ -52981,6 +53215,13 @@ class StandaloneNavigator {
         })[0];
         if (!boundAxis) {
             boundAxis = { axis, callbacks: [] };
+            // A navigator bound to a yAxis defines the full range the axis
+            // should cover. Stash the axis' own bounds before overriding them,
+            // so `unbind` can restore them, #24716
+            if (axis.coll === 'yAxis') {
+                boundAxis.oldMin = axis.options.min ?? axis.min;
+                boundAxis.oldMax = axis.options.max ?? axis.max;
+            }
             this.boundAxes.push(boundAxis);
         }
         boundAxis.callbacks = removeEventCallbacks;
@@ -52990,6 +53231,12 @@ class StandaloneNavigator {
                 nav.addSeries(series.options);
             }
         });
+        // Bind a yAxis to the navigator's full range so vertical panning isn't
+        // capped at the series' data extremes, #24716
+        if (axis.coll === 'yAxis') {
+            const { dataMin, dataMax } = navigator.xAxis.getExtremes();
+            axis.update({ min: dataMin, max: dataMax }, false);
+        }
         // Set extremes to match the navigator's extremes
         axis.setExtremes(min, max);
         // Unbind the axis before it's destroyed
@@ -53011,12 +53258,15 @@ class StandaloneNavigator {
      *        Passing a Chart object unbinds the first X axis of the chart,
      *        an Axis object unbinds that specific axis,
      *        and undefined unbinds all axes bound to the navigator.
+     * @param {boolean} restoreExtremes
+     *        Whether to restore the axis' original min/max that were
+     *        overridden when binding a yAxis.
      */
-    unbind(axisOrChart) {
+    unbind(axisOrChart, restoreExtremes) {
         // If no axis or chart is provided, unbind all bound axes
         if (!axisOrChart) {
-            this.boundAxes.forEach(({ callbacks }) => {
-                callbacks.forEach((removeCallback) => removeCallback());
+            this.boundAxes.forEach((boundAxis) => {
+                this.releaseAxis(boundAxis, restoreExtremes);
             });
             this.boundAxes.length = 0;
             return;
@@ -53026,20 +53276,45 @@ class StandaloneNavigator {
             axisOrChart.xAxis[0];
         for (let i = this.boundAxes.length - 1; i >= 0; i--) {
             if (this.boundAxes[i].axis === axis) {
-                this.boundAxes[i].callbacks.forEach((callback) => callback());
+                this.releaseAxis(this.boundAxes[i], restoreExtremes);
                 this.boundAxes.splice(i, 1);
             }
         }
     }
+    /**
+     * Disconnect a bound axis' events and restore the axis' own bounds that
+     * were overridden when binding a yAxis.
+     *
+     * @internal
+     *
+     * @param {BoundAxis} boundAxis
+     *        The bound axis entry to release.
+     * @param {boolean} [restoreExtremes=false]
+     *        Whether to restore the axis' original min/max that were
+     *        overridden when binding a yAxis.
+     */
+    releaseAxis(boundAxis, restoreExtremes = false) {
+        // Disconnect events
+        boundAxis.callbacks.forEach((removeCallback) => removeCallback());
+        // Restore the axis' original min/max that were overridden in `bind`
+        if (boundAxis.axis.coll === 'yAxis' && restoreExtremes) {
+            const min = boundAxis.oldMin ?? void 0, max = boundAxis.oldMax ?? void 0;
+            boundAxis.axis.update({ min, max }, false);
+            boundAxis.axis.setExtremes(min, max);
+        }
+    }
     /**
      * Destroys allocated standalone navigator elements.
      *
      * @function Highcharts.StandaloneNavigator#destroy
+     *
+     * @param {boolean} restoreExtremes
+     *        Whether to restore the axis' original min/max that were
+     *        overridden when binding a yAxis.
      */
-    destroy() {
-        // Disconnect events
-        this.boundAxes.forEach(({ callbacks }) => {
-            callbacks.forEach((removeCallback) => removeCallback());
+    destroy(restoreExtremes) {
+        this.boundAxes.forEach((boundAxis) => {
+            this.releaseAxis(boundAxis, restoreExtremes);
         });
         this.boundAxes.length = 0;
         this.navigator.destroy();
@@ -53082,7 +53357,7 @@ class StandaloneNavigator {
      *        Options for the series to be added to the navigator.
      */
     addSeries(seriesOptions) {
-        this.navigator.chart.addSeries(merge(seriesOptions, { showInNavigator: pick(seriesOptions.showInNavigator, true) }));
+        this.navigator.chart.addSeries(merge(seriesOptions, { showInNavigator: (seriesOptions.showInNavigator ?? true) }));
         this.navigator.setBaseSeries();
     }
     /**
@@ -53121,8 +53396,8 @@ class StandaloneNavigator {
     getRange() {
         const { min, max } = this.navigator.chart.xAxis[0].getExtremes(), { userMin, userMax, min: dataMin, max: dataMax } = this.navigator.xAxis.getExtremes();
         return {
-            min: pick(min, dataMin),
-            max: pick(max, dataMax),
+            min: (min ?? dataMin),
+            max: (max ?? dataMax),
             dataMin,
             dataMax,
             userMin,
@@ -53186,9 +53461,10 @@ class StandaloneNavigator {
 ''; // Detach doclets above
 
 ;// ./code/es-modules/masters/modules/navigator.src.js
+/* unused harmony import specifier */ var Highcharts;
 // SPDX-License-Identifier: LicenseRef-Highcharts
 /**
- * @license Highcharts JS v13.0.0 (2026-06-11)
+ * @license Highcharts JS v13.0.2 (2026-08-27)
  * @module highcharts/modules/navigator
  * @requires highcharts
  *