@jjlmoya/utils-science 1.20.0 → 1.22.0

package/src/tool/microwave-detector/i18n/zh.ts

@@ -22,7 +22,7 @@ const howTo = [
 const faq = [
     {
       question: '网站是如何检测我的微波炉的？',
-      answer: '我们不使用神奇的传感器，而是利用网络延迟。2.4GHz WiFi 和微波炉都在相同的频率（约 2450 MHz）下工作。如果微波炉屏蔽失效，它会产生与 WiFi 冲突的“噪声”，从而剧烈增加延迟（Ping）。',
+      answer: '我们不使用神奇的传感器，而是利用网络延迟。2.4GHz WiFi 和微波炉都在相同的频率（约 2450 MHz）下工作。如果微波炉屏蔽失效，它会产生与 WiFi 冲突的"噪声"，从而剧烈增加延迟（Ping）。',
     },
     {
       question: '如果我的微波炉有泄漏，危险吗？',
@@ -34,7 +34,7 @@ const faq = [
     },
     {
       question: '图表上的延迟尖峰意味着什么？',
-      answer: '微波炉运行期间持续出现的尖峰表明电磁信号正在“逃逸”并使空气饱和，导致 WiFi 数据包无法按时送达。',
+      answer: '微波炉运行期间持续出现的尖峰表明电磁信号正在"逃逸"并使空气饱和，导致 WiFi 数据包无法按时送达。',
     },
   ];
 import { bibliography } from '../bibliography';
@@ -97,11 +97,11 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: '任何在 2.4GHz 频段运行的 WiFi 设备都在与您的微波炉争夺同一片“空间”。在一个完美的微波炉中，<strong>法拉第笼</strong>（即您在炉门和内壁上看到的金属网）应 100% 阻隔能量。',
+      html: '任何在 2.4GHz 频段运行的 WiFi 设备都在与您的微波炉争夺同一片"空间"。在一个完美的微波炉中，<strong>法拉第笼</strong>（即您在炉门和内壁上看到的金属网）应 100% 阻隔能量。',
     },
     {
       type: 'paragraph',
-      html: '然而，长远来看，没有任何屏蔽笼是完美的。炉门密封条、磁性搭扣和金属磨损都可能导致少量能量逸出。虽然这些水平通常远低于人体安全限值，但对于 WiFi 网卡来说却是<strong>巨大</strong>的干扰，会导致延迟、丢包以及我们工具测量的特征性“抖动”。',
+      html: '然而，长远来看，没有任何屏蔽笼是完美的。炉门密封条、磁性搭扣和金属磨损都可能导致少量能量逸出。虽然这些水平通常远低于人体安全限值，但对于 WiFi 网卡来说却是<strong>巨大</strong>的干扰，会导致延迟、丢包以及我们工具测量的特征性"抖动"。',
     },
     {
       type: 'title',
@@ -116,7 +116,7 @@ export const content: ToolLocaleContent = {
       type: 'list',
       items: [
         '<strong>步骤 1 - 手机：</strong> 将手机放入微波炉内（<strong>切记严禁开启微波炉！</strong> 只需关上炉门即可）。',
-        '<strong>步骤 2 - 拨打：</strong> 尝试从另一台设备拨打该手机。如果手机响了，说明法拉第笼有缺陷或未针对蜂窝频率进行优化。如果提示“不在服务区”，则说明屏蔽工作正常。',
+        '<strong>步骤 2 - 拨打：</strong> 尝试从另一台设备拨打该手机。如果手机响了，说明法拉第笼有缺陷或未针对蜂窝频率进行优化。如果提示"不在服务区"，则说明屏蔽工作正常。',
       ],
     },
     {
@@ -127,9 +127,9 @@ export const content: ToolLocaleContent = {
     {
       type: 'list',
       items: [
-        '<strong>“微波会改变水分子的结构”</strong> - 错误。微波辐射是 <em>非电离辐射</em>。它没有足够的能量来打破化学键或改变 DNA。它只是使水分子振动，从而增加其动能（温度）。',
-        '<strong>“辐射会累积在食物中”</strong> - 错误。微波就像光：一旦关掉开关，它们就消失了。加热后的食物不会发出微波辐射，只会像营火或平底锅一样发出红外辐射（热量）。',
-        '<strong>“盯着转盘看会损伤眼睛”</strong> - 部分属实。炉门玻璃设计有金属网，可以阻隔 2.45GHz 波长的辐射。然而，如果金属网损坏，玻璃将无法阻挡微波。眼睛的晶状体对热量非常敏感且血液循环较差，因此长时间直接暴露（在泄漏点附近）可能会导致热致白内障。',
+        '<strong>"微波会改变水分子的结构"</strong> - 错误。微波辐射是 <em>非电离辐射</em>。它没有足够的能量来打破化学键或改变 DNA。它只是使水分子振动，从而增加其动能（温度）。',
+        '<strong>"辐射会累积在食物中"</strong> - 错误。微波就像光：一旦关掉开关，它们就消失了。加热后的食物不会发出微波辐射，只会像营火或平底锅一样发出红外辐射（热量）。',
+        '<strong>"盯着转盘看会损伤眼睛"</strong> - 部分属实。炉门玻璃设计有金属网，可以阻隔 2.45GHz 波长的辐射。然而，如果金属网损坏，玻璃将无法阻挡微波。眼睛的晶状体对热量非常敏感且血液循环较差，因此长时间直接暴露（在泄漏点附近）可能会导致热致白内障。',
       ],
     },
     {
@@ -139,7 +139,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: '我们的工具并不直接测量辐射（智能手机没有相关传感器），但它测量辐射的<strong>主要症状</strong>。当 2.45GHz 的辐射分子从微波炉逃逸时，它会与您设备的 WiFi 信号“碰撞”。这会导致：',
+      html: '我们的工具并不直接测量辐射（智能手机没有相关传感器），但它测量辐射的<strong>主要症状</strong>。当 2.45GHz 的辐射分子从微波炉逃逸时，它会与您设备的 WiFi 信号"碰撞"。这会导致：',
     },
     {
       type: 'list',
@@ -147,7 +147,7 @@ export const content: ToolLocaleContent = {
         '<strong>数据包重传：</strong> 路由器检测到消息到达时已损坏，必须重新发送，从而增加了延迟。',
         '<strong>抖动变化：</strong> 这是衡量响应时间不稳定性的指标。高抖动是存在大规模外部干扰的明确信号。',
         '<strong>性能下降：</strong> 由于射频频谱饱和，传输速度骤降。',
-        '<strong>背景噪声：</strong> 微波炉注入的噪声提高了“噪声底限”，使设备难以区分真实数据和电磁混乱。',
+        '<strong>背景噪声：</strong> 微波炉注入的噪声提高了"噪声底限"，使设备难以区分真实数据和电磁混乱。',
       ],
     },
   ],

package/src/tool/microwave-detector/index.ts

@@ -1,4 +1,5 @@
 import { microwaveDetector } from './entry';
+import type { ToolDefinition } from '../../types';
 export * from './entry';
 export const MICROWAVE_DETECTOR_TOOL: ToolDefinition = {
   entry: microwaveDetector,

package/src/tool/microwave-detector/logic/MicrowaveEngine.ts

@@ -81,7 +81,11 @@ export class MicrowaveEngine {
         if (this.lastPings.length < 2) return 0;
         let diffSum = 0;
         for (let i = 1; i < this.lastPings.length; i++) {
-            diffSum += Math.abs(this.lastPings[i] - this.lastPings[i - 1]);
+            const current = this.lastPings[i];
+            const prev = this.lastPings[i - 1];
+            if (current !== undefined && prev !== undefined) {
+                diffSum += Math.abs(current - prev);
+            }
         }
         return diffSum / (this.lastPings.length - 1);
     }

package/src/tool/simulation-probability/bibliography.astro

@@ -1,5 +1,5 @@
 ---
-import { Bibliography } from '@jjlmoya/utils-shared';
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
 import { simulationProbability } from './index';
 import type { KnownLocale } from '../../types';
 
@@ -11,4 +11,4 @@ const { locale = 'es' } = Astro.props;
 const content = await simulationProbability.i18n[locale]?.();
 ---
 
-{content && <Bibliography links={content.bibliography} />}
+{content && <SharedBibliography links={content.bibliography} />}

package/src/tool/simulation-probability/i18n/fr.ts

@@ -1,6 +1,6 @@
 const description = 'Analysez si notre réalité est une simulation en utilisant l\'argument du trilemme de Nick Bostrom. Calculez la probabilité existentielle avec 4 paramètres clés.';
 const slug = 'calculateur-probabilite-simulation';
-const title = 'Calculateur de Probabilité de Simulation : Vivez vous dans un univers virtuel ?';
+const title = 'Calculateur de Probabilité de Simulation: Vivez vous dans un univers virtuel ?';
 const howTo = [
     {
       name: 'Ajuster le progrès technologique',
@@ -12,7 +12,7 @@ const howTo = [
     },
     {
       name: 'Évaluer l\'intérêt pour la simulation',
-      text: 'Si l\'humanité atteignait le niveau post-humain, voudrait-elle créer des simulations de son passé ? Considérez les motivations : recherche scientifique, divertissement, préservation historique.',
+      text: 'Si l\'humanité atteignait le niveau post-humain, voudrait-elle créer des simulations de son passé ? Considérez les motivations: recherche scientifique, divertissement, préservation historique.',
     },
     {
       name: 'Interpréter le résultat',
@@ -64,9 +64,9 @@ export const content: ToolLocaleContent = {
     nSub: 'Échelle de Simulation',
     probabilityTitle: 'Probabilité de Simulation',
     trilemmaResult: 'Verdict du Trilemme',
-    scenario1: 'Scénario 1 : Extinction',
-    scenario2: 'Scénario 2 : Désintérêt',
-    scenario3: 'Scénario 3 : Nous sommes simulés',
+    scenario1: 'Scénario 1: Extinction',
+    scenario2: 'Scénario 2: Désintérêt',
+    scenario3: 'Scénario 3: Nous sommes simulés',
     fpDescription: 'Probabilité que l\'humanité atteigne la capacité technique de simuler des univers avec conscience.',
     flDescription: 'Probabilité d\'éviter l\'effondrement (extinction, guerre) avant d\'atteindre le niveau post-humain.',
     fiDescription: 'Pourcentage de civilisations avancées qui décident de créer des simulations de leurs ancêtres.',

package/src/tool/simulation-probability/i18n/ru.ts

@@ -4,7 +4,7 @@ const title = 'Калькулятор вероятности симуляции:
 const howTo = [
     {
       name: 'Настройте технологический прогресс',
-      text: 'Оцените вероятность того, что человечество достигнет постчеловеческого уровня. 50% — нейтрально; увеличивайте, если верите, что ИИ и вычисления продолжат расти экспоненциально.',
+      text: 'Оцените вероятность того, что человечество достигнет постчеловеческого уровня. 50% - нейтрально; увеличивайте, если верите, что ИИ и вычисления продолжат расти экспоненциально.',
     },
     {
       name: 'Установите выживаемость',
@@ -29,16 +29,16 @@ const faq = [
       answer: 'Нет. Высокие вероятности говорят о том, что это серьезная возможность, которую следует учитывать, но это не доказательство. Аргумент основан на предположениях о будущем технологий, которые могут и не реализоваться.',
     },
     {
-      question: 'Как бы на нас повлияло знание того, что мы — симуляция?',
+      question: 'Как бы на нас повлияло знание того, что мы - симуляция?',
       answer: 'Философски многие утверждают, что это ничего не меняет по существу. Если вы и ваши близкие симулируетесь вместе, ваши переживания, эмоции и отношения остаются реальными и ощущаемыми. Важен прожитый опыт, а не субстрат.',
     },
     {
       question: 'Есть ли научные доказательства того, что мы в симуляции?',
-      answer: 'Убедительных доказательств нет. Некоторые физики указывают на аномалии в квантовой механике (квантование, запутанность) как на возможные «вычислительные оптимизации», но это лишь спекулятивные интерпретации.',
+      answer: 'Убедительных доказательств нет. Некоторые физики указывают на аномалии в квантовой механике (квантование, запутанность) как на возможные "вычислительные оптимизации", но это лишь спекулятивные интерпретации.',
     },
     {
-      question: 'Какое значение мне следует присвоить «N» (масштабу симуляции)?',
-      answer: 'Это зависит от ваших убеждений о будущем вычислительной техники. Низкие значения (100–1000) предполагают ограниченность ресурсов. Высокие значения (миллионы) предполагают практически неограниченную вычислительную мощность. В большинстве научных дискуссий используются значения от 1000 до 1 триллиона.',
+      question: 'Какое значение мне следует присвоить "N" (масштабу симуляции)?',
+      answer: 'Это зависит от ваших убеждений о будущем вычислительной техники. Низкие значения (100-1000) предполагают ограниченность ресурсов. Высокие значения (миллионы) предполагают практически неограниченную вычислительную мощность. В большинстве научных дискуссий используются значения от 1000 до 1 триллиона.',
     },
   ];
 import { bibliography } from '../bibliography';
@@ -81,7 +81,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: 'Идея о том, что наша реальность может быть искусственной конструкцией, чрезвычайно продвинутой компьютерной симуляцией, прошла путь от научной фантастики до серьезных философских и научных дебатов. В 2003 году философ Ник Бостром из Оксфордского университета опубликовал статью под названием <em>«Живете ли вы в компьютерной симуляции?»</em>, где предложил аргумент трилеммы, бросающий вызов нашему восприятию бытия.',
+      html: 'Идея о том, что наша реальность может быть искусственной конструкцией, чрезвычайно продвинутой компьютерной симуляцией, прошла путь от научной фантастики до серьезных философских и научных дебатов. В 2003 году философ Ник Бостром из Оксфордского университета опубликовал статью под названием <em>"Живете ли вы в компьютерной симуляции?"</em>, где предложил аргумент трилеммы, бросающий вызов нашему восприятию бытия.',
     },
     {
       type: 'paragraph',
@@ -139,7 +139,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: 'От квантовой физики до космологии некоторые ученые ищут «глюки» или пределы в разрешении нашей реальности. Если у вселенной есть минимальная длина (Планковская длина) или поведение, похожее на оптимизацию кода (например, квантовая запутанность), гипотеза находит сторонников в области цифровой физики.',
+      html: 'От квантовой физики до космологии некоторые ученые ищут "глюки" или пределы в разрешении нашей реальности. Если у вселенной есть минимальная длина (Планковская длина) или поведение, похожее на оптимизацию кода (например, квантовая запутанность), гипотеза находит сторонников в области цифровой физики.',
     },
     {
       type: 'title',

package/src/tool/simulation-probability/i18n/zh.ts

@@ -20,10 +20,10 @@ const faq = [
   },
   {
     question: '是否有科学证据表明我们处于模拟中？',
-    answer: '目前还没有结论性的证据。一些物理学家将量子力学中的异常现象（如量子化、纠缠）视为可能的“计算优化”，但这些都是推测性的解释。',
+    answer: '目前还没有结论性的证据。一些物理学家将量子力学中的异常现象（如量子化、纠缠）视为可能的"计算优化"，但这些都是推测性的解释。',
   },
   {
-    question: '我应该给“N”（模拟规模）赋予什么值？',
+    question: '我应该给"N"（模拟规模）赋予什么值？',
     answer: '这取决于您对计算机未来的信念。低值（100-1000）假设资源有限。高值（数百万）假设拥有几乎无限的计算能力。大多数科学讨论使用介于 1000 到 1 万亿之间的值。',
   },
 ];
@@ -84,7 +84,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: '我们的现实可能是一个人造结构，一个极其先进的计算机模拟，这个想法已经从科幻小说变成了严肃的哲学和科学辩论。2003 年，牛津大学哲学家尼克·波斯特罗姆发表了一篇题为 <em>"你是否生活在计算机模拟中？"</em> 的文章，他在文中提出了一个挑战我们存在认知的“三解困境”论证。',
+      html: '我们的现实可能是一个人造结构，一个极其先进的计算机模拟，这个想法已经从科幻小说变成了严肃的哲学和科学辩论。2003 年，牛津大学哲学家尼克·波斯特罗姆发表了一篇题为 <em>"你是否生活在计算机模拟中？"</em> 的文章，他在文中提出了一个挑战我们存在认知的"三解困境"论证。',
     },
     {
       type: 'paragraph',
@@ -141,7 +141,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: '从量子物理学到宇宙学，一些科学家正在寻找现实分辨率中的“缺陷”或限制。如果宇宙具有最小长度（普朗克长度）或看起来像代码优化（如量子纠缠）的行为，那么该假设在数字物理学领域就会获得支持者。',
+      html: '从量子物理学到宇宙学，一些科学家正在寻找现实分辨率中的"缺陷"或限制。如果宇宙具有最小长度（普朗克长度）或看起来像代码优化（如量子纠缠）的行为，那么该假设在数字物理学领域就会获得支持者。',
     },
     {
       type: 'title',

package/src/tool/simulation-probability/index.ts

@@ -1,4 +1,5 @@
 import { simulationProbability } from './entry';
+import type { ToolDefinition } from '../../types';
 export * from './entry';
 export const SIMULATION_PROBABILITY_TOOL: ToolDefinition = {
   entry: simulationProbability,

package/src/tool/temperature-timeline/bibliography.astro

@@ -0,0 +1,14 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { temperatureTimeline } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'en' } = Astro.props;
+const content = await temperatureTimeline.i18n[locale]?.();
+---
+
+{content && <SharedBibliography links={content.bibliography} />}

package/src/tool/temperature-timeline/bibliography.ts

@@ -0,0 +1,12 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'Global temperatures in the Cenozoic - Nature Geoscience',
+    url: 'https://www.nature.com/nature-index/topics/l4/paleoceanographic-dynamics-of-cenozoic-climate-systems',
+  },
+  {
+    name: 'Phanerozoic climate history and temperature trends - Science',
+    url: 'https://www.science.org/doi/10.1126/science.adk3705',
+  },
+];

package/src/tool/temperature-timeline/component.astro

@@ -0,0 +1,289 @@
+---
+import './planet-temperature-timeline.css';
+
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="timeline-root" id="temperature-timeline-root" data-ui={JSON.stringify(ui)}>
+  <div class="timeline-canvas-container" id="timeline-canvas-area">
+    <canvas id="timeline-thermal-canvas"></canvas>
+  </div>
+
+  <div class="timeline-ruler-container" id="timeline-ruler">
+    <div class="timeline-ruler-track"></div>
+    <div class="timeline-ruler-notch" data-index="5">
+      <span class="timeline-notch-label">ANT</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+    <div class="timeline-ruler-notch" data-index="4">
+      <span class="timeline-notch-label">CEN</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+    <div class="timeline-ruler-notch" data-index="3">
+      <span class="timeline-notch-label">MES</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+    <div class="timeline-ruler-notch" data-index="2">
+      <span class="timeline-notch-label">PAL</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+    <div class="timeline-ruler-notch" data-index="1">
+      <span class="timeline-notch-label">PRO</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+    <div class="timeline-ruler-notch" data-index="0">
+      <span class="timeline-notch-label">ARC</span>
+      <div class="timeline-notch-line"></div>
+    </div>
+  </div>
+
+  <div class="timeline-info-panel">
+    <div class="timeline-meta-header">
+      <span id="timeline-era-age" class="timeline-age">---</span>
+      <h3 id="timeline-era-title" class="timeline-era-name">---</h3>
+    </div>
+
+    <div class="timeline-temp">
+      <span id="timeline-era-temp-val">---</span><span class="timeline-temp-unit">°C</span>
+    </div>
+  </div>
+</div>
+
+<script>
+  import { TemperatureTimelineEngine } from './logic/TemperatureTimelineEngine';
+
+  const root = document.getElementById('temperature-timeline-root');
+  if (root) {
+    const ageEl = document.getElementById('timeline-era-age');
+    const titleEl = document.getElementById('timeline-era-title');
+    const tempValEl = document.getElementById('timeline-era-temp-val');
+    const canvas = document.getElementById('timeline-thermal-canvas') as HTMLCanvasElement;
+    const canvasArea = document.getElementById('timeline-canvas-area');
+    const notches = document.querySelectorAll('.timeline-ruler-notch');
+
+    const uiData = JSON.parse(root.getAttribute('data-ui') || '{}');
+    const engine = new TemperatureTimelineEngine();
+    const epochs = engine.getEpochs().map(epoch => ({
+      ...epoch,
+      name: uiData[`epoch_${epoch.id}_name`] || epoch.name,
+      ageRange: uiData[`epoch_${epoch.id}_age`] || epoch.ageRange,
+      description: uiData[`epoch_${epoch.id}_desc`] || epoch.description,
+    }));
+
+    let currentEraIndex = 4;
+    let targetRadius = 130;
+    let currentRadius = 130;
+    let targetSpeed = 0.015;
+    let currentSpeed = 0.015;
+    const targetColor = { r: 56, g: 189, b: 248 };
+    const currentColor = { r: 56, g: 189, b: 248 };
+    let isCold = false;
+
+    function getThemeConfig(temp: number, isDark: boolean) {
+      if (temp >= 25) {
+        return { color: { r: 234, g: 88, b: 12 }, radius: 160, speed: 0.04, cold: false };
+      } else if (temp >= 20) {
+        return { color: { r: 249, g: 115, b: 22 }, radius: 140, speed: 0.03, cold: false };
+      } else if (temp >= 15) {
+        return { color: { r: 217, g: 119, b: 6 }, radius: 130, speed: 0.02, cold: false };
+      } else if (temp >= 13) {
+        return { color: isDark ? { r: 56, g: 189, b: 248 } : { r: 2, g: 132, b: 199 }, radius: 110, speed: 0.01, cold: true };
+      }
+      return { color: isDark ? { r: 224, g: 242, b: 254 } : { r: 15, g: 23, b: 42 }, radius: 90, speed: 0.005, cold: true };
+    }
+
+    function updateNotchStates(index: number, color: { r: number; g: number; b: number }) {
+      notches.forEach(n => {
+        const notchIdx = parseInt(n.getAttribute('data-index') || '0');
+        const label = n.querySelector('.timeline-notch-label') as HTMLElement;
+        if (notchIdx === index) {
+          n.classList.add('active');
+          if (label) {
+            label.style.textShadow = `0 0 12px rgba(${color.r}, ${color.g}, ${color.b}, 0.8)`;
+          }
+        } else {
+          n.classList.remove('active');
+          if (label) {
+            label.style.textShadow = 'none';
+          }
+        }
+      });
+    }
+
+    function selectEpoch(index: number) {
+      if (index < 0) index = 0;
+      if (index >= epochs.length) index = epochs.length - 1;
+      currentEraIndex = index;
+
+      const epoch = epochs[index];
+      if (!epoch) return;
+
+      if (ageEl) ageEl.textContent = epoch.ageRange;
+      if (titleEl) titleEl.textContent = epoch.name;
+      if (tempValEl) tempValEl.textContent = epoch.avgTemp.toFixed(1);
+
+      const isDark = document.body.classList.contains('theme-dark') || document.documentElement.classList.contains('theme-dark');
+      const config = getThemeConfig(epoch.avgTemp, isDark);
+
+      targetColor.r = config.color.r;
+      targetColor.g = config.color.g;
+      targetColor.b = config.color.b;
+      targetRadius = config.radius;
+      targetSpeed = config.speed;
+      isCold = config.cold;
+
+      updateNotchStates(index, targetColor);
+    }
+
+    let isDragging = false;
+    let startY = 0;
+    let startEraIndex = 4;
+
+    function handleStart(y: number) {
+      isDragging = true;
+      startY = y;
+      startEraIndex = currentEraIndex;
+    }
+
+    function handleMove(y: number) {
+      if (!isDragging) return;
+      const dy = y - startY;
+      const height = root?.clientHeight || 600;
+      const deltaEra = -Math.round((dy / height) * epochs.length * 1.8);
+      let nextIndex = startEraIndex + deltaEra;
+      if (nextIndex < 0) nextIndex = 0;
+      if (nextIndex >= epochs.length) nextIndex = epochs.length - 1;
+      if (nextIndex !== currentEraIndex) {
+        selectEpoch(nextIndex);
+      }
+    }
+
+    canvasArea?.addEventListener('mousedown', (e: MouseEvent) => handleStart(e.clientY));
+    window.addEventListener('mousemove', (e: MouseEvent) => handleMove(e.clientY));
+    window.addEventListener('mouseup', () => { isDragging = false; });
+
+    canvasArea?.addEventListener('touchstart', (e: TouchEvent) => {
+      if (e.touches[0]) handleStart(e.touches[0].clientY);
+    });
+    window.addEventListener('touchmove', (e: TouchEvent) => {
+      if (e.touches[0]) handleMove(e.touches[0].clientY);
+    });
+    window.addEventListener('touchend', () => { isDragging = false; });
+
+    notches.forEach(notch => {
+      notch.addEventListener('click', () => {
+        const idx = parseInt(notch.getAttribute('data-index') || '0');
+        selectEpoch(idx);
+      });
+    });
+
+    const particles: { angle: number; speed: number; radiusOffset: number; size: number }[] = [];
+    for (let i = 0; i < 150; i++) {
+      particles.push({
+        angle: Math.random() * Math.PI * 2,
+        speed: 0.005 + Math.random() * 0.015,
+        radiusOffset: -40 + Math.random() * 80,
+        size: 1.5 + Math.random() * 2.5
+      });
+    }
+
+    let phase = 0;
+
+    function renderParticles(ctx: CanvasRenderingContext2D, cx: number, cy: number, colorString: string) {
+      particles.forEach(p => {
+        p.angle += p.speed * (currentSpeed * 50 + 0.5);
+        
+        let warp = 0;
+        if (!isCold) {
+          warp = Math.sin(p.angle * 6 + phase) * 15;
+        }
+
+        const rad = currentRadius + p.radiusOffset + warp;
+        const px = cx + Math.cos(p.angle) * rad;
+        const py = cy + Math.sin(p.angle) * rad * 0.7;
+
+        ctx.beginPath();
+        ctx.fillStyle = colorString + `, ${0.15 + (1 - Math.abs(p.radiusOffset) / 80) * 0.65})`;
+        ctx.arc(px, py, p.size, 0, Math.PI * 2);
+        ctx.fill();
+      });
+    }
+
+    function renderAtmosphereCircles(ctx: CanvasRenderingContext2D, cx: number, cy: number, colorString: string) {
+      if (isCold) {
+        ctx.strokeStyle = colorString + ', 0.45)';
+        ctx.lineWidth = 1.5;
+        for (let i = 1; i < 4; i++) {
+          ctx.beginPath();
+          ctx.arc(cx, cy, currentRadius * (i / 4), 0, Math.PI * 2);
+          ctx.stroke();
+        }
+      } else {
+        ctx.strokeStyle = colorString + ', 0.25)';
+        ctx.lineWidth = 1;
+        ctx.beginPath();
+        ctx.arc(cx, cy, currentRadius + 30, 0, Math.PI * 2);
+        ctx.stroke();
+      }
+    }
+
+    function updateCurrentColor() {
+      currentColor.r += (targetColor.r - currentColor.r) * 0.08;
+      currentColor.g += (targetColor.g - currentColor.g) * 0.08;
+      currentColor.b += (targetColor.b - currentColor.b) * 0.08;
+    }
+
+    function animate() {
+      if (!canvas) return;
+      const ctx = canvas.getContext('2d');
+      if (!ctx) return;
+
+      const dpr = window.devicePixelRatio || 1;
+      canvas.width = canvas.clientWidth * dpr;
+      canvas.height = canvas.clientHeight * dpr;
+      ctx.scale(dpr, dpr);
+
+      const w = canvas.width / dpr;
+      const h = canvas.height / dpr;
+
+      ctx.clearRect(0, 0, w, h);
+
+      currentRadius += (targetRadius - currentRadius) * 0.08;
+      currentSpeed += (targetSpeed - currentSpeed) * 0.08;
+      updateCurrentColor();
+
+      phase += currentSpeed;
+
+      const cx = w / 2;
+      const cy = h / 2;
+
+      const colorString = `rgba(${Math.floor(currentColor.r)}, ${Math.floor(currentColor.g)}, ${Math.floor(currentColor.b)}`;
+
+      if (root) {
+        root.style.boxShadow = `0 20px 40px rgba(${currentColor.r}, ${currentColor.g}, ${currentColor.b}, 0.06)`;
+      }
+
+      renderParticles(ctx, cx, cy, colorString);
+      renderAtmosphereCircles(ctx, cx, cy, colorString);
+
+      ctx.beginPath();
+      ctx.strokeStyle = colorString + ', 0.8)';
+      ctx.lineWidth = 2.5;
+      ctx.arc(cx, cy, currentRadius, 0, Math.PI * 2);
+      ctx.stroke();
+
+      requestAnimationFrame(animate);
+    }
+
+    selectEpoch(4);
+    animate();
+
+    window.addEventListener('resize', () => {
+      selectEpoch(currentEraIndex);
+    });
+  }
+</script>

package/src/tool/temperature-timeline/entry.ts

@@ -0,0 +1,26 @@
+import type { ScienceToolEntry } from '../../types';
+
+export const temperatureTimeline: ScienceToolEntry = {
+  id: 'planet-temperature-timeline',
+  icons: {
+    bg: 'mdi:weather-sunny',
+    fg: 'mdi:clock-outline',
+  },
+  i18n: {
+    es: () => import('./i18n/es').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    de: () => import('./i18n/de').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
+  },
+};