@jjlmoya/utils-cooking 1.26.0 → 1.28.0

package/src/tool/kitchen-timer/i18n/fr.ts

@@ -7,12 +7,12 @@ const faq = [
 		{
 			question: 'Combien de minuteurs puis-je créer ?',
 			answer:
-				'Illimité. Ajoutez-en autant que nécessaire avec le bouton "+". Parfait pour cuisiner plusieurs plats simultanément : bouillir des pâtes, réduire une sauce, reposer la viande et cuire au four, tout en même temps.',
+				'Illimité. Ajoutez-en autant que nécessaire avec le bouton "+". Parfait pour cuisiner plusieurs plats simultanément: bouillir des pâtes, réduire une sauce, reposer la viande et cuire au four, tout en même temps.',
 		},
 		{
 			question: 'Pourquoi le temps de repos est-il important pour la viande ?',
 			answer:
-				'Lorsque vous coupez la viande juste après la cuisson, les jus s\'échappent sur l\'assiette. Si vous la laissez reposer 5 à 10 minutes, les fibres se détendent et les jus se redistribuent. Résultat : une viande juteuse au lieu d\'être sèche. Le repos est une cuisson passive.',
+				'Lorsque vous coupez la viande juste après la cuisson, les jus s\'échappent sur l\'assiette. Si vous la laissez reposer 5 à 10 minutes, les fibres se détendent et les jus se redistribuent. Résultat: une viande juteuse au lieu d\'être sèche. Le repos est une cuisson passive.',
 		},
 		{
 			question: 'Fonctionne-t-il avec l\'écran verrouillé ?',
@@ -32,7 +32,7 @@ const howTo = [
 		},
 		{
 			name: 'Personnaliser chaque minuteur',
-			text: 'Changez le nom de chaque minuteur pour identifier ce qui cuit : "Four", "Riz", "Sauce", etc.',
+			text: 'Changez le nom de chaque minuteur pour identifier ce qui cuit: "Four", "Riz", "Sauce", etc.',
 		},
 		{
 			name: 'Contrôler depuis le dock mobile',
@@ -110,12 +110,12 @@ export const content: ToolLocaleContent = {
 		{
 			question: 'Combien de minuteurs puis-je créer ?',
 			answer:
-				'Illimité. Ajoutez-en autant que nécessaire avec le bouton "+". Parfait pour cuisiner plusieurs plats simultanément : bouillir des pâtes, réduire une sauce, reposer la viande et cuire au four, tout en même temps.',
+				'Illimité. Ajoutez-en autant que nécessaire avec le bouton "+". Parfait pour cuisiner plusieurs plats simultanément: bouillir des pâtes, réduire une sauce, reposer la viande et cuire au four, tout en même temps.',
 		},
 		{
 			question: 'Pourquoi le temps de repos est-il important pour la viande ?',
 			answer:
-				'Lorsque vous coupez la viande juste après la cuisson, les jus s\'échappent sur l\'assiette. Si vous la laissez reposer 5 à 10 minutes, les fibres se détendent et les jus se redistribuent. Résultat : une viande juteuse au lieu d\'être sèche. Le repos est une cuisson passive.',
+				'Lorsque vous coupez la viande juste après la cuisson, les jus s\'échappent sur l\'assiette. Si vous la laissez reposer 5 à 10 minutes, les fibres se détendent et les jus se redistribuent. Résultat: une viande juteuse au lieu d\'être sèche. Le repos est une cuisson passive.',
 		},
 		{
 			question: 'Fonctionne-t-il avec l\'écran verrouillé ?',
@@ -134,7 +134,7 @@ export const content: ToolLocaleContent = {
 		},
 		{
 			name: 'Personnaliser chaque minuteur',
-			text: 'Changez le nom de chaque minuteur pour identifier ce qui cuit : "Four", "Riz", "Sauce", etc.',
+			text: 'Changez le nom de chaque minuteur pour identifier ce qui cuit: "Four", "Riz", "Sauce", etc.',
 		},
 		{
 			name: 'Contrôler depuis le dock mobile',
@@ -157,7 +157,7 @@ export const content: ToolLocaleContent = {
 		},
 		{
 			type: 'paragraph',
-			html: 'Cet outil de <strong>Minuteur Multiple</strong> a été conçu pour les chefs à domicile et les professionnels qui ont besoin d\'orchestrer une symphonie de plats : bouillir des pâtes, rôti au four et réduction de sauce, tout cela se passant simultanément.',
+			html: 'Cet outil de <strong>Minuteur Multiple</strong> a été conçu pour les chefs à domicile et les professionnels qui ont besoin d\'orchestrer une symphonie de plats: bouillir des pâtes, rôti au four et réduction de sauce, tout cela se passant simultanément.',
 		},
 		{
 			type: 'title',
@@ -182,7 +182,7 @@ export const content: ToolLocaleContent = {
 		},
 		{
 			type: 'title',
-			text: 'Sécurité Alimentaire : La Zone de Danger',
+			text: 'Sécurité Alimentaire: La Zone de Danger',
 			level: 3,
 		},
 		{

package/src/tool/kitchen-timer/i18n/id.ts

@@ -6,7 +6,7 @@ const description = "Kelola beberapa waktu memasak secara bersamaan. Alarm indep
 const faq = [
   {
     question: 'Berapa banyak timer yang bisa saya buat?',
-    answer: 'Tak terbatas. Tambahkan sebanyak yang Anda butuhkan dengan tombol "+". Ideal untuk memasak beberapa hidangan sekaligus: merebus pasta, mereduksi saus, mendiamkan daging, dan oven yang menyala – semuanya sekaligus.',
+    answer: 'Tak terbatas. Tambahkan sebanyak yang Anda butuhkan dengan tombol "+". Ideal untuk memasak beberapa hidangan sekaligus: merebus pasta, mereduksi saus, mendiamkan daging, dan oven yang menyala - semuanya sekaligus.',
   },
   {
     question: 'Mengapa waktu istirahat penting untuk daging?',

package/src/tool/kitchen-timer/i18n/nl.ts

@@ -6,7 +6,7 @@ const description = "Beheer meerdere kooktijden gelijktijdig. Onafhankelijke ala
 const faq = [
   {
     question: 'Hoeveel timers kan ik maken?',
-    answer: 'Onbeperkt. Voeg er zoveel toe als je nodig hebt met de "+"-knop. Ideaal voor het gelijktijdig koken van meerdere gerechten: pasta koken, saus inkoken, vlees laten rusten en de oven aan – alles tegelijk.',
+    answer: 'Onbeperkt. Voeg er zoveel toe als je nodig hebt met de "+"-knop. Ideaal voor het gelijktijdig koken van meerdere gerechten: pasta koken, saus inkoken, vlees laten rusten en de oven aan - alles tegelijk.',
   },
   {
     question: 'Waarom is rusttijd belangrijk voor vlees?',

package/src/tool/kitchen-timer/i18n/pl.ts

@@ -6,7 +6,7 @@ const description = "Zarządzaj wieloma czasami gotowania jednocześnie. Niezale
 const faq = [
   {
     question: 'Ile minutników mogę stworzyć?',
-    answer: 'Nieograniczoną liczbę. Dodaj tyle, ile potrzebujesz przyciskiem "+". Idealne do gotowania kilku potraw naraz: gotujący się makaron, redukujący się sos, odpoczywające mięso i pracujący piekarnik – wszystko jednocześnie.',
+    answer: 'Nieograniczoną liczbę. Dodaj tyle, ile potrzebujesz przyciskiem "+". Idealne do gotowania kilku potraw naraz: gotujący się makaron, redukujący się sos, odpoczywające mięso i pracujący piekarnik - wszystko jednocześnie.',
   },
   {
     question: 'Dlaczego odpoczynek mięsa jest ważny?',

package/src/tool/kitchen-timer/i18n/ru.ts

@@ -6,11 +6,11 @@ const description = "Управляйте несколькими процесс
 const faq = [
   {
     question: 'Сколько таймеров я могу создать?',
-    answer: 'Неограниченно. Добавляйте столько, сколько нужно, кнопкой "+". Идеально для одновременного приготовления нескольких блюд: варка пасты, выпаривание соуса, отдых мяса и работа духовки — всё сразу.',
+    answer: 'Неограниченно. Добавляйте столько, сколько нужно, кнопкой "+". Идеально для одновременного приготовления нескольких блюд: варка пасты, выпаривание соуса, отдых мяса и работа духовки - всё сразу.',
   },
   {
     question: 'Почему важен отдых мяса?',
-    answer: 'Если разрезать мясо сразу после огня, соки вытекут на тарелку. При отдыхе в течение 5–10 минут волокна расслабляются, и соки распределяются равномерно. Результат: сочное мясо вместо сухого.',
+    answer: 'Если разрезать мясо сразу после огня, соки вытекут на тарелку. При отдыхе в течение 5-10 минут волокна расслабляются, и соки распределяются равномерно. Результат: сочное мясо вместо сухого.',
   },
   {
     question: 'Работает ли таймер при заблокированном экране?',
@@ -110,7 +110,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: 'Профессиональная кухня — это не только рецепты, но и <strong>точный тайминг</strong>. Концепция <em>"Mise en Place"</em> (всё на своих местах) включает время как один из важнейших ингредиентов.',
+      html: 'Профессиональная кухня - это не только рецепты, но и <strong>точный тайминг</strong>. Концепция <em>"Mise en Place"</em> (всё на своих местах) включает время как один из важнейших ингредиентов.',
     },
     {
       type: 'title',
@@ -135,7 +135,7 @@ export const content: ToolLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: 'Время влияет и на безопасность. "Опасная зона" размножения бактерий — от 5°C до 65°C. Блюда не должны находиться в этом диапазоне более <strong>2 часов</strong>.',
+      html: 'Время влияет и на безопасность. "Опасная зона" размножения бактерий - от 5°C до 65°C. Блюда не должны находиться в этом диапазоне более <strong>2 часов</strong>.',
     },
     {
       type: 'title',

package/src/tool/kitchen-timer/i18n/sv.ts

@@ -6,7 +6,7 @@ const description = "Hantera flera tillagningstider samtidigt. Oberoende larm, i
 const faq = [
   {
     question: 'Hur många timers kan jag skapa?',
-    answer: 'Obegränsat antal. Lägg till så många du behöver med "+"-knappen. Perfekt för att laga flera rätter samtidigt: pasta som kokar, sås som reduceras, kött som vilar och ugnen igång – allt på en gång.',
+    answer: 'Obegränsat antal. Lägg till så många du behöver med "+"-knappen. Perfekt för att laga flera rätter samtidigt: pasta som kokar, sås som reduceras, kött som vilar och ugnen igång - allt på en gång.',
   },
   {
     question: 'Varför är vilotiden viktig för kött?',

package/src/tool/kitchen-timer/i18n/zh.ts

@@ -6,7 +6,7 @@ const description = "同时管理多个烹饪时间。独立闹钟设计，专
 const faq = [
   {
     question: '我可以创建多少个计时器？',
-    answer: '无限制。通过“+”按钮，你可以为每道菜添加一个计时器。非常适合同时管控多项任务：在煮面条的同时，收浓酱汁、让肉类静置、并监控烤箱。',
+    answer: '无限制。通过"+"按钮，你可以为每道菜添加一个计时器。非常适合同时管控多项任务：在煮面条的同时，收浓酱汁、让肉类静置、并监控烤箱。',
   },
   {
     question: '为什么肉类静置过程很重要？',
@@ -17,18 +17,18 @@ const faq = [
     answer: '是的，但你需要开启浏览器的通知权限。计时器会在后台持续运行，即使你切换标签页或锁屏手机，它也会通过声音和系统通知提醒你。',
   },
   {
-    question: '什么是食品“危险温度带”？',
+    question: '什么是食品"危险温度带"？',
     answer: '细菌在 5°C 到 65°C 之间繁殖最快。烹饪后的食物在该温度区间内不应停留超过 2 小时（如果环境温度超过 30°C，则限制为 1 小时）。使用计时器来控制降温冷却的时间。',
   },
 ];
 const howTo = [
   {
     name: '创建多个计时器',
-    text: '点击“+”按钮，根据你的需要添加多个计时器。适合协调多道菜肴同步进行。',
+    text: '点击"+"按钮，根据你的需要添加多个计时器。适合协调多道菜肴同步进行。',
   },
   {
     name: '个性化计时器名称',
-    text: '修改每个计时器的标签以便识别正在烹饪的内容：“烤箱”、“米饭”、“酱汁”等。',
+    text: '修改每个计时器的标签以便识别正在烹饪的内容："烤箱"、"米饭"、"酱汁"等。',
   },
   {
     name: '移动端便捷控制',
@@ -147,7 +147,7 @@ export const content: ToolLocaleContent = {
       items: [
         '<strong>错开完成时间：</strong> 如果所有菜同时完成，装盘时你会手忙脚乱。尽量规划让配菜早于主菜 5 分钟准备好。',
         '<strong>利用余热：</strong> 在计时器响铃前 1-2 分钟关闭火源。余热会温柔地完成最后的烹制。',
-        '<strong>重命名你的计时器：</strong> 忙碌时容易忘记闹钟是哪道菜。使用本工具的重命名功能，标注“烤箱”、“米饭”或“酱汁”。',
+        '<strong>重命名你的计时器：</strong> 忙碌时容易忘记闹钟是哪道菜。使用本工具的重命名功能，标注"烤箱"、"米饭"或"酱汁"。',
       ],
     },
     {

package/src/tool/lacto-fermentation-salt-calculator/bibliography.astro

@@ -0,0 +1,6 @@
+---
+import { Bibliography as BibliographyComponent } from '@jjlmoya/utils-shared';
+import { bibliography } from './bibliography';
+---
+
+<BibliographyComponent links={bibliography} />

package/src/tool/lacto-fermentation-salt-calculator/bibliography.ts

@@ -0,0 +1,10 @@
+export const bibliography = [
+  {
+    name: 'Microbiology and Technology of Fermented Foods',
+    url: 'https://onlinelibrary.wiley.com/doi/book/10.1002/9780470277515',
+  },
+  {
+    name: 'Lactic Acid Bacteria: Microbiological and Functional Aspects',
+    url: 'https://www.taylorfrancis.com/books/edit/10.1201/9780429057465/lactic-acid-bacteria-gabriel-vinderola-arthur-ouwehand-seppo-salminen-atte-von-wright',
+  },
+];

package/src/tool/lacto-fermentation-salt-calculator/component.astro

@@ -0,0 +1,163 @@
+---
+import WizardMode from './components/WizardMode.astro';
+import DigitalScale from './components/DigitalScale.astro';
+import PetriDish from './components/PetriDish.astro';
+
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="fermentation-container">
+  <div class="fermentation-card">
+    <div class="fermentation-glow-1"></div>
+    <div class="fermentation-glow-2"></div>
+
+    <div class="fermentation-grid">
+      <div class="fermentation-controls-section">
+        <WizardMode ui={ui} />
+        <DigitalScale ui={ui} />
+      </div>
+
+      <div class="fermentation-visuals-section">
+        <PetriDish ui={ui} />
+      </div>
+    </div>
+  </div>
+</div>
+
+<script is:inline define:vars={{ ui }}>
+  const metricBtn = document.getElementById('toggle-metric-btn');
+  const imperialBtn = document.getElementById('toggle-imperial-btn');
+  const dryBtn = document.getElementById('toggle-dry-btn');
+  const wetBtn = document.getElementById('toggle-wet-btn');
+  const vegInput = document.getElementById('veg-weight-input');
+  const waterInput = document.getElementById('water-weight-input');
+  const waterGroup = document.getElementById('water-weight-group');
+  const salinitySlider = document.getElementById('salinity-slider');
+  
+  const salinityDisplay = document.getElementById('salinity-val-display');
+  const scaleDisplay = document.getElementById('scale-main-value');
+  const scaleUnitDisplay = document.getElementById('scale-unit-label');
+  const fineDisplay = document.getElementById('fine-teaspoons-val');
+  const kosherDisplay = document.getElementById('kosher-teaspoons-val');
+
+  const petriBac = document.getElementById('petri-bacteria');
+  const petriMold = document.getElementById('petri-mold');
+  const petriCrys = document.getElementById('petri-crystals');
+
+  const statusBadge = document.getElementById('status-badge');
+  const statusBadgeText = document.getElementById('status-badge-text');
+  const statusDescText = document.getElementById('status-description-text');
+
+  let activeMode = 'dry';
+  let activeUnit = 'metric';
+
+  function updatePetriAndStatus(salinity) {
+    if (salinity < 2.0) {
+      petriMold.style.opacity = '1';
+      petriBac.style.opacity = '0';
+      petriCrys.style.opacity = '0';
+      
+      statusBadge.className = 'status-badge danger';
+      statusBadgeText.textContent = ui.statusDanger;
+      statusDescText.textContent = ui.statusDangerDesc;
+    } else if (salinity > 3.5) {
+      petriMold.style.opacity = '0';
+      petriBac.style.opacity = '0';
+      petriCrys.style.opacity = '1';
+
+      statusBadge.className = 'status-badge inhibited';
+      statusBadgeText.textContent = ui.statusInhibited;
+      statusDescText.textContent = ui.statusInhibitedDesc;
+    } else {
+      petriMold.style.opacity = '0';
+      petriBac.style.opacity = '1';
+      petriCrys.style.opacity = '0';
+
+      statusBadge.className = 'status-badge optimal';
+      statusBadgeText.textContent = ui.statusOptimal;
+      statusDescText.textContent = ui.statusOptimalDesc;
+    }
+  }
+
+  function updateView() {
+    const vegWeight = Math.max(0, parseFloat(vegInput.value) || 0);
+    const waterWeight = Math.max(0, parseFloat(waterInput.value) || 0);
+    const salinity = Math.max(0, parseFloat(salinitySlider.value) || 0);
+
+    salinityDisplay.textContent = `${salinity.toFixed(1)}%`;
+
+    const totalWeight = activeMode === 'dry' ? vegWeight : (vegWeight + waterWeight);
+    const saltResult = Math.max(0, (totalWeight * salinity) / 100);
+    
+    scaleDisplay.textContent = saltResult.toFixed(2);
+    scaleUnitDisplay.textContent = activeUnit === 'metric' ? 'g' : 'oz';
+
+    const saltGrams = activeUnit === 'imperial' ? saltResult * 28.3495 : saltResult;
+
+    fineDisplay.textContent = Math.max(0, saltGrams / 5.7).toFixed(1);
+    kosherDisplay.textContent = Math.max(0, saltGrams / 4.3).toFixed(1);
+
+    updatePetriAndStatus(salinity);
+  }
+
+  function convertInputsTo(targetUnit) {
+    const currentVeg = parseFloat(vegInput.value) || 0;
+    const currentWater = parseFloat(waterInput.value) || 0;
+
+    const labels = document.querySelectorAll('.weight-unit-label');
+
+    if (targetUnit === 'imperial') {
+      vegInput.value = (currentVeg * 0.035274).toFixed(1);
+      waterInput.value = (currentWater * 0.035274).toFixed(1);
+      labels.forEach(label => label.textContent = 'oz');
+    } else {
+      vegInput.value = Math.round(currentVeg / 0.035274).toString();
+      waterInput.value = Math.round(currentWater / 0.035274).toString();
+      labels.forEach(label => label.textContent = 'g');
+    }
+  }
+
+  metricBtn.addEventListener('click', () => {
+    if (activeUnit === 'metric') return;
+    activeUnit = 'metric';
+    metricBtn.classList.add('active');
+    imperialBtn.classList.remove('active');
+    convertInputsTo('metric');
+    updateView();
+  });
+
+  imperialBtn.addEventListener('click', () => {
+    if (activeUnit === 'imperial') return;
+    activeUnit = 'imperial';
+    imperialBtn.classList.add('active');
+    metricBtn.classList.remove('active');
+    convertInputsTo('imperial');
+    updateView();
+  });
+
+  dryBtn.addEventListener('click', () => {
+    activeMode = 'dry';
+    dryBtn.classList.add('active');
+    wetBtn.classList.remove('active');
+    waterGroup.classList.add('hidden');
+    updateView();
+  });
+
+  wetBtn.addEventListener('click', () => {
+    activeMode = 'wet';
+    wetBtn.classList.add('active');
+    dryBtn.classList.remove('active');
+    waterGroup.classList.remove('hidden');
+    updateView();
+  });
+
+  vegInput.addEventListener('input', updateView);
+  waterInput.addEventListener('input', updateView);
+  salinitySlider.addEventListener('input', updateView);
+
+  updateView();
+</script>

package/src/tool/lacto-fermentation-salt-calculator/components/DigitalScale.astro

@@ -0,0 +1,43 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="digital-scale-container">
+  <div class="scale-header">
+    <span class="scale-title">{ui.scaleTitle}</span>
+  </div>
+
+  <div class="scale-plate">
+    <div class="scale-display">
+      <div class="scale-digits">
+        <span id="scale-main-value">25.00</span>
+        <span id="scale-unit-label" class="scale-unit">g</span>
+      </div>
+      <div class="scale-label">{ui.saltGramsLabel}</div>
+    </div>
+  </div>
+
+  <div class="scale-conversions">
+    <div class="conversion-item">
+      <span class="conversion-label">{ui.fineLabel}</span>
+      <div class="conversion-val">
+        <span id="fine-teaspoons-val">4.4</span>
+        <span class="conversion-unit">tsp</span>
+      </div>
+    </div>
+
+    <div class="conversion-item">
+      <span class="conversion-label">{ui.kosherLabel}</span>
+      <div class="conversion-val">
+        <span id="kosher-teaspoons-val">5.8</span>
+        <span class="conversion-unit">tsp</span>
+      </div>
+    </div>
+  </div>
+
+  <p class="scale-disclaimer">{ui.disclaimer}</p>
+</div>

package/src/tool/lacto-fermentation-salt-calculator/components/PetriDish.astro

@@ -0,0 +1,55 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="petri-dish-section">
+  <div class="petri-header">
+    <span class="petri-title">{ui.petriTitle}</span>
+  </div>
+
+  <div class="petri-container">
+    <div class="petri-dish">
+      <div class="petri-agar">
+        <svg viewBox="0 0 200 200" class="petri-svg" xmlns="http://www.w3.org/2000/svg">
+          <g id="petri-bacteria" class="bacteria-layer">
+            <ellipse cx="60" cy="80" rx="6" ry="14" transform="rotate(25 60 80)" class="bac-cell"></ellipse>
+            <ellipse cx="140" cy="70" rx="5" ry="12" transform="rotate(-35 140 70)" class="bac-cell"></ellipse>
+            <ellipse cx="100" cy="130" rx="7" ry="15" transform="rotate(45 100 130)" class="bac-cell"></ellipse>
+            <circle cx="80" cy="50" r="5" class="bac-coccus"></circle>
+            <circle cx="120" cy="110" r="4.5" class="bac-coccus"></circle>
+            <circle cx="70" cy="150" r="6" class="bac-coccus"></circle>
+          </g>
+
+          <g id="petri-mold" class="mold-layer">
+            <path d="M 40,100 C 50,80 70,80 80,100 C 90,80 110,80 120,100 C 110,120 90,120 80,100 C 70,120 50,120 40,100 Z" class="mold-fungus" fill="none" stroke-width="3"></path>
+            <path d="M 110,60 C 120,45 135,45 140,60 C 145,45 160,45 160,60" class="mold-fungus" fill="none" stroke-width="2.5"></path>
+            <path d="M 70,140 C 80,125 95,125 100,140 C 105,125 120,125 120,140" class="mold-fungus" fill="none" stroke-width="2.5"></path>
+            <circle cx="80" cy="100" r="3" class="mold-spore"></circle>
+            <circle cx="140" cy="60" r="2" class="mold-spore"></circle>
+            <circle cx="100" cy="140" r="2.5" class="mold-spore"></circle>
+          </g>
+
+          <g id="petri-crystals" class="crystals-layer">
+            <rect x="50" y="50" width="12" height="12" transform="rotate(15 56 56)" class="crystal-cube"></rect>
+            <rect x="130" y="120" width="16" height="16" transform="rotate(45 138 128)" class="crystal-cube"></rect>
+            <rect x="60" y="120" width="10" height="10" transform="rotate(5 65 125)" class="crystal-cube"></rect>
+            <rect x="140" y="45" width="14" height="14" transform="rotate(30 147 52)" class="crystal-cube"></rect>
+          </g>
+        </svg>
+      </div>
+    </div>
+  </div>
+
+  <div class="status-box">
+    <div id="status-badge" class="status-badge optimal">
+      <span id="status-badge-text">{ui.statusOptimal}</span>
+    </div>
+    <p id="status-description-text" class="status-desc-text">
+      {ui.statusOptimalDesc}
+    </p>
+  </div>
+</div>

package/src/tool/lacto-fermentation-salt-calculator/components/WizardMode.astro

@@ -0,0 +1,83 @@
+---
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+---
+
+<div class="fermentation-wizard">
+  <div class="wizard-control-group">
+    <label class="wizard-label">{ui.unitLabel}</label>
+    <div class="unit-toggle-container">
+      <button type="button" id="toggle-metric-btn" class="mode-btn active" data-unit="metric">
+        {ui.metricUnit}
+      </button>
+      <button type="button" id="toggle-imperial-btn" class="mode-btn" data-unit="imperial">
+        {ui.imperialUnit}
+      </button>
+    </div>
+  </div>
+
+  <div class="wizard-control-group">
+    <label class="wizard-label">
+      {ui.modeLabel}
+    </label>
+    <div class="mode-toggle-container">
+      <button type="button" id="toggle-dry-btn" class="mode-btn active" data-mode="dry">
+        {ui.dryMode}
+      </button>
+      <button type="button" id="toggle-wet-btn" class="mode-btn" data-mode="wet">
+        {ui.wetMode}
+      </button>
+    </div>
+  </div>
+
+  <div class="wizard-control-group">
+    <label for="veg-weight-input" class="wizard-label">
+      {ui.vegWeightLabel} (<span class="weight-unit-label">g</span>)
+    </label>
+    <input
+      type="number"
+      id="veg-weight-input"
+      min="0"
+      max="100000"
+      step="any"
+      value="1000"
+      class="wizard-number-input"
+      inputmode="decimal"
+    />
+  </div>
+
+  <div id="water-weight-group" class="wizard-control-group hidden">
+    <label for="water-weight-input" class="wizard-label">
+      {ui.waterWeightLabel} (<span class="weight-unit-label">g</span>)
+    </label>
+    <input
+      type="number"
+      id="water-weight-input"
+      min="0"
+      max="100000"
+      step="any"
+      value="500"
+      class="wizard-number-input"
+      inputmode="decimal"
+    />
+  </div>
+
+  <div class="wizard-control-group">
+    <div class="slider-header">
+      <label for="salinity-slider" class="wizard-label">{ui.salinityLabel}</label>
+      <span id="salinity-val-display" class="slider-val">2.5%</span>
+    </div>
+    <input
+      type="range"
+      id="salinity-slider"
+      min="1.0"
+      max="6.0"
+      step="0.1"
+      value="2.5"
+      class="wizard-slider"
+    />
+  </div>
+</div>

package/src/tool/lacto-fermentation-salt-calculator/entry.ts

@@ -0,0 +1,26 @@
+import type { CookingToolEntry } from '../../types';
+
+export const lactoFermentationSalt: CookingToolEntry = {
+  id: 'lacto-fermentation-salt-calculator',
+  icons: {
+    bg: 'mdi:leaf',
+    fg: 'mdi:flask-outline',
+  },
+  i18n: {
+    en: () => import('./i18n/en').then((m) => m.content),
+    de: () => import('./i18n/de').then((m) => m.content),
+    es: () => import('./i18n/es').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').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),
+    pt: () => import('./i18n/pt').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),
+  },
+};