histropediajs 1.5.0 → 1.6.0

package/dist/histropedia.esm.js

@@ -1,5 +1,5 @@
 /*!
-HistropediaJS v1.5.0 | Histropedia Ltd. (c) 2026 | https://js.histropedia.com
+HistropediaJS v1.6.0 | Histropedia Ltd. (c) 2026 | https://js.histropedia.com
 Use of this software is subject to our End User Licence Agreement: https://js.histropedia.com/licence.html
 */
 var __defProp = Object.defineProperty;
@@ -180,8 +180,17 @@ const LEGACY_PRECISIONS = {
   8: "decade",
   9: "year",
   10: "month",
-  11: "day"
-};
+  11: "day",
+  12: "hour",
+  13: "minute",
+  14: "second",
+  15: "millisecond"
+};
+const DMY_STRING_PATTERN = /^(-?\d+)(?:-(\d{1,2}))?(?:-(\d{1,2}))?(?:[T ](\d{1,2})(?::(\d{1,2}))?(?::(\d{1,2})(?:\.(\d{1,3}))?)?)?$/;
+const MILLISECONDS_PER_SECOND = 1e3;
+const MILLISECONDS_PER_MINUTE = 60 * MILLISECONDS_PER_SECOND;
+const MILLISECONDS_PER_HOUR = 60 * MILLISECONDS_PER_MINUTE;
+const MILLISECONDS_PER_DAY = 24 * MILLISECONDS_PER_HOUR;
 function normalizePrecision(precision) {
   return Object.prototype.hasOwnProperty.call(LEGACY_PRECISIONS, precision) ? LEGACY_PRECISIONS[precision] : precision || "day";
 }
@@ -194,16 +203,60 @@ function getHistoricalPeriodBounds(year, size) {
   };
 }
 __name(getHistoricalPeriodBounds, "getHistoricalPeriodBounds");
-function Dmy(year, month, day) {
+function clampInteger(value, fallback, minimum, maximum) {
+  const parsed = Number(value);
+  if (!Number.isFinite(parsed)) {
+    return fallback;
+  }
+  return Math.min(maximum, Math.max(minimum, Math.trunc(parsed)));
+}
+__name(clampInteger, "clampInteger");
+function setTimeParts(target, hour, minute, second, millisecond) {
+  const values = {
+    hour: clampInteger(hour, 0, 0, 23),
+    minute: clampInteger(minute, 0, 0, 59),
+    second: clampInteger(second, 0, 0, 59),
+    millisecond: clampInteger(millisecond, 0, 0, 999)
+  };
+  for (const [key, value] of Object.entries(values)) {
+    Object.defineProperty(target, key, {
+      value,
+      enumerable: value !== 0,
+      configurable: true,
+      writable: true
+    });
+  }
+}
+__name(setTimeParts, "setTimeParts");
+function setPrecision(target, precision) {
+  if (precision === void 0) {
+    return;
+  }
+  Object.defineProperty(target, "precision", {
+    value: precision,
+    enumerable: false,
+    configurable: true,
+    writable: true
+  });
+}
+__name(setPrecision, "setPrecision");
+function createAdjustedDmy(source, values) {
+  return new Dmy({ ...values, precision: source.precision });
+}
+__name(createAdjustedDmy, "createAdjustedDmy");
+function Dmy(year, month, day, hour, minute, second, millisecond) {
   if (typeof year === "object") {
     const options = year;
     this.year = options.year;
     this.month = options.month;
     this.day = getCorrectDay(options.year, options.month, options.day);
+    setTimeParts(this, options.hour, options.minute, options.second, options.millisecond);
+    setPrecision(this, options.precision);
   } else {
     this.year = year;
     this.month = month;
     this.day = getCorrectDay(year, month, day);
+    setTimeParts(this, hour, minute, second, millisecond);
   }
 }
 __name(Dmy, "Dmy");
@@ -230,14 +283,19 @@ function digitGroupedNumber(number, separator) {
 }
 __name(digitGroupedNumber, "digitGroupedNumber");
 Dmy.prototype.getDaysTo = function(other) {
-  return other.getDaysSinceYearZero() - this.getDaysSinceYearZero();
+  const dayDifference = other.getDaysSinceYearZero() - this.getDaysSinceYearZero();
+  const timeDifference = other.getMillisecondsOfDay() - this.getMillisecondsOfDay();
+  return dayDifference + timeDifference / MILLISECONDS_PER_DAY;
+};
+Dmy.prototype.getMillisecondsOfDay = function() {
+  return this.hour * MILLISECONDS_PER_HOUR + this.minute * MILLISECONDS_PER_MINUTE + this.second * MILLISECONDS_PER_SECOND + this.millisecond;
 };
 Dmy.prototype.getMonthsTo = function(other) {
   return this.getYearsTo(other) * 12;
 };
 Dmy.prototype.getYearsTo = function(other) {
   let yearDiff = other.year - this.year;
-  yearDiff += (other.month - this.month) / 12 + (other.day - this.day) / 365.2422;
+  yearDiff += (other.month - this.month) / 12 + (other.day - this.day) / 365.2422 + (other.getMillisecondsOfDay() - this.getMillisecondsOfDay()) / (MILLISECONDS_PER_DAY * 365.2422);
   return yearDiff;
 };
 Dmy.prototype.getLeapYearsSinceYearZero = function() {
@@ -257,14 +315,11 @@ Dmy.prototype.getDaysSinceYearZero = function() {
   return days;
 };
 Dmy.prototype.getDayOfYear = function() {
-  if (isUndefined(this._dayOfYear)) {
-    this._dayOfYear = 0;
-    for (let m = 1; m < this.month; m++) {
-      this._dayOfYear += daysInMonth(this.year, m);
-    }
-    this._dayOfYear += this.day;
+  let dayOfYear = this.day;
+  for (let m = 1; m < this.month; m++) {
+    dayOfYear += daysInMonth(this.year, m);
   }
-  return this._dayOfYear;
+  return dayOfYear;
 };
 Dmy.getByDayOfYear = function(year, dayOfYear) {
   const dmy = new Dmy(year, 1, 1);
@@ -290,18 +345,77 @@ Dmy.prototype.addDays = function(amount) {
   let day = this.day;
   let month = this.month;
   let year = this.year;
-  for (let i = 0; i < amount; i++) {
-    day++;
-    if (day > daysInMonth(year, month)) {
-      day = 1;
-      month++;
-      if (month > 12) {
-        month = 1;
-        year++;
+  const direction = amount < 0 ? -1 : 1;
+  let remaining = Math.abs(Math.trunc(amount));
+  while (remaining > 0) {
+    if (direction > 0) {
+      day++;
+      if (day > daysInMonth(year, month)) {
+        day = 1;
+        month++;
+        if (month > 12) {
+          month = 1;
+          year++;
+        }
+      }
+    } else {
+      day--;
+      if (day < 1) {
+        month--;
+        if (month < 1) {
+          month = 12;
+          year--;
+        }
+        day = daysInMonth(year, month);
       }
     }
+    remaining--;
   }
-  return new Dmy(year, month, day);
+  return createAdjustedDmy(this, {
+    year,
+    month,
+    day,
+    hour: this.hour,
+    minute: this.minute,
+    second: this.second,
+    millisecond: this.millisecond
+  });
+};
+Dmy.prototype.addMilliseconds = function(amount) {
+  let date = this;
+  let milliseconds = this.getMillisecondsOfDay() + Math.trunc(amount);
+  while (milliseconds < 0) {
+    date = date.addDays(-1);
+    milliseconds += MILLISECONDS_PER_DAY;
+  }
+  while (milliseconds >= MILLISECONDS_PER_DAY) {
+    date = date.addDays(1);
+    milliseconds -= MILLISECONDS_PER_DAY;
+  }
+  const hour = Math.floor(milliseconds / MILLISECONDS_PER_HOUR);
+  milliseconds -= hour * MILLISECONDS_PER_HOUR;
+  const minute = Math.floor(milliseconds / MILLISECONDS_PER_MINUTE);
+  milliseconds -= minute * MILLISECONDS_PER_MINUTE;
+  const second = Math.floor(milliseconds / MILLISECONDS_PER_SECOND);
+  const millisecond = milliseconds - second * MILLISECONDS_PER_SECOND;
+  return createAdjustedDmy(this, {
+    year: date.year,
+    month: date.month,
+    day: date.day,
+    hour,
+    minute,
+    second,
+    millisecond
+  });
+};
+Dmy.prototype.addSeconds = function(amount) {
+  return this.addMilliseconds(amount * MILLISECONDS_PER_SECOND);
+};
+Dmy.prototype.addMinutes = function(amount) {
+  return this.addMilliseconds(amount * MILLISECONDS_PER_MINUTE);
+};
+Dmy.prototype.addHours = function(amount) {
+  return this.addMilliseconds(amount * MILLISECONDS_PER_HOUR);
 };
 Dmy.prototype.addMonths = function(amount) {
   let month = this.month;
@@ -313,22 +427,10 @@ Dmy.prototype.addMonths = function(amount) {
       year++;
     }
   }
-  return new Dmy(year, month, 1);
+  return createAdjustedDmy(this, { year, month, day: 1 });
 };
 Dmy.prototype.getPreviousDay = function() {
-  let day = this.day;
-  let month = this.month;
-  let year = this.year;
-  day--;
-  if (day < 1) {
-    month--;
-    if (month < 1) {
-      month = 12;
-      year--;
-    }
-    day = daysInMonth(year, month);
-  }
-  return new Dmy(year, month, day);
+  return this.addDays(-1);
 };
 Dmy.prototype.getNextMonth = function() {
   let month = this.month;
@@ -338,7 +440,7 @@ Dmy.prototype.getNextMonth = function() {
     month = 1;
     year++;
   }
-  return new Dmy(year, month, 1);
+  return createAdjustedDmy(this, { year, month, day: 1 });
 };
 Dmy.prototype.getPreviousMonth = function() {
   let month = this.month;
@@ -348,11 +450,15 @@ Dmy.prototype.getPreviousMonth = function() {
     month = 12;
     year--;
   }
-  return new Dmy(year, month, 1);
+  return createAdjustedDmy(this, { year, month, day: 1 });
 };
 Dmy.prototype.addYears = function(amount) {
-  return new Dmy(this.year + amount, 1, 1);
+  return createAdjustedDmy(this, { year: this.year + amount, month: 1, day: 1 });
 };
+function pad(value, length) {
+  return String(value).padStart(length, "0");
+}
+__name(pad, "pad");
 Dmy.prototype.format = function(format, options) {
   options = options || {};
   format = format || "D MMM YYYY";
@@ -375,24 +481,26 @@ Dmy.prototype.format = function(format, options) {
   return format.replace(
     "YYYY",
     isBc ? digitGroupedNumber(-this.year + 1, thousandsSeparator) + bceText : digitGroupedNumber(this.year, thousandsSeparator)
-  ).replace("D", this.day).replace("MMM", MONTH_NAMES[this.month - 1]);
+  ).replace("D", this.day).replace("MMM", MONTH_NAMES[this.month - 1]).replace("HH", pad(this.hour, 2)).replace("mm", pad(this.minute, 2)).replace("ss", pad(this.second, 2)).replace("SSS", pad(this.millisecond, 3));
 };
 Dmy.prototype.isSame = function(other) {
-  return other.year === this.year && other.month === this.month && other.day === this.day;
+  return other.year === this.year && other.month === this.month && other.day === this.day && (other.hour || 0) === this.hour && (other.minute || 0) === this.minute && (other.second || 0) === this.second && (other.millisecond || 0) === this.millisecond;
 };
 Dmy.prototype.toKeyString = function() {
-  return `${this.year}|${this.month}|${this.day}`;
+  const dateKey = `${this.year}|${this.month}|${this.day}`;
+  if (this.getMillisecondsOfDay() === 0) {
+    return dateKey;
+  }
+  return `${dateKey}|${this.hour}|${this.minute}|${this.second}|${this.millisecond}`;
 };
 Dmy.prototype.isAfter = function(other) {
-  if (this.year > other.year) {
-    return true;
-  }
-  if (this.year === other.year) {
-    if (this.month > other.month) {
-      return true;
-    }
-    if (this.month === other.month) {
-      return this.day > other.day;
+  const fields = ["year", "month", "day", "hour", "minute", "second", "millisecond"];
+  for (let i = 0; i < fields.length; i++) {
+    const field = fields[i];
+    const thisValue = this[field] || 0;
+    const otherValue = other[field] || 0;
+    if (thisValue !== otherValue) {
+      return thisValue > otherValue;
     }
   }
   return false;
@@ -412,15 +520,24 @@ Dmy.prototype.compare = function(other) {
 Dmy.prototype.asFloat = function() {
   const m = this.month - 1;
   const d = this.day - 1;
-  if (m === 0 && d === 0) {
+  const dayFraction = this.getMillisecondsOfDay() / MILLISECONDS_PER_DAY;
+  if (m === 0 && d === 0 && dayFraction === 0) {
     return this.year;
   }
-  return Math.round((this.year + (m * 31 + d) / 371) * 100) / 100;
+  return Math.round((this.year + (m * 31 + d + dayFraction) / 371) * 100) / 100;
 };
 Dmy.prototype.isInFuture = function() {
   const date = /* @__PURE__ */ new Date();
-  const today = new Dmy(date.getFullYear(), date.getMonth() + 1, date.getDate());
-  return this.isAfter(today);
+  const now = new Dmy(
+    date.getFullYear(),
+    date.getMonth() + 1,
+    date.getDate(),
+    date.getHours(),
+    date.getMinutes(),
+    date.getSeconds(),
+    date.getMilliseconds()
+  );
+  return this.isAfter(now);
 };
 Dmy.prototype.convertToIso = function() {
   if (this.year < 0) {
@@ -433,6 +550,18 @@ Dmy.CreateAsStartOfPeriod = function(isoDmy, precision) {
   const month = isoDmy.month || 1;
   const day = isoDmy.day || 1;
   precision = normalizePrecision(precision);
+  if (precision === "millisecond") {
+    return new Dmy(isoDmy);
+  }
+  if (precision === "second") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, isoDmy.minute, isoDmy.second, 0);
+  }
+  if (precision === "minute") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, isoDmy.minute, 0, 0);
+  }
+  if (precision === "hour") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, 0, 0, 0);
+  }
   if (precision === "day") {
     return new Dmy(isoYear, month, day);
   }
@@ -458,6 +587,18 @@ Dmy.CreateAsEndOfPeriod = function(isoDmy, precision) {
   const month = isoDmy.month || 1;
   const day = isoDmy.day || 1;
   precision = normalizePrecision(precision);
+  if (precision === "millisecond") {
+    return new Dmy(isoDmy);
+  }
+  if (precision === "second") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, isoDmy.minute, isoDmy.second, 999);
+  }
+  if (precision === "minute") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, isoDmy.minute, 59, 999);
+  }
+  if (precision === "hour") {
+    return new Dmy(isoYear, month, day, isoDmy.hour, 59, 59, 999);
+  }
   if (precision === "day") {
     return new Dmy(isoYear, month, day);
   }
@@ -485,6 +626,26 @@ Dmy.CreateAsEndOfPeriod = function(isoDmy, precision) {
   Logger.error("precision is not implemented");
   return new Dmy(isoYear, month, day);
 };
+Dmy.CreateAsExclusiveEndOfPeriod = function(isoDmy, precision) {
+  precision = normalizePrecision(precision);
+  const start = Dmy.CreateAsStartOfPeriod(isoDmy, precision);
+  if (precision === "millisecond") {
+    return start.addMilliseconds(1);
+  }
+  if (precision === "second") {
+    return start.addSeconds(1);
+  }
+  if (precision === "minute") {
+    return start.addMinutes(1);
+  }
+  if (precision === "hour") {
+    return start.addHours(1);
+  }
+  if (precision === "day") {
+    return start.addDays(1);
+  }
+  return Dmy.CreateAsEndOfPeriod(isoDmy, precision).addDays(1);
+};
 Dmy.now = function() {
   const now = /* @__PURE__ */ new Date();
   return new Dmy({
@@ -493,21 +654,37 @@ Dmy.now = function() {
     day: now.getDate()
   });
 };
+function parseDmyString(dateString) {
+  const match = String(dateString).match(DMY_STRING_PATTERN);
+  if (!match) {
+    return null;
+  }
+  const year = parseInt(match[1], 10);
+  const month = match[2] == null ? 1 : parseInt(match[2], 10);
+  const day = match[3] == null ? 1 : parseInt(match[3], 10);
+  const hour = match[4] == null ? 0 : parseInt(match[4], 10);
+  const minute = match[5] == null ? 0 : parseInt(match[5], 10);
+  const second = match[6] == null ? 0 : parseInt(match[6], 10);
+  const millisecond = match[7] ? parseInt(match[7].padEnd(3, "0"), 10) : 0;
+  return {
+    date: new Dmy({
+      year,
+      month,
+      day,
+      hour,
+      minute,
+      second,
+      millisecond
+    }),
+    hasMonth: match[2] != null,
+    hasDay: match[3] != null,
+    hasTime: match[4] != null
+  };
+}
+__name(parseDmyString, "parseDmyString");
 Dmy.fromString = function(dateString) {
-  const dateParts = dateString.split("-");
-  const isBc = dateParts[0] === "";
-  if (isBc) {
-    dateParts.shift();
-    dateParts[0] = `-${dateParts[0]}`;
-  }
-  const year = parseInt(dateParts[0]);
-  const month = parseInt(dateParts[1]) || 1;
-  const day = parseInt(dateParts[2]) || 1;
-  return new Dmy({
-    year: parseInt(year),
-    month: parseInt(month),
-    day: parseInt(day)
-  });
+  const parsed = parseDmyString(dateString);
+  return parsed ? parsed.date : new Dmy(NaN, 1, 1);
 };
 function merge(target, ...sources) {
   return Object.assign(target, ...sources);
@@ -595,10 +772,10 @@ function defineValueOrFunctionProperty(obj, propName) {
   });
 }
 __name(defineValueOrFunctionProperty, "defineValueOrFunctionProperty");
-function isUndefined$1(value) {
+function isUndefined(value) {
   return typeof value === "undefined";
 }
-__name(isUndefined$1, "isUndefined$1");
+__name(isUndefined, "isUndefined");
 const propertyAbbreviations = {
   id: "i",
   title: "t",
@@ -607,10 +784,18 @@ const propertyAbbreviations = {
   "from.year": "fy",
   "from.month": "fm",
   "from.day": "fd",
+  "from.hour": "fhr",
+  "from.minute": "fmi",
+  "from.second": "fs",
+  "from.millisecond": "fms",
   "from.precision": "fp",
   "to.year": "ty",
   "to.month": "tm",
   "to.day": "td",
+  "to.hour": "thr",
+  "to.minute": "tmi",
+  "to.second": "ts",
+  "to.millisecond": "tms",
   "to.precision": "tp",
   isToPresent: "p",
   isStarred: "v",
@@ -629,7 +814,8 @@ function extractProperty(data, property) {
 __name(extractProperty, "extractProperty");
 function extractPropertyFromPath(data, path) {
   const pathParts = path.split(".");
-  return pathParts.reduce((curr, next) => curr ? curr[next] : void 0, data);
+  const value = pathParts.reduce((curr, next) => curr ? curr[next] : void 0, data);
+  return isUndefined(value) ? data[propertyAbbreviations[path]] : value;
 }
 __name(extractPropertyFromPath, "extractPropertyFromPath");
 function isPath(property) {
@@ -645,9 +831,9 @@ function getPropertyFromData(data, property) {
 __name(getPropertyFromData, "getPropertyFromData");
 function existsInData(data, property) {
   if (isPath(property)) {
-    return !isUndefined$1(extractPropertyFromPath(data, property));
+    return !isUndefined(extractPropertyFromPath(data, property));
   }
-  return !isUndefined$1(extractProperty(data, property));
+  return !isUndefined(extractProperty(data, property));
 }
 __name(existsInData, "existsInData");
 defineValueOrFunctionProperty(Article.prototype, "hidePeriodLine");
@@ -723,12 +909,16 @@ Article.prototype.setupByReceivedData = function(receivedData) {
   this.isImageInfoLoaded = false;
 };
 Article.prototype._setupArticlePeriod = function(data) {
-  const fromDmy = new Dmy(
+  let fromDmy = new Dmy(
     parseInt(getPropertyFromData(data, "from.year")),
     parseInt(getPropertyFromData(data, "from.month")),
-    parseInt(getPropertyFromData(data, "from.day"))
+    parseInt(getPropertyFromData(data, "from.day")),
+    parseInt(getPropertyFromData(data, "from.hour")),
+    parseInt(getPropertyFromData(data, "from.minute")),
+    parseInt(getPropertyFromData(data, "from.second")),
+    parseInt(getPropertyFromData(data, "from.millisecond"))
   );
-  this.owner.getDmyFromInput(fromDmy);
+  fromDmy = this.owner.getDmyFromInput(fromDmy);
   const fromPrecision = getPropertyFromData(data, "from.precision");
   const isToPresentProp = getPropertyFromData(data, "isToPresent");
   const isToPresent = isToPresentProp === true || isToPresentProp === 1;
@@ -739,17 +929,21 @@ Article.prototype._setupArticlePeriod = function(data) {
     toDmy = new Dmy(
       parseInt(getPropertyFromData(data, "to.year")),
       parseInt(getPropertyFromData(data, "to.month")),
-      parseInt(getPropertyFromData(data, "to.day"))
+      parseInt(getPropertyFromData(data, "to.day")),
+      parseInt(getPropertyFromData(data, "to.hour")),
+      parseInt(getPropertyFromData(data, "to.minute")),
+      parseInt(getPropertyFromData(data, "to.second")),
+      parseInt(getPropertyFromData(data, "to.millisecond"))
     );
-    this.owner.getDmyFromInput(toDmy);
+    toDmy = this.owner.getDmyFromInput(toDmy);
     toPrecision = getPropertyFromData(data, "to.precision");
   } else {
     toDmy = fromDmy;
     toPrecision = fromPrecision;
   }
   const from = Dmy.CreateAsStartOfPeriod(fromDmy, fromPrecision);
-  const to = Dmy.CreateAsEndOfPeriod(toDmy, toPrecision);
-  this.period = { from, to: to.getNextDay(), isToPresent };
+  const to = Dmy.CreateAsExclusiveEndOfPeriod(toDmy, toPrecision);
+  this.period = { from, to, isToPresent };
   this.period.years = this.period.to.asFloat() - this.period.from.asFloat();
 };
 Article.prototype.setImage = function() {
@@ -864,7 +1058,7 @@ Article.prototype.headerOverlapsWith = function(other) {
   return otherRight >= thisLeft && thisRight >= otherLeft;
 };
 Article.prototype._getWidth = function() {
-  return this._getCurrentStyle().width;
+  return this.getCurrentStyle().width;
 };
 Article.prototype.getWidth = function() {
   this._ensureSizeCache();
@@ -925,29 +1119,10 @@ Article.prototype.setOption = function(option, value) {
   const styleChanged = existsInData(option, "style");
   const activeStyleChanged = existsInData(option, "activeStyle");
   const hoverStyleChanged = existsInData(option, "hoverStyle");
-  let activeHoverStyleUpdated = false;
-  if (styleChanged) {
+  if (styleChanged || hoverStyleChanged || activeStyleChanged) {
     this.initialiseStyles(this.data);
-    this.invalidateCaches();
-  } else {
-    if (hoverStyleChanged) {
-      deepMerge(this.hoverStyle, option.hoverStyle);
-      this.activeHoverStyle = deepMerge(
-        {},
-        this.hoverStyle,
-        this.owner._getResolvedArticleOptions(this).defaultActiveStyle,
-        this.data.activeStyle
-      );
-      activeHoverStyleUpdated = true;
-    }
-    if (activeStyleChanged) {
-      this.activeStyle = deepMerge(this.activeStyle, option.activeStyle);
-      if (!activeHoverStyleUpdated) {
-        deepMerge(this.activeHoverStyle, option.activeStyle);
-      }
-    }
-    this.invalidateCaches();
   }
+  this.invalidateCaches();
   const cardLayoutChanged = existsInData(option, "cardLayout");
   if (cardLayoutChanged) {
     this.setCardLayout(option.cardLayout);
@@ -962,35 +1137,27 @@ Article.prototype.setOption = function(option, value) {
   }
 };
 Article.prototype.initialiseStyles = function(data = this.data) {
-  const articleOptions = this.owner._getResolvedArticleOptions(this);
   const resolvedDefaultCardLayout = this.owner._resolveDefaultCardLayoutName(this);
   const explicitCardLayout = this.owner._getExplicitArticleCardLayout(this);
   const cardLayout = explicitCardLayout || resolvedDefaultCardLayout;
   this._resolvedDefaultCardLayout = resolvedDefaultCardLayout;
   this._resolvedCardLayoutName = cardLayout;
-  const layoutStyles = articleOptions.layoutStyles[cardLayout] || {};
-  const style = deepMerge(
-    {},
-    articleOptions.defaultStyle,
-    layoutStyles.style || {},
-    getPropertyFromData(data, "style") || {}
-  );
+  const styleOverrides = this.owner._getResolvedArticleStyleOverrides(this, cardLayout);
+  const style = deepMerge({}, styleOverrides.style, getPropertyFromData(data, "style") || {});
   const activeStyle = deepMerge(
     {},
-    articleOptions.defaultActiveStyle,
-    layoutStyles.activeStyle || {},
+    styleOverrides.activeStyle,
     getPropertyFromData(data, "activeStyle") || {}
   );
   const hoverStyle = deepMerge(
     {},
-    articleOptions.defaultHoverStyle,
-    layoutStyles.hoverStyle || {},
+    styleOverrides.hoverStyle,
     getPropertyFromData(data, "hoverStyle") || {}
   );
   this.style = style;
   this.activeStyle = deepMerge({}, style, activeStyle);
   this.hoverStyle = deepMerge({}, style, hoverStyle);
-  this.activeHoverStyle = deepMerge({}, this.hoverStyle, activeStyle);
+  this.activeHoverStyle = deepMerge({}, style, hoverStyle, activeStyle);
 };
 Article.prototype.setStyle = function(option, value) {
   if (typeof option === "string") {
@@ -1012,13 +1179,7 @@ Article.prototype.setHoverStyle = function(option, value) {
     option = buildObjectFromPath(option, value);
   }
   this.data.hoverStyle = deepMerge(this.data.hoverStyle || {}, option);
-  deepMerge(this.hoverStyle, option);
-  this.activeHoverStyle = deepMerge(
-    {},
-    this.hoverStyle,
-    this.owner._getResolvedArticleOptions(this).defaultActiveStyle,
-    this.data.activeStyle
-  );
+  this.initialiseStyles(this.data);
   this.owner.requestRedraw();
 };
 Article.prototype.setActiveStyle = function(option, value) {
@@ -1029,8 +1190,7 @@ Article.prototype.setActiveStyle = function(option, value) {
     option = buildObjectFromPath(option, value);
   }
   this.data.activeStyle = deepMerge(this.data.activeStyle || {}, option);
-  deepMerge(this.activeStyle, option);
-  deepMerge(this.activeHoverStyle, option);
+  this.initialiseStyles(this.data);
   this.owner.requestRedraw();
 };
 Article.prototype.activated = function() {
@@ -1192,6 +1352,57 @@ Article.prototype.moveToOffsetWithAnim = function(destination) {
   });
   moveAnimation.dummyElement = moveTween;
 };
+function roundPixel(value) {
+  return Math.round(value);
+}
+__name(roundPixel, "roundPixel");
+function snapPixel(value, dpr = 1) {
+  const ratio = typeof dpr === "number" && isFinite(dpr) && dpr > 0 ? dpr : 1;
+  return Math.round(value * ratio) / ratio;
+}
+__name(snapPixel, "snapPixel");
+function retainPixel(value) {
+  return value;
+}
+__name(retainPixel, "retainPixel");
+function createPixelSnap(dpr = 1, mode = "device") {
+  if (mode === false || mode === "none") {
+    return retainPixel;
+  }
+  if (mode === "css") {
+    return roundPixel;
+  }
+  return /* @__PURE__ */ __name(function snapToDevicePixel(value) {
+    return snapPixel(value, dpr);
+  }, "snapToDevicePixel");
+}
+__name(createPixelSnap, "createPixelSnap");
+function createStrokePixelSnap(dpr = 1, mode = "device", lineWidth = 1) {
+  if (mode === false || mode === "none") {
+    return retainPixel;
+  }
+  const deviceRatio = typeof dpr === "number" && isFinite(dpr) && dpr > 0 ? dpr : 1;
+  const ratio = mode === "css" ? 1 : deviceRatio;
+  const width = typeof lineWidth === "number" && isFinite(lineWidth) && lineWidth > 0 ? lineWidth : 1;
+  const halfPhysicalWidth = width * ratio / 2;
+  return /* @__PURE__ */ __name(function snapStrokeCentre(value) {
+    return (Math.round(value * ratio - halfPhysicalWidth) + halfPhysicalWidth) / ratio;
+  }, "snapStrokeCentre");
+}
+__name(createStrokePixelSnap, "createStrokePixelSnap");
+function createInnerSpace(outerSpace, borderWidth, snap) {
+  if (!snap) {
+    snap = roundPixel;
+  }
+  const halfBorder = borderWidth / 2;
+  return {
+    left: snap(outerSpace.left + halfBorder),
+    top: snap(outerSpace.top + halfBorder),
+    width: snap(outerSpace.width - borderWidth),
+    height: snap(outerSpace.height - borderWidth)
+  };
+}
+__name(createInnerSpace, "createInnerSpace");
 Article.prototype.draw = function(ctx) {
   if (!this.isDataLoaded || isNaN(this.position.left)) {
     return;
@@ -1201,12 +1412,15 @@ Article.prototype.draw = function(ctx) {
   const cardLayout = this._getCurrentCardLayout();
   cardLayout.draw.call(this, ctx);
 };
-Article.prototype._getCurrentStyle = function() {
+Article.prototype.getCurrentStyle = function() {
   if (this.isActive) {
     return this.isMouseover ? this.activeHoverStyle : this.activeStyle;
   }
   return this.isMouseover ? this.hoverStyle : this.style;
 };
+Article.prototype._getCurrentStyle = function() {
+  return this.getCurrentStyle();
+};
 Article.prototype._getPeriodLineRenderGeometry = function(axisY) {
   const resolvedArticleOptions = this.owner._getResolvedArticleOptions(this);
   const periodLineOptions = resolvedArticleOptions.periodLine || {};
@@ -1238,7 +1452,7 @@ Article.prototype._getPeriodLineRenderGeometry = function(axisY) {
 };
 Article.prototype.drawPeriodLinesAndConnectors = function(ctx, axisY) {
   ctx.globalAlpha = this.opacity;
-  const style = this._getCurrentStyle();
+  const style = this.getCurrentStyle();
   const geometry = this._getPeriodLineRenderGeometry(axisY);
   const y = geometry.y;
   if (!this.hidePeriodLine) {
@@ -1270,16 +1484,26 @@ Article.prototype.drawPeriodLinesAndConnectors = function(ctx, axisY) {
   const y1 = y;
   const x2 = connectorEnd.left;
   const y2 = connectorEnd.top;
+  const isVertical = Math.abs(x1 - x2) < Number.EPSILON;
+  const pixelSnapMode = this.owner?.options?.article?.rendering?.pixelSnap;
+  const snapStroke = createStrokePixelSnap(
+    this.owner?.getCanvasDpr?.() || 1,
+    pixelSnapMode,
+    style.connectorLine.thickness
+  );
+  const connectorX = isVertical ? snapStroke(x2) : null;
+  const drawX1 = connectorX ?? x1;
+  const drawX2 = connectorX ?? x2;
   ctx.strokeStyle = ctx.fillStyle = style.color;
   ctx.lineWidth = style.connectorLine.thickness;
   ctx.beginPath();
-  ctx.moveTo(x1, y1);
-  ctx.lineTo(x2, y2);
+  ctx.moveTo(drawX1, y1);
+  ctx.lineTo(drawX2, y2);
   ctx.stroke();
-  const radians = Math.atan((y2 - y1) / (x2 - x1)) + (x2 >= x1 ? -90 : 90) * Math.PI / 180;
+  const radians = Math.atan((y2 - y1) / (drawX2 - drawX1)) + (drawX2 >= drawX1 ? -90 : 90) * Math.PI / 180;
   ctx.save();
   ctx.beginPath();
-  ctx.translate(x2, y2);
+  ctx.translate(drawX2, y2);
   ctx.rotate(radians);
   ctx.moveTo(-style.connectorLine.arrow.width, 0);
   ctx.lineTo(style.connectorLine.arrow.width, 0);
@@ -1351,7 +1575,7 @@ Article.prototype.memo = function(key, factory) {
   return key in bucket ? bucket[key] : bucket[key] = factory.call(this);
 };
 Article.prototype._getSizeCacheKey = function() {
-  const style = typeof this._getCurrentStyle === "function" ? this._getCurrentStyle() : null;
+  const style = typeof this.getCurrentStyle === "function" ? this.getCurrentStyle() : null;
   const imageStyle = style && style.image || {};
   const header = style && style.header || {};
   const subheader = style && style.subheader || {};
@@ -1587,6 +1811,10 @@ const sorters = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
 const MINOR_MARKER = 0;
 const MAJOR_MARKER = 1;
 const ERA_MARKER = 2;
+const ZOOM_MILLISECOND = -4;
+const ZOOM_SECOND = -3;
+const ZOOM_MINUTE = -2;
+const ZOOM_HOUR = -1;
 const ZOOM_DAY = 0;
 const ZOOM_MONTH = 1;
 const ZOOM_YEAR = 2;
@@ -1599,6 +1827,10 @@ const ZOOM_MILLION_YEARS = 8;
 const ZOOM_10_MILLION_YEARS = 9;
 const ZOOM_100_MILLION_YEARS = 10;
 const ZOOM_BILLION_YEARS = 11;
+const PRECISION_MILLISECOND = "millisecond";
+const PRECISION_SECOND = "second";
+const PRECISION_MINUTE = "minute";
+const PRECISION_HOUR = "hour";
 const PRECISION_DAY = "day";
 const PRECISION_MONTH = "month";
 const PRECISION_YEAR = "year";
@@ -1620,6 +1852,249 @@ const DENSITY_ALL = "all";
 const RANGE_ALL = "all";
 const RANGE_SCREEN = "screen";
 const DENSITY_SETTINGS = [
+  {
+    region: -26,
+    zoom: { from: Number.NEGATIVE_INFINITY, to: -80.86 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 134217728 }
+  },
+  {
+    region: -25,
+    zoom: { from: -80.86, to: -77.75 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 67108864 }
+  },
+  {
+    region: -24,
+    zoom: { from: -77.75, to: -74.64 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 33554432 }
+  },
+  {
+    region: -23,
+    zoom: { from: -74.64, to: -71.53 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 16777216 }
+  },
+  {
+    region: -22,
+    zoom: { from: -71.53, to: -68.42 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 8388608 }
+  },
+  {
+    region: -21,
+    zoom: { from: -68.42, to: -65.31 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 4194304 }
+  },
+  {
+    region: -20,
+    zoom: { from: -65.31, to: -62.2 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 2097152 }
+  },
+  {
+    region: -19,
+    zoom: { from: -62.2, to: -59.09 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 1048576 }
+  },
+  {
+    region: -18,
+    zoom: { from: -59.09, to: -55.98 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 524288 }
+  },
+  {
+    region: -17,
+    zoom: { from: -55.98, to: -52.87 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 262144 }
+  },
+  {
+    region: -16,
+    zoom: { from: -52.87, to: -49.76 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 131072 }
+  },
+  {
+    region: -15,
+    zoom: { from: -49.76, to: -46.65 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 65536 }
+  },
+  {
+    region: -14,
+    zoom: { from: -46.65, to: -43.54 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 32768 }
+  },
+  {
+    region: -13,
+    zoom: { from: -43.54, to: -40.43 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 16384 }
+  },
+  {
+    region: -12,
+    zoom: { from: -40.43, to: -37.32 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 8192 }
+  },
+  {
+    region: -11,
+    zoom: { from: -37.32, to: -34.21 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 4096 }
+  },
+  {
+    region: -10,
+    zoom: { from: -34.21, to: -31.1 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 2048 }
+  },
+  {
+    region: -9,
+    zoom: { from: -31.1, to: -27.99 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 1024 }
+  },
+  {
+    region: -8,
+    zoom: { from: -27.99, to: -24.88 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 512 }
+  },
+  {
+    region: -7,
+    zoom: { from: -24.88, to: -21.77 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 256 }
+  },
+  {
+    region: -6,
+    zoom: { from: -21.77, to: -18.66 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 128 }
+  },
+  {
+    region: -5,
+    zoom: { from: -18.66, to: -15.55 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 64 }
+  },
+  {
+    region: -4,
+    zoom: { from: -15.55, to: -12.44 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 32 }
+  },
+  {
+    region: -3,
+    zoom: { from: -12.44, to: -9.33 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 16 }
+  },
+  {
+    region: -2,
+    zoom: { from: -9.33, to: -6.22 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 8 }
+  },
+  {
+    region: -1,
+    zoom: { from: -6.22, to: -3.11 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 4 }
+  },
+  {
+    region: 0,
+    zoom: { from: -3.11, to: 0 },
+    low: 1,
+    medium: 2,
+    high: 3,
+    all: 25,
+    step: { months: 0, days: 0, divisionsPerDay: 2 }
+  },
   {
     region: 1,
     zoom: { from: 0, to: 3.11 },
@@ -1995,9 +2470,13 @@ const constants = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePro
   PRECISION_CENTURY,
   PRECISION_DAY,
   PRECISION_DECADE,
+  PRECISION_HOUR,
   PRECISION_MILLENNIUM,
   PRECISION_MILLION_YEARS,
+  PRECISION_MILLISECOND,
+  PRECISION_MINUTE,
   PRECISION_MONTH,
+  PRECISION_SECOND,
   PRECISION_YEAR,
   RANGE_ALL,
   RANGE_SCREEN,
@@ -2010,9 +2489,13 @@ const constants = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePro
   ZOOM_CENTURY,
   ZOOM_DAY,
   ZOOM_DECADE,
+  ZOOM_HOUR,
   ZOOM_MILLENNIUM,
   ZOOM_MILLION_YEARS,
+  ZOOM_MILLISECOND,
+  ZOOM_MINUTE,
   ZOOM_MONTH,
+  ZOOM_SECOND,
   ZOOM_YEAR
 }, Symbol.toStringTag, { value: "Module" }));
 const CHART_RENDERERS = /* @__PURE__ */ new Map();
@@ -2085,7 +2568,7 @@ const CHART_DEFAULT_STYLE = {
       minor: {
         visible: true,
         color: "rgba(0, 0, 0, 0.035)",
-        thickness: 2,
+        thickness: 1,
         minimumSpacing: 20
       }
     },
@@ -2699,10 +3182,10 @@ function getValueY(value, domain, plot) {
   return plot.bottom - (value - domain.min) / (domain.max - domain.min) * plot.height;
 }
 __name(getValueY, "getValueY");
-function clamp$2(value, min, max) {
+function clamp$1(value, min, max) {
   return Math.max(min, Math.min(max, value));
 }
-__name(clamp$2, "clamp$2");
+__name(clamp$1, "clamp$1");
 function getViewportRange(points, drawCycleContext) {
   const tokens = drawCycleContext && drawCycleContext.tokens ? drawCycleContext.tokens : null;
   if (!tokens || !tokens.start || !tokens.end || points.length === 0) {
@@ -2749,6 +3232,126 @@ function clipToRect(ctx, rect) {
   ctx.clip();
 }
 __name(clipToRect, "clipToRect");
+function clipLineSegmentToRect(from, to, rect) {
+  const dx = to.x - from.x;
+  const dy = to.y - from.y;
+  let startRatio = 0;
+  let endRatio = 1;
+  let startBoundary = null;
+  let endBoundary = null;
+  const boundaries = [
+    [-dx, from.x - rect.left],
+    [dx, rect.right - from.x],
+    [-dy, from.y - rect.top],
+    [dy, rect.bottom - from.y]
+  ];
+  for (let i = 0; i < boundaries.length; i++) {
+    const [direction, distance] = boundaries[i];
+    if (direction === 0) {
+      if (distance < 0) {
+        return null;
+      }
+      continue;
+    }
+    const ratio = distance / direction;
+    if (direction < 0) {
+      if (ratio > startRatio) {
+        startRatio = ratio;
+        startBoundary = i;
+      }
+    } else if (ratio < endRatio) {
+      endRatio = ratio;
+      endBoundary = i;
+    }
+    if (startRatio > endRatio) {
+      return null;
+    }
+  }
+  const getClippedPoint = /* @__PURE__ */ __name((ratio, boundary) => {
+    if (ratio === 0) {
+      return from;
+    }
+    if (ratio === 1) {
+      return to;
+    }
+    const point = {
+      x: clamp$1(from.x + dx * ratio, rect.left, rect.right),
+      y: clamp$1(from.y + dy * ratio, rect.top, rect.bottom)
+    };
+    if (boundary === 0) {
+      point.x = rect.left;
+    } else if (boundary === 1) {
+      point.x = rect.right;
+    } else if (boundary === 2) {
+      point.y = rect.top;
+    } else if (boundary === 3) {
+      point.y = rect.bottom;
+    }
+    return point;
+  }, "getClippedPoint");
+  return {
+    from: getClippedPoint(startRatio, startBoundary),
+    to: getClippedPoint(endRatio, endBoundary)
+  };
+}
+__name(clipLineSegmentToRect, "clipLineSegmentToRect");
+function pointsEqual(left, right) {
+  return left && right && left.x === right.x && left.y === right.y;
+}
+__name(pointsEqual, "pointsEqual");
+function clipPolygonAgainstBoundary(points, isInside2, getIntersection) {
+  if (points.length === 0) {
+    return points;
+  }
+  const clipped = [];
+  let previous = points[points.length - 1];
+  let previousInside = isInside2(previous);
+  for (let i = 0; i < points.length; i++) {
+    const current = points[i];
+    const currentInside = isInside2(current);
+    if (currentInside) {
+      if (!previousInside) {
+        clipped.push(getIntersection(previous, current));
+      }
+      clipped.push(current);
+    } else if (previousInside) {
+      clipped.push(getIntersection(previous, current));
+    }
+    previous = current;
+    previousInside = currentInside;
+  }
+  return clipped;
+}
+__name(clipPolygonAgainstBoundary, "clipPolygonAgainstBoundary");
+function clipPolygonToRect(points, rect) {
+  const clipVertical = /* @__PURE__ */ __name((polygon, boundary, keepGreater) => clipPolygonAgainstBoundary(
+    polygon,
+    (point) => keepGreater ? point.x >= boundary : point.x <= boundary,
+    (from, to) => {
+      const ratio = (boundary - from.x) / (to.x - from.x);
+      return {
+        x: boundary,
+        y: clamp$1(from.y + (to.y - from.y) * ratio, rect.top, rect.bottom)
+      };
+    }
+  ), "clipVertical");
+  const clipHorizontal = /* @__PURE__ */ __name((polygon, boundary, keepGreater) => clipPolygonAgainstBoundary(
+    polygon,
+    (point) => keepGreater ? point.y >= boundary : point.y <= boundary,
+    (from, to) => {
+      const ratio = (boundary - from.y) / (to.y - from.y);
+      return {
+        x: clamp$1(from.x + (to.x - from.x) * ratio, rect.left, rect.right),
+        y: boundary
+      };
+    }
+  ), "clipHorizontal");
+  let clipped = clipVertical(points, rect.left, true);
+  clipped = clipVertical(clipped, rect.right, false);
+  clipped = clipHorizontal(clipped, rect.top, true);
+  return clipHorizontal(clipped, rect.bottom, false);
+}
+__name(clipPolygonToRect, "clipPolygonToRect");
 function drawBackground(ctx, geometry, style) {
   if (!style.backgroundColor) {
     return;
@@ -2819,7 +3422,7 @@ function shouldDrawMinorXGridLines(timeline, minimumSpacing) {
   return unitSizeInPixels >= minimumSpacing;
 }
 __name(shouldDrawMinorXGridLines, "shouldDrawMinorXGridLines");
-function drawXGridLineGroup(ctx, plot, markerTokens, options) {
+function drawXGridLineGroup(ctx, plot, markerTokens, options, minimumSpacing = 0) {
   if (!options || options.visible !== true || markerTokens.length === 0) {
     return;
   }
@@ -2828,6 +3431,9 @@ function drawXGridLineGroup(ctx, plot, markerTokens, options) {
   ctx.strokeStyle = options.color || "rgba(0, 0, 0, 0.08)";
   for (let i = 0; i < markerTokens.length; i++) {
     const token = markerTokens[i];
+    if (token.adaptive && token.markerSpacingInPixels < minimumSpacing) {
+      continue;
+    }
     if (typeof token.drawX !== "number" || !Number.isFinite(token.drawX)) {
       continue;
     }
@@ -2845,10 +3451,16 @@ function drawXGridLines(ctx, plot, gridLine, timeline, drawCycleContext) {
   const xGrid = gridLine.x || {};
   const major = xGrid.major || {};
   const minor = xGrid.minor || {};
-  const minorMinimumSpacing = Math.max(0, getNumber(minor.minimumSpacing, 40));
+  const minorMinimumSpacing = Math.max(0, getNumber(minor.minimumSpacing, 20));
   drawXGridLineGroup(ctx, plot, getMarkers(drawCycleContext, MAJOR_MARKER), major);
   if (shouldDrawMinorXGridLines(timeline, minorMinimumSpacing)) {
-    drawXGridLineGroup(ctx, plot, getMarkers(drawCycleContext, MINOR_MARKER), minor);
+    drawXGridLineGroup(
+      ctx,
+      plot,
+      getMarkers(drawCycleContext, MINOR_MARKER),
+      minor,
+      minorMinimumSpacing
+    );
   }
 }
 __name(drawXGridLines, "drawXGridLines");
@@ -2909,22 +3521,32 @@ function drawSeriesLine(ctx, timeline, series, domain, plot, drawCycleContext, p
   if (Array.isArray(style.lineDash) && typeof ctx.setLineDash === "function") {
     ctx.setLineDash(style.lineDash);
   }
-  let hasPath = false;
+  let previousPoint = null;
+  let pathEnd = null;
   const range = getViewportRange(points, drawCycleContext);
   for (let i = range.start; i <= range.end; i++) {
     const point = points[i];
     if (typeof point.value !== "number" || !Number.isFinite(point.value)) {
-      hasPath = false;
+      previousPoint = null;
+      pathEnd = null;
       continue;
     }
     const x = timeline.getPixel(point.date, drawCycleContext);
     const y = getValueY(point.value, domain, plot);
-    if (!hasPath) {
-      ctx.moveTo(x, y);
-      hasPath = true;
-    } else {
-      ctx.lineTo(x, y);
+    const currentPoint = { x, y };
+    if (previousPoint && Number.isFinite(previousPoint.x) && Number.isFinite(previousPoint.y) && Number.isFinite(currentPoint.x) && Number.isFinite(currentPoint.y)) {
+      const clippedSegment = clipLineSegmentToRect(previousPoint, currentPoint, plot);
+      if (clippedSegment) {
+        if (!pointsEqual(pathEnd, clippedSegment.from)) {
+          ctx.moveTo(clippedSegment.from.x, clippedSegment.from.y);
+        }
+        ctx.lineTo(clippedSegment.to.x, clippedSegment.to.y);
+        pathEnd = clippedSegment.to;
+      } else {
+        pathEnd = null;
+      }
     }
+    previousPoint = currentPoint;
   }
   ctx.stroke();
   if (typeof ctx.setLineDash === "function") {
@@ -2938,7 +3560,7 @@ function drawSeriesArea(ctx, timeline, stackedSeries, domain, plot, drawCycleCon
   const points = stackedSeries.points || [];
   const style = series.style || {};
   const areaStyle = style.area || {};
-  const opacity = clamp$2(getNumber(areaStyle.opacity, 0.2), 0, 1);
+  const opacity = clamp$1(getNumber(areaStyle.opacity, 0.2), 0, 1);
   ctx.save();
   clipToRect(ctx, plot);
   ctx.fillStyle = areaStyle.fillColor || style.color || "#2563eb";
@@ -2949,11 +3571,23 @@ function drawSeriesArea(ctx, timeline, stackedSeries, domain, plot, drawCycleCon
     if (segment.length === 0) {
       return;
     }
+    const polygon = [];
+    for (let i = 0; i < segment.length; i++) {
+      polygon.push({ x: segment[i].x, y: segment[i].y });
+    }
     for (let i = segment.length - 1; i >= 0; i--) {
-      ctx.lineTo(segment[i].x, segment[i].baseY);
+      polygon.push({ x: segment[i].x, y: segment[i].baseY });
+    }
+    const clippedPolygon = clipPolygonToRect(polygon, plot);
+    if (clippedPolygon.length >= 3) {
+      ctx.beginPath();
+      ctx.moveTo(clippedPolygon[0].x, clippedPolygon[0].y);
+      for (let i = 1; i < clippedPolygon.length; i++) {
+        ctx.lineTo(clippedPolygon[i].x, clippedPolygon[i].y);
+      }
+      ctx.closePath();
+      ctx.fill();
     }
-    ctx.closePath();
-    ctx.fill();
     segment = [];
   }, "closeSegment");
   for (let i = range.start; i <= range.end; i++) {
@@ -2964,15 +3598,8 @@ function drawSeriesArea(ctx, timeline, stackedSeries, domain, plot, drawCycleCon
     }
     const x = timeline.getPixel(point.date, drawCycleContext);
     const y = getValueY(point.value, domain, plot);
-    const baseY = clamp$2(getValueY(point.baseValue, domain, plot), plot.top, plot.bottom);
-    if (segment.length === 0) {
-      ctx.beginPath();
-      ctx.moveTo(x, baseY);
-      ctx.lineTo(x, y);
-    } else {
-      ctx.lineTo(x, y);
-    }
-    segment.push({ x, baseY });
+    const baseY = clamp$1(getValueY(point.baseValue, domain, plot), plot.top, plot.bottom);
+    segment.push({ x, y, baseY });
   }
   closeSegment();
   ctx.restore();
@@ -3088,8 +3715,16 @@ function normalizeDate(owner, input) {
   const month = parseFiniteInteger(input.month, 1);
   const day = parseFiniteInteger(input.day, 1);
   const precision = input.precision;
-  const dmy = new Dmy(year, month, day);
-  owner.getDmyFromInput(dmy);
+  let dmy = new Dmy(
+    year,
+    month,
+    day,
+    parseFiniteInteger(input.hour, 0),
+    parseFiniteInteger(input.minute, 0),
+    parseFiniteInteger(input.second, 0),
+    parseFiniteInteger(input.millisecond, 0)
+  );
+  dmy = owner.getDmyFromInput(dmy);
   return Dmy.CreateAsStartOfPeriod(dmy, precision);
 }
 __name(normalizeDate, "normalizeDate");
@@ -3145,11 +3780,20 @@ function setAssignedSeriesColor(chart, id, color) {
   chart._seriesColors.push({ id, color });
 }
 __name(setAssignedSeriesColor, "setAssignedSeriesColor");
-function normalizeSeries(owner, chartStyle, seriesInput, index, assignedColor) {
+function getSeriesPalette(chartOptions) {
+  const configuredColors = chartOptions && chartOptions.seriesColors;
+  if (!Array.isArray(configuredColors)) {
+    return CHART_DEFAULT_PALETTE;
+  }
+  const palette = configuredColors.filter((color) => typeof color === "string" && color.length > 0);
+  return palette.length > 0 ? palette : CHART_DEFAULT_PALETTE;
+}
+__name(getSeriesPalette, "getSeriesPalette");
+function normalizeSeries(owner, chartStyle, seriesInput, index, assignedColor, palette) {
   const input = seriesInput || {};
   const baseStyle = deepMerge({}, CHART_DEFAULT_SERIES_STYLE, chartStyle.series || {});
   if (!baseStyle.color) {
-    baseStyle.color = assignedColor || CHART_DEFAULT_PALETTE[index % CHART_DEFAULT_PALETTE.length];
+    baseStyle.color = assignedColor || palette[index % palette.length];
   }
   const points = Array.isArray(input.points) ? input.points.map((point) => normalizePoint(owner, point)).filter(Boolean) : [];
   points.sort((a, b) => a.date.compare(b.date));
@@ -3230,14 +3874,21 @@ Chart.prototype._resolveFromData = function() {
     {},
     CHART_DEFAULT_STYLE,
     chartOptions.defaultStyle || {},
-    { gridLine: chartOptions.gridLine || {} },
     getPropertyFromData(resolvedData, "style") || {}
   );
   const seriesInput = Array.isArray(resolvedData.series) ? resolvedData.series : [];
+  const seriesPalette = getSeriesPalette(chartOptions);
   this.series = seriesInput.map((series, index) => {
     const seriesId = getSeriesId(series, index);
     const assignedColor = getAssignedSeriesColor(this, seriesId);
-    const normalizedSeries = normalizeSeries(this.owner, this.style, series, index, assignedColor);
+    const normalizedSeries = normalizeSeries(
+      this.owner,
+      this.style,
+      series,
+      index,
+      assignedColor,
+      seriesPalette
+    );
     if (hasSeriesInputColor(series) || !hasChartSeriesColor(this.style)) {
       setAssignedSeriesColor(this, seriesId, normalizedSeries.style.color);
     }
@@ -3395,10 +4046,10 @@ function isFiniteNumber(value) {
   return typeof value === "number" && Number.isFinite(value);
 }
 __name(isFiniteNumber, "isFiniteNumber");
-function clamp$1(value, min, max) {
+function clamp(value, min, max) {
   return Math.min(Math.max(value, min), max);
 }
-__name(clamp$1, "clamp$1");
+__name(clamp, "clamp");
 function getLaneArticleOptionImpact(articleOption) {
   const styleChanged = hasLaneArticlePath(articleOption, LANE_ARTICLE_STYLE_PATHS);
   const cacheChanged = styleChanged || hasLaneArticlePath(articleOption, LANE_ARTICLE_CACHE_ONLY_PATHS);
@@ -3468,10 +4119,10 @@ function computeResponsiveDistanceToBaseline(responsiveOptions, availableHeight,
   const rawMax = isFiniteNumber(layoutOptions.max) ? layoutOptions.max : Number.POSITIVE_INFINITY;
   const min = Math.max(0, Math.min(rawMin, rawMax));
   const max = Math.max(min, rawMax);
-  const boundedMin = clamp$1(min, 0, safeAvailableHeight);
-  const boundedMax = clamp$1(max, boundedMin, safeAvailableHeight);
+  const boundedMin = clamp(min, 0, safeAvailableHeight);
+  const boundedMax = clamp(max, boundedMin, safeAvailableHeight);
   const scaledDistance = Math.round(safeAvailableHeight * ratio);
-  return clamp$1(scaledDistance, boundedMin, boundedMax);
+  return clamp(scaledDistance, boundedMin, boundedMax);
 }
 __name(computeResponsiveDistanceToBaseline, "computeResponsiveDistanceToBaseline");
 function resolveDistanceToBaselineValue(distanceToBaseline, availableHeight, laneLayoutActive, cardLayoutName) {
@@ -3501,7 +4152,7 @@ const ARTICLE_DATA_DEFAULTS = {
 };
 const DEFAULT_STYLE = {
   width: 150,
-  color: "#e9e9e9",
+  color: "#e5e5e5",
   backgroundColor: "#fff",
   topRadius: 3,
   // portrait card layout only
@@ -3626,6 +4277,7 @@ const TIME_BAND_DEFAULT_STYLE = {
     offsetY: 0
   }
 };
+const DEFAULT_MAIN_LINE_COLOR = "#cdd2d8";
 const ENGINE_DEFAULTS = {
   width: 1e3,
   height: 500,
@@ -3661,7 +4313,8 @@ const ENGINE_DEFAULTS = {
       // density region size
       initial: 200,
       showMinorLabels: 48,
-      minimum: 8
+      minimum: 8,
+      minimumMajor: 120
     }
   },
   initialDate: {
@@ -3691,7 +4344,22 @@ const ENGINE_DEFAULTS = {
       visible: true,
       position: "bottom",
       size: 8,
-      showDateIndicators: true
+      color: DEFAULT_MAIN_LINE_COLOR,
+      opacity: 0.75,
+      dateIndicators: {
+        visible: true,
+        shape: "rectangle",
+        size: 4,
+        color: "#666",
+        opacity: 1,
+        hiddenStyle: {
+          opacity: 0.25
+        },
+        activeStyle: {
+          color: "article",
+          opacity: 1
+        }
+      }
     },
     draggingHighlight: {
       visible: true,
@@ -3742,6 +4410,10 @@ const ENGINE_DEFAULTS = {
           x: 4,
           y: 0
         },
+        sticky: {
+          enabled: "auto",
+          offsetX: 4
+        },
         bceText: " ʙᴄᴇ",
         thousandsSeparator: ",",
         yearPrefixes: {
@@ -3749,6 +4421,23 @@ const ENGINE_DEFAULTS = {
           Ma: { label: "Ma", value: 1e6, minDivision: 1e6 },
           Ga: { label: "Ga", value: 1e9, minDivision: 1e9 }
         }
+      },
+      parent: {
+        visible: false,
+        levels: "all",
+        height: 20,
+        font: "normal 14px Calibri",
+        color: "#444",
+        futureColor: "#ccc",
+        textAlign: "start",
+        offset: {
+          x: 4,
+          y: 0
+        },
+        sticky: {
+          enabled: true,
+          offsetX: 4
+        }
       }
     },
     cursor: {
@@ -3776,6 +4465,7 @@ const ENGINE_DEFAULTS = {
       up: "edge",
       down: 0
     },
+    seriesColors: [...CHART_DEFAULT_PALETTE],
     defaultData: {},
     defaultStyle: deepMerge({}, CHART_DEFAULT_STYLE),
     data: []
@@ -3870,6 +4560,46 @@ function warnDeprecatedOptionPath(fromPath, toPath) {
   Logger.warn(`DEPRECATION WARNING: ${fromPath} is deprecated. Use ${toPath} instead.`);
 }
 __name(warnDeprecatedOptionPath, "warnDeprecatedOptionPath");
+const DATE_INDICATOR_SHAPES = /* @__PURE__ */ new Set(["rectangle", "circle"]);
+function validateDateIndicatorStyle(style, optionPath, { allowVisible = false } = {}) {
+  if (style === void 0) {
+    return;
+  }
+  if (!style || typeof style !== "object" || Array.isArray(style)) {
+    throw new TypeError(`${optionPath} must be an object`);
+  }
+  if (allowVisible && style.visible !== void 0 && typeof style.visible !== "boolean") {
+    throw new TypeError(`${optionPath}.visible must be a boolean`);
+  }
+  if (style.shape !== void 0 && !DATE_INDICATOR_SHAPES.has(style.shape)) {
+    throw new TypeError(`${optionPath}.shape must be "rectangle" or "circle"`);
+  }
+  if (style.size !== void 0 && (typeof style.size !== "number" || !Number.isFinite(style.size) || style.size <= 0)) {
+    throw new TypeError(`${optionPath}.size must be a positive finite number`);
+  }
+  if (style.color !== void 0 && typeof style.color !== "string") {
+    throw new TypeError(`${optionPath}.color must be a CSS colour string or "article"`);
+  }
+  if (style.opacity !== void 0 && (typeof style.opacity !== "number" || !Number.isFinite(style.opacity) || style.opacity < 0 || style.opacity > 1)) {
+    throw new TypeError(`${optionPath}.opacity must be a finite number between 0 and 1`);
+  }
+}
+__name(validateDateIndicatorStyle, "validateDateIndicatorStyle");
+function validateDateIndicatorOptions(inputOptions) {
+  const dateIndicators = inputOptions?.style?.mainLine?.dateIndicators;
+  validateDateIndicatorStyle(dateIndicators, "style.mainLine.dateIndicators", {
+    allowVisible: true
+  });
+  validateDateIndicatorStyle(
+    dateIndicators?.hiddenStyle,
+    "style.mainLine.dateIndicators.hiddenStyle"
+  );
+  validateDateIndicatorStyle(
+    dateIndicators?.activeStyle,
+    "style.mainLine.dateIndicators.activeStyle"
+  );
+}
+__name(validateDateIndicatorOptions, "validateDateIndicatorOptions");
 function migrateArticleDistanceToBaseline(inputArticleOptions, processedArticleOptions, optionPath) {
   if (inputArticleOptions?.distanceToMainLine === void 0) {
     return;
@@ -3894,10 +4624,7 @@ function normalizeDeprecatedOptionPath(path) {
   if (typeof path !== "string") {
     return path;
   }
-  const normalizedPath = path.replace(
-    /(^article\.|\.article\.)distanceToMainLine$/,
-    "$1distanceToBaseline.value"
-  );
+  const normalizedPath = path.replace(/(^article\.|\.article\.)distanceToMainLine$/, "$1distanceToBaseline.value").replace(/^chart\.gridLine(?=\.|$)/, "chart.defaultStyle.gridLine");
   if (normalizedPath !== path) {
     warnDeprecatedOptionPath(path, normalizedPath);
   }
@@ -3926,7 +4653,20 @@ function handleDeprecatedOptions(inputOptions) {
   if (!inputOptions) {
     return inputOptions;
   }
+  validateDateIndicatorOptions(inputOptions);
   const processedOptions = deepMerge({}, inputOptions);
+  if (inputOptions.chart?.gridLine !== void 0) {
+    warnDeprecatedOptionPath("chart.gridLine", "chart.defaultStyle.gridLine");
+    if (!processedOptions.chart.defaultStyle) {
+      processedOptions.chart.defaultStyle = {};
+    }
+    processedOptions.chart.defaultStyle.gridLine = deepMerge(
+      {},
+      inputOptions.chart.gridLine,
+      inputOptions.chart.defaultStyle?.gridLine || {}
+    );
+    delete processedOptions.chart.gridLine;
+  }
   if (inputOptions.article?.distanceToMainLine !== void 0) {
     if (!processedOptions.article) {
       processedOptions.article = {};
@@ -4202,12 +4942,16 @@ TimeBand.prototype.setupByReceivedData = function(receivedData) {
   this.isDataLoaded = true;
 };
 TimeBand.prototype._setupPeriod = function(data) {
-  const fromDmy = new Dmy(
+  let fromDmy = new Dmy(
     parseInt(getPropertyFromData(data, "from.year")),
     parseInt(getPropertyFromData(data, "from.month")),
-    parseInt(getPropertyFromData(data, "from.day"))
+    parseInt(getPropertyFromData(data, "from.day")),
+    parseInt(getPropertyFromData(data, "from.hour")),
+    parseInt(getPropertyFromData(data, "from.minute")),
+    parseInt(getPropertyFromData(data, "from.second")),
+    parseInt(getPropertyFromData(data, "from.millisecond"))
   );
-  this.owner.getDmyFromInput(fromDmy);
+  fromDmy = this.owner.getDmyFromInput(fromDmy);
   const fromPrecision = getPropertyFromData(data, "from.precision");
   const isToPresentProp = getPropertyFromData(data, "isToPresent");
   const isToPresent = isToPresentProp === true || isToPresentProp === 1;
@@ -4219,17 +4963,21 @@ TimeBand.prototype._setupPeriod = function(data) {
     toDmy = new Dmy(
       parseInt(getPropertyFromData(data, "to.year")),
       parseInt(getPropertyFromData(data, "to.month")),
-      parseInt(getPropertyFromData(data, "to.day"))
+      parseInt(getPropertyFromData(data, "to.day")),
+      parseInt(getPropertyFromData(data, "to.hour")),
+      parseInt(getPropertyFromData(data, "to.minute")),
+      parseInt(getPropertyFromData(data, "to.second")),
+      parseInt(getPropertyFromData(data, "to.millisecond"))
     );
-    this.owner.getDmyFromInput(toDmy);
+    toDmy = this.owner.getDmyFromInput(toDmy);
     toPrecision = getPropertyFromData(data, "to.precision");
   } else {
     toDmy = fromDmy;
     toPrecision = fromPrecision;
   }
   const from = Dmy.CreateAsStartOfPeriod(fromDmy, fromPrecision);
-  const to = Dmy.CreateAsEndOfPeriod(toDmy, toPrecision);
-  this.period = { from, to: to.getNextDay(), isToPresent };
+  const to = Dmy.CreateAsExclusiveEndOfPeriod(toDmy, toPrecision);
+  this.period = { from, to, isToPresent };
 };
 TimeBand.prototype.overlapsInclusiveWithDates = function(from, to) {
   return !(this.period.from.isAfter(to) || from.isAfter(this.period.to));
@@ -4326,16 +5074,6 @@ function findMinIndex(arr, property) {
   return minIndex;
 }
 __name(findMinIndex, "findMinIndex");
-function clamp(value, min, max) {
-  if (value < min) {
-    return min;
-  }
-  if (value > max) {
-    return max;
-  }
-  return value;
-}
-__name(clamp, "clamp");
 function isScreenAutoStackingRange(range) {
   return range === "screen" || range === 1;
 }
@@ -5014,6 +5752,151 @@ const _ImageLoader = class _ImageLoader {
 };
 __name(_ImageLoader, "ImageLoader");
 let ImageLoader = _ImageLoader;
+const SUBDAY_UNIT_MILLISECONDS = {
+  [ZOOM_MILLISECOND]: 1,
+  [ZOOM_SECOND]: MILLISECONDS_PER_SECOND,
+  [ZOOM_MINUTE]: MILLISECONDS_PER_MINUTE,
+  [ZOOM_HOUR]: MILLISECONDS_PER_HOUR
+};
+const ADAPTIVE_MINOR_INTERVALS = {
+  [ZOOM_HOUR]: [12, 6, 3, 1],
+  [ZOOM_MINUTE]: [30, 10, 5, 1],
+  [ZOOM_SECOND]: [30, 10, 5, 1],
+  [ZOOM_MILLISECOND]: [500, 100, 50, 10, 5, 1]
+};
+const SUBDAY_VISUAL_SCALES = [
+  {
+    majorUnit: ZOOM_DAY,
+    majorMilliseconds: MILLISECONDS_PER_DAY,
+    minorUnit: ZOOM_HOUR
+  },
+  {
+    majorUnit: ZOOM_HOUR,
+    majorMilliseconds: MILLISECONDS_PER_HOUR,
+    minorUnit: ZOOM_MINUTE
+  },
+  {
+    majorUnit: ZOOM_MINUTE,
+    majorMilliseconds: MILLISECONDS_PER_MINUTE,
+    minorUnit: ZOOM_SECOND
+  },
+  {
+    majorUnit: ZOOM_SECOND,
+    majorMilliseconds: MILLISECONDS_PER_SECOND,
+    minorUnit: ZOOM_MILLISECOND
+  }
+];
+const PARENT_CONTEXT_MAXIMUM_LEVEL = ZOOM_CENTURY;
+function getZoomUnitLengthInDays(unit) {
+  if (unit < ZOOM_DAY) {
+    return SUBDAY_UNIT_MILLISECONDS[unit] / MILLISECONDS_PER_DAY;
+  }
+  return unit === ZOOM_DAY ? 1 : null;
+}
+__name(getZoomUnitLengthInDays, "getZoomUnitLengthInDays");
+function formatSubdayVisualMajorLabel(dmy, unit, options) {
+  if (unit === ZOOM_DAY) {
+    return dmy.format("D MMM YYYY", options);
+  }
+  if (unit === ZOOM_SECOND) {
+    return dmy.format("HH:mm:ss");
+  }
+  return dmy.format("HH:mm");
+}
+__name(formatSubdayVisualMajorLabel, "formatSubdayVisualMajorLabel");
+function formatSubdayMinorLabel(dmy, unit) {
+  if (unit === ZOOM_HOUR || unit === ZOOM_MINUTE) {
+    return dmy.format("HH:mm");
+  }
+  if (unit === ZOOM_SECOND) {
+    return `:${dmy.format("ss")}`;
+  }
+  return `.${dmy.format("SSS")}`;
+}
+__name(formatSubdayMinorLabel, "formatSubdayMinorLabel");
+function ordinal(value, thousandsSeparator) {
+  const lastTwoDigits = value % 100;
+  let suffix;
+  if (lastTwoDigits >= 11 && lastTwoDigits <= 13) {
+    suffix = "th";
+  } else {
+    switch (value % 10) {
+      case 1:
+        suffix = "st";
+        break;
+      case 2:
+        suffix = "nd";
+        break;
+      case 3:
+        suffix = "rd";
+        break;
+      default:
+        suffix = "th";
+    }
+  }
+  const formattedValue = new Dmy(value, 1, 1).format("YYYY", {
+    thousandsSeparator,
+    bceText: ""
+  });
+  return `${formattedValue}${suffix}`;
+}
+__name(ordinal, "ordinal");
+function getParentIntervalStart(value, unit) {
+  switch (unit) {
+    case ZOOM_SECOND:
+      return new Dmy(value.year, value.month, value.day, value.hour, value.minute, value.second);
+    case ZOOM_MINUTE:
+      return new Dmy(value.year, value.month, value.day, value.hour, value.minute);
+    case ZOOM_HOUR:
+      return new Dmy(value.year, value.month, value.day, value.hour);
+    case ZOOM_DAY:
+      return new Dmy(value.year, value.month, value.day);
+    case ZOOM_MONTH:
+      return new Dmy(value.year, value.month, 1);
+    case ZOOM_YEAR:
+      return new Dmy(value.year, 1, 1);
+    case ZOOM_DECADE: {
+      if (value.year > 0) {
+        return new Dmy(Math.floor(value.year / 10) * 10, 1, 1);
+      }
+      const displayedYear = 1 - value.year;
+      const displayedDecade = Math.floor(displayedYear / 10) * 10;
+      return new Dmy(1 - (displayedDecade + 9), 1, 1);
+    }
+    case ZOOM_CENTURY:
+      return Dmy.CreateAsStartOfPeriod(value, "century");
+    case ZOOM_MILLENNIUM:
+      return Dmy.CreateAsStartOfPeriod(value, "millennium");
+    default:
+      return null;
+  }
+}
+__name(getParentIntervalStart, "getParentIntervalStart");
+function getNextParentInterval(start, unit) {
+  switch (unit) {
+    case ZOOM_SECOND:
+      return start.addSeconds(1);
+    case ZOOM_MINUTE:
+      return start.addMinutes(1);
+    case ZOOM_HOUR:
+      return start.addHours(1);
+    case ZOOM_DAY:
+      return start.getNextDay();
+    case ZOOM_MONTH:
+      return start.getNextMonth();
+    case ZOOM_YEAR:
+      return start.addYears(1);
+    case ZOOM_DECADE:
+      return start.addYears(10);
+    case ZOOM_CENTURY:
+      return Dmy.CreateAsExclusiveEndOfPeriod(start, "century");
+    case ZOOM_MILLENNIUM:
+      return Dmy.CreateAsExclusiveEndOfPeriod(start, "millennium");
+    default:
+      return null;
+  }
+}
+__name(getNextParentInterval, "getNextParentInterval");
 const _TimescaleManager = class _TimescaleManager {
   constructor(owner, zoomOptions) {
     this.owner = owner;
@@ -5022,6 +5905,9 @@ const _TimescaleManager = class _TimescaleManager {
     this.startToken = null;
     this.unit = ZOOM_DAY;
     this.unitSizeInPixels = 100;
+    this.adaptiveMinorUnit = null;
+    this.adaptiveMinorInterval = null;
+    this.adaptiveMinorMarkerSpacingInPixels = null;
     this.unitLengthInYears = 1;
     this.zoomChangedHandlers = [];
     this.yearPrefix = {
@@ -5030,6 +5916,7 @@ const _TimescaleManager = class _TimescaleManager {
       major: false
     };
     this.unitLevels = [];
+    this.unitOrder = [];
   }
 };
 __name(_TimescaleManager, "TimescaleManager");
@@ -5037,7 +5924,7 @@ let TimescaleManager = _TimescaleManager;
 TimescaleManager.prototype.getUnitSizeInPixelsForZoom = function(zoom) {
   const zoomRatio = this.zoomOptions.ratio;
   const currentUnitSettings = this.unitLevels[this.unit];
-  const zoomStart = currentUnitSettings.zoomStart;
+  const zoomStart = currentUnitSettings.referenceZoom ?? currentUnitSettings.zoomStart;
   const startUnitSize = currentUnitSettings.startUnitSize;
   return startUnitSize * Math.pow(zoomRatio, zoom - zoomStart);
 };
@@ -5045,14 +5932,289 @@ TimescaleManager.prototype.getChangePoint = function(_unit) {
   return this.unitLevels[this.unit].zoomStart;
 };
 TimescaleManager.prototype.getUnitFromZoom = function(zoom) {
-  const unitLevels = this.unitLevels;
-  for (let i = unitLevels.length - 1; i >= 0; i--) {
-    if (zoom >= unitLevels[i].zoomStart) {
-      return i;
+  for (let i = this.unitOrder.length - 1; i >= 0; i--) {
+    const unit = this.unitOrder[i];
+    if (zoom >= this.unitLevels[unit].zoomStart) {
+      return unit;
     }
   }
   throw new Error(`Zoom ${zoom} is out of range`);
 };
+TimescaleManager.prototype.getAdaptiveMinorInterval = function(unit = this.unit, unitSizeInPixels = this.unitSizeInPixels) {
+  const intervals = ADAPTIVE_MINOR_INTERVALS[unit];
+  if (!intervals) {
+    return 1;
+  }
+  const minimumMarkerSpacing = this.zoomOptions.unitSize.minimum;
+  const minimumLabelSpacing = this.zoomOptions.unitSize.showMinorLabels ?? minimumMarkerSpacing;
+  const minimumSpacing = Math.max(minimumMarkerSpacing, minimumLabelSpacing);
+  for (let i = intervals.length - 1; i >= 0; i--) {
+    if (unitSizeInPixels * intervals[i] >= minimumSpacing) {
+      return intervals[i];
+    }
+  }
+  return null;
+};
+TimescaleManager.prototype.getSubdayVisualMarkerLayout = function() {
+  if (this.zoomOptions.minimum >= ZOOM_DAY || this.zoom > ZOOM_DAY || this.unit > ZOOM_DAY) {
+    return null;
+  }
+  const unitMilliseconds = this.unit === ZOOM_DAY ? MILLISECONDS_PER_DAY : SUBDAY_UNIT_MILLISECONDS[this.unit];
+  const pixelsPerMillisecond = this.unitSizeInPixels / unitMilliseconds;
+  const minimumMajorSpacing = this.zoomOptions.unitSize.minimumMajor ?? 120;
+  let scale = null;
+  for (let i = SUBDAY_VISUAL_SCALES.length - 1; i >= 0; i--) {
+    const candidate = SUBDAY_VISUAL_SCALES[i];
+    if (candidate.majorMilliseconds * pixelsPerMillisecond >= minimumMajorSpacing) {
+      scale = candidate;
+      break;
+    }
+  }
+  if (!scale) {
+    return null;
+  }
+  const minorUnitSizeInPixels = SUBDAY_UNIT_MILLISECONDS[scale.minorUnit] * pixelsPerMillisecond;
+  const minorInterval = this.getAdaptiveMinorInterval(scale.minorUnit, minorUnitSizeInPixels);
+  return {
+    ...scale,
+    majorMarkerSpacingInPixels: scale.majorMilliseconds * pixelsPerMillisecond,
+    minorInterval,
+    minorMarkerSpacingInPixels: minorInterval ? minorUnitSizeInPixels * minorInterval : null,
+    minorMilliseconds: minorInterval ? SUBDAY_UNIT_MILLISECONDS[scale.minorUnit] * minorInterval : null,
+    pixelsPerMillisecond
+  };
+};
+TimescaleManager.prototype.getParentContextScale = function() {
+  const visualLayout = this.getSubdayVisualMarkerLayout();
+  const levelUnit = visualLayout ? visualLayout.majorUnit : this.unit + 1;
+  if (levelUnit < ZOOM_MILLISECOND || levelUnit > PARENT_CONTEXT_MAXIMUM_LEVEL) {
+    return null;
+  }
+  return {
+    level: this.zoomUnitToString(levelUnit),
+    levelUnit,
+    parentUnit: levelUnit <= ZOOM_HOUR ? ZOOM_DAY : levelUnit + 1
+  };
+};
+TimescaleManager.prototype.isParentContextTextVisible = function(options) {
+  if (options?.visible !== true) {
+    return false;
+  }
+  const scale = this.getParentContextScale();
+  if (!scale) {
+    return false;
+  }
+  if (options.levels === "all") {
+    return true;
+  }
+  return Array.isArray(options.levels) && options.levels.includes(scale.level);
+};
+TimescaleManager.prototype.formatParentContextLabel = function(value, unit) {
+  const options = this.getDateLabelFormatOptions(MAJOR_MARKER);
+  switch (unit) {
+    case ZOOM_SECOND:
+    case ZOOM_MINUTE:
+    case ZOOM_HOUR:
+    case ZOOM_DAY:
+      return value.format("D MMM YYYY", options);
+    case ZOOM_MONTH:
+      return value.format("MMM YYYY", options);
+    case ZOOM_YEAR:
+      return value.format("YYYY", options);
+    case ZOOM_DECADE: {
+      const displayedYear = value.year <= 0 ? 1 - value.year : value.year;
+      const decade = Math.floor(displayedYear / 10) * 10;
+      const formattedDecade = new Dmy(decade, 1, 1).format("YYYY", {
+        thousandsSeparator: options.thousandsSeparator,
+        bceText: ""
+      });
+      return `${formattedDecade}s${value.year <= 0 ? options.bceText : ""}`;
+    }
+    case ZOOM_CENTURY:
+    case ZOOM_MILLENNIUM: {
+      const displayedYear = value.year <= 0 ? 1 - value.year : value.year;
+      const periodSize = unit === ZOOM_CENTURY ? 100 : 1e3;
+      const period = Math.ceil(displayedYear / periodSize);
+      const periodName = unit === ZOOM_CENTURY ? "century" : "millennium";
+      return `${ordinal(period, options.thousandsSeparator)} ${periodName}${value.year <= 0 ? options.bceText : ""}`;
+    }
+    default:
+      return "";
+  }
+};
+TimescaleManager.prototype.createParentContextTokens = function(visibleStart, width, repositionWindow) {
+  const scale = this.getParentContextScale();
+  if (!scale || !visibleStart || !this.startToken) {
+    return [];
+  }
+  const tokens = [];
+  let value = getParentIntervalStart(visibleStart, scale.parentUnit);
+  let drawX = repositionWindow + this.getPixelsBetween(this.startToken.value, value);
+  do {
+    const nextValue = getNextParentInterval(value, scale.parentUnit);
+    if (!nextValue) {
+      break;
+    }
+    const nextDrawX = repositionWindow + this.getPixelsBetween(this.startToken.value, nextValue);
+    tokens.push({
+      drawX,
+      label: this.formatParentContextLabel(value, scale.parentUnit),
+      length: nextDrawX - drawX,
+      unit: scale.parentUnit,
+      value
+    });
+    value = nextValue;
+    drawX = nextDrawX;
+  } while (tokens.length < 1e3 && tokens[tokens.length - 1].drawX <= width);
+  return tokens;
+};
+TimescaleManager.prototype.setAdaptiveMinorInterval = function() {
+  const layout = this.getSubdayVisualMarkerLayout();
+  if (!layout) {
+    this.adaptiveMinorUnit = null;
+    this.adaptiveMinorInterval = null;
+    this.adaptiveMinorMarkerSpacingInPixels = null;
+    return;
+  }
+  this.adaptiveMinorUnit = layout.minorUnit;
+  this.adaptiveMinorInterval = layout.minorInterval;
+  this.adaptiveMinorMarkerSpacingInPixels = layout.minorMarkerSpacingInPixels;
+};
+TimescaleManager.prototype.createSubdayVisualMarkers = function(width, repositionWindow, layout = this.getSubdayVisualMarkerLayout()) {
+  const markers = {
+    [MAJOR_MARKER]: [],
+    [MINOR_MARKER]: []
+  };
+  if (!layout || !this.startToken) {
+    return markers;
+  }
+  const buffer = 150;
+  const stepMilliseconds = layout.minorMilliseconds || layout.majorMilliseconds;
+  const millisecondsToLeftEdge = Math.floor(
+    (-buffer - repositionWindow) / layout.pixelsPerMillisecond
+  );
+  const approximateStart = this.startToken.value.addMilliseconds(millisecondsToLeftEdge);
+  const dayStart = new Dmy(approximateStart.year, approximateStart.month, approximateStart.day);
+  const firstOffset = Math.floor(approximateStart.getMillisecondsOfDay() / stepMilliseconds) * stepMilliseconds;
+  let value = dayStart.addMilliseconds(firstOffset);
+  const showMinorLabels = layout.minorMarkerSpacingInPixels >= this.zoomOptions.unitSize.showMinorLabels;
+  const createMajorMarker = /* @__PURE__ */ __name((majorValue) => ({
+    drawX: repositionWindow + this.getPixelsBetween(this.startToken.value, majorValue),
+    label: formatSubdayVisualMajorLabel(
+      majorValue,
+      layout.majorUnit,
+      this.getDateLabelFormatOptions(MAJOR_MARKER)
+    ),
+    length: layout.majorMarkerSpacingInPixels,
+    markerSpacingInPixels: layout.majorMarkerSpacingInPixels,
+    type: MAJOR_MARKER,
+    unit: layout.majorUnit,
+    value: majorValue,
+    visual: true
+  }), "createMajorMarker");
+  const owningMajorOffset = Math.floor(approximateStart.getMillisecondsOfDay() / layout.majorMilliseconds) * layout.majorMilliseconds;
+  const owningMajorValue = dayStart.addMilliseconds(owningMajorOffset);
+  if (owningMajorValue.isAfter(value) === false && !owningMajorValue.isSame(value)) {
+    markers[MAJOR_MARKER].push(createMajorMarker(owningMajorValue));
+  }
+  while (true) {
+    const drawX = repositionWindow + this.getPixelsBetween(this.startToken.value, value);
+    if (drawX > width + buffer) {
+      break;
+    }
+    const millisecondsOfDay = value.getMillisecondsOfDay();
+    const isMajor = millisecondsOfDay % layout.majorMilliseconds === 0;
+    if (isMajor) {
+      markers[MAJOR_MARKER].push(createMajorMarker(value));
+    } else if (layout.minorMilliseconds) {
+      markers[MINOR_MARKER].push({
+        adaptive: layout.minorInterval !== 1,
+        drawX,
+        label: showMinorLabels ? formatSubdayMinorLabel(value, layout.minorUnit) : void 0,
+        length: layout.minorMarkerSpacingInPixels,
+        markerSpacingInPixels: layout.minorMarkerSpacingInPixels,
+        type: MINOR_MARKER,
+        unit: layout.minorUnit,
+        value,
+        visual: true
+      });
+    }
+    value = value.addMilliseconds(stepMilliseconds);
+  }
+  return markers;
+};
+TimescaleManager.prototype.createHourToken = function(dmy) {
+  const token = {
+    unit: ZOOM_HOUR,
+    value: dmy,
+    length: this.unitSizeInPixels
+  };
+  const unitSettings = this.unitLevels[ZOOM_HOUR];
+  if (dmy.hour === 0) {
+    token.label = dmy.format("D MMM YYYY", this.getDateLabelFormatOptions(MAJOR_MARKER));
+    token.type = MAJOR_MARKER;
+  } else {
+    token.type = MINOR_MARKER;
+    if (this.zoom < unitSettings.zoomHideMinorLabels) {
+      token.label = formatSubdayMinorLabel(dmy, ZOOM_HOUR);
+    }
+  }
+  return token;
+};
+TimescaleManager.prototype.createMinuteToken = function(dmy) {
+  const token = {
+    unit: ZOOM_MINUTE,
+    value: dmy,
+    length: this.unitSizeInPixels
+  };
+  const unitSettings = this.unitLevels[ZOOM_MINUTE];
+  if (dmy.minute === 0) {
+    token.label = dmy.format("HH:mm");
+    token.type = MAJOR_MARKER;
+  } else {
+    token.type = MINOR_MARKER;
+    if (this.zoom < unitSettings.zoomHideMinorLabels) {
+      token.label = formatSubdayMinorLabel(dmy, ZOOM_MINUTE);
+    }
+  }
+  return token;
+};
+TimescaleManager.prototype.createSecondToken = function(dmy) {
+  const token = {
+    unit: ZOOM_SECOND,
+    value: dmy,
+    length: this.unitSizeInPixels
+  };
+  const unitSettings = this.unitLevels[ZOOM_SECOND];
+  if (dmy.second === 0) {
+    token.label = dmy.format("HH:mm:ss");
+    token.type = MAJOR_MARKER;
+  } else {
+    token.type = MINOR_MARKER;
+    if (this.zoom < unitSettings.zoomHideMinorLabels) {
+      token.label = formatSubdayMinorLabel(dmy, ZOOM_SECOND);
+    }
+  }
+  return token;
+};
+TimescaleManager.prototype.createMillisecondToken = function(dmy) {
+  const token = {
+    unit: ZOOM_MILLISECOND,
+    value: dmy,
+    length: this.unitSizeInPixels
+  };
+  const unitSettings = this.unitLevels[ZOOM_MILLISECOND];
+  if (dmy.millisecond === 0) {
+    token.label = dmy.format("HH:mm:ss.SSS");
+    token.type = MAJOR_MARKER;
+  } else {
+    token.type = MINOR_MARKER;
+    if (this.zoom < unitSettings.zoomHideMinorLabels) {
+      token.label = formatSubdayMinorLabel(dmy, ZOOM_MILLISECOND);
+    }
+  }
+  return token;
+};
 TimescaleManager.prototype.getDateLabelFormatOptions = function(tokenType) {
   tokenType = tokenType === MAJOR_MARKER ? "major" : "minor";
   const dateLabelFormatOptions = this.owner.options.style.dateLabel[tokenType];
@@ -5142,6 +6304,7 @@ TimescaleManager.prototype.setZoom = function(value) {
   this.zoom = nextZoom;
   this.unit = this.getUnitFromZoom(this.zoom);
   this.unitSizeInPixels = this.getUnitSizeInPixelsForZoom(this.zoom);
+  this.setAdaptiveMinorInterval();
   let unitLengthInYears = 0;
   if (this.unit >= ZOOM_YEAR) {
     const unitYearPowerOfTen = this.unit - ZOOM_YEAR;
@@ -5160,7 +6323,7 @@ TimescaleManager.prototype.setZoom = function(value) {
 TimescaleManager.prototype.getPixelsBetween = function(a, b) {
   const unit = this.unit;
   if (unit <= ZOOM_DAY) {
-    return a.getDaysTo(b) * this.unitSizeInPixels;
+    return a.getDaysTo(b) * this.unitSizeInPixels / getZoomUnitLengthInDays(unit);
   }
   if (unit === ZOOM_MONTH) {
     return a.getMonthsTo(b) * this.unitSizeInPixels;
@@ -5177,9 +6340,27 @@ TimescaleManager.prototype.setStartDate = function(from) {
     bcMove = 1;
   }
   switch (this.unit) {
-    case ZOOM_DAY:
-      this.startToken = this.createDayToken(from);
+    case ZOOM_MILLISECOND:
+      this.startToken = this.createMillisecondToken(new Dmy(from));
       return 0;
+    case ZOOM_SECOND: {
+      const start = new Dmy(from.year, from.month, from.day, from.hour, from.minute, from.second);
+      this.startToken = this.createSecondToken(start);
+      return -this.getPixelsBetween(start, from);
+    }
+    case ZOOM_MINUTE: {
+      const start = new Dmy(from.year, from.month, from.day, from.hour, from.minute);
+      this.startToken = this.createMinuteToken(start);
+      return -this.getPixelsBetween(start, from);
+    }
+    case ZOOM_HOUR: {
+      const start = new Dmy(from.year, from.month, from.day, from.hour);
+      this.startToken = this.createHourToken(start);
+      return -this.getPixelsBetween(start, from);
+    }
+    case ZOOM_DAY:
+      this.startToken = this.createDayToken(new Dmy(from.year, from.month, from.day));
+      return -this.getPixelsBetween(this.startToken.value, from);
     case ZOOM_MONTH: {
       this.startToken = this.createMonthToken(new Dmy(from.year, from.month, 1));
       const unitSizeForDays = this.unitSizeInPixels / 30.44;
@@ -5202,6 +6383,14 @@ TimescaleManager.prototype.setStartDate = function(from) {
 };
 TimescaleManager.prototype.getStartTokenCloned = function() {
   switch (this.startToken.unit) {
+    case ZOOM_MILLISECOND:
+      return this.createMillisecondToken(this.startToken.value);
+    case ZOOM_SECOND:
+      return this.createSecondToken(this.startToken.value);
+    case ZOOM_MINUTE:
+      return this.createMinuteToken(this.startToken.value);
+    case ZOOM_HOUR:
+      return this.createHourToken(this.startToken.value);
     case ZOOM_DAY:
       return this.createDayToken(this.startToken.value);
     case ZOOM_MONTH:
@@ -5212,6 +6401,14 @@ TimescaleManager.prototype.getStartTokenCloned = function() {
 };
 TimescaleManager.prototype.getNext = function(token) {
   switch (token.unit) {
+    case ZOOM_MILLISECOND:
+      return this.createMillisecondToken(token.value.addMilliseconds(1));
+    case ZOOM_SECOND:
+      return this.createSecondToken(token.value.addSeconds(1));
+    case ZOOM_MINUTE:
+      return this.createMinuteToken(token.value.addMinutes(1));
+    case ZOOM_HOUR:
+      return this.createHourToken(token.value.addHours(1));
     case ZOOM_DAY:
       return this.createDayToken(token.value.getNextDay());
     case ZOOM_MONTH:
@@ -5230,6 +6427,14 @@ TimescaleManager.prototype.getNext = function(token) {
 };
 TimescaleManager.prototype.getPrevious = function(token) {
   switch (token.unit) {
+    case ZOOM_MILLISECOND:
+      return this.createMillisecondToken(token.value.addMilliseconds(-1));
+    case ZOOM_SECOND:
+      return this.createSecondToken(token.value.addSeconds(-1));
+    case ZOOM_MINUTE:
+      return this.createMinuteToken(token.value.addMinutes(-1));
+    case ZOOM_HOUR:
+      return this.createHourToken(token.value.addHours(-1));
     case ZOOM_DAY:
       return this.createDayToken(token.value.getPreviousDay());
     case ZOOM_MONTH:
@@ -5252,6 +6457,14 @@ TimescaleManager.prototype.getPreviousNth = function(token, n) {
 };
 TimescaleManager.prototype.zoomUnitToString = function(unit) {
   switch (unit) {
+    case ZOOM_MILLISECOND:
+      return "millisecond";
+    case ZOOM_SECOND:
+      return "second";
+    case ZOOM_MINUTE:
+      return "minute";
+    case ZOOM_HOUR:
+      return "hour";
     case ZOOM_DAY:
       return "day";
     case ZOOM_MONTH:
@@ -5282,9 +6495,14 @@ TimescaleManager.prototype.zoomUnitToString = function(unit) {
 };
 TimescaleManager.prototype.setUnitLevels = function() {
   this.unitLevels = [];
+  this.unitOrder = [];
   const minUnitSize = this.zoomOptions.unitSize.minimum;
   const showMinorLabelUnitSize = this.zoomOptions.unitSize.showMinorLabels;
   const dayZoomStart = 0;
+  const addUnit = /* @__PURE__ */ __name((unit, settings) => {
+    this.unitLevels[unit] = settings;
+    this.unitOrder.push(unit);
+  }, "addUnit");
   const hideLabelsZoomChangeFromEnd = this.getZoomChangeByDistance(
     showMinorLabelUnitSize,
     minUnitSize
@@ -5299,12 +6517,41 @@ TimescaleManager.prototype.setUnitLevels = function() {
     zoomHideMinorLabels: dayZoomHideMinorLabels,
     zoomEnd: dayZoomEnd
   };
-  this.unitLevels.push(daySettings);
+  addUnit(ZOOM_DAY, daySettings);
+  const hourSizeAtDayBoundary = dayStartUnitSize / 24;
+  const hourZoomStart = this.getZoomChangeByDistance(hourSizeAtDayBoundary, minUnitSize * 60);
+  addUnit(ZOOM_HOUR, {
+    startUnitSize: minUnitSize * 60,
+    zoomStart: hourZoomStart,
+    zoomEnd: dayZoomStart,
+    zoomHideMinorLabels: hourZoomStart + this.getZoomChangeByDistance(minUnitSize * 60, showMinorLabelUnitSize)
+  });
+  const minuteZoomStart = hourZoomStart + this.getZoomChangeByDistance(minUnitSize, minUnitSize * 60);
+  addUnit(ZOOM_MINUTE, {
+    startUnitSize: minUnitSize * 60,
+    zoomStart: minuteZoomStart,
+    zoomEnd: hourZoomStart,
+    zoomHideMinorLabels: minuteZoomStart + this.getZoomChangeByDistance(minUnitSize * 60, showMinorLabelUnitSize)
+  });
+  const secondZoomStart = minuteZoomStart + this.getZoomChangeByDistance(minUnitSize, minUnitSize * 1e3);
+  addUnit(ZOOM_SECOND, {
+    startUnitSize: minUnitSize * 1e3,
+    zoomStart: secondZoomStart,
+    zoomEnd: minuteZoomStart,
+    zoomHideMinorLabels: secondZoomStart + this.getZoomChangeByDistance(minUnitSize * 1e3, showMinorLabelUnitSize)
+  });
+  addUnit(ZOOM_MILLISECOND, {
+    startUnitSize: minUnitSize,
+    referenceZoom: secondZoomStart,
+    zoomStart: Number.NEGATIVE_INFINITY,
+    zoomEnd: secondZoomStart,
+    zoomHideMinorLabels: secondZoomStart + this.getZoomChangeByDistance(minUnitSize, showMinorLabelUnitSize)
+  });
   const monthStartUnitSize = minUnitSize * 31;
   const monthZoomSpan = this.getZoomChangeByDistance(monthStartUnitSize, minUnitSize);
   const monthZoomEnd = dayZoomEnd + monthZoomSpan;
   const monthZoomHideMinorLabels = monthZoomEnd - hideLabelsZoomChangeFromEnd;
-  this.unitLevels.push({
+  addUnit(ZOOM_MONTH, {
     startUnitSize: monthStartUnitSize,
     zoomStart: dayZoomEnd,
     zoomHideMinorLabels: monthZoomHideMinorLabels,
@@ -5314,7 +6561,7 @@ TimescaleManager.prototype.setUnitLevels = function() {
   const yearZoomSpan = this.getZoomChangeByDistance(yearStartUnitSize, minUnitSize);
   const yearZoomEnd = monthZoomEnd + yearZoomSpan;
   const yearZoomHideMinorLabels = yearZoomEnd - hideLabelsZoomChangeFromEnd;
-  this.unitLevels.push({
+  addUnit(ZOOM_YEAR, {
     startUnitSize: yearStartUnitSize,
     zoomStart: monthZoomEnd,
     zoomHideMinorLabels: yearZoomHideMinorLabels,
@@ -5331,7 +6578,7 @@ TimescaleManager.prototype.setUnitLevels = function() {
     zoomSpan = this.getZoomChangeByDistance(startUnitSize, minUnitSize);
     zoomEnd = zoomStart + zoomSpan;
     zoomHideMinorLabels = zoomEnd - hideLabelsZoomChangeFromEnd;
-    this.unitLevels.push({
+    addUnit(ZOOM_YEAR + i, {
       startUnitSize,
       zoomStart,
       zoomHideMinorLabels,
@@ -5342,6 +6589,7 @@ TimescaleManager.prototype.setUnitLevels = function() {
       this.zoomOptions.maximum = Math.min(this.zoomOptions.maximum, zoomEnd);
     }
   }
+  this.unitOrder.sort((a, b) => a - b);
 };
 TimescaleManager.prototype.getZoomChangeByDistance = function(startDistance, endDistance) {
   const zoomRatio = this.zoomOptions.ratio;
@@ -5787,6 +7035,8 @@ function getPinchDistance(tracker) {
 __name(getPinchDistance, "getPinchDistance");
 function Timeline(container, inputOptions) {
   const processedInputOptions = handleDeprecatedOptions(inputOptions);
+  this._registeredArticleLayoutStyles = deepMerge({}, DEFAULT_OPTIONS.article.layoutStyles || {});
+  this._explicitArticleOptions = deepMerge({}, processedInputOptions?.article || {});
   this.options = deepMerge({}, DEFAULT_OPTIONS, processedInputOptions);
   if (isCanvas(container)) {
     this.canvas = container;
@@ -5865,7 +7115,7 @@ function Timeline(container, inputOptions) {
   }
   this._isInitialized = false;
   this._hasPendingTimelineStateChange = false;
-  const zoom = this.options.zoom, startDate = this.getDmyFromInput(new Dmy(this.options.initialDate));
+  const zoom = this.options.zoom, startDate = this.getDmyFromInput(this.options.initialDate);
   this.timescaleManager = new TimescaleManager(this, zoom);
   this.timescaleManager.setUnitLevels();
   this.timescaleManager.addZoomChangedHandler(this.zoomChanged, this);
@@ -5917,7 +7167,9 @@ Timeline.prototype.isInVicinity = function(event, vicinityParameters, relativePo
     return vicinityParameters;
   }
   const pos = relativePosition || this.getRelativePosition(event);
-  return pos.top > this.top - vicinityParameters.up && pos.top < this.top + vicinityParameters.down;
+  const isWithinUpperBound = vicinityParameters.up === void 0 || pos.top > this.top - vicinityParameters.up;
+  const isWithinLowerBound = vicinityParameters.down === void 0 || pos.top < this.top + vicinityParameters.down;
+  return isWithinUpperBound && isWithinLowerBound;
 };
 Timeline.prototype.getPixel = function(dmy, drawCycleContext) {
   let cache;
@@ -6155,7 +7407,7 @@ Timeline.prototype.enqueueImageLoad = function(article) {
 };
 Timeline.prototype._getArticleImageTargetSpec = function(article) {
   const layout = article._getCurrentCardLayoutName();
-  const style = article._getCurrentStyle();
+  const style = article.getCurrentStyle();
   const imageStyle = style && style.image ? style.image : {};
   const shape = imageStyle.shape || (layout === "portrait" ? "square" : "square");
   let cssTargetW = null, cssTargetH = null;
@@ -6201,6 +7453,9 @@ Timeline.prototype.setOption = function(option, value) {
     option = buildObjectFromPath(normalizedOptionPath, value);
   }
   option = handleDeprecatedOptions(option);
+  if (existsInData(option, "article")) {
+    deepMerge(this._explicitArticleOptions, option.article || {});
+  }
   deepMerge(this.options, option);
   const sizeChanged = option.width || option.height;
   if (sizeChanged) {
@@ -6223,6 +7478,10 @@ Timeline.prototype.setOption = function(option, value) {
   if (timeBandsSpaceChanged) {
     this.top = this.options.height - this._getEffectiveVerticalOffset();
   }
+  const parentContextSpaceChanged = existsInData(option, "style.dateLabel.parent.visible") || existsInData(option, "style.dateLabel.parent.height");
+  if (parentContextSpaceChanged) {
+    this.top = this.options.height - this._getEffectiveVerticalOffset();
+  }
   const articleImpact = getLaneArticleOptionImpact(getPropertyFromData(option, "article"));
   const timeBandsDefaultStyleChanged = existsInData(option, "timeBand.defaultStyle");
   if (timeBandsDefaultStyleChanged && Array.isArray(this.timeBands) && this.timeBands.length > 0) {
@@ -6237,11 +7496,15 @@ Timeline.prototype.setOption = function(option, value) {
   if (Array.isArray(chartData) && typeof this.addCharts === "function") {
     this.addCharts(chartData);
   }
-  const chartDefaultsChanged = existsInData(option, "chart.defaultData") || existsInData(option, "chart.defaultStyle");
+  const chartSeriesColorsChanged = existsInData(option, "chart.seriesColors");
+  const chartDefaultsChanged = chartSeriesColorsChanged || existsInData(option, "chart.defaultData") || existsInData(option, "chart.defaultStyle");
   if (chartDefaultsChanged && Array.isArray(this.charts) && this.charts.length > 0) {
     let chartLaneChanged = false;
     for (let i = 0; i < this.charts.length; i++) {
       const previousLaneId = this.charts[i].laneId;
+      if (chartSeriesColorsChanged) {
+        this.charts[i]._seriesColors = [];
+      }
       this.charts[i]._resolveFromData();
       if (existsInData(option, "chart.defaultData") && this.charts[i].laneId != null) {
         this._ensureChartLane(this.charts[i].laneId);
@@ -6298,18 +7561,38 @@ Timeline.prototype._getEffectiveVerticalOffset = function() {
   const tb = this.options.timeBand || {};
   const hasLoadedBands = Array.isArray(this.timeBands) && this.timeBands.length > 0;
   const reserve = !!tb.reserveSpace;
-  const extra = reserve && tb.visible && hasLoadedBands ? tb.reserveSpacePixels || 0 : 0;
-  return base + extra;
+  const timeBandExtra = reserve && tb.visible && hasLoadedBands ? tb.reserveSpacePixels || 0 : 0;
+  const parent = this.options.style?.dateLabel?.parent || {};
+  const parentExtra = parent.visible === true ? parent.height || 0 : 0;
+  return base + timeBandExtra + parentExtra;
 };
 Timeline.prototype.generateDensitySettings = function() {
   const zoomRatio = this.timescaleManager.zoomOptions.ratio;
-  Logger.log(this.timescaleManager);
   const newSettings = [];
-  const halfZoom = Math.round(Math.log(0.5) / Math.log(zoomRatio) * 100) / 100;
-  for (let i = 0; i < 19; i++) {
+  const roundZoom = /* @__PURE__ */ __name((value) => Math.round(value * 100) / 100, "roundZoom");
+  const halfZoom = roundZoom(Math.log(0.5) / Math.log(zoomRatio));
+  const finestSubdayPower = Math.ceil(Math.log2(MILLISECONDS_PER_DAY));
+  for (let power = finestSubdayPower; power >= 1; power--) {
+    newSettings.push({
+      region: 1 - power,
+      zoom: {
+        from: power === finestSubdayPower ? Number.NEGATIVE_INFINITY : roundZoom(-power * halfZoom),
+        to: roundZoom(-(power - 1) * halfZoom)
+      },
+      low: 1,
+      medium: 2,
+      high: 3,
+      all: 25,
+      step: { months: 0, days: 0, divisionsPerDay: Math.pow(2, power) }
+    });
+  }
+  const positiveRegionCount = Math.ceil(this.timescaleManager.zoomOptions.maximum / halfZoom);
+  for (let i = 0; i < positiveRegionCount; i++) {
+    const from = roundZoom(i * halfZoom);
+    const to = roundZoom((i + 1) * halfZoom);
     const nextRegion = {
       region: i + 1,
-      zoom: { from: i * halfZoom, to: (i + 1) * halfZoom },
+      zoom: { from, to },
       low: 1,
       medium: 2,
       high: 3,
@@ -6318,12 +7601,109 @@ Timeline.prototype.generateDensitySettings = function() {
     };
     newSettings.push(nextRegion);
   }
-  Logger.log(JSON.stringify(newSettings));
-};
-function getLaneGroupKey(laneId, groupIndex) {
-  return `${laneId}::${groupIndex}`;
+  const output = JSON.stringify(
+    newSettings,
+    (_key, value) => value === Number.NEGATIVE_INFINITY ? "__DENSITY_NEGATIVE_INFINITY__" : value,
+    2
+  ).replace('"__DENSITY_NEGATIVE_INFINITY__"', "Number.NEGATIVE_INFINITY");
+  Logger.log(output);
+};
+function isSubdayDensityGroupIndex(index) {
+  return index != null && typeof index === "object";
+}
+__name(isSubdayDensityGroupIndex, "isSubdayDensityGroupIndex");
+function createSubdayDensityGroupIndex(date, divisionsPerDay) {
+  return {
+    day: date.getDaysSinceYearZero(),
+    division: Math.floor(date.getMillisecondsOfDay() * divisionsPerDay / MILLISECONDS_PER_DAY),
+    divisionsPerDay
+  };
+}
+__name(createSubdayDensityGroupIndex, "createSubdayDensityGroupIndex");
+function compareDensityGroupIndexes(left, right) {
+  if (!isSubdayDensityGroupIndex(left) && !isSubdayDensityGroupIndex(right)) {
+    return left === right ? 0 : left < right ? -1 : 1;
+  }
+  if (left.day !== right.day) {
+    return left.day < right.day ? -1 : 1;
+  }
+  if (left.division !== right.division) {
+    return left.division < right.division ? -1 : 1;
+  }
+  return 0;
+}
+__name(compareDensityGroupIndexes, "compareDensityGroupIndexes");
+function shiftDensityGroupIndex(index, offset) {
+  if (!isSubdayDensityGroupIndex(index)) {
+    return index + offset;
+  }
+  const unnormalisedDivision = index.division + offset;
+  const dayOffset = Math.floor(unnormalisedDivision / index.divisionsPerDay);
+  return {
+    day: index.day + dayOffset,
+    division: unnormalisedDivision - dayOffset * index.divisionsPerDay,
+    divisionsPerDay: index.divisionsPerDay
+  };
+}
+__name(shiftDensityGroupIndex, "shiftDensityGroupIndex");
+function clampDensityGroupIndex(index, minimum, maximum) {
+  if (compareDensityGroupIndexes(index, minimum) < 0) {
+    return minimum;
+  }
+  if (compareDensityGroupIndexes(index, maximum) > 0) {
+    return maximum;
+  }
+  return index;
+}
+__name(clampDensityGroupIndex, "clampDensityGroupIndex");
+function getDensityGroupKey(index) {
+  if (!isSubdayDensityGroupIndex(index)) {
+    return String(index);
+  }
+  return `${index.day}:${index.division}`;
+}
+__name(getDensityGroupKey, "getDensityGroupKey");
+function getSubdayDensityGroupBoundary(index) {
+  return {
+    dayNumber: index.day,
+    dayFraction: index.division / index.divisionsPerDay
+  };
+}
+__name(getSubdayDensityGroupBoundary, "getSubdayDensityGroupBoundary");
+function getLaneGroupKey(laneId, groupIndex) {
+  return `${laneId}::${getDensityGroupKey(groupIndex)}`;
+}
+__name(getLaneGroupKey, "getLaneGroupKey");
+const STARRED_INCREASE_CONSTANT = 1e7;
+const ACTIVE_INCREASE_CONSTANT = 2e7;
+function getArticleEffectiveRank(article) {
+  if (article.isActive) {
+    return article.rank + ACTIVE_INCREASE_CONSTANT;
+  }
+  return article.rank + (article.isStarred ? STARRED_INCREASE_CONSTANT : 0);
+}
+__name(getArticleEffectiveRank, "getArticleEffectiveRank");
+function selectRankedArticles(articles, pick) {
+  const topArticles = [];
+  let minRankIndex = 0;
+  for (let i = 0; i < articles.length; i++) {
+    const article = articles[i];
+    article.effectiveRank = getArticleEffectiveRank(article);
+    if (topArticles.length < pick) {
+      topArticles.push(article);
+      if (article.effectiveRank < topArticles[minRankIndex].effectiveRank) {
+        minRankIndex = topArticles.length - 1;
+      }
+      continue;
+    }
+    if (article.effectiveRank > topArticles[minRankIndex].effectiveRank) {
+      topArticles[minRankIndex] = article;
+      minRankIndex = findMinIndex(topArticles, "effectiveRank");
+    }
+  }
+  return topArticles;
 }
-__name(getLaneGroupKey, "getLaneGroupKey");
+__name(selectRankedArticles, "selectRankedArticles");
 Timeline.prototype.updateArticlesGroupIndex = function() {
   this.forLoadedArticles(function(article) {
     article.groupIndex = this.calculateGroupIndex(article.period.from);
@@ -6333,15 +7713,21 @@ Timeline.prototype.updateVisibleArticlesOfGroups = function(drawCycleContext) {
   if (this._isLaneLayoutActive()) {
     this.groups = {};
     const groupIndexExtension2 = isScreenAutoStackingRange(this.options.article.autoStacking.range) ? 1 : 20;
-    const leftmostGroupIndex2 = this.calculateGroupIndex(drawCycleContext.tokens.start) - groupIndexExtension2;
-    const rightmostGroupIndex2 = this.calculateGroupIndex(drawCycleContext.tokens.end) + groupIndexExtension2;
+    const leftmostGroupIndex2 = shiftDensityGroupIndex(
+      this.calculateGroupIndex(drawCycleContext.tokens.start),
+      -groupIndexExtension2
+    );
+    const rightmostGroupIndex2 = shiftDensityGroupIndex(
+      this.calculateGroupIndex(drawCycleContext.tokens.end),
+      groupIndexExtension2
+    );
     const activeLanes = this._getActiveLanesForLayout();
     this.forLoadedArticles(function(article) {
       article.isVisibleInGroup = false;
     });
     for (let l = 0; l < activeLanes.length; l++) {
       const lane = activeLanes[l];
-      for (let index = leftmostGroupIndex2; index <= rightmostGroupIndex2; index++) {
+      for (let index = leftmostGroupIndex2; compareDensityGroupIndexes(index, rightmostGroupIndex2) <= 0; index = shiftDensityGroupIndex(index, 1)) {
         const key = getLaneGroupKey(lane.id, index);
         this.groups[key] = this.getArticlesInGroup(
           index,
@@ -6358,13 +7744,19 @@ Timeline.prototype.updateVisibleArticlesOfGroups = function(drawCycleContext) {
   }
   this.groups = {};
   const groupIndexExtension = isScreenAutoStackingRange(this.options.article.autoStacking.range) ? 1 : 20;
-  const leftmostGroupIndex = this.calculateGroupIndex(drawCycleContext.tokens.start) - groupIndexExtension;
-  const rightmostGroupIndex = this.calculateGroupIndex(drawCycleContext.tokens.end) + groupIndexExtension;
+  const leftmostGroupIndex = shiftDensityGroupIndex(
+    this.calculateGroupIndex(drawCycleContext.tokens.start),
+    -groupIndexExtension
+  );
+  const rightmostGroupIndex = shiftDensityGroupIndex(
+    this.calculateGroupIndex(drawCycleContext.tokens.end),
+    groupIndexExtension
+  );
   this.forLoadedArticles(function(article) {
     article.isVisibleInGroup = false;
   });
-  for (let index = leftmostGroupIndex; index <= rightmostGroupIndex; index++) {
-    this.groups[index] = this.getArticlesInGroup(
+  for (let index = leftmostGroupIndex; compareDensityGroupIndexes(index, rightmostGroupIndex) <= 0; index = shiftDensityGroupIndex(index, 1)) {
+    this.groups[getDensityGroupKey(index)] = this.getArticlesInGroup(
       index,
       leftmostGroupIndex,
       rightmostGroupIndex
@@ -6374,26 +7766,11 @@ Timeline.prototype.updateVisibleArticlesOfGroups = function(drawCycleContext) {
     });
   }
 };
-const STARRED_INCREASE_CONSTANT = 1e7;
-const ACTIVE_INCREASE_CONSTANT = 2e7;
 Timeline.prototype.getArticlesInGroup = function(index, leftmostGroupIndex, rightmostGroupIndex, laneId) {
-  function getArticleEffectiveRank(article) {
-    let effectiveRank = article.rank;
-    if (article.isActive) {
-      effectiveRank += ACTIVE_INCREASE_CONSTANT;
-    } else {
-      if (article.isStarred) {
-        effectiveRank += STARRED_INCREASE_CONSTANT;
-      }
-    }
-    return effectiveRank;
-  }
-  __name(getArticleEffectiveRank, "getArticleEffectiveRank");
   const lane = typeof laneId !== "undefined" ? this.getLaneById(laneId) : null;
   const density = lane && lane.resolvedArticleOptions ? lane.resolvedArticleOptions.density : this.options.article.density;
   const pick = this.getDensityPick(density);
-  const topArticles = [];
-  let minRankIndex = 0;
+  const articlesInGroup = [];
   for (let i = 0; i < this.articles.length; i++) {
     const article = this.articles[i];
     if (!article.isDataLoaded || article.isHiddenByFilter) {
@@ -6402,26 +7779,21 @@ Timeline.prototype.getArticlesInGroup = function(index, leftmostGroupIndex, righ
     if (typeof laneId !== "undefined" && article.laneId !== laneId) {
       continue;
     }
-    const belongsToThisGroup = clamp(article.groupIndex, leftmostGroupIndex, rightmostGroupIndex) === index;
+    const belongsToThisGroup = compareDensityGroupIndexes(
+      clampDensityGroupIndex(article.groupIndex, leftmostGroupIndex, rightmostGroupIndex),
+      index
+    ) === 0;
     if (!belongsToThisGroup) {
       continue;
     }
-    article.effectiveRank = getArticleEffectiveRank(article);
-    if (topArticles.length < pick) {
-      topArticles.push(article);
-      if (article.effectiveRank < topArticles[minRankIndex].effectiveRank) {
-        minRankIndex = topArticles.length - 1;
-      }
-      continue;
-    }
-    if (article.effectiveRank > topArticles[minRankIndex].effectiveRank) {
-      topArticles[minRankIndex] = article;
-      minRankIndex = findMinIndex(topArticles, "effectiveRank");
-    }
+    articlesInGroup.push(article);
   }
-  return topArticles;
+  return selectRankedArticles(articlesInGroup, pick);
 };
 Timeline.prototype.calculateGroupIndex = function(date) {
+  if (this.currentDensitySetting.step.divisionsPerDay) {
+    return createSubdayDensityGroupIndex(date, this.currentDensitySetting.step.divisionsPerDay);
+  }
   if (this.timescaleManager.unit >= ZOOM_MONTH && this.currentDensitySetting.step.months !== 0) {
     const g2 = date.year * 12 + (date.month - 1);
     return Math.floor(g2 / this.currentDensitySetting.step.months);
@@ -6438,17 +7810,18 @@ Timeline.prototype.canBeVisibleInGroup = function(article, startToken, endToken)
   }
   startToken = startToken || this.timescaleManager.startToken;
   endToken = endToken || this.calculateEndToken();
-  const leftmostGroupIndex = this.calculateGroupIndex(startToken.value) - 1;
-  const rightmostGroupIndex = this.calculateGroupIndex(endToken.value) + 1;
-  const effectiveArticleGroupIndex = clamp(
+  const leftmostGroupIndex = shiftDensityGroupIndex(this.calculateGroupIndex(startToken.value), -1);
+  const rightmostGroupIndex = shiftDensityGroupIndex(this.calculateGroupIndex(endToken.value), 1);
+  const effectiveArticleGroupIndex = clampDensityGroupIndex(
     article.groupIndex,
     leftmostGroupIndex,
     rightmostGroupIndex
   );
-  if (!Object.prototype.hasOwnProperty.call(this.groups, effectiveArticleGroupIndex)) {
+  const effectiveGroupKey = getDensityGroupKey(effectiveArticleGroupIndex);
+  if (!Object.prototype.hasOwnProperty.call(this.groups, effectiveGroupKey)) {
     return false;
   }
-  return this.groups[effectiveArticleGroupIndex].indexOf(article.id) >= 0;
+  return this.groups[effectiveGroupKey].indexOf(article.id) >= 0;
 };
 const DEFAULT_MAX_FRAME_DELTA = 64;
 function startInertia({
@@ -6525,16 +7898,76 @@ function normalisePadding(padding = 0) {
 }
 __name(normalisePadding, "normalisePadding");
 function normaliseDateInput(date) {
-  if (!date || !Number.isFinite(date.year)) {
-    throw new Error("fitDateRange requires start and end dates with a numeric year");
+  const parsed = typeof date === "string" ? parseDmyString(date)?.date : date;
+  if (!parsed || !Number.isFinite(parsed.year)) {
+    throw new Error("Date input requires a numeric year or canonical Histropedia date string");
   }
   return new Dmy({
-    year: date.year,
-    month: date.month ?? 1,
-    day: date.day ?? 1
+    year: parsed.year,
+    month: parsed.month ?? 1,
+    day: parsed.day ?? 1,
+    hour: parsed.hour ?? 0,
+    minute: parsed.minute ?? 0,
+    second: parsed.second ?? 0,
+    millisecond: parsed.millisecond ?? 0
   });
 }
 __name(normaliseDateInput, "normaliseDateInput");
+function normaliseDayPoint(point) {
+  const dayOffset = Math.floor(point.millisecond / MILLISECONDS_PER_DAY);
+  return {
+    dayNumber: point.dayNumber + dayOffset,
+    millisecond: point.millisecond - dayOffset * MILLISECONDS_PER_DAY
+  };
+}
+__name(normaliseDayPoint, "normaliseDayPoint");
+function getDayPoint(dmy) {
+  return {
+    dayNumber: dmy.getDaysSinceYearZero(),
+    millisecond: dmy.getMillisecondsOfDay()
+  };
+}
+__name(getDayPoint, "getDayPoint");
+function compareDayPoints(left, right) {
+  if (left.dayNumber !== right.dayNumber) {
+    return left.dayNumber < right.dayNumber ? -1 : 1;
+  }
+  if (left.millisecond !== right.millisecond) {
+    return left.millisecond < right.millisecond ? -1 : 1;
+  }
+  return 0;
+}
+__name(compareDayPoints, "compareDayPoints");
+function getDayPointDifference(start, end) {
+  const wholeDays = end.dayNumber - start.dayNumber;
+  const milliseconds = end.millisecond - start.millisecond;
+  return wholeDays + milliseconds / MILLISECONDS_PER_DAY;
+}
+__name(getDayPointDifference, "getDayPointDifference");
+function addDaysToDayPoint(point, days) {
+  const wholeDays = Math.floor(days);
+  return normaliseDayPoint({
+    dayNumber: point.dayNumber + wholeDays,
+    millisecond: point.millisecond + (days - wholeDays) * MILLISECONDS_PER_DAY
+  });
+}
+__name(addDaysToDayPoint, "addDaysToDayPoint");
+function interpolateDayPoints(start, end, progress) {
+  if (progress <= 0) {
+    return { ...start };
+  }
+  if (progress >= 1) {
+    return { ...end };
+  }
+  const scaledWholeDayDifference = (end.dayNumber - start.dayNumber) * progress;
+  const wholeDays = Math.floor(scaledWholeDayDifference);
+  const milliseconds = start.millisecond + (scaledWholeDayDifference - wholeDays) * MILLISECONDS_PER_DAY + (end.millisecond - start.millisecond) * progress;
+  return normaliseDayPoint({
+    dayNumber: start.dayNumber + wholeDays,
+    millisecond: milliseconds
+  });
+}
+__name(interpolateDayPoints, "interpolateDayPoints");
 function getNextYearStart(year) {
   return new Dmy(year === -1 ? 1 : year + 1, 1, 1);
 }
@@ -6548,18 +7981,20 @@ function getNextMonthStart(year, month) {
 __name(getNextMonthStart, "getNextMonthStart");
 function normaliseDateRangeInput(date) {
   const start = normaliseDateInput(date);
-  const hasMonth = date.month != null;
-  const hasDay = date.day != null;
-  if (!hasMonth) {
+  const parsedString = typeof date === "string" ? parseDmyString(date) : null;
+  const hasMonth = parsedString ? parsedString.hasMonth : date.month != null;
+  const hasDay = parsedString ? parsedString.hasDay : date.day != null;
+  const hasTime = parsedString ? parsedString.hasTime : date.hour != null || date.minute != null || date.second != null || date.millisecond != null;
+  if (!hasMonth && !hasTime) {
     return {
       start,
-      end: getNextYearStart(date.year)
+      end: getNextYearStart(start.year)
     };
   }
-  if (!hasDay) {
+  if (!hasDay && !hasTime) {
     return {
       start,
-      end: getNextMonthStart(date.year, date.month)
+      end: getNextMonthStart(start.year, start.month)
     };
   }
   return {
@@ -6593,13 +8028,18 @@ function normaliseZoomForManager(manager, zoom) {
 }
 __name(normaliseZoomForManager, "normaliseZoomForManager");
 function getUnitFromZoom(manager, zoom) {
+  if (typeof manager.getUnitFromZoom === "function") {
+    return manager.getUnitFromZoom(zoom);
+  }
   const unitLevels = manager.unitLevels;
   if (!Array.isArray(unitLevels) || unitLevels.length === 0) {
     return manager.unit;
   }
-  for (let i = unitLevels.length - 1; i >= 0; i--) {
-    if (zoom >= unitLevels[i].zoomStart) {
-      return i;
+  const unitOrder = manager.unitOrder || unitLevels.map((_settings, unit) => unit);
+  for (let i = unitOrder.length - 1; i >= 0; i--) {
+    const unit = unitOrder[i];
+    if (zoom >= unitLevels[unit].zoomStart) {
+      return unit;
     }
   }
   return manager.unit;
@@ -6608,8 +8048,8 @@ __name(getUnitFromZoom, "getUnitFromZoom");
 function getUnitSizeInPixelsForZoom(manager, unit, zoom) {
   const unitSettings = manager.unitLevels?.[unit];
   const zoomRatio = manager.zoomOptions?.ratio;
-  if (unitSettings && Number.isFinite(unitSettings.startUnitSize) && Number.isFinite(unitSettings.zoomStart) && Number.isFinite(zoomRatio) && zoomRatio > 0) {
-    return unitSettings.startUnitSize * Math.pow(zoomRatio, zoom - unitSettings.zoomStart);
+  if (unitSettings && Number.isFinite(unitSettings.startUnitSize) && Number.isFinite(unitSettings.referenceZoom ?? unitSettings.zoomStart) && Number.isFinite(zoomRatio) && zoomRatio > 0) {
+    return unitSettings.startUnitSize * Math.pow(zoomRatio, zoom - (unitSettings.referenceZoom ?? unitSettings.zoomStart));
   }
   if (!Number.isFinite(manager.unitSizeInPixels)) {
     return NaN;
@@ -6630,7 +8070,7 @@ function getPixelsBetweenAtZoom(manager, startDate, endDate, zoom) {
     return NaN;
   }
   if (unit <= ZOOM_DAY) {
-    return startDate.getDaysTo(endDate) * unitSizeInPixels;
+    return startDate.getDaysTo(endDate) * unitSizeInPixels / getZoomUnitLengthInDays(unit);
   }
   if (unit === ZOOM_MONTH) {
     return startDate.getMonthsTo(endDate) * unitSizeInPixels;
@@ -6638,23 +8078,23 @@ function getPixelsBetweenAtZoom(manager, startDate, endDate, zoom) {
   return startDate.getYearsTo(endDate) * unitSizeInPixels / getUnitLengthInYears(unit);
 }
 __name(getPixelsBetweenAtZoom, "getPixelsBetweenAtZoom");
-function getPixelsBetweenDayNumbersAtZoom(manager, startDayNumber, endDayNumber, zoom) {
+function getPixelsBetweenDayPointsAtZoom(manager, startPoint, endPoint, zoom) {
   const normalisedZoom = normaliseZoomForManager(manager, zoom);
   const unit = getUnitFromZoom(manager, normalisedZoom);
   const unitSizeInPixels = getUnitSizeInPixelsForZoom(manager, unit, normalisedZoom);
   if (!Number.isFinite(unitSizeInPixels) || unitSizeInPixels <= 0) {
     return NaN;
   }
-  const daySpan = endDayNumber - startDayNumber;
+  const daySpan = getDayPointDifference(startPoint, endPoint);
   if (unit <= ZOOM_DAY) {
-    return daySpan * unitSizeInPixels;
+    return daySpan * unitSizeInPixels / getZoomUnitLengthInDays(unit);
   }
   if (unit === ZOOM_MONTH) {
     return daySpan * unitSizeInPixels / 30.44;
   }
   return daySpan * unitSizeInPixels / (365.2422 * getUnitLengthInYears(unit));
 }
-__name(getPixelsBetweenDayNumbersAtZoom, "getPixelsBetweenDayNumbersAtZoom");
+__name(getPixelsBetweenDayPointsAtZoom, "getPixelsBetweenDayPointsAtZoom");
 function getFitZoomForInternalDates(timeline, internalStart, internalEnd, padding) {
   const manager = timeline.timescaleManager;
   const currentPixelSpan = manager.getPixelsBetween(internalStart, internalEnd);
@@ -6702,14 +8142,7 @@ function normaliseBoundDate(timeline, date) {
   if (date == null) {
     return null;
   }
-  const normalised = normaliseDateInput(typeof date === "string" ? Dmy.fromString(date) : date);
-  return timeline.getDmyFromInput(
-    new Dmy({
-      year: normalised.year,
-      month: normalised.month,
-      day: normalised.day
-    })
-  );
+  return timeline.getDmyFromInput(normaliseDateInput(date));
 }
 __name(normaliseBoundDate, "normaliseBoundDate");
 function getTimelineDateBounds(timeline) {
@@ -6728,24 +8161,27 @@ function getTimelineDateBounds(timeline) {
   return {
     minDate,
     maxDate,
+    minPoint: minDate ? getDayPoint(minDate) : null,
+    maxPoint: maxDate ? getDayPoint(maxDate) : null,
     minDay: minDate ? getDayNumber(minDate) : null,
     maxDay: maxDate ? getDayNumber(maxDate) : null,
     overflow: bounds.overflow === "clamp" ? "clamp" : "elastic"
   };
 }
 __name(getTimelineDateBounds, "getTimelineDateBounds");
-function getViewportDayRange(timeline) {
-  const start = getDayNumberAtPixel(timeline, 0);
-  const end = getDayNumberAtPixel(timeline, timeline.getWidth());
-  return start <= end ? { start, end } : { start: end, end: start };
+function getViewportDayPointRange(timeline) {
+  const start = getDayPointAtPixel(timeline, 0);
+  const end = getDayPointAtPixel(timeline, timeline.getWidth());
+  return compareDayPoints(start, end) <= 0 ? { start, end } : { start: end, end: start };
 }
-__name(getViewportDayRange, "getViewportDayRange");
+__name(getViewportDayPointRange, "getViewportDayPointRange");
 function getDateBoundSideCorrection(bounds, viewport, width) {
-  const minOverflow = bounds.minDay != null ? bounds.minDay - viewport.start : 0;
-  const maxOverflow = bounds.maxDay != null ? viewport.end - bounds.maxDay : 0;
+  const minOverflow = bounds.minPoint ? getDayPointDifference(viewport.start, bounds.minPoint) : 0;
+  const maxOverflow = bounds.maxPoint ? getDayPointDifference(bounds.maxPoint, viewport.end) : 0;
   if (minOverflow > 0 && minOverflow >= maxOverflow) {
     return {
       type: "min",
+      dayPoint: bounds.minPoint,
       dayNumber: bounds.minDay,
       pixelOffset: 0,
       overflowDays: minOverflow
@@ -6754,6 +8190,7 @@ function getDateBoundSideCorrection(bounds, viewport, width) {
   if (maxOverflow > 0) {
     return {
       type: "max",
+      dayPoint: bounds.maxPoint,
       dayNumber: bounds.maxDay,
       pixelOffset: width,
       overflowDays: maxOverflow
@@ -6766,22 +8203,23 @@ function getDateBoundCorrection(timeline, bounds = getTimelineDateBounds(timelin
   if (!bounds) {
     return null;
   }
-  const viewport = getViewportDayRange(timeline);
+  const viewport = getViewportDayPointRange(timeline);
   const width = timeline.getWidth();
   const sideCorrection = getDateBoundSideCorrection(bounds, viewport, width);
   if (options.mode === "elastic" && bounds.overflow === "elastic" && sideCorrection) {
     return sideCorrection;
   }
-  if (bounds.minDay != null && bounds.maxDay != null && viewport.end - viewport.start > bounds.maxDay - bounds.minDay) {
+  if (bounds.minPoint && bounds.maxPoint && getDayPointDifference(viewport.start, viewport.end) > getDayPointDifference(bounds.minPoint, bounds.maxPoint)) {
     return {
       type: "range",
-      zoom: getFitZoomForDayNumbers(
+      zoom: getFitZoomForDayPoints(
         timeline,
-        bounds.minDay,
-        bounds.maxDay,
+        bounds.minPoint,
+        bounds.maxPoint,
         { left: 0, right: 0 },
         timeline.timescaleManager.zoom
       ),
+      dayPoint: bounds.minPoint,
       dayNumber: bounds.minDay,
       pixelOffset: 0
     };
@@ -6801,22 +8239,44 @@ function getElasticOverflowDays(timeline, overflowDays) {
   return resistedPixels / pixelsPerDay;
 }
 __name(getElasticOverflowDays, "getElasticOverflowDays");
-function setElasticBoundedViewportStartDay(timeline, targetStartDayNumber, viewportSpanDays) {
+function getUnresistedElasticOverflowDays(timeline, overflowDays) {
+  const pixelsPerDay = getPixelsPerDay(timeline);
+  if (!pixelsPerDay || !Number.isFinite(overflowDays) || overflowDays <= 0) {
+    return 0;
+  }
+  const width = Math.max(1, timeline.getWidth());
+  const maxElasticPixels = Math.max(32, width * 0.22);
+  const resistedPixels = overflowDays * pixelsPerDay;
+  if (resistedPixels >= maxElasticPixels) {
+    return Number.MAX_SAFE_INTEGER / pixelsPerDay;
+  }
+  return maxElasticPixels * resistedPixels / (maxElasticPixels - resistedPixels) / pixelsPerDay;
+}
+__name(getUnresistedElasticOverflowDays, "getUnresistedElasticOverflowDays");
+function setElasticBoundedViewportStartPoint(timeline, targetStartPoint, viewportSpanDays) {
   const bounds = getTimelineDateBounds(timeline);
-  let nextStartDayNumber = targetStartDayNumber;
+  let nextStartPoint = targetStartPoint;
   if (bounds?.overflow === "elastic" && Number.isFinite(viewportSpanDays)) {
-    const targetEndDayNumber = targetStartDayNumber + viewportSpanDays;
-    if (bounds.minDay != null && targetStartDayNumber < bounds.minDay) {
-      nextStartDayNumber = bounds.minDay - getElasticOverflowDays(timeline, bounds.minDay - targetStartDayNumber);
-    } else if (bounds.maxDay != null && targetEndDayNumber > bounds.maxDay) {
-      nextStartDayNumber = bounds.maxDay + getElasticOverflowDays(timeline, targetEndDayNumber - bounds.maxDay) - viewportSpanDays;
+    const targetEndPoint = addDaysToDayPoint(targetStartPoint, viewportSpanDays);
+    if (bounds.minPoint && compareDayPoints(targetStartPoint, bounds.minPoint) < 0) {
+      const overflow = getDayPointDifference(targetStartPoint, bounds.minPoint);
+      nextStartPoint = addDaysToDayPoint(
+        bounds.minPoint,
+        -getElasticOverflowDays(timeline, overflow)
+      );
+    } else if (bounds.maxPoint && compareDayPoints(targetEndPoint, bounds.maxPoint) > 0) {
+      const overflow = getDayPointDifference(bounds.maxPoint, targetEndPoint);
+      nextStartPoint = addDaysToDayPoint(
+        bounds.maxPoint,
+        getElasticOverflowDays(timeline, overflow) - viewportSpanDays
+      );
     }
   }
-  setInternalStartDayNumber(timeline, nextStartDayNumber, 0, false, {
+  setInternalStartDayPoint(timeline, nextStartPoint, 0, false, {
     skipDateBounds: true
   });
 }
-__name(setElasticBoundedViewportStartDay, "setElasticBoundedViewportStartDay");
+__name(setElasticBoundedViewportStartPoint, "setElasticBoundedViewportStartPoint");
 function applyTimelineDateBounds(timeline, options = {}) {
   const bounds = getTimelineDateBounds(timeline);
   if (!bounds) {
@@ -6831,7 +8291,7 @@ function applyTimelineDateBounds(timeline, options = {}) {
     if (correction.zoom !== timeline.timescaleManager.zoom) {
       timeline.timescaleManager.setZoom(correction.zoom);
     }
-    setInternalStartDayNumber(timeline, correction.dayNumber, correction.pixelOffset, false, {
+    setInternalStartDayPoint(timeline, correction.dayPoint, correction.pixelOffset, false, {
       skipDateBounds: true
     });
     return true;
@@ -6839,13 +8299,17 @@ function applyTimelineDateBounds(timeline, options = {}) {
   if (mode === "elastic" && bounds.overflow === "elastic") {
     const elasticOverflowDays = getElasticOverflowDays(timeline, correction.overflowDays);
     if (correction.type === "min") {
-      setInternalStartDayNumber(timeline, correction.dayNumber - elasticOverflowDays, 0, false, {
-        skipDateBounds: true
-      });
+      setInternalStartDayPoint(
+        timeline,
+        addDaysToDayPoint(correction.dayPoint, -elasticOverflowDays),
+        0,
+        false,
+        { skipDateBounds: true }
+      );
     } else {
-      setInternalStartDayNumber(
+      setInternalStartDayPoint(
         timeline,
-        correction.dayNumber + elasticOverflowDays,
+        addDaysToDayPoint(correction.dayPoint, elasticOverflowDays),
         correction.pixelOffset,
         false,
         { skipDateBounds: true }
@@ -6853,7 +8317,7 @@ function applyTimelineDateBounds(timeline, options = {}) {
     }
     return true;
   }
-  setInternalStartDayNumber(timeline, correction.dayNumber, correction.pixelOffset, false, {
+  setInternalStartDayPoint(timeline, correction.dayPoint, correction.pixelOffset, false, {
     skipDateBounds: true
   });
   return true;
@@ -6870,7 +8334,7 @@ function getPixelsPerDay(timeline) {
     return 0;
   }
   if (manager.unit == null || manager.unit <= ZOOM_DAY) {
-    return unitSize;
+    return unitSize / getZoomUnitLengthInDays(manager.unit ?? ZOOM_DAY);
   }
   if (manager.unit === ZOOM_MONTH) {
     return unitSize / 30.44;
@@ -6879,10 +8343,12 @@ function getPixelsPerDay(timeline) {
   return unitSize / (365.2422 * unitLengthInYears);
 }
 __name(getPixelsPerDay, "getPixelsPerDay");
-function setInternalStartDayNumber(timeline, dayNumber, pixelOffset, emitStateChange = false, options = {}) {
-  const startDayNumber = Math.floor(dayNumber);
-  const startDmy = getDmyFromDayNumber(startDayNumber);
-  const partialDayPixels = (dayNumber - startDayNumber) * getPixelsPerDay(timeline);
+function setInternalStartDayPoint(timeline, dayPoint, pixelOffset, emitStateChange = false, options = {}) {
+  const normalisedPoint = normaliseDayPoint(dayPoint);
+  const milliseconds = Math.floor(normalisedPoint.millisecond);
+  const millisecondFraction = normalisedPoint.millisecond - milliseconds;
+  const startDmy = getDmyFromDayNumber(normalisedPoint.dayNumber).addMilliseconds(milliseconds);
+  const partialDayPixels = millisecondFraction * getPixelsPerDay(timeline) / MILLISECONDS_PER_DAY;
   const dateFraction = timeline.timescaleManager.setStartDate(startDmy);
   timeline.repositionWindow = dateFraction - partialDayPixels;
   if (pixelOffset) {
@@ -6897,26 +8363,26 @@ function setInternalStartDayNumber(timeline, dayNumber, pixelOffset, emitStateCh
     timeline._emitTimelineStateChange();
   }
 }
-__name(setInternalStartDayNumber, "setInternalStartDayNumber");
+__name(setInternalStartDayPoint, "setInternalStartDayPoint");
 function setInternalStartDate(timeline, dmy, pixelOffset, emitStateChange = false, options = {}) {
-  const dayNumber = getDayNumber(dmy);
-  setInternalStartDayNumber(timeline, dayNumber, pixelOffset, emitStateChange, options);
+  setInternalStartDayPoint(timeline, getDayPoint(dmy), pixelOffset, emitStateChange, options);
 }
 __name(setInternalStartDate, "setInternalStartDate");
-function getDayNumberFromPivotPoint(timeline, pivotPoint) {
+function getDayPointFromPivotPoint(timeline, pivotPoint) {
   const pixelsPerDay = getPixelsPerDay(timeline);
+  const point = getDayPoint(pivotPoint.date);
   if (!pixelsPerDay) {
-    return getDayNumber(pivotPoint.date);
+    return point;
   }
-  return getDayNumber(pivotPoint.date) + pivotPoint.fraction / pixelsPerDay;
+  return addDaysToDayPoint(point, pivotPoint.fraction / pixelsPerDay);
 }
-__name(getDayNumberFromPivotPoint, "getDayNumberFromPivotPoint");
-function getDayNumberAtPixel(timeline, pixel) {
-  return getDayNumberFromPivotPoint(timeline, timeline.getPivotPoint(pixel));
+__name(getDayPointFromPivotPoint, "getDayPointFromPivotPoint");
+function getDayPointAtPixel(timeline, pixel) {
+  return getDayPointFromPivotPoint(timeline, timeline.getPivotPoint(pixel));
 }
-__name(getDayNumberAtPixel, "getDayNumberAtPixel");
+__name(getDayPointAtPixel, "getDayPointAtPixel");
 function getDayNumber(dmy) {
-  return dmy.getDaysSinceYearZero();
+  return dmy.getDaysSinceYearZero() + dmy.getMillisecondsOfDay() / MILLISECONDS_PER_DAY;
 }
 __name(getDayNumber, "getDayNumber");
 function getDmyFromDayNumber(dayNumber) {
@@ -6941,12 +8407,12 @@ function interpolate(start, end, progress) {
   return start + (end - start) * progress;
 }
 __name(interpolate, "interpolate");
-function getFitZoomForDayNumbers(timeline, startDayNumber, endDayNumber, padding, fallbackZoom) {
-  if (endDayNumber <= startDayNumber) {
+function getFitZoomForDayPoints(timeline, startPoint, endPoint, padding, fallbackZoom) {
+  if (compareDayPoints(endPoint, startPoint) <= 0) {
     return fallbackZoom;
   }
   const manager = timeline.timescaleManager;
-  const currentPixelSpan = (endDayNumber - startDayNumber) * getPixelsPerDay(timeline);
+  const currentPixelSpan = getDayPointDifference(startPoint, endPoint) * getPixelsPerDay(timeline);
   if (!Number.isFinite(currentPixelSpan) || currentPixelSpan <= 0) {
     return fallbackZoom;
   }
@@ -6957,10 +8423,10 @@ function getFitZoomForDayNumbers(timeline, startDayNumber, endDayNumber, padding
   }
   let targetZoom = manager.zoom + zoomChange;
   for (let i = 0; i < 4; i++) {
-    const predictedPixelSpan = getPixelsBetweenDayNumbersAtZoom(
+    const predictedPixelSpan = getPixelsBetweenDayPointsAtZoom(
       manager,
-      startDayNumber,
-      endDayNumber,
+      startPoint,
+      endPoint,
       targetZoom
     );
     if (!Number.isFinite(predictedPixelSpan) || predictedPixelSpan <= 0) {
@@ -6977,7 +8443,7 @@ function getFitZoomForDayNumbers(timeline, startDayNumber, endDayNumber, padding
   }
   return normaliseZoomForManager(manager, targetZoom);
 }
-__name(getFitZoomForDayNumbers, "getFitZoomForDayNumbers");
+__name(getFitZoomForDayPoints, "getFitZoomForDayPoints");
 function stopNavigationAnimations(timeline) {
   if (typeof timeline.stopPanAnimation === "function") {
     timeline.stopPanAnimation();
@@ -7014,13 +8480,13 @@ function animateDateRangeFit(timeline, targetStartDate, targetEndDate, targetZoo
   timeline.startAnimation();
   const startZoom = timeline.timescaleManager.zoom;
   const fitPixelSpan = getFitPixelSpan(timeline, padding);
-  const startDayNumberAtPadding = getDayNumberAtPixel(timeline, padding.left);
-  const startEndDayNumberAtPadding = getDayNumberAtPixel(timeline, padding.left + fitPixelSpan);
+  const startPointAtPadding = getDayPointAtPixel(timeline, padding.left);
+  const startEndPointAtPadding = getDayPointAtPixel(timeline, padding.left + fitPixelSpan);
   const targetInternalStart = timeline.getDmyFromInput(normaliseDateInput(targetStartDate));
   const targetInternalEnd = timeline.getDmyFromInput(normaliseDateInput(targetEndDate));
-  const targetDayNumber = getDayNumber(targetInternalStart);
-  const targetEndDayNumber = getDayNumber(targetInternalEnd);
-  const canInterpolateBoundaries = startEndDayNumberAtPadding > startDayNumberAtPadding && targetEndDayNumber > targetDayNumber;
+  const targetPoint = getDayPoint(targetInternalStart);
+  const targetEndPoint = getDayPoint(targetInternalEnd);
+  const canInterpolateBoundaries = compareDayPoints(startEndPointAtPadding, startPointAtPadding) > 0 && compareDayPoints(targetEndPoint, targetPoint) > 0;
   const rangeTween = tween({
     from: 0,
     to: 1,
@@ -7032,13 +8498,13 @@ function animateDateRangeFit(timeline, targetStartDate, targetEndDate, targetZoo
         rangeTween.stop();
         return;
       }
-      const nextDayNumber = interpolate(startDayNumberAtPadding, targetDayNumber, progress);
+      const nextPoint = interpolateDayPoints(startPointAtPadding, targetPoint, progress);
       let nextZoom = startZoom;
       if (progress > 0) {
-        nextZoom = canInterpolateBoundaries ? getFitZoomForDayNumbers(
+        nextZoom = canInterpolateBoundaries ? getFitZoomForDayPoints(
           timeline,
-          nextDayNumber,
-          interpolate(startEndDayNumberAtPadding, targetEndDayNumber, progress),
+          nextPoint,
+          interpolateDayPoints(startEndPointAtPadding, targetEndPoint, progress),
           padding,
           timeline.timescaleManager.zoom
         ) : interpolate(startZoom, targetZoom, progress);
@@ -7046,7 +8512,7 @@ function animateDateRangeFit(timeline, targetStartDate, targetEndDate, targetZoo
       if (nextZoom !== timeline.timescaleManager.zoom) {
         timeline.timescaleManager.setZoom(nextZoom);
       }
-      setInternalStartDayNumber(timeline, nextDayNumber, padding.left);
+      setInternalStartDayPoint(timeline, nextPoint, padding.left);
     },
     onComplete() {
       if (targetZoom !== timeline.timescaleManager.zoom) {
@@ -7077,7 +8543,7 @@ function getArticleFitRange(timeline, articleFilter) {
     if (!latest || from.compare(latest) > 0) {
       latest = from;
     }
-    const style = article._getCurrentStyle();
+    const style = article.getCurrentStyle();
     const connectorOffset = style.connectorLine?.offsetX ?? 0;
     const width = style.width ?? 0;
     maxCardLeftOffset = Math.max(maxCardLeftOffset, connectorOffset);
@@ -7434,10 +8900,7 @@ Timeline.prototype.enableDragging = /* @__PURE__ */ __name(function enableDraggi
   __name(onPointerMove, "onPointerMove");
   function onPointerEnd(evt, tracker) {
     if (me.isPinching && tracker.list.length < 2) {
-      if (tracker.list.length === 1) {
-        const primary = getPrimary(tracker);
-        me.dragStartX = primary.x;
-      }
+      const remainingPointer = tracker.list.length === 1 ? getPrimary(tracker) : null;
       const endScale = pinch.scale || 1;
       const actualEndZoom = me.timescaleManager.zoom;
       const endTotalZoomDelta = actualEndZoom - pinch.initial.zoom;
@@ -7459,9 +8922,18 @@ Timeline.prototype.enableDragging = /* @__PURE__ */ __name(function enableDraggi
         }),
         evt
       );
-      me.settleDateBounds?.();
-      if (!me.isPanning) {
-        me._flushTimelineStateChange?.();
+      if (remainingPointer) {
+        if (me.isDragging) {
+          me.resetDragTracking(remainingPointer);
+        }
+      } else if (me.isDragging) {
+        me.resetDragTracking(getPoint(evt));
+        me.endDragging(evt);
+      } else {
+        me.settleDateBounds?.();
+        if (!me.isPanning) {
+          me._flushTimelineStateChange?.();
+        }
       }
       return;
     }
@@ -7523,31 +8995,51 @@ Timeline.prototype.startDragging = /* @__PURE__ */ __name(function startDragging
   this.stopZoomAnimation?.();
   this.isDragging = true;
   const page = getPoint(evt);
+  Timeline.prototype.resetDragTracking.call(this, page);
+  this.trigger(
+    "viewport-drag-start",
+    makeViewportDragPayload({
+      startToken: this.timescaleManager.startToken,
+      offsetX: this.repositionWindow
+    }),
+    evt
+  );
+}, "startDragging");
+Timeline.prototype.resetDragTracking = /* @__PURE__ */ __name(function resetDragTracking(page) {
   this.dragOrigin = { left: page.x, top: page.y };
   this.dragStartX = page.x;
   this.dragStartY = page.y;
   this.dragMomentumSamples = [{ time: Date.now(), x: page.x }];
   this.dragDateBoundsState = null;
   const bounds = getTimelineDateBounds(this);
-  const pixelsPerDay = getPixelsPerDay(this);
-  if (bounds?.overflow === "elastic" && pixelsPerDay) {
-    const leftDayNumber = getDayNumberAtPixel(this, 0);
-    const rightDayNumber = getDayNumberAtPixel(this, this.getWidth());
+  if (bounds?.overflow === "elastic") {
+    const pixelsPerDay = getPixelsPerDay(this);
+    if (!pixelsPerDay) {
+      return;
+    }
+    const viewport = getViewportDayPointRange(this);
+    const viewportSpanDays = getDayPointDifference(viewport.start, viewport.end);
+    let leftDayPoint = viewport.start;
+    if (bounds.minPoint && compareDayPoints(viewport.start, bounds.minPoint) < 0) {
+      const overflow = getDayPointDifference(viewport.start, bounds.minPoint);
+      leftDayPoint = addDaysToDayPoint(
+        bounds.minPoint,
+        -getUnresistedElasticOverflowDays(this, overflow)
+      );
+    } else if (bounds.maxPoint && compareDayPoints(viewport.end, bounds.maxPoint) > 0) {
+      const overflow = getDayPointDifference(bounds.maxPoint, viewport.end);
+      leftDayPoint = addDaysToDayPoint(
+        bounds.maxPoint,
+        getUnresistedElasticOverflowDays(this, overflow) - viewportSpanDays
+      );
+    }
     this.dragDateBoundsState = {
-      leftDayNumber,
+      leftDayPoint,
       pixelsPerDay,
-      viewportSpanDays: rightDayNumber - leftDayNumber
+      viewportSpanDays
     };
   }
-  this.trigger(
-    "viewport-drag-start",
-    makeViewportDragPayload({
-      startToken: this.timescaleManager.startToken,
-      offsetX: this.repositionWindow
-    }),
-    evt
-  );
-}, "startDragging");
+}, "resetDragTracking");
 Timeline.prototype.endDragging = /* @__PURE__ */ __name(function endDragging(evt) {
   this.isDragging = false;
   const page = getPoint(evt);
@@ -7592,10 +9084,13 @@ Timeline.prototype.doDrag = /* @__PURE__ */ __name(function doDrag(evt) {
     this.animation.dragRedrawFunction = this.defaultRedraw;
   }
   if (this.dragDateBoundsState) {
-    const targetLeftDayNumber = this.dragDateBoundsState.leftDayNumber + cumulativeMovePixelsX / this.dragDateBoundsState.pixelsPerDay;
-    setElasticBoundedViewportStartDay(
+    const targetLeftDayPoint = addDaysToDayPoint(
+      this.dragDateBoundsState.leftDayPoint,
+      cumulativeMovePixelsX / this.dragDateBoundsState.pixelsPerDay
+    );
+    setElasticBoundedViewportStartPoint(
       this,
-      targetLeftDayNumber,
+      targetLeftDayPoint,
       this.dragDateBoundsState.viewportSpanDays
     );
   } else {
@@ -7782,13 +9277,20 @@ Timeline.prototype.getDmyFromInput = function(dmy) {
   let normalised;
   if (typeof dmy === "string") {
     normalised = Dmy.fromString(dmy);
+    if (!Number.isFinite(normalised.year)) {
+      throw new Error(`Invalid Histropedia date string: ${dmy}`);
+    }
   } else if (dmy instanceof Dmy) {
     normalised = new Dmy(dmy);
   } else {
     normalised = new Dmy({
       year: dmy.year,
       month: dmy.month ?? 1,
-      day: dmy.day ?? 1
+      day: dmy.day ?? 1,
+      hour: dmy.hour ?? 0,
+      minute: dmy.minute ?? 0,
+      second: dmy.second ?? 0,
+      millisecond: dmy.millisecond ?? 0
     });
   }
   if (!this.options?.shiftBceDates) {
@@ -7862,7 +9364,7 @@ Timeline.prototype.hasArticle = function(articleId) {
       article = this.articles[i];
     }
   }
-  return !isUndefined$1(article);
+  return !isUndefined(article);
 };
 Timeline.prototype.reposition = function(article, drawCycleContext) {
   if (article.isDragging) {
@@ -7906,7 +9408,7 @@ Timeline.prototype.getOriginalPosition = function(article, drawCycleContext) {
       from = 0;
     }
   }
-  const style = article._getCurrentStyle();
+  const style = article.getCurrentStyle();
   const lane = this.getLaneById(article.laneId);
   if (this._isLaneLayoutActive() && lane && lane.geometry) {
     return {
@@ -8275,6 +9777,7 @@ function resolveAreaExtents(areaConfig, options = {}) {
   };
 }
 __name(resolveAreaExtents, "resolveAreaExtents");
+const MAIN_RANGE_RIGHT_BUFFER = 150;
 Timeline.prototype.defaultRedraw = function() {
   this.redraw({
     // 1. update isVisibleInGroup and after articles IsInRange is decided
@@ -8380,7 +9883,6 @@ Timeline.prototype.redraw = function(callbacks) {
   });
 };
 Timeline.prototype.render = function(ctx, top, width, markers, drawCycleContext) {
-  const halfMainlineSize = this.options.style.mainLine.size >> 1;
   const effectiveVerticalOffset = this._getEffectiveVerticalOffset ? this._getEffectiveVerticalOffset() : this.options.verticalOffset;
   if (!this.owner) {
     ctx.clearRect(0, 0, width, this.top + effectiveVerticalOffset);
@@ -8392,19 +9894,7 @@ Timeline.prototype.render = function(ctx, top, width, markers, drawCycleContext)
   this.drawDraggingHighlight(ctx, top, width);
   const mainLineTop = this.options.style.mainLine.position === "top" ? -effectiveVerticalOffset : top;
   this.drawMainline(ctx, mainLineTop, width, markers);
-  if (this.options.style.mainLine.showDateIndicators) {
-    ctx.beginPath();
-    this.forInRangeArticles(/* @__PURE__ */ __name(function redraw_articles_drawIndicators(article) {
-      if (!article.isHiddenByFilter && article.isInView) {
-        ctx.moveTo(article.indicator.fromX, top - halfMainlineSize);
-        ctx.lineTo(article.indicator.fromX, top + halfMainlineSize);
-      }
-    }, "redraw_articles_drawIndicators"));
-    ctx.lineWidth = 3;
-    ctx.globalAlpha = 0.75;
-    ctx.strokeStyle = "#303030";
-    ctx.stroke();
-  }
+  this.drawDateIndicators(ctx, mainLineTop);
   ctx.globalAlpha = 1;
   for (let i = 0; i < this.articles.length; i++) {
     const article = this.articles[i];
@@ -8434,7 +9924,53 @@ Timeline.prototype.drawDebugOverlays = function(ctx, width, drawCycleContext) {
     this.drawDensityRegionBoundaries(ctx, width, drawCycleContext);
   }
 };
+function resolveDateIndicatorColor(timeline, article, color, useActiveArticleColor) {
+  if (color !== "article") {
+    return color;
+  }
+  if (useActiveArticleColor) {
+    return article.activeStyle?.color || article.style?.color || timeline.options.article.defaultStyle.color;
+  }
+  return article.style?.color || timeline.options.article.defaultStyle.color;
+}
+__name(resolveDateIndicatorColor, "resolveDateIndicatorColor");
+Timeline.prototype.drawDateIndicators = function(ctx, top) {
+  const dateIndicators = this.options.style.mainLine.dateIndicators;
+  if (!dateIndicators.visible) {
+    return;
+  }
+  const mainLineSize = this.options.style.mainLine.size;
+  const halfMainLineSize = mainLineSize / 2;
+  ctx.save();
+  ctx.globalAlpha = 1;
+  this.forInRangeArticles(/* @__PURE__ */ __name(function redraw_articles_drawIndicators(article) {
+    if (article.isHiddenByFilter || !article.isInView) {
+      return;
+    }
+    const isActive = article.isActive === true;
+    const isDensityHidden = !isActive && article.isVisibleInLane !== false && article.isVisibleInGroup === false;
+    const stateStyle = isActive ? dateIndicators.activeStyle : isDensityHidden ? dateIndicators.hiddenStyle : null;
+    const style = stateStyle ? { ...dateIndicators, ...stateStyle } : dateIndicators;
+    const size = style.size;
+    const halfSize = size / 2;
+    const x = article.indicator.fromX;
+    const useActiveArticleColor = isActive && stateStyle?.color === "article";
+    ctx.globalAlpha = style.opacity ?? 1;
+    ctx.fillStyle = resolveDateIndicatorColor(this, article, style.color, useActiveArticleColor);
+    if (style.shape === "circle") {
+      ctx.beginPath();
+      ctx.arc(x, top, halfSize, 0, Math.PI * 2);
+      ctx.fill();
+      return;
+    }
+    ctx.fillRect(x - halfSize, top - halfMainLineSize, size, mainLineSize);
+  }, "redraw_articles_drawIndicators"));
+  ctx.restore();
+};
 Timeline.prototype.getDensityRegionBoundaryDate = function(groupIndex) {
+  if (isSubdayDensityGroupIndex(groupIndex)) {
+    return getDmyFromDayNumber(groupIndex.day);
+  }
   const step = this.currentDensitySetting.step;
   if (this.timescaleManager.unit >= ZOOM_MONTH && step.months !== 0) {
     const monthIndex = groupIndex * step.months;
@@ -8459,14 +9995,28 @@ Timeline.prototype.getDensityRegionBoundaryDate = function(groupIndex) {
   }
   return boundary;
 };
+Timeline.prototype.getDensityRegionBoundaryPoint = function(groupIndex) {
+  if (isSubdayDensityGroupIndex(groupIndex)) {
+    const boundary = getSubdayDensityGroupBoundary(groupIndex);
+    return {
+      date: getDmyFromDayNumber(boundary.dayNumber),
+      dayFraction: boundary.dayFraction
+    };
+  }
+  return {
+    date: this.getDensityRegionBoundaryDate(groupIndex),
+    dayFraction: 0
+  };
+};
 Timeline.prototype.drawDensityRegionBoundaries = function(ctx, width, drawCycleContext) {
   const tokens = drawCycleContext?.tokens;
   if (!tokens?.start || !tokens?.end || !this.currentDensitySetting?.step) {
     return;
   }
-  const firstGroup = this.calculateGroupIndex(tokens.start) - 1;
-  const lastGroup = this.calculateGroupIndex(tokens.end) + 1;
+  const firstGroup = shiftDensityGroupIndex(this.calculateGroupIndex(tokens.start), -1);
+  const lastGroup = shiftDensityGroupIndex(this.calculateGroupIndex(tokens.end), 1);
   const startDate = this.timescaleManager.startToken.value;
+  const pixelsPerDay = getPixelsPerDay(this);
   const height = this.options.height;
   let previousX = null;
   ctx.save();
@@ -8475,9 +10025,9 @@ Timeline.prototype.drawDensityRegionBoundaries = function(ctx, width, drawCycleC
   ctx.lineWidth = 1;
   ctx.strokeStyle = "rgba(204, 0, 153, 0.8)";
   ctx.setLineDash([4, 4]);
-  for (let groupIndex = firstGroup; groupIndex <= lastGroup; groupIndex++) {
-    const boundary = this.getDensityRegionBoundaryDate(groupIndex);
-    const rawX = this.timescaleManager.getPixelsBetween(startDate, boundary) + this.repositionWindow;
+  for (let groupIndex = firstGroup; compareDensityGroupIndexes(groupIndex, lastGroup) <= 0; groupIndex = shiftDensityGroupIndex(groupIndex, 1)) {
+    const boundary = this.getDensityRegionBoundaryPoint(groupIndex);
+    const rawX = this.timescaleManager.getPixelsBetween(startDate, boundary.date) + boundary.dayFraction * pixelsPerDay + this.repositionWindow;
     const x = Math.round(rawX) + 0.5;
     if (x < 0 || x > width || x === previousX) {
       continue;
@@ -8493,23 +10043,26 @@ Timeline.prototype.drawMainline = function(ctx, top, width, markers) {
   if (this.options.style.mainLine.visible) {
     ctx.globalAlpha = 1;
     const halfMainlineSize = this.options.style.mainLine.size >> 1;
-    const mainLineGradient = ctx.createLinearGradient(
-      0,
-      top - halfMainlineSize,
-      0,
-      top + halfMainlineSize
-    );
-    mainLineGradient.addColorStop(0, "#808080");
-    mainLineGradient.addColorStop(1, "#ccc");
+    const color = this.options.style.mainLine.color;
+    let fillStyle = typeof color === "string" ? color : DEFAULT_MAIN_LINE_COLOR;
+    if (color?.type === "gradient" && typeof color.topColor === "string" && typeof color.bottomColor === "string") {
+      fillStyle = ctx.createLinearGradient(0, top - halfMainlineSize, 0, top + halfMainlineSize);
+      fillStyle.addColorStop(0, color.topColor);
+      fillStyle.addColorStop(1, color.bottomColor);
+    }
     ctx.beginPath();
     ctx.lineWidth = this.options.style.mainLine.size;
-    ctx.strokeStyle = ctx.fillStyle = mainLineGradient;
+    ctx.strokeStyle = ctx.fillStyle = fillStyle;
     ctx.moveTo(0, top);
     ctx.lineTo(width, top);
     ctx.stroke();
     for (const type in markers) {
-      this.drawMarkersAndLabels(ctx, markers[type], type, top + halfMainlineSize);
+      this.drawMarkersAndLabels(ctx, markers[type], type, top + halfMainlineSize, {
+        minorTokens: markers[MINOR_MARKER],
+        viewportWidth: width
+      });
     }
+    this.drawParentDateLabels(ctx, top + halfMainlineSize, width);
   }
 };
 Timeline.prototype.drawDraggingHighlight = function(ctx, top, width) {
@@ -8583,24 +10136,196 @@ Timeline.prototype.getTokensAndMarkers = function(width) {
   const markers = {};
   markers[MAJOR_MARKER] = [];
   markers[MINOR_MARKER] = [];
+  const visualMarkerLayout = this.timescaleManager.getSubdayVisualMarkerLayout?.();
   let x = this.repositionWindow;
   let token = this.timescaleManager.startToken;
   tokens.start = token.value;
-  let endToken = token;
-  const leftBufferNumberOfTokens = 9;
-  token = this.timescaleManager.getPreviousNth(token, leftBufferNumberOfTokens);
-  x -= token.length * leftBufferNumberOfTokens;
+  const minimumLeftBufferTokens = 9;
+  let bufferedTokenCount = 0;
+  let hasMajorBeforeViewport = token.type === MAJOR_MARKER && x <= 0;
+  while (bufferedTokenCount < minimumLeftBufferTokens || !hasMajorBeforeViewport) {
+    token = this.timescaleManager.getPrevious(token);
+    x -= token.length;
+    bufferedTokenCount++;
+    if (token.type === MAJOR_MARKER && x <= 0) {
+      hasMajorBeforeViewport = true;
+    }
+  }
   do {
-    markers[token.type].push(token);
-    tokens[token.value.toKeyString()] = token.drawX = x;
+    token.drawX = x;
+    tokens[token.value.toKeyString()] = x;
+    if (!visualMarkerLayout) {
+      markers[token.type].push(token);
+    }
     x += token.length;
-    endToken = token;
     token = this.timescaleManager.getNext(token);
-  } while (x < width + 150);
-  tokens.end = endToken.value;
+  } while (x < width + MAIN_RANGE_RIGHT_BUFFER);
+  if (visualMarkerLayout) {
+    const visualMarkers = this.timescaleManager.createSubdayVisualMarkers(
+      width,
+      this.repositionWindow,
+      visualMarkerLayout
+    );
+    markers[MAJOR_MARKER] = visualMarkers[MAJOR_MARKER];
+    markers[MINOR_MARKER] = visualMarkers[MINOR_MARKER];
+  }
+  tokens.end = this.getPivotPoint(width + MAIN_RANGE_RIGHT_BUFFER).date;
   return { tokens, markers };
 };
-Timeline.prototype.drawMarkersAndLabels = function(ctx, tokens, tokenType, markerTop) {
+function getLabelMetrics(ctx, token, labelStyle) {
+  const width = ctx.measureText(token.label).width;
+  const offsetX = Number.isFinite(labelStyle.offset?.x) ? labelStyle.offset.x : 0;
+  const anchorX = Math.round(token.drawX) + offsetX;
+  let left = anchorX;
+  if (labelStyle.textAlign === "center") {
+    left -= width / 2;
+  } else if (labelStyle.textAlign === "right" || labelStyle.textAlign === "end") {
+    left -= width;
+  }
+  return { left, width };
+}
+__name(getLabelMetrics, "getLabelMetrics");
+function getTextAnchorForLeft(left, width, textAlign) {
+  if (textAlign === "center") {
+    return left + width / 2;
+  }
+  if (textAlign === "right" || textAlign === "end") {
+    return left + width;
+  }
+  return left;
+}
+__name(getTextAnchorForLeft, "getTextAnchorForLeft");
+function isStickyMajorLabelEnabled(stickyStyle, tokens) {
+  if (stickyStyle?.enabled === true) {
+    return true;
+  }
+  if (stickyStyle?.enabled !== "auto") {
+    return false;
+  }
+  return Number.isFinite(tokens[0]?.unit) && tokens[0].unit <= ZOOM_MONTH;
+}
+__name(isStickyMajorLabelEnabled, "isStickyMajorLabelEnabled");
+const MAJOR_LABEL_MINIMUM_GAP = 8;
+function getStickyTextLabel(ctx, tokens, labelStyle, viewportWidth) {
+  if (labelStyle.sticky?.enabled !== true || !Number.isFinite(viewportWidth)) {
+    return null;
+  }
+  const stickyLeft = Number.isFinite(labelStyle.sticky.offsetX) ? labelStyle.sticky.offsetX : 0;
+  let candidateIndex = -1;
+  let candidateMetrics;
+  for (let i = 0; i < tokens.length; i++) {
+    const metrics = getLabelMetrics(ctx, tokens[i], labelStyle);
+    if (metrics.left <= stickyLeft) {
+      candidateIndex = i;
+      candidateMetrics = metrics;
+    }
+  }
+  if (candidateIndex < 0) {
+    return null;
+  }
+  const token = tokens[candidateIndex];
+  const nextToken = tokens[candidateIndex + 1];
+  if (token.drawX > viewportWidth || !nextToken && token.drawX + token.length < 0) {
+    return null;
+  }
+  let labelLeft = stickyLeft;
+  if (nextToken) {
+    const nextMetrics = getLabelMetrics(ctx, nextToken, labelStyle);
+    labelLeft = Math.min(
+      labelLeft,
+      nextMetrics.left - candidateMetrics.width - MAJOR_LABEL_MINIMUM_GAP
+    );
+  }
+  return {
+    token,
+    labelX: getTextAnchorForLeft(labelLeft, candidateMetrics.width, labelStyle.textAlign)
+  };
+}
+__name(getStickyTextLabel, "getStickyTextLabel");
+function getStickyMajorLabel(ctx, tokens, labelStyle, drawOptions) {
+  const stickyStyle = labelStyle.sticky;
+  const minorTokens = drawOptions.minorTokens || [];
+  const viewportWidth = drawOptions.viewportWidth;
+  if (!isStickyMajorLabelEnabled(stickyStyle, tokens) || !Number.isFinite(viewportWidth)) {
+    return null;
+  }
+  const stickyLeft = Number.isFinite(stickyStyle.offsetX) ? stickyStyle.offsetX : 0;
+  let candidateIndex = -1;
+  let candidateMetrics;
+  for (let i = 0; i < tokens.length; i++) {
+    const metrics = getLabelMetrics(ctx, tokens[i], labelStyle);
+    if (metrics.left <= stickyLeft) {
+      candidateIndex = i;
+      candidateMetrics = metrics;
+    }
+  }
+  if (candidateIndex < 0) {
+    return null;
+  }
+  const token = tokens[candidateIndex];
+  const nextToken = tokens[candidateIndex + 1];
+  const hasVisibleInterval = token.drawX <= viewportWidth && (nextToken ? nextToken.drawX >= 0 : token.visual === true && token.drawX + token.length >= 0 || minorTokens.some(
+    (minorToken) => minorToken.drawX >= 0 && minorToken.drawX <= viewportWidth && minorToken.drawX > token.drawX
+  ));
+  if (!hasVisibleInterval) {
+    return null;
+  }
+  let labelLeft = stickyLeft;
+  if (nextToken) {
+    const nextMetrics = getLabelMetrics(ctx, nextToken, labelStyle);
+    labelLeft = Math.min(
+      labelLeft,
+      nextMetrics.left - candidateMetrics.width - MAJOR_LABEL_MINIMUM_GAP
+    );
+  }
+  return {
+    token,
+    labelX: getTextAnchorForLeft(labelLeft, candidateMetrics.width, labelStyle.textAlign)
+  };
+}
+__name(getStickyMajorLabel, "getStickyMajorLabel");
+Timeline.prototype.drawParentDateLabels = function(ctx, markerTop, viewportWidth) {
+  const labelStyle = this.options.style.dateLabel.parent;
+  if (!this.timescaleManager.isParentContextTextVisible(labelStyle)) {
+    return;
+  }
+  const visibleStart = this.getPivotPoint(0).date;
+  const tokens = this.timescaleManager.createParentContextTokens(
+    visibleStart,
+    viewportWidth,
+    this.repositionWindow
+  );
+  if (tokens.length === 0) {
+    return;
+  }
+  const markerDirection = this.options.style.mainLine.position === "top" ? -1 : 1;
+  const majorStyle = this.options.style.dateLabel.major;
+  const majorMarkerHeight = this.options.style.marker.major.height;
+  const labelY = markerTop + majorMarkerHeight * markerDirection + majorStyle.offset.y + labelStyle.height * markerDirection + labelStyle.offset.y;
+  ctx.font = labelStyle.font;
+  ctx.textAlign = labelStyle.textAlign;
+  ctx.textBaseline = markerDirection === 1 ? "alphabetic" : "top";
+  const stickyLabel = getStickyTextLabel(ctx, tokens, labelStyle, viewportWidth);
+  let previousLabelRight = Number.NEGATIVE_INFINITY;
+  for (let i = 0; i < tokens.length; i++) {
+    const token = tokens[i];
+    const labelX = stickyLabel?.token === token ? stickyLabel.labelX : Math.round(token.drawX) + labelStyle.offset.x;
+    const labelWidth = ctx.measureText(token.label).width;
+    let labelLeft = labelX;
+    if (labelStyle.textAlign === "center") {
+      labelLeft -= labelWidth / 2;
+    } else if (labelStyle.textAlign === "right" || labelStyle.textAlign === "end") {
+      labelLeft -= labelWidth;
+    }
+    if (stickyLabel?.token !== token && labelLeft < previousLabelRight + MAJOR_LABEL_MINIMUM_GAP) {
+      continue;
+    }
+    ctx.fillStyle = token.value.isInFuture() ? labelStyle.futureColor : labelStyle.color;
+    ctx.fillText(token.label, labelX, labelY);
+    previousLabelRight = labelLeft + labelWidth;
+  }
+};
+Timeline.prototype.drawMarkersAndLabels = function(ctx, tokens, tokenType, markerTop, drawOptions = {}) {
   if (tokens.length === 0) {
     return;
   }
@@ -8618,7 +10343,7 @@ Timeline.prototype.drawMarkersAndLabels = function(ctx, tokens, tokenType, marke
   const isExtended = markerStyle.extend;
   const markerDirection = this.options.style.mainLine.position === "top" ? -1 : 1;
   const markerHeight = markerStyle.height;
-  const withLabel = !!tokens[0].label;
+  const withLabel = tokens.some((token) => token.label);
   let isInFuture = tokens[0].value.isInFuture();
   let wasInPast = !isInFuture;
   let labelStyle;
@@ -8633,6 +10358,7 @@ Timeline.prototype.drawMarkersAndLabels = function(ctx, tokens, tokenType, marke
     ctx.textBaseline = markerDirection === 1 ? "alphabetic" : "top";
     labelY = markerTop + markerHeight * markerDirection + labelStyle.offset.y;
   }
+  const stickyLabel = withLabel && tokenType === "major" ? getStickyMajorLabel(ctx, tokens, labelStyle, drawOptions) : null;
   ctx.beginPath();
   for (let i = 0; i < tokens.length; i++) {
     const token = tokens[i];
@@ -8649,7 +10375,7 @@ Timeline.prototype.drawMarkersAndLabels = function(ctx, tokens, tokenType, marke
     const markerEndY = isExtended ? markerTop + -1 * markerDirection * this.top : markerTop;
     ctx.lineTo(drawX, markerEndY);
     if (withLabel && token.label) {
-      const labelX = drawX + labelStyle.offset.x;
+      const labelX = stickyLabel?.token === token ? stickyLabel.labelX : drawX + labelStyle.offset.x;
       ctx.fillStyle = isInFuture ? labelStyle.futureColor : labelStyle.color;
       ctx.fillText(token.label, labelX, labelY);
     }
@@ -8705,6 +10431,45 @@ Timeline.prototype._getResolvedArticleOptions = function(articleOrData) {
   const lane = this.getLaneById(laneId);
   return getResolvedLaneArticleOptions(this, lane);
 };
+Timeline.prototype._getResolvedArticleStyleOverrides = function(articleOrData, cardLayout) {
+  const laneId = articleOrData && articleOrData.laneId != null ? articleOrData.laneId : this._resolveLaneIdFromArticleData(articleOrData);
+  const lane = this.getLaneById(laneId);
+  const baseOptions = ENGINE_DEFAULTS.article || {};
+  const layoutDefaults = this._registeredArticleLayoutStyles?.[cardLayout] || {};
+  const timelineOptions = this._explicitArticleOptions || {};
+  const timelineLayoutStyles = timelineOptions.layoutStyles?.[cardLayout] || {};
+  const laneOptions = lane?.articleOptions || {};
+  const laneLayoutStyles = laneOptions.layoutStyles?.[cardLayout] || {};
+  return {
+    style: deepMerge(
+      {},
+      baseOptions.defaultStyle || {},
+      layoutDefaults.style || {},
+      timelineOptions.defaultStyle || {},
+      timelineLayoutStyles.style || {},
+      laneOptions.defaultStyle || {},
+      laneLayoutStyles.style || {}
+    ),
+    hoverStyle: deepMerge(
+      {},
+      baseOptions.defaultHoverStyle || {},
+      layoutDefaults.hoverStyle || {},
+      timelineOptions.defaultHoverStyle || {},
+      timelineLayoutStyles.hoverStyle || {},
+      laneOptions.defaultHoverStyle || {},
+      laneLayoutStyles.hoverStyle || {}
+    ),
+    activeStyle: deepMerge(
+      {},
+      baseOptions.defaultActiveStyle || {},
+      layoutDefaults.activeStyle || {},
+      timelineOptions.defaultActiveStyle || {},
+      timelineLayoutStyles.activeStyle || {},
+      laneOptions.defaultActiveStyle || {},
+      laneLayoutStyles.activeStyle || {}
+    )
+  };
+};
 Timeline.prototype._getExplicitArticleCardLayout = function(articleOrData) {
   if (!articleOrData) {
     return null;
@@ -10052,6 +11817,7 @@ const WHEEL_ZOOM_STATE_CHANGE_DELAY = 120;
 const FRAME_MS = 1e3 / 60;
 const STANDARD_WHEEL_NOTCH_DELTA = 120;
 const MIN_BROWSER_ZOOM_SCALED_NOTCH_DELTA = 24;
+const MILLISECOND_BOUNDARY_EPSILON = 1e-7;
 const BROWSER_ZOOM_SCALE_FACTORS = [
   0.25,
   1 / 3,
@@ -10322,7 +12088,8 @@ Timeline.prototype.setZoomByPivotPixel = /* @__PURE__ */ __name(function setZoom
 Timeline.prototype.setZoomByPivotPoint = /* @__PURE__ */ __name(function setZoomByPivotPoint(newZoom, pivotPoint, pivotPixel, offsetX = 0) {
   this.timescaleManager.setZoom(newZoom);
   const compensation = this.timescaleManager.setStartDate(pivotPoint.date);
-  this.repositionWindow = compensation - pivotPoint.fraction;
+  const residualPixels = Number.isFinite(pivotPoint.millisecondFraction) ? pivotPoint.millisecondFraction * getPixelsPerDay(this) / MILLISECONDS_PER_DAY : pivotPoint.fraction;
+  this.repositionWindow = compensation - residualPixels;
   this.updateFromByPixels(-pivotPixel + offsetX);
   applyTimelineDateBounds(this, {
     mode: this.isDragging || this.isPinching ? "elastic" : "clamp"
@@ -10346,7 +12113,23 @@ Timeline.prototype.getPivotPoint = /* @__PURE__ */ __name(function getPivotPoint
   let fraction = pixel - (x - token.length);
   const dmy = prevToken.value;
   let { year, month, day } = dmy;
-  if (unit === ZOOM_MONTH) {
+  if (unit <= ZOOM_DAY) {
+    const pixelsPerMillisecond = getPixelsPerDay(this) / MILLISECONDS_PER_DAY;
+    let millisecondsFromToken = pixelsPerMillisecond > 0 ? fraction / pixelsPerMillisecond : 0;
+    const nearestMillisecond = Math.round(millisecondsFromToken);
+    if (Math.abs(millisecondsFromToken - nearestMillisecond) < MILLISECOND_BOUNDARY_EPSILON) {
+      millisecondsFromToken = nearestMillisecond;
+    }
+    const wholeMilliseconds = Math.floor(millisecondsFromToken);
+    const millisecondFraction = millisecondsFromToken - wholeMilliseconds;
+    prevToken.value = prevToken.value.addMilliseconds(wholeMilliseconds);
+    fraction -= wholeMilliseconds * pixelsPerMillisecond;
+    return {
+      date: prevToken.value,
+      fraction,
+      millisecondFraction
+    };
+  } else if (unit === ZOOM_MONTH) {
     day = Math.floor(fraction / len * 30.44) + 1;
     fraction -= (day - 1) * len / 30.44;
     prevToken.value = new Dmy(year, month, day);
@@ -10621,10 +12404,7 @@ __name(animateStartDate, "animateStartDate");
 Timeline.prototype.setStartDate = function(dmy, options) {
   const settings = normaliseSetStartDateOptions(options);
   const padding = settings.padding || 0;
-  if (typeof dmy === "string") {
-    dmy = Dmy.fromString(dmy);
-  }
-  dmy = this.getDmyFromInput(dmy);
+  dmy = this.getDmyFromInput(normaliseDateInput(dmy));
   if (settings.animation?.active) {
     animateStartDate(this, dmy, padding, settings.animation);
     return;
@@ -10780,44 +12560,6 @@ Timeline.prototype.offMultiple = function(handlers) {
     this.off(event, handlers[event]);
   }
 };
-function roundPixel(value) {
-  return Math.round(value);
-}
-__name(roundPixel, "roundPixel");
-function snapPixel(value, dpr = 1) {
-  const ratio = typeof dpr === "number" && isFinite(dpr) && dpr > 0 ? dpr : 1;
-  return Math.round(value * ratio) / ratio;
-}
-__name(snapPixel, "snapPixel");
-function retainPixel(value) {
-  return value;
-}
-__name(retainPixel, "retainPixel");
-function createPixelSnap(dpr = 1, mode = "device") {
-  if (mode === false || mode === "none") {
-    return retainPixel;
-  }
-  if (mode === "css") {
-    return roundPixel;
-  }
-  return /* @__PURE__ */ __name(function snapToDevicePixel(value) {
-    return snapPixel(value, dpr);
-  }, "snapToDevicePixel");
-}
-__name(createPixelSnap, "createPixelSnap");
-function createInnerSpace(outerSpace, borderWidth, snap) {
-  if (!snap) {
-    snap = roundPixel;
-  }
-  const halfBorder = borderWidth / 2;
-  return {
-    left: snap(outerSpace.left + halfBorder),
-    top: snap(outerSpace.top + halfBorder),
-    width: snap(outerSpace.width - borderWidth),
-    height: snap(outerSpace.height - borderWidth)
-  };
-}
-__name(createInnerSpace, "createInnerSpace");
 function getPixelSnap$1(article) {
   const dpr = article.owner?.getCanvasDpr?.() || 1;
   const mode = article.owner?.options?.article?.rendering?.pixelSnap;
@@ -10838,7 +12580,7 @@ const landscape = {
     if (!this.isDataLoaded || isNaN(this.position.left)) {
       return;
     }
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const snap = getPixelSnap$1(this);
     const articleOrigin = getSnappedArticleOrigin$1(this);
     const top = articleOrigin.top;
@@ -11014,7 +12756,11 @@ const landscape = {
       }
     }
     if (showStar) {
-      const star = this.getIconBox();
+      const box = this.getIconBox();
+      const centreX = snap(box.left + box.width / 2);
+      const centreY = snap(box.top + box.height / 2);
+      const outerRadius = snap(Math.min(box.width, box.height) / 2);
+      const innerRadius = snap(outerRadius / 2);
       let starStroke, starFill;
       if (!this.isStarred) {
         if (this.isMouseOverStar) {
@@ -11033,26 +12779,17 @@ const landscape = {
           starFill = "#fff800";
         }
       }
-      drawStar(
-        ctx,
-        star.centreX,
-        star.centreY,
-        5,
-        star.innerRadius,
-        star.outerRadius,
-        starFill,
-        starStroke
-      );
+      drawStar(ctx, centreX, centreY, 5, innerRadius, outerRadius, starFill, starStroke);
     }
   },
   getWidth() {
-    return this._getCurrentStyle().width;
+    return this.getCurrentStyle().width;
   },
   getHeight() {
-    return this._getCurrentStyle().height;
+    return this.getCurrentStyle().height;
   },
   getConnectorEnd() {
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const articleOrigin = getSnappedArticleOrigin$1(this);
     return {
       left: articleOrigin.left + style.connectorLine.offsetX,
@@ -11063,7 +12800,7 @@ const landscape = {
     if (this.owner?.options?.article?.star?.visible === false) {
       return false;
     }
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const snap = getPixelSnap$1(this);
     const sideLength = style.star.width;
     const box = {
@@ -11074,10 +12811,6 @@ const landscape = {
     const articleOrigin = getSnappedArticleOrigin$1(this);
     box.left = snap(articleOrigin.left - br / 4 + this._getWidth() - box.width - style.star.margin);
     box.top = snap(articleOrigin.top + br / 4 + style.star.margin);
-    box.centreX = snap(box.left + box.width / 2);
-    box.centreY = snap(box.top + box.height / 2);
-    box.outerRadius = snap(box.width / 2);
-    box.innerRadius = snap(box.outerRadius / 2);
     return box;
   },
   defaultStyle: {
@@ -11139,7 +12872,7 @@ __name(getSnappedArticleOrigin, "getSnappedArticleOrigin");
 const portrait = {
   name: "portrait",
   draw(ctx) {
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const snap = getPixelSnap(this);
     const borderWidth = style.border.width;
     const maxBorderWidth = Math.max(
@@ -11378,7 +13111,11 @@ const portrait = {
       ctx.stroke();
     }
     if (this.owner?.options?.article?.star?.visible !== false && (this.isActive || this.isStarred)) {
-      const star = getStarBox(this);
+      const box = this.getIconBox();
+      const centreX = snap(box.left + box.width / 2);
+      const centreY = snap(box.top + box.height / 2);
+      const outerRadius = snap(Math.min(box.width, box.height) / 2);
+      const innerRadius = snap(outerRadius / 2);
       let starStroke, starFill;
       if (!this.isStarred) {
         if (this.isMouseOverStar) {
@@ -11397,23 +13134,14 @@ const portrait = {
           starFill = "#fff800";
         }
       }
-      drawStar(
-        ctx,
-        star.centreX,
-        star.centreY,
-        5,
-        star.innerRadius,
-        star.outerRadius,
-        starFill,
-        starStroke
-      );
+      drawStar(ctx, centreX, centreY, 5, innerRadius, outerRadius, starFill, starStroke);
     }
   },
   getWidth() {
-    return this._getCurrentStyle().width;
+    return this.getCurrentStyle().width;
   },
   getHeight() {
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const snap = getPixelSnap(this);
     let imageHeight = 0;
     if (this.imageLoaded) {
@@ -11439,7 +13167,7 @@ const portrait = {
     return imageHeight + articleTopHeight + style.border.width;
   },
   getConnectorEnd() {
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const articleOrigin = getSnappedArticleOrigin(this);
     return {
       left: articleOrigin.left + style.connectorLine.offsetX,
@@ -11450,7 +13178,7 @@ const portrait = {
     if (this.owner?.options?.article?.star?.visible === false) {
       return false;
     }
-    const style = this._getCurrentStyle();
+    const style = this.getCurrentStyle();
     const snap = getPixelSnap(this);
     const articleOrigin = getSnappedArticleOrigin(this);
     const sideLength = style.star.width;
@@ -11465,36 +13193,16 @@ const portrait = {
     return box;
   }
 };
-function getStarBox(article) {
-  const style = article._getCurrentStyle();
-  const snap = getPixelSnap(article);
-  const articleOrigin = getSnappedArticleOrigin(article);
-  const sideLength = style.star.width;
-  const box = {
-    width: sideLength,
-    height: sideLength
-  };
-  box.left = snap(
-    articleOrigin.left - style.topRadius / 4 + article._getWidth() - box.width - style.star.margin
-  );
-  box.top = snap(articleOrigin.top + style.topRadius / 4 + style.star.margin);
-  box.centreX = snap(box.left + box.width / 2);
-  box.centreY = snap(box.top + box.height / 2);
-  box.outerRadius = snap(box.width / 2);
-  box.innerRadius = snap(box.outerRadius / 2);
-  return box;
-}
-__name(getStarBox, "getStarBox");
 const _cardLayouts = /* @__PURE__ */ new Map();
 function _injectDimensionFallbacks(layout) {
   if (typeof layout.getWidth !== "function") {
     layout.getWidth = function() {
-      return this._getCurrentStyle().width;
+      return this.getCurrentStyle().width;
     };
   }
   if (typeof layout.getHeight !== "function") {
     layout.getHeight = function() {
-      return this._getCurrentStyle().height;
+      return this.getCurrentStyle().height;
     };
   }
   if (typeof layout.getIconBox !== "function") {
@@ -11556,6 +13264,19 @@ Timeline.registerCardLayout({ name: "default", aliasOf: "portrait" });
 Timeline.prototype.getStatusForSave = function() {
   const from = this.timescaleManager.startToken.value;
   const articleSaveInfo = [];
+  const fromTime = {};
+  if (from.hour) {
+    fromTime.fhr = from.hour;
+  }
+  if (from.minute) {
+    fromTime.fmi = from.minute;
+  }
+  if (from.second) {
+    fromTime.fs = from.second;
+  }
+  if (from.millisecond) {
+    fromTime.fms = from.millisecond;
+  }
   for (let i = 0; i < this.articles.length; i++) {
     articleSaveInfo.push(this.articles[i].getStatusForSave());
   }
@@ -11568,6 +13289,7 @@ Timeline.prototype.getStatusForSave = function() {
     fy: from.year,
     fm: from.month,
     fd: from.day,
+    ...fromTime,
     w: this.repositionWindow,
     a: articleSaveInfo
   });
@@ -11644,9 +13366,13 @@ export {
   PRECISION_CENTURY,
   PRECISION_DAY,
   PRECISION_DECADE,
+  PRECISION_HOUR,
   PRECISION_MILLENNIUM,
   PRECISION_MILLION_YEARS,
+  PRECISION_MILLISECOND,
+  PRECISION_MINUTE,
   PRECISION_MONTH,
+  PRECISION_SECOND,
   PRECISION_YEAR,
   RANGE_ALL,
   RANGE_SCREEN,
@@ -11661,9 +13387,13 @@ export {
   ZOOM_CENTURY,
   ZOOM_DAY,
   ZOOM_DECADE,
+  ZOOM_HOUR,
   ZOOM_MILLENNIUM,
   ZOOM_MILLION_YEARS,
+  ZOOM_MILLISECOND,
+  ZOOM_MINUTE,
   ZOOM_MONTH,
+  ZOOM_SECOND,
   ZOOM_YEAR,
   buildChartTicks,
   buildLinearTicks,