diff --git a/script.js b/script.js
index cf732db..5aa38a4 100644
--- a/script.js
+++ b/script.js
@@ -44,14 +44,6 @@ let updateInterval;
 let lastRenderedEonstrip = null;
 let currentDetailCob = null;
 
-function fmt(d, o) {
-    // shift if TAI, then format
-    const shifted = currentTimezone==='TAI'
-        ? new Date(d.getTime() + getTAIOffsetAt(d)*1000)
-        : d;
-    return shifted.toLocaleString('en-US', o);
-}
-
 function formatSafeDate(rawDate, cobSeconds, intlOptions) {
   if (rawDate instanceof Date && !isNaN(rawDate.getTime())) {
     // Date is valid: optionally shift for TAI vs UTC, then format:
@@ -71,10 +63,6 @@ function formatSafeDate(rawDate, cobSeconds, intlOptions) {
 
 // parseCobiets, floorDiv and other CoBiE helpers are provided by cobie.js
 
-function getCurrentTAIOffset() {
-    return getTAIOffsetAt(new Date());
-}
-
 function getHumanDiff(d1, d2) {
   // make sure start ≤ end
   let start = d1 < d2 ? d1 : d2;
@@ -713,17 +701,35 @@ function showEonstripDetail(index, startCob) {
     }
 
     if (Array.isArray(window.SPECIAL_EVENTS)) {
-        const offsetStart = ((startCob % COBIE_UNITS.cosmocycle) + COBIE_UNITS.cosmocycle) % COBIE_UNITS.cosmocycle;
         const events = [];
+        const start = startCob;
+        const end   = startCob + COBIE_UNITS.eonstrip;
         window.SPECIAL_EVENTS.forEach(ev => {
-            const evCob = parseCobiets(ev.cobie || ev.start);
-            if (evCob === null) return;
-            const evOffset = ((evCob % COBIE_UNITS.cosmocycle) + COBIE_UNITS.cosmocycle) % COBIE_UNITS.cosmocycle;
-            if (evOffset >= offsetStart && evOffset < offsetStart + COBIE_UNITS.eonstrip) {
-                const rel = (evOffset - offsetStart) / COBIE_UNITS.eonstrip;
-                const durSec = ev.duration ? ev.duration : 0;
-                const dur = durSec / COBIE_UNITS.eonstrip;
-                events.push({ label: ev.label, start: rel, end: rel + dur });
+            const startCobEv = parseCobiets(ev.start || ev.cobie);
+            if (startCobEv === null) return;
+            const endCobEv = ev.end ? parseCobiets(ev.end) : Number.POSITIVE_INFINITY;
+            const unitVal = COBIE_UNITS[ev.unit] || COBIE_UNITS.cosmocycle;
+            const interval = (ev.interval || 1) * unitVal;
+            let duration = 0;
+            if (typeof ev.duration === 'string') {
+                const d = parseCobiets(ev.duration);
+                if (d !== null) duration = d;
+            } else if (typeof ev.duration === 'number') {
+                duration = ev.duration;
+            }
+
+            if (start > endCobEv) return;
+
+            let n = Math.floor((start - startCobEv) / interval);
+            if (n < 0) n = 0;
+            let occ = startCobEv + n * interval;
+            if (occ + duration <= start) occ += interval;
+
+            while (occ < end && occ <= endCobEv) {
+                const relStart = (occ - start) / COBIE_UNITS.eonstrip;
+                const relEnd   = (occ + duration - start) / COBIE_UNITS.eonstrip;
+                events.push({ label: ev.label, start: relStart, end: relEnd });
+                occ += interval;
             }
         });
         events.sort((a,b)=>a.start-b.start);
@@ -769,6 +775,12 @@ function detailNow() {
     showEonstripDetail(start);
 }
 
+function exitDetailView() {
+    document.getElementById('eonstripDetailView').style.display = 'none';
+    document.getElementById('calendarView').style.display = 'block';
+    currentDetailCob = null;
+}
+
 function getStep(mods) {
     // base step = 1 megasequence
     let step = 1;
@@ -796,6 +808,10 @@ function getStep(mods) {
 function navigatePeriod(evt, direction) {
     const step = getStep(evt);
 
+    if (currentDetailCob !== null) {
+        exitDetailView();
+    }
+
     animateSwipe(direction, () => {
         currentOffset += direction * step;
         updateCalendar();
@@ -831,6 +847,9 @@ function goToNow() {
     manualCobiets = 0;
     compareManualMode = false;
     currentOffset = 0;
+    if (currentDetailCob !== null) {
+        exitDetailView();
+    }
     updateCurrentTime();
     updateCalendar();
     clearInterval(updateInterval);
@@ -924,11 +943,7 @@ if (matchingOption) {
     currentTimezone = userTimezone;
 }
 
-document.getElementById('backToCalendar').addEventListener('click', () => {
-    document.getElementById('eonstripDetailView').style.display = 'none';
-    document.getElementById('calendarView').style.display = 'block';
-    currentDetailCob = null;
-});
+document.getElementById('backToCalendar').addEventListener('click', exitDetailView);
 document.getElementById('detailPrev').addEventListener('click', detailPrev);
 document.getElementById('detailNext').addEventListener('click', detailNext);
 document.getElementById('detailNow').addEventListener('click', detailNow);
diff --git a/style.css b/style.css
index debfe50..cc9dfd7 100644
--- a/style.css
+++ b/style.css
@@ -602,6 +602,7 @@ body.fullscreen-clock .current-time,
 body.fullscreen-clock .timezone-selector,
 body.fullscreen-clock .calendar-controls,
 body.fullscreen-clock .calendar-view,
+body.fullscreen-clock .detail-view,
 body.fullscreen-clock .time-details,
 body.fullscreen-clock .explanations {
   display: none;