@jjlmoya/utils-chrono 1.10.0 → 1.16.0

package/src/tool/gmt-world-timer/i18n/sv.ts

@@ -0,0 +1,72 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { GMTWorldTimerUI } from '../entry';
+import { bibliography } from '../bibliography';
+import { buildSchemas } from '../helpers';
+
+const faq = [
+  {
+    question: 'Hur vet jag om en klocka är en äkta GMT eller en caller GMT?',
+    answer: 'En <strong>äkta GMT</strong> (även kallad "flyer"-GMT) låter dig hoppa den lokala timvisaren oberoende — idealisk för resenärer som ofta byter tidszon. En <strong>caller GMT</strong> justerar GMT-visaren separat medan huvudtimvisaren är stilla, vilket är billigare att tillverka. Så här skiljer du dem åt: dra ut kronan till tidsinställningsläget och vrid. Om timvisaren hoppar i steg om en timme utan att stanna är det en äkta GMT. Om GMT-visaren rör sig istället är det en caller. Rolex använder ett äkta GMT-kaliber (3285) i GMT-Master II, medan många prisvärda mikromärken använder caller-verk som Seiko NH34.',
+  },
+  {
+    question: 'Vad är skillnaden mellan en GMT-klocka och en World Timer?',
+    answer: 'En <strong>GMT-klocka</strong> håller vanligtvis koll på två tidszoner — din lokala tid och en referens (oftast UTC) — med hjälp av en 24-timmarsvisare och en 24-timmarsring. En <strong>World Timer</strong> visar alla 24 tidszoner på en gång: den har en stadsring runt urtavlan och en roterande 24-timmarsskiva. World Timers som Patek Philippe 5230P eller JLC Geophysic Universal Time låter dig läsa av tiden i vilken stad som helst direkt. GMT-klockor är enklare och mer prisvärda; World Timers är mekaniskt mer komplexa och vanligtvis dyrare. Det här verktyget fungerar som en digital World Timer och låter dig lägga till så många städer du behöver.',
+  },
+  {
+    question: 'Vilken tidszon visar min klocka när det står "GMT"?',
+    answer: 'När en klocka har "GMT" på urtavlan pekar <strong>GMT-visaren</strong> (vanligtvis en fjärde visare med en färgad pilspets) på tiden i 24-timmarsformat. De flesta ägare ställer in denna visare på UTC (koordinerad universell tid) eftersom alla tidszoner definieras som avvikelser från UTC. Den roterande 24-timmarsringen kan sedan justeras för att läsa av vilken annan tidszon som helst. Om GMT-visaren till exempel pekar på 14 (kl 14) och dina ringmarkeringar är inställda på UTC+2, läser du av östeuropeisk tid. Det här verktyget hjälper dig att visualisera precis det förhållandet.',
+  },
+];
+
+const howTo = [
+  {
+    name: 'Lägg till valfri stad på din instrumentpanel',
+    text: 'Skriv ett stadsnamn eller en tidszon i sökfältet. Klicka på ett resultat för att lägga till det direkt. Varje stad visas som ett liveklockkort med aktuell lokal tid.',
+  },
+  {
+    name: 'Ta bort städer när du inte behöver dem',
+    text: 'Hovra över ett klockkort och klicka på ×-knappen för att ta bort det. Ditt urval sparas automatiskt i din webbläsare — stäng och kom tillbaka senare, din instrumentpanel är precis som du lämnade den.',
+  },
+  {
+    name: 'Använd den som GMT-referens för din klockkollektion',
+    text: 'Ange din hemstad och lägg till de tidszoner du följer med dina GMT-klockor. Använd live-offset-etiketterna för att kontrollera om din ringinställning är korrekt för varje zon.',
+  },
+];
+
+const title = 'Världsklocka: Live Dashboard med Flera Tidszoner';
+
+export const content: ToolLocaleContent<GMTWorldTimerUI> = {
+  slug: 'gmt-varldsklocka',
+  title,
+  description: 'Följ flera tidszoner live. Lägg till valfri stad och se den aktuella tiden uppdateras varje sekund. Perfekt för klockentusiaster med GMT- eller World Timer-klockor.',
+  ui: {
+    title: 'Världsklocka',
+    searchPlaceholder: 'Sök stad eller tidszon...',
+    addLabel: 'Lägg till',
+    removeLabel: 'Ta bort',
+    noResults: 'Inga städer hittades',
+    yourZones: 'Dina tidszoner',
+  },
+  seo: [
+    { type: 'title', text: 'Världsklocka — Live Dashboard för Tidszoner för Klockentusiaster', level: 2 },
+    { type: 'paragraph', html: 'Oavsett om du äger en <strong>GMT-Master II</strong>, en <strong>World Timer</strong>, eller helt enkelt behöver hålla koll på flera tidszoner för arbete eller resor, visar denna live-instrumentpanel den aktuella tiden i varje stad du bryr dig om — allt på en gång. Lägg till New York, London, Tokyo eller vilken stad som helst, och tiden uppdateras varje sekund. Dina zoner sparas i webbläsaren så att du aldrig behöver konfigurera om.' },
+    { type: 'title', text: 'Varför klockentusiaster behöver en världsklocka', level: 3 },
+    { type: 'paragraph', html: 'Om du samlar på <strong>GMT-klockor</strong> känner du till problemet: du ställer in ringen för att följa en andra tidszon, men offset ändras med sommartid, eller så har du flera GMT och vill jämföra hur var och en följer en annan stad. Det här verktyget löser det. Lägg till de städer dina klockor följer och se omedelbart deras aktuella offset och tid. Ingen huvudräkning — titta bara på kortet och vet exakt var din GMT-visare ska peka.' },
+    { type: 'title', text: 'GMT vs World Timer — Vilken passar din stil?', level: 3 },
+    { type: 'paragraph', html: 'En <strong>GMT-klocka</strong> (som Rolex GMT-Master II "Pepsi" eller Tudor Black Bay Pro) använder en 24-timmarsvisare och en roterande ring för att följa två tidszoner. En <strong>World Timer</strong> (som Nomos Zürich Weltzeit eller Omega Seamaster Worldtimer) visar alla 24 zoner samtidigt med en stadsring och en 24-timmarsskiva. Denna instrumentpanel fungerar som en World Timer: du kan se alla städer samtidigt. Använd den för att bestämma vilken komplikation som passar din livsstil innan du köper.' },
+    { type: 'title', text: 'Praktisk användning utöver klockinsamling', level: 3 },
+    {
+      type: 'list', items: [
+        'Distansarbetare som schemalägger möten över tidszoner utan förvirring',
+        'Frekventa resenärer som håller koll på hemmet och destinationen samtidigt',
+        'Traders som följer marknadsöppningar i New York, London, Tokyo och Sydney',
+        'Alla som vill veta "vad är klockan i..." utan att googla',
+      ]
+    },
+    { type: 'diagnostic', variant: 'info', title: 'Live Världsklocka', icon: 'mdi:clock-time-eight', badge: 'TID', html: 'Tiderna uppdateras live varje sekund med hjälp av webbläsarens inbyggda tidszondatabas. Sommartidsövergångar hanteras automatiskt. Inga data skickas till någon server.' },
+  ],
+  faq,
+  bibliography,
+  howTo,
+  schemas: buildSchemas(title, faq, howTo),
+};

package/src/tool/gmt-world-timer/i18n/tr.ts

@@ -0,0 +1,72 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { GMTWorldTimerUI } from '../entry';
+import { bibliography } from '../bibliography';
+import { buildSchemas } from '../helpers';
+
+const faq = [
+  {
+    question: 'Bir saatin gerçek GMT mi yoksa caller GMT mi olduğunu nasıl anlarım?',
+    answer: '<strong>Gerçek GMT</strong> ("flyer" GMT olarak da bilinir) yerel saat akrebinin bağımsız olarak ayarlanmasına olanak tanır — sık sık saat dilimi değiştiren gezginler için idealdir. <strong>Caller GMT</strong>, ana akrep sabit kalırken GMT kolunun ayrı olarak ayarlandığı, üretimi daha ucuz olan bir mekanizmadır. Ayırt etmek için: kurma kolunu saat ayar konumuna çekin ve çevirin. Akrep bir saatlik artışlarla durmadan atlıyorsa gerçek GMT\'dir. GMT kolu hareket ediyorsa caller\'dır. Rolex, GMT-Master II\'de gerçek GMT kalibresi (3285) kullanırken, birçok uygun fiyatlı mikromarka Seiko NH34 gibi caller mekanizmaları tercih eder.',
+  },
+  {
+    question: 'GMT saat ile World Timer arasındaki fark nedir?',
+    answer: 'Bir <strong>GMT saati</strong> genellikle iki saat dilimini takip eder — yerel saatiniz ve bir referans (genellikle UTC) — 24 saat kolu ve 24 saat bezeli kullanarak. Bir <strong>World Timer</strong> ise 24 saat dilimini aynı anda gösterir: kadranın etrafında bir şehir halkası ve dönen bir 24 saat diski bulunur. Patek Philippe 5230P veya JLC Geophysic Universal Time gibi World Timer\'lar, herhangi bir şehirdeki saati anında okumanızı sağlar. GMT\'ler daha basit ve daha uygun fiyatlıdır; World Timer\'lar mekanik olarak daha karmaşık ve genellikle daha pahalıdır. Bu araç, ihtiyacınız kadar şehir eklemenize izin veren dijital bir World Timer gibi çalışır.',
+  },
+  {
+    question: 'Kadranında "GMT" yazan bir saat hangi saat dilimini gösterir?',
+    answer: 'Bir saatin kadranında "GMT" yazdığında, <strong>GMT kolu</strong> (genellikle renkli bir ok ucuna sahip dördüncü kol) saati 24 saat formatında gösterir. Çoğu kullanıcı bu kolu UTC\'ye (Eşgüdümlü Evrensel Zaman) ayarlar çünkü tüm saat dilimleri UTC\'den fark olarak tanımlanır. Dönen 24 saat bezeli daha sonra herhangi bir başka saat dilimini okuyacak şekilde hizalanabilir. Örneğin, GMT kolu 14\'ü (öğleden sonra 2) gösteriyorsa ve bezel işaretleriniz UTC+2\'ye hizalanmışsa, Doğu Avrupa Saati\'ni okuyorsunuzdur. Bu araç, tam olarak bu ilişkiyi görselleştirmenize yardımcı olur.',
+  },
+];
+
+const howTo = [
+  {
+    name: 'Panonuza istediğiniz şehri ekleyin',
+    text: 'Arama çubuğuna bir şehir adı veya saat dilimi yazın. Bir sonuca tıklayarak anında ekleyin. Her şehir, geçerli yerel saati gösteren canlı bir saat kartı olarak görünür.',
+  },
+  {
+    name: 'İhtiyacınız olmayan şehirleri kaldırın',
+    text: 'Herhangi bir saat kartının üzerine gelin ve kaldırmak için × düğmesine tıklayın. Seçiminiz tarayıcınıza otomatik olarak kaydedilir — kapatın ve daha sonra geri gelin, panonuz tam olarak bıraktığınız gibi durur.',
+  },
+  {
+    name: 'Saat koleksiyonunuz için GMT referansı olarak kullanın',
+    text: 'Ana şehrinizi ayarlayın ve GMT saatlerinizle takip ettiğiniz saat dilimlerini ekleyin. Her bir bölge için bezel hizalamanızın doğru olup olmadığını kontrol etmek için canlı fark etiketlerini kullanın.',
+  },
+];
+
+const title = 'Dünya Saati: Canlı Çoklu Saat Dilimi Panosu';
+
+export const content: ToolLocaleContent<GMTWorldTimerUI> = {
+  slug: 'gmt-dunya-saati',
+  title,
+  description: 'Birden fazla saat dilimini canlı olarak takip edin. Herhangi bir şehri ekleyin ve geçerli saatin her saniye güncellendiğini görün. GMT veya World Timer saati olan saat meraklıları için mükemmel.',
+  ui: {
+    title: 'Dünya Saati',
+    searchPlaceholder: 'Şehir veya saat dilimi ara...',
+    addLabel: 'Ekle',
+    removeLabel: 'Kaldır',
+    noResults: 'Şehir bulunamadı',
+    yourZones: 'Saat Dilimleriniz',
+  },
+  seo: [
+    { type: 'title', text: 'Dünya Saati — Saat Meraklıları için Canlı Saat Dilimi Panosu', level: 2 },
+    { type: 'paragraph', html: 'İster bir <strong>GMT-Master II</strong>\'niz, ister bir <strong>World Timer</strong>\'ınız olsun, ya da sadece iş veya seyahat için birden fazla saat dilimini takip etmeniz gereksin, bu canlı pano önemsediğiniz her şehirdeki güncel saati bir bakışta gösterir. New York, Londra, Tokyo veya herhangi bir şehri ekleyin ve saat her saniye güncellensin. Bölgeleriniz tarayıcınıza kaydedilir, böylece asla yeniden yapılandırmanız gerekmez.' },
+    { type: 'title', text: 'Saat Meraklıları Neden Bir Dünya Saatine İhtiyaç Duyar?', level: 3 },
+    { type: 'paragraph', html: 'Eğer <strong>GMT saatleri</strong> koleksiyonu yapıyorsanız, zorluğu bilirsiniz: ikinci bir saat dilimini takip etmek için bezeli ayarlarsınız, ancak farklar Yaz Saati ile değişir veya birden fazla GMT\'niz vardır ve her birinin farklı bir şehri nasıl takip ettiğini karşılaştırmak istersiniz. Bu araç bunu çözer. Saatlerinizin takip ettiği şehirleri ekleyin ve anlık farklarını ve saatlerini görün. Artık zihinsel hesaplama yok — sadece karta bakın ve GMT kolunuzun tam olarak nereyi göstermesi gerektiğini bilin.' },
+    { type: 'title', text: 'GMT vs World Timer — Hangisi Tarzınıza Uyuyor?', level: 3 },
+    { type: 'paragraph', html: '<strong>GMT saati</strong> (Rolex GMT-Master II "Pepsi" veya Tudor Black Bay Pro gibi) iki saat dilimini takip etmek için 24 saat kolu ve dönen bir bezel kullanır. <strong>World Timer</strong> (Nomos Zürich Weltzeit veya Omega Seamaster Worldtimer gibi) bir şehir halkası ve 24 saat diski kullanarak 24 bölgenin tamamını aynı anda gösterir. Bu pano bir World Timer\'ı taklit eder: tüm şehirleri aynı anda görebilirsiniz. Satın almadan önce hangi komplikasyonun yaşam tarzınıza uyduğuna karar vermek için kullanın.' },
+    { type: 'title', text: 'Saat Koleksiyonculuğunun Ötesinde Pratik Kullanımlar', level: 3 },
+    {
+      type: 'list', items: [
+        'Saat dilimleri arasında toplantı planlayan uzaktan çalışanlar',
+        'Evi ve varış noktasını aynı anda takip eden sık seyahat edenler',
+        'New York, Londra, Tokyo ve Sidney\'deki piyasa açılışlarını takip eden yatırımcılar',
+        'Google\'a sormadan "... şu anda saat kaç?" bilmek isteyen herkes',
+      ]
+    },
+    { type: 'diagnostic', variant: 'info', title: 'Canlı Dünya Saati', icon: 'mdi:clock-time-eight', badge: 'SAAT', html: 'Saatler, tarayıcınızın yerleşik saat dilimi veritabanını kullanarak her saniye canlı olarak güncellenir. Yaz Saati geçişleri otomatik olarak işlenir. Hiçbir veri herhangi bir sunucuya gönderilmez.' },
+  ],
+  faq,
+  bibliography,
+  howTo,
+  schemas: buildSchemas(title, faq, howTo),
+};

package/src/tool/gmt-world-timer/i18n/zh.ts

@@ -0,0 +1,72 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { GMTWorldTimerUI } from '../entry';
+import { bibliography } from '../bibliography';
+import { buildSchemas } from '../helpers';
+
+const faq = [
+  {
+    question: '如何判断手表是真GMT还是呼叫器GMT？',
+    answer: '<strong>真GMT</strong>（又称"飞行者"GMT）可以独立调整本地时针——适合频繁跨时区旅行的用户。<strong>呼叫器GMT</strong>则是在主时针不动的情况下单独调整GMT指针，制造成本较低。区分方法：将表冠拉出到时间设定位置并旋转。如果时针以一小时为单位跳动而不停顿，就是真GMT；如果GMT指针随之移动，就是呼叫器GMT。劳力士在GMT-Master II中使用真GMT机芯（3285），而许多平价微品牌则采用精工NH34等呼叫器GMT机芯。',
+  },
+  {
+    question: 'GMT手表和世界时手表有什么区别？',
+    answer: '<strong>GMT手表</strong>通常通过24小时指针和24小时表圈来追踪两个时区——您的本地时间和一个参考时间（通常是UTC）。<strong>世界时手表</strong>则同时显示全部24个时区：表盘周围有城市圈，并有一个旋转的24小时盘。百达翡丽5230P或积家地球物理天文台世界时等世界时手表可以让您即时读取任何城市的时间。GMT更简单、更实惠；世界时机芯更复杂，价格通常更高。本工具就像一个数字版世界时手表，您可以根据需要添加任意数量的城市。',
+  },
+  {
+    question: '手表表盘上写着"GMT"时，显示的是哪个时区？',
+    answer: '当手表表盘上标有"GMT"时，<strong>GMT指针</strong>（通常是带有彩色箭头的第四根指针）以24小时制指示时间。大多数用户将此指针设置为UTC（协调世界时），因为所有时区都定义为相对于UTC的偏移量。旋转式24小时表圈可以对齐以读取任何其他时区。例如，如果GMT指针指向14（下午2点），而您的表圈标记对齐到UTC+2，那么您读出的就是东欧时间。本工具可以帮助您直观地理解这种对应关系。',
+  },
+];
+
+const howTo = [
+  {
+    name: '将任意城市添加到您的仪表盘',
+    text: '在搜索栏中输入城市名称或时区。点击搜索结果即可立即添加。每个城市都会以实时时钟卡片的形式显示当前的当地时间。',
+  },
+  {
+    name: '移除不需要的城市',
+    text: '将鼠标悬停在任意时钟卡片上，点击×按钮即可移除。您的选择会自动保存在浏览器中——关闭后再次打开，仪表盘将保持原样。',
+  },
+  {
+    name: '将其用作手表收藏的GMT参考',
+    text: '设置您的家乡城市，并添加您通过GMT手表追踪的时区。使用实时偏移标签检查每个追踪时区的表圈对齐是否正确。',
+  },
+];
+
+const title = '世界时钟：多时区实时仪表盘';
+
+export const content: ToolLocaleContent<GMTWorldTimerUI> = {
+  slug: 'gmt-world-timer',
+  title,
+  description: '实时追踪多个时区。添加任意城市，实时查看每秒更新的当前时间。适合拥有GMT或世界时手表的钟表爱好者。',
+  ui: {
+    title: '世界时钟',
+    searchPlaceholder: '搜索城市或时区...',
+    addLabel: '添加',
+    removeLabel: '移除',
+    noResults: '未找到城市',
+    yourZones: '我的时区',
+  },
+  seo: [
+    { type: 'title', text: '世界时钟 — 为钟表爱好者打造的实时时区仪表盘', level: 2 },
+    { type: 'paragraph', html: '无论您拥有<strong>GMT-Master II</strong>、<strong>世界时手表</strong>，还是仅仅需要为工作或旅行追踪多个时区，这个实时仪表盘都能让您一目了然地看到每个关注城市的当前时间。添加纽约、伦敦、东京或任意城市，时间每秒更新。您的时区保存在浏览器中，无需重复配置。' },
+    { type: 'title', text: '为什么钟表爱好者需要世界时钟', level: 3 },
+    { type: 'paragraph', html: '如果您收藏<strong>GMT手表</strong>，一定遇到过这样的困扰：您调好表圈追踪第二个时区，但夏令时导致偏移变化，或者您拥有多块GMT手表，想比较它们如何追踪不同城市。本工具可以解决这个问题。添加您手表追踪的城市，立即查看它们的当前偏移和时间。无需心算——只需看一眼卡片，就能确切知道您的GMT指针应该指向哪里。' },
+    { type: 'title', text: 'GMT与世界时 — 哪种风格适合您？', level: 3 },
+    { type: 'paragraph', html: '<strong>GMT手表</strong>（如劳力士GMT-Master II"百事圈"或帝舵Black Bay Pro）使用24小时指针和旋转表圈来追踪两个时区。<strong>世界时手表</strong>（如诺莫斯苏黎世世界时或欧米茄海马世界时）通过城市圈和24小时盘同时显示所有24个时区。本仪表盘模拟了世界时手表：您可以同时查看所有城市。在购买之前，用它来帮助您决定哪种复杂功能更适合您的生活方式。' },
+    { type: 'title', text: '超越手表收藏的实用功能', level: 3 },
+    {
+      type: 'list', items: [
+        '远程工作者跨时区安排会议，不再混淆',
+        '频繁旅行者同时关注家乡和目的地的时间',
+        '交易者追踪纽约、伦敦、东京和悉尼的市场开盘时间',
+        '任何人想快速知道"...现在几点？"而无需搜索',
+      ]
+    },
+    { type: 'diagnostic', variant: 'info', title: '实时世界时钟', icon: 'mdi:clock-time-eight', badge: '时间', html: '时间使用浏览器内置的时区数据库每秒实时更新。夏令时转换自动处理。不会向任何服务器发送任何数据。' },
+  ],
+  faq,
+  bibliography,
+  howTo,
+  schemas: buildSchemas(title, faq, howTo),
+};

package/src/tool/gmt-world-timer/index.ts

@@ -0,0 +1,11 @@
+import type { ToolDefinition } from '../../types';
+import { gmtWorldTimer } from './entry';
+
+export * from './entry';
+
+export const GMT_WORLD_TIMER_TOOL: ToolDefinition = {
+  entry: gmtWorldTimer,
+  Component: () => import('./component.astro'),
+  SEOComponent: () => import('./seo.astro'),
+  BibliographyComponent: () => import('./bibliography.astro'),
+};

package/src/tool/gmt-world-timer/seo.astro

@@ -0,0 +1,11 @@
+---
+import { SEORenderer } from '@jjlmoya/utils-shared';
+import { gmtWorldTimer } from './index';
+import type { KnownLocale } from '../../types';
+interface Props { locale?: KnownLocale; }
+const { locale = 'en' } = Astro.props;
+const loader = gmtWorldTimer.i18n[locale] || gmtWorldTimer.i18n.en;
+const content = await loader?.();
+if (!content) return null;
+---
+{content.seo?.length > 0 && <SEORenderer content={{ locale, sections: content.seo }} />}

package/src/tool/perpetual-calendar/bibliography.astro

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

package/src/tool/perpetual-calendar/bibliography.ts

@@ -0,0 +1,16 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'Perpetual Calendar - Wikipedia',
+    url: 'https://en.wikipedia.org/wiki/Perpetual_calendar',
+  },
+  {
+    name: 'Patek Philippe Perpetual Calendar',
+    url: 'https://www.patek.com/en/manufacture/quality-and-fine-workmanship/calendar-watches',
+  },
+  {
+    name: 'How a Perpetual Calendar Works - Hodinkee',
+    url: 'https://www.hodinkee.com/watch101/perpetual-calendar',
+  },
+];

package/src/tool/perpetual-calendar/calendar.ts

@@ -0,0 +1,24 @@
+export function isLeapYear(y: number): boolean {
+  return new Date(y, 1, 29).getDate() === 29;
+}
+
+export function daysInMonth(y: number, m: number): number {
+  return new Date(y, m + 1, 0).getDate();
+}
+
+const PHASES = ['New Moon', 'Waxing Crescent', 'First Quarter', 'Waxing Gibbous', 'Full Moon', 'Waning Gibbous', 'Last Quarter', 'Waning Crescent'];
+const PHASE_THRESHOLDS = [0.03, 0.22, 0.28, 0.47, 0.53, 0.72, 0.78, 0.97];
+
+export function moonPhase(y: number, m: number, d: number, locale = 'en'): { phase: string; illumination: number } {
+  const jd = new Date(y, m, d).getTime() / 86400000 + 2440587.5 - 2451549.5;
+  const cycle = 29.53058867;
+  const progress = (((jd % cycle) + cycle) % cycle) / cycle;
+  const ill = Math.round((progress <= 0.5 ? progress * 2 : (1 - progress) * 2) * 100);
+  const pct = new Intl.NumberFormat(locale, { style: 'percent' }).format(ill / 100);
+  let phase = '';
+  for (let i = 0; i < PHASE_THRESHOLDS.length; i++) {
+    if (progress < PHASE_THRESHOLDS[i]) { phase = PHASES[i]; break; }
+  }
+  if (!phase) phase = PHASES[PHASES.length - 1];
+  return { phase: phase + ' ' + pct, illumination: ill };
+}

package/src/tool/perpetual-calendar/client.ts

@@ -0,0 +1,98 @@
+const canvas = document.getElementById('calendar-canvas') as HTMLCanvasElement;
+const ctx = canvas.getContext('2d')!;
+
+import { setCtx, detectTheme } from './state';
+import { drawScene } from './dial';
+import { isLeapYear, daysInMonth, moonPhase } from './calendar';
+
+setCtx(ctx);
+
+const REF_W = 600;
+const REF_H = 600;
+
+let curY = new Date().getFullYear();
+let curM = new Date().getMonth();
+let curD = new Date().getDate();
+let smoothD = curD;
+let autoPlaying = false;
+
+function resizeCanvas() {
+  const parent = canvas.parentElement!;
+  const dw = parent.clientWidth;
+  const dh = dw * (REF_H / REF_W);
+  const dpr = Math.min(window.devicePixelRatio || 1, 2);
+  canvas.style.width = dw + 'px';
+  canvas.style.height = dh + 'px';
+  canvas.width = dw * dpr;
+  canvas.height = dh * dpr;
+  ctx.setTransform(dw / REF_W * dpr, 0, 0, dh / REF_H * dpr, 0, 0);
+}
+
+function updateUI() {
+  const setText = (id: string, v: string) => { const el = document.getElementById(id); if (el) el.textContent = v; };
+  const d = Math.round(smoothD);
+  const dt = new Date(curY, curM, d);
+  const loc = window.location.pathname.match(/^\/([a-z]{2})/)?.[1] || 'en';
+  setText('cal-date', d.toString());
+  setText('cal-weekday', new Intl.DateTimeFormat(loc, { weekday: 'long' }).format(dt));
+  setText('cal-month', new Intl.DateTimeFormat(loc, { month: 'long' }).format(dt));
+  setText('cal-year', curY.toString());
+  setText('cal-leap', isLeapYear(curY) ? 'Yes' : 'No');
+  const mp = moonPhase(curY, curM, d, loc);
+  setText('cal-moon', mp.phase);
+  setText('cal-weekday-header', new Intl.DateTimeFormat(loc, { weekday: 'long' }).format(dt));
+  setText('cal-date-full', new Intl.DateTimeFormat(loc, { month: 'long', day: 'numeric', year: 'numeric' }).format(dt));
+}
+
+function render() {
+  detectTheme();
+  drawScene(curY, curM, curD, smoothD);
+  updateUI();
+}
+
+function tick() {
+  if (autoPlaying) {
+    curD++;
+    if (curD > daysInMonth(curY, curM)) { curD = 1; curM++; }
+    if (curM > 11) { curM = 0; curY++; }
+    smoothD = curD;
+  }
+  render();
+  animationId = requestAnimationFrame(tick);
+}
+
+function advance(fn: () => void) {
+  if (autoPlaying) { autoPlaying = false; document.querySelector('[data-action="play"]')!.textContent = '\u25B6'; }
+  fn();
+  smoothD = curD;
+  render();
+}
+
+function initControls() {
+  document.querySelector('[data-action="day-next"]')?.addEventListener('click', () => advance(() => {
+    curD++; if (curD > daysInMonth(curY, curM)) { curD = 1; curM++; if (curM > 11) { curM = 0; curY++; } }
+  }));
+  document.querySelector('[data-action="day-prev"]')?.addEventListener('click', () => advance(() => {
+    curD--; if (curD < 1) { curM--; if (curM < 0) { curM = 11; curY--; } curD = daysInMonth(curY, curM); }
+  }));
+  document.querySelector('[data-action="month-next"]')?.addEventListener('click', () => advance(() => {
+    curD = 1; curM++; if (curM > 11) { curM = 0; curY++; }
+  }));
+  document.querySelector('[data-action="year-next"]')?.addEventListener('click', () => advance(() => {
+    const d = new Date(curY + 1, curM, curD);
+    curY = d.getFullYear(); curM = d.getMonth(); curD = d.getDate();
+  }));
+  document.querySelector('[data-action="play"]')?.addEventListener('click', (e) => {
+    autoPlaying = !autoPlaying;
+    (e.currentTarget as HTMLElement).textContent = autoPlaying ? '\u23F8' : '\u25B6';
+  });
+  document.querySelector('[data-action="reset"]')?.addEventListener('click', () => advance(() => {
+    const n = new Date();
+    curY = n.getFullYear(); curM = n.getMonth(); curD = n.getDate();
+  }));
+}
+
+new ResizeObserver(resizeCanvas).observe(canvas.parentElement!);
+resizeCanvas();
+initControls();
+tick();

package/src/tool/perpetual-calendar/component.astro

@@ -0,0 +1,17 @@
+---
+import CalendarPanel from './components/CalendarPanel.astro';
+
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<link href="./perpetual-calendar.css" rel="stylesheet" />
+
+<div class="tool-main-card" data-ui={JSON.stringify(ui)}>
+  <CalendarPanel labels={ui} />
+</div>
+
+<script src="./client.ts"></script>

package/src/tool/perpetual-calendar/components/CalendarPanel.astro

@@ -0,0 +1,49 @@
+---
+interface Props {
+  labels: Record<string, string>;
+}
+
+const { labels } = Astro.props;
+---
+
+<div class="calendar-layout">
+  <div class="dial-section">
+    <canvas id="calendar-canvas" width="600" height="600"></canvas>
+    <div class="date-overlay" id="cal-date-header">
+      <span class="date-weekday" id="cal-weekday-header">Tuesday</span>
+      <span class="date-full" id="cal-date-full">May 26, 2026</span>
+    </div>
+  </div>
+
+  <div class="sidebar">
+    <div class="sidebar-group">
+      <div class="sidebar-label">{labels.dateLabel || 'Navigate'}</div>
+      <div class="sidebar-buttons">
+        <button data-action="day-prev" title="Day -1">&#9664;D</button>
+        <button data-action="day-next" title="Day +1">D&#9654;</button>
+        <button data-action="month-next" title="Month +1">M&#9654;</button>
+        <button data-action="year-next" title="Year +1">Y&#9654;</button>
+      </div>
+    </div>
+
+    <div class="sidebar-group">
+      <div class="sidebar-label">{labels.autoPlay || 'Auto'}</div>
+      <div class="sidebar-buttons">
+        <button class="play-btn" data-action="play" title="Auto advance">&#9654;</button>
+        <button data-action="reset" title="Reset to today">&#9673;</button>
+      </div>
+    </div>
+
+    <div class="sidebar-group">
+      <div class="sidebar-label">Info</div>
+      <div class="sidebar-info" id="cal-info">
+        <div class="sidebar-row"><span class="slbl">{labels.dateLabel || 'Date'}</span><span class="sval" id="cal-date">1</span></div>
+        <div class="sidebar-row"><span class="slbl">{labels.weekdayLabel || 'Day'}</span><span class="sval" id="cal-weekday">Mon</span></div>
+        <div class="sidebar-row"><span class="slbl">{labels.monthLabel || 'Month'}</span><span class="sval" id="cal-month">Jan</span></div>
+        <div class="sidebar-row"><span class="slbl">{labels.yearLabel || 'Year'}</span><span class="sval" id="cal-year">2024</span></div>
+        <div class="sidebar-row"><span class="slbl">{labels.leapYearLabel || 'Leap'}</span><span class="sval" id="cal-leap">No</span></div>
+        <div class="sidebar-row"><span class="slbl">{labels.moonPhaseLabel || 'Moon'}</span><span class="sval" id="cal-moon">New</span></div>
+      </div>
+    </div>
+  </div>
+</div>

package/src/tool/perpetual-calendar/dial.ts

@@ -0,0 +1,176 @@
+import { getCtx, getFontFam, c, W, H, CX, CY, OUTER_R } from './state';
+
+export function drawBg() {
+  const ctx = getCtx();
+  const grad = ctx.createRadialGradient(CX, CY, 0, CX, CY, 400);
+  grad.addColorStop(0, c('#1e1e3a', '#f5f0e8'));
+  grad.addColorStop(0.5, c('#16162e', '#eae4d8'));
+  grad.addColorStop(1, c('#0c0c18', '#ddd6c8'));
+  ctx.fillStyle = grad;
+  ctx.fillRect(0, 0, W, H);
+}
+
+export function drawOuterRing() {
+  const ctx = getCtx();
+  ctx.beginPath();
+  ctx.arc(CX, CY, OUTER_R, 0, Math.PI * 2);
+  ctx.strokeStyle = c('rgba(212,175,55,0.3)', 'rgba(139,105,20,0.3)');
+  ctx.lineWidth = 2;
+  ctx.stroke();
+}
+
+export function drawDateNumbers(currentDate: number, smoothDate: number) {
+  const ctx = getCtx();
+  const r = 245;
+  const ff = getFontFam();
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  for (let i = 1; i <= 31; i++) {
+    const ang = ((i - 1) / 31) * Math.PI * 2 - Math.PI / 2;
+    const x = CX + Math.cos(ang) * r;
+    const y = CY + Math.sin(ang) * r;
+    const isActive = Math.round(smoothDate) === i;
+    ctx.font = (isActive ? 'bold 13px ' : '10px ') + ff;
+    ctx.fillStyle = isActive ? c('#ffd700', '#8b6914') : c('rgba(180,180,200,0.5)', 'rgba(80,70,50,0.5)');
+    ctx.fillText(i.toString(), x, y);
+  }
+}
+
+export function drawDateHand(smoothDate: number) {
+  const ctx = getCtx();
+  const ang = ((smoothDate - 1) / 31) * Math.PI * 2 - Math.PI / 2;
+  ctx.save();
+  ctx.translate(CX, CY);
+  ctx.rotate(ang);
+  ctx.beginPath();
+  ctx.moveTo(-4, 20);
+  ctx.lineTo(0, -200);
+  ctx.lineTo(4, 20);
+  ctx.closePath();
+  const grad = ctx.createLinearGradient(0, -200, 0, 20);
+  grad.addColorStop(0, c('#ffd700', '#b8860b'));
+  grad.addColorStop(1, c('#b8860b', '#8b6914'));
+  ctx.fillStyle = grad;
+  ctx.fill();
+  ctx.beginPath();
+  ctx.arc(0, 0, 6, 0, Math.PI * 2);
+  ctx.fillStyle = c('#d4af37', '#8b6914');
+  ctx.fill();
+  ctx.restore();
+}
+
+export function drawMonthWindow(y: number, m: number) {
+  const ctx = getCtx();
+  const ff = getFontFam();
+  const mn = new Intl.DateTimeFormat(window.location.pathname.match(/^\/([a-z]{2})/)?.[1] || 'en', { month: 'long' }).format(new Date(y, m, 1));
+  ctx.save();
+  const x = CX, yPos = CY - 140;
+  ctx.fillStyle = c('rgba(30,30,58,0.9)', 'rgba(245,240,232,0.95)');
+  ctx.beginPath();
+  ctx.roundRect(x - 75, yPos - 12, 150, 28, 6);
+  ctx.fill();
+  ctx.strokeStyle = c('rgba(212,175,55,0.4)', 'rgba(139,105,20,0.4)');
+  ctx.lineWidth = 1;
+  ctx.stroke();
+  ctx.fillStyle = c('#d4af37', '#8b6914');
+  ctx.font = '600 13px ' + ff;
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.fillText(mn, x, yPos + 2);
+  ctx.restore();
+}
+
+export function drawDaySubdial(y: number, m: number, d: number) {
+  const ctx = getCtx();
+  const ff = getFontFam();
+  const dow = new Date(y, m, d).getDay();
+  const names = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+  const sx = CX + 150, sy = CY - 20, sr = 45;
+  ctx.beginPath();
+  ctx.arc(sx, sy, sr, 0, Math.PI * 2);
+  ctx.fillStyle = c('rgba(30,30,58,0.8)', 'rgba(245,240,232,0.9)');
+  ctx.fill();
+  ctx.strokeStyle = c('rgba(212,175,55,0.3)', 'rgba(139,105,20,0.3)');
+  ctx.lineWidth = 1;
+  ctx.stroke();
+  ctx.fillStyle = c('rgba(180,180,200,0.4)', 'rgba(80,70,50,0.4)');
+  ctx.font = '7px ' + ff;
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  for (let i = 0; i < 7; i++) {
+    const a = (i / 7) * Math.PI * 2 - Math.PI / 2;
+    const nx = sx + Math.cos(a) * (sr - 10);
+    const ny = sy + Math.sin(a) * (sr - 10);
+    ctx.fillStyle = i === dow ? c('#ffd700', '#8b6914') : c('rgba(180,180,200,0.4)', 'rgba(80,70,50,0.4)');
+    ctx.font = (i === dow ? 'bold 8px ' : '7px ') + ff;
+    ctx.fillText(names[i], nx, ny);
+  }
+  ctx.fillStyle = c('#d4af37', '#8b6914');
+  ctx.font = 'bold 14px ' + ff;
+  ctx.fillText(names[dow], sx, sy + sr + 16);
+}
+
+export function drawMoonSubdial(y: number, m: number, d: number) {
+  const ctx = getCtx();
+  const mx = CX - 150, my = CY + 30, mr = 42;
+  ctx.beginPath();
+  ctx.arc(mx, my, mr, 0, Math.PI * 2);
+  ctx.fillStyle = c('rgba(30,30,58,0.8)', 'rgba(245,240,232,0.9)');
+  ctx.fill();
+  ctx.strokeStyle = c('rgba(212,175,55,0.3)', 'rgba(139,105,20,0.3)');
+  ctx.lineWidth = 1;
+  ctx.stroke();
+  const jd = new Date(y, m, d).getTime() / 86400000 + 2440587.5 - 2451549.5;
+  const progress = (((jd % 29.53058867) + 29.53058867) % 29.53058867) / 29.53058867;
+  const mr2 = mr - 8;
+  ctx.save();
+  ctx.beginPath();
+  ctx.arc(mx, my, mr2, 0, Math.PI * 2);
+  ctx.fillStyle = c('#1a1a2e', '#ddd6c8');
+  ctx.fill();
+  ctx.clip();
+  ctx.beginPath();
+  ctx.arc(mx + (progress - 0.5) * mr2 * 2, my, mr2, 0, Math.PI * 2);
+  ctx.fillStyle = c('#e8d8a0', '#c8a850');
+  ctx.fill();
+  ctx.restore();
+  ctx.beginPath();
+  ctx.arc(mx, my, mr2, 0, Math.PI * 2);
+  ctx.strokeStyle = c('rgba(212,175,55,0.2)', 'rgba(139,105,20,0.2)');
+  ctx.lineWidth = 1;
+  ctx.stroke();
+}
+
+export function drawLeapIndicator(y: number) {
+  const ctx = getCtx();
+  const ff = getFontFam();
+  const leap = new Date(y, 1, 29).getDate() === 29;
+  const lx = CX, ly = CY + 130;
+  ctx.fillStyle = c('rgba(30,30,58,0.8)', 'rgba(245,240,232,0.9)');
+  ctx.beginPath();
+  ctx.roundRect(lx - 50, ly - 10, 100, 24, 6);
+  ctx.fill();
+  ctx.strokeStyle = leap ? c('rgba(212,175,55,0.5)', 'rgba(139,105,20,0.5)') : c('rgba(60,60,90,0.3)', 'rgba(80,70,50,0.2)');
+  ctx.lineWidth = 1;
+  ctx.stroke();
+  ctx.fillStyle = leap ? c('#ffd700', '#8b6914') : c('rgba(160,160,184,0.4)', 'rgba(80,70,50,0.4)');
+  ctx.font = '600 10px ' + ff;
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.fillText(leap ? 'LEAP YEAR' : 'COMMON YEAR', lx, ly + 2);
+}
+
+export function drawScene(y: number, m: number, d: number, smoothDate: number) {
+  const ctx = getCtx();
+  ctx.save();
+  ctx.clearRect(0, 0, W, H);
+  drawBg();
+  drawOuterRing();
+  drawDateNumbers(d, smoothDate);
+  drawDateHand(smoothDate);
+  drawMonthWindow(y, m);
+  drawDaySubdial(y, m, Math.round(smoothDate));
+  drawMoonSubdial(y, m, Math.round(smoothDate));
+  drawLeapIndicator(y);
+  ctx.restore();
+}