@jjlmoya/utils-creative 1.5.0 → 1.7.0

package/src/tool/dice-roller/i18n/fr.ts

@@ -1,9 +1,77 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import type { DiceRollerLocaleContent } from '../index';
 
+const slug = 'lanceur-de-des';
+const title = 'Lanceur de Dés';
+const description = 'Un simulateur de dés complet pour vos JdR et jeux de société. Lancez des d4, d6, d8, d10, d12, d20 et d100 avec modificateurs et historique.';
+
+const faq: DiceRollerLocaleContent['faq'] = [
+  {
+    question: 'Comment simuler un lancer avec avantage (D&D) ?',
+    answer: 'Ajoutez deux dés d20 à votre réserve en cliquant deux fois sur le bouton d20. Lors du lancer, observez les deux résultats individuels et gardez le plus élevé. Le total affiché sera la somme, mais vous pouvez voir chaque dé séparément dans le détail du résultat.',
+  },
+  {
+    question: 'Que signifient les couleurs verte ou rouge sur les résultats ?',
+    answer: 'Les résultats en vert indiquent que le dé a obtenu sa valeur maximale possible (un "critique"). Les résultats en rouge indiquent la valeur minimale (un "1", le pire résultat possible). Cela permet de repérer les critiques et les échecs d\'un coup d\'œil.',
+  },
+  {
+    question: 'Puis-je ajouter plusieurs dés du même type ?',
+    answer: 'Oui. Chaque clic sur un dé l\'ajoute à votre réserve. Si vous cliquez trois fois sur le d6, la réserve affichera "3d6". Pour réduire le nombre, cliquez sur le bouton "−" qui apparaît à côté de chaque groupe de dés.',
+  },
+  {
+    question: 'Les dés numériques sont-ils aussi aléatoires que les physiques ?',
+    answer: 'Statistiquement, oui. Les moteurs JavaScript modernes utilisent des algorithmes pseudo-aléatoires (xorshift128+) avec une distribution uniforme de très haute qualité. Un vrai dé physique peut présenter de petites imperfections de fabrication qui biaisent les résultats ; le dé numérique n\'a pas ce problème.',
+  },
+  {
+    question: 'Qu\'est-ce que le d100 et comment est-il utilisé ?',
+    answer: 'Le d100 (ou d%) génère un nombre de 1 à 100 et est utilisé dans les systèmes de jeu basés sur les pourcentages, tels que l\'Appel de Cthulhu ou Warhammer Fantasy. Il représente une "probabilité directe" : si votre compétence en Discrétion est de 65 %, vous devez obtenir 65 ou moins pour réussir.',
+  },
+];
+
+const howTo: DiceRollerLocaleContent['howTo'] = [
+  { name: 'Composer la réserve de dés', text: 'Cliquez sur les boutons des dés (d4, d6, d8...) pour les ajouter à votre réserve. Chaque clic ajoute un dé du type sélectionné. Vous pouvez mélanger différents types dans le même lancer.' },
+  { name: 'Ajuster le modificateur', text: 'Utilisez les boutons "+" et "−" à côté du modificateur pour appliquer des bonus ou des pénalités (comme le modificateur de caractéristique dans D&D). Le modificateur est automatiquement ajouté au total.' },
+  { name: 'Lancer les dés', text: 'Appuyez sur le bouton "Lancer les dés". Le panneau de droite affiche le total final et le détail de chaque dé individuel, avec les critiques (maximum) en vert et les échecs (minimum) en rouge.' },
+  { name: 'Consulter l\'historique', text: 'Chaque lancer est enregistré dans l\'historique avec l\'expression de dés utilisée, le résultat total et l\'heure exacte. Vous pouvez effacer l\'historique avec le bouton correspondant.' },
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faq.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howTo.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'fr',
+};
+
 export const content: DiceRollerLocaleContent = {
-  slug: 'lanceur-de-des',
-  title: 'Lanceur de Dés',
-  description: 'Un simulateur de dés complet pour vos JdR et jeux de société. Lancez des d4, d6, d8, d10, d12, d20 et d100 avec modificateurs et historique.',
+  slug,
+  title,
+  description,
   faqTitle: 'Questions Fréquemment Posées',
   bibliographyTitle: 'Bibliographie du Hasard',
   ui: {
@@ -14,7 +82,16 @@ export const content: DiceRollerLocaleContent = {
     historyLabel: 'Historique',
     clearHistoryBtn: 'Effacer l\'historique',
     faqTitle: 'FAQ',
-    bibliographyTitle: 'Références'
+    bibliographyTitle: 'Références',
+    addDiceLabel: 'Ajouter des dés au sac',
+    bagLabel: 'Sac de dés',
+    emptyBagBtn: 'Vider',
+    emptyBagText: 'Cliquez sur les dés pour les ajouter',
+    modifierLabel: 'Modificateur',
+    rollManyLabel: 'Lancer $COUNT dés',
+    rollOneLabel: 'Lancer $COUNT dé',
+    preRollText: 'Ajoutez des dés et lancez',
+    emptyHistoryText: 'L\'historique des lancers apparaîtra ici'
   },
   seo: [
     { type: 'title', text: 'L\'Art du Hasard : Histoire et Mathématiques des Dés', level: 2 },
@@ -50,38 +127,12 @@ export const content: DiceRollerLocaleContent = {
       { term: 'Lancer Centile', definition: 'Un lancer utilisant deux d10 pour produire un résultat de 1 à 100, utilisé dans les systèmes basés sur les compétences où les capacités sont mesurées en pourcentages.' },
     ]},
   ],
-  faq: [
-    {
-      question: 'Comment simuler un lancer avec avantage (D&D) ?',
-      answer: 'Ajoutez deux dés d20 à votre réserve en cliquant deux fois sur le bouton d20. Lors du lancer, observez les deux résultats individuels et gardez le plus élevé. Le total affiché sera la somme, mais vous pouvez voir chaque dé séparément dans le détail du résultat.',
-    },
-    {
-      question: 'Que signifient les couleurs verte ou rouge sur les résultats ?',
-      answer: 'Les résultats en vert indiquent que le dé a obtenu sa valeur maximale possible (un "critique"). Les résultats en rouge indiquent la valeur minimale (un "1", le pire résultat possible). Cela permet de repérer les critiques et les échecs d\'un coup d\'œil.',
-    },
-    {
-      question: 'Puis-je ajouter plusieurs dés du même type ?',
-      answer: 'Oui. Chaque clic sur un dé l\'ajoute à votre réserve. Si vous cliquez trois fois sur le d6, la réserve affichera "3d6". Pour réduire le nombre, cliquez sur le bouton "−" qui apparaît à côté de chaque groupe de dés.',
-    },
-    {
-      question: 'Les dés numériques sont-ils aussi aléatoires que les physiques ?',
-      answer: 'Statistiquement, oui. Les moteurs JavaScript modernes utilisent des algorithmes pseudo-aléatoires (xorshift128+) avec une distribution uniforme de très haute qualité. Un vrai dé physique peut présenter de petites imperfections de fabrication qui biaisent les résultats ; le dé numérique n\'a pas ce problème.',
-    },
-    {
-      question: 'Qu\'est-ce que le d100 et comment est-il utilisé ?',
-      answer: 'Le d100 (ou d%) génère un nombre de 1 à 100 et est utilisé dans les systèmes de jeu basés sur les pourcentages, tels que l\'Appel de Cthulhu ou Warhammer Fantasy. Il représente une "probabilité directe" : si votre compétence en Discrétion est de 65 %, vous devez obtenir 65 ou moins pour réussir.',
-    },
-  ],
+  faq,
   bibliography: [
     { name: 'D&D Beyond – Règles des mécaniques de dés', url: 'https://www.dndbeyond.com/sources/basic-rules/using-ability-scores' },
     { name: 'Roll20 – Table de jeu virtuelle et systèmes de dés', url: 'https://roll20.net/' },
     { name: 'Pathfinder – Référence du système d20', url: 'https://paizo.com/pathfinder' },
   ],
-  howTo: [
-    { name: 'Composer la réserve de dés', text: 'Cliquez sur les boutons des dés (d4, d6, d8...) pour les ajouter à votre réserve. Chaque clic ajoute un dé du type sélectionné. Vous pouvez mélanger différents types dans le même lancer.' },
-    { name: 'Ajuster le modificateur', text: 'Utilisez les boutons "+" et "−" à côté du modificateur pour appliquer des bonus ou des pénalités (comme le modificateur de caractéristique dans D&D). Le modificateur est automatiquement ajouté au total.' },
-    { name: 'Lancer les dés', text: 'Appuyez sur le bouton "Lancer les dés". Le panneau de droite affiche le total final et le détail de chaque dé individuel, avec les critiques (maximum) en vert et les échecs (minimum) en rouge.' },
-    { name: 'Consulter l\'historique', text: 'Chaque lancer est enregistré dans l\'historique avec l\'expression de dés utilisée, le résultat total et l\'heure exacte. Vous pouvez effacer l\'historique avec le bouton correspondant.' },
-  ],
-  schemas: []
+  howTo,
+  schemas: [faqSchema as any, howToSchema as any, appSchema],
 };

package/src/tool/dice-roller/index.ts

@@ -13,6 +13,15 @@ export interface DiceRollerUI {
   clearHistoryBtn: string;
   faqTitle: string;
   bibliographyTitle: string;
+  addDiceLabel: string;
+  bagLabel: string;
+  emptyBagBtn: string;
+  emptyBagText: string;
+  modifierLabel: string;
+  rollManyLabel: string;
+  rollOneLabel: string;
+  preRollText: string;
+  emptyHistoryText: string;
 }
 
 export type DiceRollerLocaleContent = ToolLocaleContent<DiceRollerUI>;

package/src/tool/excuse-generator/i18n/en.ts

@@ -1,9 +1,63 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import type { ExcuseGeneratorLocaleContent } from '../index';
 
+const slug = 'excuse-generator';
+const title = 'Excuse Generator';
+const description = 'Semantic gambling machine to get rid of commitments with style. Generate surreal and irrefutable excuses instantly.';
+
+const faq: ExcuseGeneratorLocaleContent['faq'] = [
+  {
+    question: 'Can this generator save my marriage?',
+    answer: 'While we are not therapists, avoiding that dinner with the in-laws using a plausible technical emergency can significantly reduce tension. Use responsibly.'
+  },
+  {
+    question: 'Why such surreal phrases?',
+    answer: 'The strategy is based on Cognitive Dissonance. If you say something boring it is verifiable. If you say something absurd, the surprise blocks the capacity for anger.'
+  }
+];
+
+const howTo: ExcuseGeneratorLocaleContent['howTo'] = [
+  { name: 'Generate', text: 'Click the generate button to create a new excuse.' },
+  { name: 'Copy', text: 'Click the copy button to bring the excuse to your clipboard.' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faq.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howTo.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'en',
+};
+
 export const content: ExcuseGeneratorLocaleContent = {
-  slug: 'excuse-generator',
-  title: 'Excuse Generator',
-  description: 'Semantic gambling machine to get rid of commitments with style. Generate surreal and irrefutable excuses instantly.',
+  slug,
+  title,
+  description,
   faqTitle: 'Frequently Asked Questions',
   bibliographyTitle: 'Leisure Bibliography',
   ui: {
@@ -59,22 +113,10 @@ export const content: ExcuseGeneratorLocaleContent = {
       { pro: 'Creative and humorous tone defuses tension', con: 'Not suitable for formal or professional contexts' },
     ]},
   ],
-  faq: [
-    {
-      question: 'Can this generator save my marriage?',
-      answer: 'While we are not therapists, avoiding that dinner with the in-laws using a plausible technical emergency can significantly reduce tension. Use responsibly.'
-    },
-    {
-      question: 'Why such surreal phrases?',
-      answer: 'The strategy is based on Cognitive Dissonance. If you say something boring it is verifiable. If you say something absurd, the surprise blocks the capacity for anger.'
-    }
-  ],
+  faq,
   bibliography: [
     { name: 'Procrastinator\'s Manifesto', url: 'https://example.com/manifesto' }
   ],
-  howTo: [
-    { name: 'Generate', text: 'Click the generate button to create a new excuse.' },
-    { name: 'Copy', text: 'Click the copy button to bring the excuse to your clipboard.' }
-  ],
-  schemas: []
+  howTo,
+  schemas: [faqSchema as any, howToSchema as any, appSchema],
 };

package/src/tool/excuse-generator/i18n/es.ts

@@ -1,9 +1,63 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import type { ExcuseGeneratorLocaleContent } from '../index';
 
+const slug = 'generador-excusas';
+const title = 'Generador de Excusas';
+const description = 'Máquina de azar semántica para librarte de compromisos con estilo.';
+
+const faq: ExcuseGeneratorLocaleContent['faq'] = [
+  {
+    question: '¿Puede este generador salvar mi matrimonio?',
+    answer: 'Aunque no somos terapeutas, evitar esa cena con los suegros utilizando una emergencia técnica plausible puede reducir la tensión significativamente.'
+  },
+  {
+    question: '¿Por qué frases tan surrealistas?',
+    answer: 'La estrategia se basa en la Disonancia Cognitiva. Si dices algo aburrido es comprobable. Si dices algo absurdo, la sorpresa bloquea la capacidad de enfado.'
+  }
+];
+
+const howTo: ExcuseGeneratorLocaleContent['howTo'] = [
+  { name: 'Generar', text: 'Pulsa el botón de generar para crear una nueva excusa.' },
+  { name: 'Copiar', text: 'Haz clic en el botón de copiar para llevar la excusa a tu portapapeles.' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faq.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howTo.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'es',
+};
+
 export const content: ExcuseGeneratorLocaleContent = {
-  slug: 'generador-excusas',
-  title: 'Generador de Excusas',
-  description: 'Máquina de azar semántica para librarte de compromisos con estilo.',
+  slug,
+  title,
+  description,
   faqTitle: 'Preguntas Frecuentes',
   bibliographyTitle: 'Bibliografía del Ocio',
   ui: {
@@ -63,22 +117,10 @@ export const content: ExcuseGeneratorLocaleContent = {
       { pro: 'El tono creativo y humorístico difunde la tensión', con: 'No apta para contextos formales o profesionales' },
     ]},
   ],
-  faq: [
-    {
-      question: '¿Puede este generador salvar mi matrimonio?',
-      answer: 'Aunque no somos terapeutas, evitar esa cena con los suegros utilizando una emergencia técnica plausible puede reducir la tensión significativamente.'
-    },
-    {
-      question: '¿Por qué frases tan surrealistas?',
-      answer: 'La estrategia se basa en la Disonancia Cognitiva. Si dices algo aburrido es comprobable. Si dices algo absurdo, la sorpresa bloquea la capacidad de enfado.'
-    }
-  ],
+  faq,
   bibliography: [
     { name: 'Manifesto del Procrastinador', url: 'https://example.com/manifesto' }
   ],
-  howTo: [
-    { name: 'Generar', text: 'Pulsa el botón de generar para crear una nueva excusa.' },
-    { name: 'Copiar', text: 'Haz clic en el botón de copiar para llevar la excusa a tu portapapeles.' }
-  ],
-  schemas: []
+  howTo,
+  schemas: [faqSchema as any, howToSchema as any, appSchema],
 };

package/src/tool/excuse-generator/i18n/fr.ts

@@ -1,9 +1,63 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import type { ExcuseGeneratorLocaleContent } from '../index';
 
+const slug = 'generateur-d-excuses';
+const title = 'Générateur d\'Excuses';
+const description = 'Une machine à sous sémantique pour vous débarrasser de vos engagements avec style. Générez des excuses surréalistes et irréfutables instantanément.';
+
+const faq: ExcuseGeneratorLocaleContent['faq'] = [
+  {
+    question: 'Ce générateur peut-il sauver mon mariage ?',
+    answer: 'Bien que nous ne soyons pas thérapeutes, éviter ce dîner chez les beaux-parents grâce à une urgence technique plausible peut considérablement réduire les tensions. À utiliser avec parcimonie.'
+  },
+  {
+    question: 'Pourquoi des phrases aussi surréalistes ?',
+    answer: 'La stratégie repose sur la Dissonance Cognitive. Si vous dites quelque chose d\'ennuyeux, c\'est vérifiable. Si vous dites quelque chose d\'absurde, la surprise paralyse la capacité de colère.'
+  }
+];
+
+const howTo: ExcuseGeneratorLocaleContent['howTo'] = [
+  { name: 'Générer', text: 'Cliquez sur le bouton pour créer une nouvelle excuse.' },
+  { name: 'Copier', text: 'Cliquez sur le bouton de copie pour mettre l\'excuse dans votre presse-papiers.' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faq.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howTo.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'fr',
+};
+
 export const content: ExcuseGeneratorLocaleContent = {
-  slug: 'generateur-d-excuses',
-  title: 'Générateur d\'Excuses',
-  description: 'Une machine à sous sémantique pour vous débarrasser de vos engagements avec style. Générez des excuses surréalistes et irréfutables instantanément.',
+  slug,
+  title,
+  description,
   faqTitle: 'Questions Fréquemment Posées',
   bibliographyTitle: 'Bibliographie du Temps Libre',
   ui: {
@@ -59,22 +113,10 @@ export const content: ExcuseGeneratorLocaleContent = {
       { pro: 'Le ton créatif et humoristique désamorce la tension', con: 'Inapproprié dans un contexte formel ou professionnel' },
     ]},
   ],
-  faq: [
-    {
-      question: 'Ce générateur peut-il sauver mon mariage ?',
-      answer: 'Bien que nous ne soyons pas thérapeutes, éviter ce dîner chez les beaux-parents grâce à une urgence technique plausible peut considérablement réduire les tensions. À utiliser avec parcimonie.'
-    },
-    {
-      question: 'Pourquoi des phrases aussi surréalistes ?',
-      answer: 'La stratégie repose sur la Dissonance Cognitive. Si vous dites quelque chose d\'ennuyeux, c\'est vérifiable. Si vous dites quelque chose d\'absurde, la surprise paralyse la capacité de colère.'
-    }
-  ],
+  faq,
   bibliography: [
     { name: 'Manifeste du Procrastinateur', url: 'https://example.com/manifesto' }
   ],
-  howTo: [
-    { name: 'Générer', text: 'Cliquez sur le bouton pour créer une nouvelle excuse.' },
-    { name: 'Copier', text: 'Cliquez sur le bouton de copie pour mettre l\'excuse dans votre presse-papiers.' }
-  ],
-  schemas: []
+  howTo,
+  schemas: [faqSchema as any, howToSchema as any, appSchema],
 };

package/src/tool/fortune-cookie/component.astro

@@ -470,25 +470,35 @@ const ASSETS = {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(0.5);
-  width: 75%;
-  max-width: 280px;
+  width: 85%;
+  max-width: 320px;
+  background-color: #fff;
+  border-radius: 2px;
+  box-shadow: 
+    0 10px 15px -3px rgba(0, 0, 0, 0.2),
+    0 4px 6px -2px rgba(0, 0, 0, 0.1),
+    inset 0 0 20px rgba(0, 0, 0, 0.05);
   opacity: 0;
   transition-property: all;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 1000ms;
+  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
+  transition-duration: 800ms;
   z-index: 0;
+  overflow: hidden;
 }
 
 .fortune-cookie-paper.visible {
   opacity: 1;
-  transform: translate(-50%, -50%) scale(1);
+  transform: translate(-50%, -50%) scale(1) rotate(-1deg);
   z-index: 20;
 }
 
 .fortune-cookie-paper-img {
   width: 100%;
-  filter: drop-shadow(0 20px 13px rgba(0, 0, 0, 0.03)) drop-shadow(0 8px 5px rgba(0, 0, 0, 0.08));
-  transform: rotate(1deg);
+  height: auto;
+  display: block;
+  opacity: 0.15;
+  pointer-events: none;
+  mix-blend-mode: multiply;
 }
 
 .fortune-cookie-paper-content {
@@ -498,23 +508,24 @@ const ASSETS = {
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  padding: 2rem;
+  padding: 1.5rem;
   text-align: center;
+  z-index: 10;
 }
 
 .fortune-cookie-text {
-  color: #0f172a;
-  font-weight: 900;
+  color: #1e293b;
+  font-weight: 800;
   font-size: 1.125rem;
-  line-height: 1.25;
+  line-height: 1.4;
   transform: rotate(-1deg);
   user-select: text;
+  margin: 0;
 }
 
 @media (min-width: 768px) {
   .fortune-cookie-text {
     font-size: 1.25rem;
-    line-height: 1.75rem;
   }
 }
 
@@ -527,12 +538,12 @@ const ASSETS = {
   transform: rotate(-1deg);
 }
 
-.fortune-cookie-number {
+:global(.fortune-cookie-number) {
   font-size: 0.75rem;
   line-height: 1rem;
   font-weight: 700;
-  background-color: rgba(255, 255, 255, 0.9);
-  color: #450a0a;
+  background-color: #f1f5f9;
+  color: #dc2626;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   padding-top: 0.125rem;
@@ -621,7 +632,7 @@ const ASSETS = {
   40%, 60% { transform: translate3d(4px, 0, 0) rotate(4deg); }
 }
 
-.fortune-cookie-crumb {
+:global(.fortune-cookie-crumb) {
   position: absolute;
   width: 20px;
   height: 20px;

package/src/tool/fortune-cookie/i18n/en.ts

@@ -1,9 +1,63 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import type { FortuneCookieLocaleContent } from '../index';
 
+const slug = 'fortune-cookie';
+const title = 'Fortune Cookie';
+const description = 'Check your daily destiny and discover your lucky numbers. One fortune per day, revealed with a click.';
+
+const faq: FortuneCookieLocaleContent['faq'] = [
+  {
+    question: 'Can I open more than one cookie per day?',
+    answer: 'Destiny only speaks once a day. We save your fortune on the device so it guides you throughout the day.'
+  },
+  {
+    question: 'Are the fortunes randomly generated?',
+    answer: 'Yes — a random fortune is selected each day and saved locally. Each of the 25 fortunes has an equal chance of being chosen, ensuring variety over time.'
+  }
+];
+
+const howTo: FortuneCookieLocaleContent['howTo'] = [
+  { name: 'Break the cookie', text: 'Click repeatedly on the cookie to crack it open.' },
+  { name: 'Read your fortune', text: 'Discover the hidden message inside and your lucky numbers for the day.' }
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faq.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howTo.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'en',
+};
+
 export const content: FortuneCookieLocaleContent = {
-  slug: 'fortune-cookie',
-  title: 'Fortune Cookie',
-  description: 'Check your daily destiny and discover your lucky numbers. One fortune per day, revealed with a click.',
+  slug,
+  title,
+  description,
   faqTitle: 'Frequently Asked Questions',
   bibliographyTitle: 'Destiny Bibliography',
   ui: {
@@ -64,22 +118,10 @@ export const content: FortuneCookieLocaleContent = {
       { value: '1/day', label: 'One destiny per day', icon: 'mdi:calendar-today' },
     ], columns: 4 },
   ],
-  faq: [
-    {
-      question: 'Can I open more than one cookie per day?',
-      answer: 'Destiny only speaks once a day. We save your fortune on the device so it guides you throughout the day.'
-    },
-    {
-      question: 'Are the fortunes randomly generated?',
-      answer: 'Yes — a random fortune is selected each day and saved locally. Each of the 25 fortunes has an equal chance of being chosen, ensuring variety over time.'
-    }
-  ],
+  faq,
   bibliography: [
     { name: 'History of the Fortune Cookie', url: 'https://en.wikipedia.org/wiki/Fortune_cookie' }
   ],
-  howTo: [
-    { name: 'Break the cookie', text: 'Click repeatedly on the cookie to crack it open.' },
-    { name: 'Read your fortune', text: 'Discover the hidden message inside and your lucky numbers for the day.' }
-  ],
-  schemas: []
+  howTo,
+  schemas: [faqSchema as any, howToSchema as any, appSchema],
 };