{"id":140,"date":"2026-01-17T03:24:59","date_gmt":"2026-01-17T03:24:59","guid":{"rendered":"https:\/\/freedomunityfr.org\/?page_id=140"},"modified":"2026-01-24T06:38:34","modified_gmt":"2026-01-24T06:38:34","slug":"accueil","status":"publish","type":"page","link":"https:\/\/freedomunityfr.org\/","title":{"rendered":"Accueil"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"fr\" class=\"scroll-smooth\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>FreedomUnityFr &#8211; Portail Alchimique<\/title>\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n    <!-- Biblioth\u00e8que pour formater le texte de l'Oracle (Markdown) -->\n    <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/marked\/marked.min.js\"><\/script>\n    \n    <!-- Firebase SDK -->\n    <script type=\"module\" src=\"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-app.js\"><\/script>\n    <script type=\"module\" src=\"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-auth.js\"><\/script>\n    <script type=\"module\" src=\"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-firestore.js\"><\/script>\n\n    <script>\n        tailwind.config = {\n            theme: {\n                extend: {\n                    colors: {\n                        'alchemy-dark': '#1a2e1a',\n                        'alchemy-green': '#4a6741',\n                        'alchemy-gold': '#c5a059',\n                        'alchemy-paper': '#f4f1ea',\n                        'alchemy-wash': '#e8e4d9',\n                        'paper-border': '#dcd6c8',\n                    },\n                    fontFamily: {\n                        'serif': ['Cinzel', 'serif'],\n                        'body': ['Lato', 'sans-serif'],\n                        'hand': ['Homemade Apple', 'cursive'],\n                        'grimoire-title': ['Cinzel Decorative', 'cursive'],\n                        'grimoire-text': ['Cormorant Garamond', 'serif'],\n                        'grimoire-hand': ['Jim Nightshade', 'cursive'],\n                    },\n                    backgroundImage: {\n                        'paper-texture': \"url('https:\/\/www.transparenttextures.com\/patterns\/cream-paper.png')\",\n                    },\n                    animation: {\n                        'float': 'float 6s ease-in-out infinite',\n                        'fade-in': 'fadeIn 0.8s ease-out forwards',\n                        'spin-slow': 'spin 12s linear infinite',\n                        'pulse-glow': 'pulseGlow 3s infinite',\n                    },\n                    keyframes: {\n                        float: {\n                            '0%, 100%': { transform: 'translateY(0)' },\n                            '50%': { transform: 'translateY(-5px)' },\n                        },\n                        fadeIn: {\n                            '0%': { opacity: '0', transform: 'translateY(10px)' },\n                            '100%': { opacity: '1', transform: 'translateY(0)' },\n                        },\n                        pulseGlow: {\n                            '0%, 100%': { boxShadow: '0 0 5px rgba(197, 160, 89, 0.2)' },\n                            '50%': { boxShadow: '0 0 20px rgba(197, 160, 89, 0.6)' },\n                        }\n                    }\n                }\n            }\n        }\n    <\/script>\n    \n    <!-- Importation des polices (Site + Grimoire) -->\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cinzel:wght@400;700;900&#038;family=Lato:wght@300;400;700&#038;family=Homemade+Apple&#038;family=Cinzel+Decorative:wght@400;700&#038;family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&#038;family=Jim+Nightshade&#038;display=swap\" rel=\"stylesheet\">\n    \n    <style>\n        body { font-family: 'Lato', sans-serif; background-color: #f4f1ea; color: #1a2e1a; }\n        h1, h2, h3, h4, h5 { font-family: 'Cinzel', serif; }\n        \n        \/* Texture Vieux Papier Site *\/\n        .texture-overlay {\n            position: fixed; top: 0; left: 0; w: 100%; h: 100%; pointer-events: none; z-index: 9999; opacity: 0.05;\n            background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'\/%3E%3C\/svg%3E\");\n        }\n\n        .glass-panel {\n            background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(8px);\n            border: 1px solid rgba(197, 160, 89, 0.4); box-shadow: 0 10px 40px -10px rgba(26, 46, 26, 0.2);\n        }\n\n        .tab-btn.active { border-bottom: 2px solid #c5a059; color: #1a2e1a; font-weight: 700; }\n        .tab-btn { color: #888; transition: all 0.3s; }\n        .tab-btn:hover { color: #c5a059; }\n\n        \/* Styles Oracle Markdown *\/\n        .oracle-content strong { color: #c5a059; font-weight: 700; }\n        .oracle-content em { font-style: italic; color: #4a6741; }\n        .oracle-content ul { list-style-type: disc; padding-left: 1.5rem; margin-bottom: 1rem; }\n        .oracle-content p { margin-bottom: 0.8rem; line-height: 1.7; }\n        .oracle-content h3 { font-family: 'Cinzel', serif; font-size: 1.1rem; margin-top: 1rem; margin-bottom: 0.5rem; color: #1a2e1a; border-bottom: 1px solid #c5a059; display: inline-block; }\n\n        \/* --- STYLES SP\u00c9CIFIQUES GRIMOIRE (MODAL) --- *\/\n        .grimoire-scope {\n            --bg-wood: #1a1510;\n            --page-bg: #e3d0b0;\n            --page-texture: url('data:image\/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0IiBoZWlnaHQ9IjQiPgo8cmVjdCB3aWR0aD0iNCIgaGVpZ2h0PSI0IiBmaWxsPSIjZTNkMGIwIi8+CjxyZWN0IHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9IiNkYmM1YTAiLz4KPC9zdmc+');\n            --ink-color: #3e2723;\n            --accent-gold: #c5a059;\n            font-family: 'Cormorant Garamond', serif;\n            color: var(--ink-color);\n        }\n        \n        .grimoire-overlay {\n            background-color: var(--bg-wood);\n            background-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.8) 100%), repeating-linear-gradient(45deg, #2b2018 0, #2b2018 2px, #221912 2px, #221912 4px);\n        }\n\n        .grimoire-scope h1 { font-family: 'Cinzel Decorative', cursive; font-size: 2.5rem; border-bottom: 2px solid var(--accent-gold); display: inline-block; padding-bottom: 10px; margin-bottom: 15px; color: #2c1a16; text-align: center; width: 100%; }\n        .grimoire-scope h2 { font-family: 'Cinzel Decorative', cursive; font-size: 1.8rem; margin-top: 20px; color: #4a3b32; text-align: center; }\n        .grimoire-scope p { font-size: 1.15rem; line-height: 1.6; text-align: justify; margin-bottom: 15px; }\n        \n        .drop-cap::first-letter { font-family: 'Jim Nightshade', cursive; float: left; font-size: 3.5rem; line-height: 0.8; padding-right: 10px; color: #8b0000; }\n        \n        .book-wrapper { background: #5d4037; padding: 15px; border-radius: 10px; box-shadow: inset 0 0 40px rgba(0,0,0,0.8), 0 30px 60px rgba(0,0,0,0.7); display: flex; position: relative; max-width: 1000px; width: 100%; margin: 20px; }\n        .book-wrapper::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 40px; transform: translateX(-50%); background: linear-gradient(90deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.6) 100%); z-index: 10; border-radius: 5px; }\n\n        .page { flex: 1; background-color: var(--page-bg); background-image: var(--page-texture); padding: 30px; position: relative; min-height: 600px; }\n        .page.left { border-radius: 5px 0 0 5px; background: linear-gradient(90deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 10%, rgba(0,0,0,0.1) 95%, rgba(0,0,0,0.4) 100%), var(--page-bg); border-right: 1px solid rgba(0,0,0,0.1); }\n        .page.right { border-radius: 0 5px 5px 0; background: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.1) 5%, rgba(0,0,0,0) 90%, rgba(0,0,0,0.05) 100%), var(--page-bg); border-left: 1px solid rgba(0,0,0,0.1); }\n\n        .corner-decoration { position: absolute; width: 60px; height: 60px; opacity: 0.4; pointer-events: none; }\n        .top-left { top: 10px; left: 10px; } .top-right { top: 10px; right: 10px; transform: rotate(90deg); } .bottom-right { bottom: 10px; right: 10px; transform: rotate(180deg); }\n\n        @media (max-width: 900px) {\n            .book-wrapper { flex-direction: column; max-height: 85vh; overflow-y: auto; }\n            .book-wrapper::before { display: none; }\n            .page { min-height: auto; }\n            .page.left, .page.right { border-radius: 5px; margin-bottom: 5px; }\n        }\n\n        \/* Scrollbar *\/\n        ::-webkit-scrollbar { width: 8px; }\n        ::-webkit-scrollbar-track { background: #f4f1ea; }\n        ::-webkit-scrollbar-thumb { background: #c5a059; border-radius: 4px; }\n    <\/style>\n<\/head>\n<body class=\"bg-alchemy-paper antialiased bg-paper-texture selection:bg-alchemy-gold selection:text-white relative\">\n\n    <div class=\"texture-overlay\"><\/div>\n    <div id=\"toast-container\" class=\"fixed bottom-5 right-5 z-50 flex flex-col gap-2 pointer-events-none\"><\/div>\n\n    <!-- HEADER -->\n    <header class=\"fixed w-full z-40 glass-panel border-b border-paper-border transition-all duration-300\">\n        <div class=\"max-w-7xl mx-auto px-4 h-20 flex items-center justify-between\">\n            <div class=\"flex items-center gap-3 cursor-pointer select-none group\" onclick=\"window.scrollTo(0,0)\">\n                <div class=\"w-10 h-10 border border-alchemy-gold rounded-full flex items-center justify-center relative bg-white overflow-hidden shadow-md\">\n                    <div class=\"absolute inset-0 bg-alchemy-gold\/10 scale-0 group-hover:scale-100 transition-transform rounded-full\"><\/div>\n                    <i data-lucide=\"flower-2\" class=\"text-alchemy-green w-6 h-6 group-hover:rotate-45 transition-transform duration-700 ease-out\"><\/i>\n                <\/div>\n                <div>\n                    <span class=\"block text-alchemy-gold text-[10px] uppercase tracking-[0.3em] font-bold leading-none mb-1\">Association Doyet<\/span>\n                    <h1 class=\"text-xl font-bold text-alchemy-dark tracking-wide leading-none group-hover:text-alchemy-green transition-colors\">Freedom<span class=\"text-alchemy-gold\">Unity<\/span><\/h1>\n                <\/div>\n            <\/div>\n\n            <nav class=\"hidden md:flex space-x-6 text-xs font-bold uppercase tracking-widest text-gray-600\">\n                <a href=\"#almanach\" class=\"hover:text-alchemy-gold transition-colors py-2 border-b-2 border-transparent hover:border-alchemy-gold\">Almanach<\/a>\n                <a href=\"#semiotheque\" class=\"hover:text-alchemy-gold transition-colors py-2 border-b-2 border-transparent hover:border-alchemy-gold\">S\u00e9mioth\u00e8que<\/a>\n                <a href=\"#oracle\" class=\"text-alchemy-gold hover:text-alchemy-dark transition-colors flex items-center gap-1\"><i data-lucide=\"sparkles\" class=\"w-3 h-3\"><\/i> Oracle<\/a>\n                <a href=\"#boutique\" class=\"hover:text-alchemy-gold transition-colors py-2 border-b-2 border-transparent hover:border-alchemy-gold\">Boutique<\/a>\n            <\/nav>\n\n            <div class=\"hidden md:flex items-center gap-2 px-3 py-1 bg-white\/50 border border-alchemy-gold\/20 rounded-full shadow-sm\">\n                <span id=\"auth-dot\" class=\"w-2 h-2 rounded-full bg-gray-400\"><\/span>\n                <span id=\"user-display\" class=\"text-[10px] font-mono text-gray-500\">Connexion&#8230;<\/span>\n            <\/div>\n            \n             <button class=\"md:hidden text-alchemy-dark p-2\" onclick=\"toggleMobileMenu()\"><i data-lucide=\"menu\"><\/i><\/button>\n        <\/div>\n        \n        <div id=\"mobile-menu\" class=\"hidden md:hidden bg-alchemy-paper border-b border-paper-border p-4 absolute w-full shadow-xl z-50\">\n            <nav class=\"flex flex-col space-y-4 text-center font-serif text-alchemy-dark\">\n                <a href=\"#almanach\" onclick=\"toggleMobileMenu()\" class=\"py-2 border-b border-alchemy-gold\/10\">Almanach<\/a>\n                <a href=\"#semiotheque\" onclick=\"toggleMobileMenu()\" class=\"py-2 border-b border-alchemy-gold\/10\">S\u00e9mioth\u00e8que<\/a>\n                <a href=\"#oracle\" onclick=\"toggleMobileMenu()\" class=\"py-2 border-b border-alchemy-gold\/10\">Oracle<\/a>\n                <a href=\"#boutique\" onclick=\"toggleMobileMenu()\" class=\"py-2\">Boutique<\/a>\n            <\/nav>\n        <\/div>\n    <\/header>\n\n    <main class=\"pt-20\">\n\n        <!-- HERO SECTION -->\n        <section class=\"relative py-24 px-4 text-center overflow-hidden min-h-[65vh] flex flex-col justify-center items-center\">\n            <div class=\"absolute inset-0 bg-cover bg-center opacity-10 grayscale mix-blend-multiply pointer-events-none\" style=\"background-image: url('https:\/\/images.unsplash.com\/photo-1518112390430-f4ab02e9c2c8?ixlib=rb-1.2.1&#038;auto=format&#038;fit=crop&#038;w=1950&#038;q=80');\"><\/div>\n            \n            <div class=\"relative z-10 max-w-4xl mx-auto animate-fade-in\">\n                <div class=\"inline-block mb-4 animate-float\">\n                    <i data-lucide=\"infinity\" class=\"w-14 h-14 text-alchemy-gold opacity-90 drop-shadow-md\"><\/i>\n                <\/div>\n                <h1 class=\"text-5xl md:text-7xl font-bold text-alchemy-dark mb-6 leading-tight drop-shadow-sm\">\n                    L&#8217;Alliance de la Terre <br> <span class=\"font-hand text-4xl md:text-6xl text-alchemy-green lowercase\">&#038;<\/span> de l&#8217;Esprit\n                <\/h1>\n                <p class=\"text-lg text-gray-600 mb-10 font-light italic max-w-xl mx-auto\">\n                    &#8220;Un portail quantique \u00e0 Doyet. Cultivez votre jardin, interrogez l&#8217;Oracle et partagez l&#8217;abondance de la Nature.&#8221;\n                <\/p>\n                \n                <div class=\"flex flex-col sm:flex-row gap-4 justify-center\">\n                    <a href=\"#semiotheque\" class=\"px-8 py-3 bg-alchemy-dark text-alchemy-paper font-bold uppercase tracking-widest text-xs hover:bg-alchemy-green transition-all shadow-lg shadow-alchemy-green\/20 rounded-sm transform hover:-translate-y-1\">\n                        \u00c9changer des Graines\n                    <\/a>\n                    <a href=\"#oracle\" class=\"px-8 py-3 border-2 border-alchemy-gold text-alchemy-dark font-bold uppercase tracking-widest text-xs hover:bg-alchemy-gold hover:text-white transition-all rounded-sm flex items-center justify-center gap-2 shadow-sm transform hover:-translate-y-1\">\n                        <i data-lucide=\"brain-circuit\" class=\"w-4 h-4\"><\/i> Parler \u00e0 l&#8217;Oracle\n                    <\/a>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- WIDGET METEO & ALMANACH -->\n        <div id=\"fu-weather-widget\" class=\"max-w-4xl w-full mx-auto font-garamond px-4 -mt-10 relative z-20\">\n            <div class=\"glass-panel rounded-lg p-6 md:p-8 text-ink relative overflow-hidden flex flex-col md:flex-row gap-8 items-stretch\">\n                <!-- COLONNE GAUCHE: METEO -->\n                <div class=\"flex-1\">\n                    <div class=\"flex justify-between items-center mb-4\">\n                        <div>\n                            <h2 class=\"text-xl font-bold font-cinzel text-alchemy-dark flex items-center gap-2\">\n                                <i data-lucide=\"map-pin\" class=\"w-4 h-4 text-alchemy-gold\"><\/i> Doyet\n                            <\/h2>\n                            <p class=\"text-sm italic text-gray-500 mt-1 first-letter:uppercase\" id=\"current-date-meteo\">Chargement&#8230;<\/p>\n                        <\/div>\n                        <div class=\"p-2 border border-alchemy-gold\/30 rounded-full bg-white\/50 shadow-inner\">\n                           <i id=\"main-icon\" data-lucide=\"loader\" class=\"w-8 h-8 text-alchemy-gold animate-spin\"><\/i>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"flex items-center justify-between mb-4\">\n                        <div class=\"flex flex-col\">\n                            <span id=\"current-temp\" class=\"text-5xl font-bold text-alchemy-dark font-cinzel\">&#8211;\u00b0<\/span>\n                            <span id=\"weather-desc\" class=\"text-md font-semibold text-alchemy-green italic mt-1\">Analyse&#8230;<\/span>\n                        <\/div>\n                        <div class=\"space-y-2 text-sm font-semibold border-l border-alchemy-gold\/20 pl-4\">\n                            <div class=\"flex items-center gap-2 text-gray-600\">\n                                <i data-lucide=\"droplets\" class=\"w-4 h-4 text-blue-800\/60\"><\/i>\n                                <span id=\"humidity\">&#8211;%<\/span>\n                            <\/div>\n                            <div class=\"flex items-center gap-2 text-gray-600\">\n                                <i data-lucide=\"wind\" class=\"w-4 h-4 text-gray-400\"><\/i>\n                                <span id=\"wind-speed\">&#8212; km\/h<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"bg-alchemy-paper\/80 p-3 rounded border border-alchemy-gold\/20 text-center\">\n                        <p class=\"text-xs font-bold text-alchemy-gold uppercase mb-1\">Conseil du jour<\/p>\n                        <p id=\"weather-tip\" class=\"text-sm italic text-alchemy-dark\">&#8220;Connectez-vous \u00e0 la terre&#8230;&#8221;<\/p>\n                    <\/div>\n                <\/div>\n                \n                <div class=\"hidden md:block w-px bg-gradient-to-b from-transparent via-alchemy-gold\/40 to-transparent\"><\/div>\n\n                <!-- COLONNE DROITE: PREVISIONS & LUNE -->\n                <div class=\"flex-1 flex flex-col justify-between\">\n                    <div>\n                        <h3 class=\"text-xs font-bold font-cinzel text-gray-400 uppercase mb-4 tracking-widest text-center\">Pr\u00e9visions 3 Jours<\/h3>\n                        <div id=\"forecast-container\" class=\"grid grid-cols-3 gap-2 text-center\">\n                            <!-- Injection JS -->\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"mt-6 pt-4 border-t border-dashed border-alchemy-gold\/30 flex items-center justify-between px-4\">\n                        <div class=\"text-center\">\n                             <span class=\"text-[10px] font-bold text-gray-400 uppercase tracking-widest block mb-1\">Lune<\/span>\n                             <div class=\"text-2xl animate-float\" id=\"moon-icon\">\ud83c\udf11<\/div>\n                        <\/div>\n                        <div class=\"text-right\">\n                            <span class=\"text-[10px] font-bold text-gray-400 uppercase tracking-widest block mb-1\">Cycle<\/span>\n                            <div class=\"text-sm font-bold text-alchemy-dark\" id=\"moon-phase\">Calcul&#8230;<\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- S\u00c9MIOTH\u00c8QUE (Grainoth\u00e8que) -->\n        <section id=\"semiotheque\" class=\"py-20 bg-alchemy-wash border-t border-white\/50 mt-12\">\n            <div class=\"max-w-7xl mx-auto px-4\">\n                \n                <div class=\"text-center mb-10\">\n                    <h2 class=\"text-4xl font-bold text-alchemy-dark\">La S\u00e9mioth\u00e8que<\/h2>\n                    <p class=\"text-gray-600 mt-2 font-serif italic\">&#8220;Une graine contient toutes les for\u00eats futures.&#8221;<\/p>\n                <\/div>\n\n                <!-- Tabs -->\n                <div class=\"flex justify-center gap-8 mb-8 border-b border-gray-300\">\n                    <button id=\"tab-seeds-btn\" class=\"tab-btn active px-4 py-2 text-sm uppercase tracking-widest\" onclick=\"switchTab('seeds')\">Semences<\/button>\n                    <button id=\"tab-know-btn\" class=\"tab-btn px-4 py-2 text-sm uppercase tracking-widest\" onclick=\"switchTab('knowledge')\">Herbier &#038; Rituels<\/button>\n                <\/div>\n\n                <!-- Tab: Semences -->\n                <div id=\"tab-seeds\" class=\"tab-content block animate-fade-in\">\n                    <!-- Toolbar -->\n                    <div class=\"flex flex-col md:flex-row justify-between items-center gap-4 mb-8 bg-white\/40 p-4 rounded border border-white\">\n                        <div class=\"flex flex-wrap gap-2 justify-center\">\n                             <span class=\"text-xs font-bold uppercase tracking-widest self-center text-alchemy-gold mr-2\">Filtrer :<\/span>\n                             <button onclick=\"filterSeeds('all')\" class=\"text-xs hover:text-alchemy-dark text-gray-500 font-bold transition-colors\">Tout<\/button>\n                             <button onclick=\"filterSeeds('L\u00e9gume')\" class=\"text-xs hover:text-alchemy-dark text-gray-500 font-bold transition-colors\">\ud83e\udd55 L\u00e9gumes<\/button>\n                             <button onclick=\"filterSeeds('Fleur')\" class=\"text-xs hover:text-alchemy-dark text-gray-500 font-bold transition-colors\">\ud83c\udf38 Fleurs<\/button>\n                             <button onclick=\"filterSeeds('M\u00e9dicinale')\" class=\"text-xs hover:text-alchemy-dark text-gray-500 font-bold transition-colors\">\ud83c\udf3f Soins<\/button>\n                        <\/div>\n                        <button onclick=\"openModal('seed-modal')\" class=\"bg-alchemy-dark text-alchemy-paper px-5 py-2 rounded-sm text-xs font-bold uppercase tracking-widest hover:bg-alchemy-green transition-colors flex items-center gap-2 shadow-lg shadow-alchemy-dark\/10\">\n                            <i data-lucide=\"plus-circle\" class=\"w-4 h-4\"><\/i> D\u00e9poser une graine\n                        <\/button>\n                    <\/div>\n\n                    <!-- Grid Semences -->\n                    <div id=\"seed-list\" class=\"grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6\">\n                        <!-- Les graines seront inject\u00e9es ici par JS -->\n                        <div class=\"col-span-full text-center py-12\">\n                            <i data-lucide=\"loader-2\" class=\"w-8 h-8 animate-spin mx-auto text-alchemy-gold mb-2\"><\/i>\n                            <p class=\"text-sm text-gray-500\">Ouverture des tiroirs&#8230;<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <!-- Tab: Savoirs (MODIFI\u00c9 POUR OUVRIR LE GRIMOIRE) -->\n                <div id=\"tab-knowledge\" class=\"tab-content hidden animate-fade-in\">\n                    <div class=\"grid grid-cols-1 md:grid-cols-2 gap-8 max-w-4xl mx-auto\">\n                        <!-- Carte ouverture Grimoire Rituels -->\n                        <div onclick=\"openGrimoire()\" class=\"cursor-pointer group bg-white\/40 border-2 border-alchemy-gold\/20 p-8 rounded flex flex-col items-center justify-center hover:bg-alchemy-gold\/10 transition-all hover:scale-[1.02] shadow-sm\">\n                            <i data-lucide=\"book\" class=\"w-16 h-16 text-alchemy-dark mb-4 group-hover:text-alchemy-gold transition-colors\"><\/i>\n                            <h3 class=\"font-serif text-xl text-alchemy-dark font-bold mb-2\">Grimoire des Rituels<\/h3>\n                            <p class=\"text-sm text-gray-600 text-center italic\">&#8220;Ouvrez le livre ancien pour d\u00e9couvrir les cycles lunaires et la magie naturelle.&#8221;<\/p>\n                            <span class=\"mt-4 text-xs font-bold uppercase tracking-widest text-alchemy-gold border-b border-alchemy-gold pb-1\">Consulter<\/span>\n                        <\/div>\n                        \n                        <!-- Placeholder autre savoir -->\n                        <div class=\"bg-white\/40 border-2 border-dashed border-gray-300 p-8 rounded flex flex-col items-center justify-center opacity-70\">\n                            <i data-lucide=\"feather\" class=\"w-16 h-16 text-gray-400 mb-4\"><\/i>\n                            <h3 class=\"font-serif text-xl text-gray-500 font-bold mb-2\">Fiches Plantes<\/h3>\n                            <p class=\"text-sm text-gray-400 text-center italic\">En cours de r\u00e9daction&#8230;<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n            <\/div>\n        <\/section>\n\n        <!-- SECTION LABORATOIRE (Textes corrig\u00e9s pour contraste sur fond clair) -->\n        <section id=\"labo-transmutation\" class=\"py-16 px-4 max-w-4xl mx-auto relative\">\n            \n            <div class=\"absolute inset-0 flex items-center justify-center opacity-10 pointer-events-none overflow-hidden\">\n                <div class=\"w-[500px] h-[500px] border border-alchemy-gold rounded-full animate-[spin_60s_linear_infinite]\"><\/div>\n                <div class=\"absolute w-[350px] h-[350px] border border-alchemy-green rounded-full animate-[spin_40s_linear_infinite_reverse]\"><\/div>\n                <div class=\"absolute text-9xl text-alchemy-gold opacity-20\">\u269b\ufe0f<\/div>\n            <\/div>\n\n            <div class=\"glass-panel p-8 rounded-2xl border border-alchemy-gold\/30 relative z-10 text-center\">\n                \n                <h2 class=\"text-3xl font-bold text-alchemy-dark mb-2\">Le Creuset Int\u00e9rieur<\/h2>\n                <p class=\"text-gray-600 mb-8 italic\">&#8220;D\u00e9posez ici votre charge (le Plomb), nous en ferons de la Lumi\u00e8re (l&#8217;Or).&#8221;<\/p>\n\n                <div class=\"mb-8\">\n                    <label for=\"emotion-input\" class=\"block text-sm font-medium text-gray-500 mb-2\">Quel est l&#8217;\u00e9tat de l&#8217;esprit ou du corps ?<\/label>\n                    <div class=\"flex flex-col md:flex-row justify-center gap-4\">\n                        <select id=\"emotion-input\" class=\"bg-white border border-alchemy-gold\/30 text-alchemy-dark text-lg rounded-lg focus:ring-alchemy-gold focus:border-alchemy-gold block w-full md:w-1\/2 p-3\">\n                            <option value=\"\" disabled selected>&#8212; Choisissez une fr\u00e9quence &#8212;<\/option>\n                            <option value=\"stress\">\u26a1 Stress \/ Anxi\u00e9t\u00e9 (Trop d&#8217;\u00e9nergie mentale)<\/option>\n                            <option value=\"fatigue\">\ud83d\udd0b Fatigue \/ \u00c9puisement (Manque de Feu)<\/option>\n                            <option value=\"doute\">\u2601\ufe0f Doute \/ Confusion (Brouillard)<\/option>\n                            <option value=\"colere\">\ud83d\udd25 Col\u00e8re \/ Frustration (Feu destructeur)<\/option>\n                            <option value=\"creation\">\ud83c\udfa8 Blocage Cr\u00e9atif (Stagnation)<\/option>\n                        <\/select>\n                        \n                        <button onclick=\"transmuteEnergy()\" class=\"bg-alchemy-dark text-white hover:bg-alchemy-green font-bold py-3 px-8 rounded-lg border border-alchemy-gold\/50 shadow-lg transition-all transform hover:scale-105 active:scale-95\">\n                            Transmuter \u2697\ufe0f\n                        <\/button>\n                    <\/div>\n                <\/div>\n\n                <div id=\"elixir-result\" class=\"hidden opacity-0 transition-opacity duration-1000\">\n                    <div class=\"border-t border-alchemy-gold\/20 my-6\"><\/div>\n                    \n                    <h3 class=\"text-2xl font-bold text-alchemy-dark mb-6\">\u2728 Votre Ordonnance Alchimique<\/h3>\n                    \n                    <div class=\"grid grid-cols-1 md:grid-cols-3 gap-6 text-left\">\n                        \n                        <div class=\"bg-alchemy-wash p-4 rounded-lg border-l-4 border-alchemy-green\">\n                            <h4 class=\"text-alchemy-green font-bold mb-1\">\ud83c\udf3f L&#8217;Alli\u00e9 V\u00e9g\u00e9tal<\/h4>\n                            <p id=\"result-plant\" class=\"text-xl font-serif text-alchemy-dark mb-2\">Nom de la plante<\/p>\n                            <p id=\"result-plant-desc\" class=\"text-sm text-gray-600\">Description&#8230;<\/p>\n                        <\/div>\n\n                        <div class=\"bg-alchemy-wash p-4 rounded-lg border-l-4 border-alchemy-gold\">\n                            <h4 class=\"text-amber-600 font-bold mb-1\">\u16dc La Fr\u00e9quence Runique<\/h4>\n                            <div class=\"flex items-center gap-3\">\n                                <span id=\"result-rune-symbol\" class=\"text-4xl text-alchemy-dark\">\u16c9<\/span>\n                                <div>\n                                    <p id=\"result-rune-name\" class=\"text-xl font-serif text-alchemy-dark\">Algiz<\/p>\n                                    <p id=\"result-rune-desc\" class=\"text-xs text-gray-600\">Protection divine<\/p>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n\n                        <div class=\"bg-alchemy-wash p-4 rounded-lg border-l-4 border-purple-500\">\n                            <h4 class=\"text-purple-600 font-bold mb-1\">\ud83e\uddd8 L&#8217;Action Quantique<\/h4>\n                            <p id=\"result-action\" class=\"text-sm text-alchemy-dark italic\">&#8220;Faire ceci&#8230;&#8221;<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n            <\/div>\n        <\/section>\n\n        <!-- HERBIER ALCHIMIQUE -->\n        <section id=\"herbier-alchimique\" class=\"py-16 px-4 max-w-7xl mx-auto\">\n        \n            <div class=\"text-center mb-12\">\n                <h2 class=\"text-3xl md:text-4xl font-bold text-alchemy-dark mb-4\">\n                    L&#8217;Herbier des Signatures\n                <\/h2>\n                <p class=\"text-gray-600 max-w-2xl mx-auto italic\">\n                    &#8220;Ainsi,ce qui est en bas est comme en hauts .&#8221; <br>\n                    R\u00e9pertoire des alli\u00e9s v\u00e9g\u00e9taux, class\u00e9s par influences plan\u00e9taires et vertus quantiques.\n                <\/p>\n            <\/div>\n\n            <div class=\"flex flex-wrap justify-center gap-4 mb-10\" id=\"plant-filters\">\n                <button onclick=\"filterPlants('all')\" class=\"px-4 py-2 rounded-full border border-alchemy-gold\/30 bg-white hover:bg-alchemy-gold hover:text-white text-alchemy-dark transition-all active-filter shadow-sm\">\n                    \u267e\ufe0f Tout Voir\n                <\/button>\n                <button onclick=\"filterPlants('Soleil')\" class=\"px-4 py-2 rounded-full border border-alchemy-gold\/30 bg-white hover:bg-yellow-100 hover:border-yellow-400 text-alchemy-dark transition-all shadow-sm\">\n                    \u2600\ufe0f Soleil (Vitalit\u00e9)\n                <\/button>\n                <button onclick=\"filterPlants('Lune')\" class=\"px-4 py-2 rounded-full border border-alchemy-gold\/30 bg-white hover:bg-blue-50 hover:border-blue-300 text-alchemy-dark transition-all shadow-sm\">\n                    \ud83c\udf11 Lune (Intuition)\n                <\/button>\n                <button onclick=\"filterPlants('Mars')\" class=\"px-4 py-2 rounded-full border border-alchemy-gold\/30 bg-white hover:bg-red-50 hover:border-red-500 text-alchemy-dark transition-all shadow-sm\">\n                    \u2642\ufe0f Mars (D\u00e9fense)\n                <\/button>\n                <button onclick=\"filterPlants('Jupiter')\" class=\"px-4 py-2 rounded-full border border-alchemy-gold\/30 bg-white hover:bg-purple-50 hover:border-purple-400 text-alchemy-dark transition-all shadow-sm\">\n                    \u2643 Jupiter (Sagesse)\n                <\/button>\n            <\/div>\n\n            <div id=\"plants-grid\" class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\n                <!-- Les cartes seront inject\u00e9es ici -->\n            <\/div>\n\n        <\/section>\n\n        <script>\n            \/\/ --- DONN\u00c9ES DES PLANTES ---\n            const plantsData = [\n                {\n                    name: \"Romarin Officinal\",\n                    latin: \"Rosmarinus officinalis\",\n                    planet: \"Soleil\",\n                    planetIcon: \"\u2600\ufe0f\",\n                    element: \"Feu \ud83d\udf02\",\n                    image: \"\ud83c\udf3f\",\n                    medicinal: \"Stimulant h\u00e9patique, tonique circulatoire, aide \u00e0 la m\u00e9moire.\",\n                    quantum: \"Restructure les corps subtils. Br\u00fble les miasmes n\u00e9gatifs. Apporte la clart\u00e9 solaire et le courage d'\u00eatre.\",\n                    usage: \"En teinture m\u00e8re le matin, ou en encens pour purifier le lieu.\"\n                },\n                {\n                    name: \"Sauge Officinale\",\n                    latin: \"Salvia officinalis\",\n                    planet: \"Jupiter\",\n                    planetIcon: \"\u2643\",\n                    element: \"Air \ud83d\udf01\",\n                    image: \"\ud83c\udf43\",\n                    medicinal: \"Antiseptique, r\u00e9gulatrice hormonale, maux de gorge.\",\n                    quantum: \"La 'Sauveuse'. Connecte \u00e0 la sagesse ancestrale. Nettoie le champ aurique avant les rituels.\",\n                    usage: \"Infusion pour la gorge, Fumigation pour l'esprit.\"\n                },\n                {\n                    name: \"Grande Ortie\",\n                    latin: \"Urtica dioica\",\n                    planet: \"Mars\",\n                    planetIcon: \"\u2642\ufe0f\",\n                    element: \"Feu \ud83d\udf02\",\n                    image: \"\ud83c\udf31\",\n                    medicinal: \"Remin\u00e9ralisante (Fer), anti-an\u00e9mique, purifie le sang.\",\n                    quantum: \"\u00c9nergie guerri\u00e8re de protection. Transforme l'agression en force int\u00e9rieure. Coupe les liens toxiques.\",\n                    usage: \"Soupe (racine de Ga\u00efa) ou purin au jardin pour fortifier les autres plantes.\"\n                },\n                {\n                    name: \"M\u00e9lisse\",\n                    latin: \"Melissa officinalis\",\n                    planet: \"Lune\",\n                    planetIcon: \"\ud83c\udf11\",\n                    element: \"Eau \ud83d\udf04\",\n                    image: \"\ud83c\udf19\",\n                    medicinal: \"Calmante, digestive, contre l'anxi\u00e9t\u00e9 et l'insomnie.\",\n                    quantum: \"Apaise le c\u0153ur \u00e9motionnel. Aide \u00e0 dig\u00e9rer les chocs traumatiques. Ouvre la porte des r\u00eaves lucides.\",\n                    usage: \"Infusion fra\u00eeche le soir.\"\n                }\n            ];\n\n            \/\/ --- FONCTION DE LOGIQUE (Laboratoire) ---\n             const alchemicalRemedies = {\n                'stress': {\n                    plant: \"M\u00e9lisse & Aub\u00e9pine\", plantDesc: \"Apaise le c\u0153ur qui s'emballe et calme le syst\u00e8me nerveux.\",\n                    rune: \"Isa (\u16c1)\", runeName: \"ISA - La Glace\", runeDesc: \"Stoppe le flux chaotique. Invite au calme statique et \u00e0 la concentration.\",\n                    action: \"Pratiquez la respiration carr\u00e9e (4-4-4-4) en visualisant une colonne de glace protectrice autour de vous.\"\n                },\n                'fatigue': {\n                    plant: \"Romarin & Ortie\", plantDesc: \"Le Romarin rallume le feu solaire, l'Ortie remin\u00e9ralise la terre du corps.\",\n                    rune: \"Sowilo (\u16cb)\", runeName: \"SOWILO - Le Soleil\", runeDesc: \"Victoire et \u00e9nergie pure. La foudre qui nettoie et recharge.\",\n                    action: \"Sortez imm\u00e9diatement. Exposez votre visage au ciel (m\u00eame gris) et marchez pieds nus si possible pour capter les \u00e9lectrons de la Terre.\"\n                },\n                'doute': {\n                    plant: \"Sauge Officinale\", plantDesc: \"Dissipe les illusions et purifie le mental brumeux.\",\n                    rune: \"Kenaz (\u16b2)\", runeName: \"KENAZ - La Torche\", runeDesc: \"Le feu de la connaissance qui \u00e9claire l'ombre. R\u00e9v\u00e9lation.\",\n                    action: \"\u00c9crivez votre doute sur un papier, puis br\u00fblez-le en observant la flamme. La r\u00e9ponse est dans la cendre.\"\n                },\n                'colere': {\n                    plant: \"Camomille Matricaire\", plantDesc: \"Adoucit l'amertume et transforme l'agressivit\u00e9 en compr\u00e9hension.\",\n                    rune: \"Algiz (\u16c9)\", runeName: \"ALGIZ - Le Roseau\", runeDesc: \"Ancrage souple. Ne pas casser sous la temp\u00eate, mais plier.\",\n                    action: \"Buvez un grand verre d'eau froide lentement. L'eau \u00e9teint le feu excessif de Mars.\"\n                },\n                'creation': {\n                    plant: \"Armoise (Mugwort)\", plantDesc: \"Ouvre le troisi\u00e8me \u0153il et favorise les visions oniriques.\",\n                    rune: \"Ansuz (\u16a8)\", runeName: \"ANSUZ - Le Souffle\", runeDesc: \"Inspiration divine (Odin). La parole cr\u00e9atrice et la communication.\",\n                    action: \"Ne cherchez pas \u00e0 'faire'. Asseyez-vous en silence, \u00e9coutez un son (musique, vent) et laissez l'image venir.\"\n                }\n            };\n\n            function transmuteEnergy() {\n                const input = document.getElementById('emotion-input').value;\n                const resultSection = document.getElementById('elixir-result');\n                if (!input) { alert(\"Veuillez d\u00e9poser une \u00e9motion dans le creuset.\"); return; }\n                const remedy = alchemicalRemedies[input];\n\n                document.getElementById('result-plant').innerText = remedy.plant;\n                document.getElementById('result-plant-desc').innerText = remedy.plantDesc;\n                document.getElementById('result-rune-symbol').innerText = remedy.rune.split(' ')[1].replace(\/[()]\/g, ''); \n                document.getElementById('result-rune-name').innerText = remedy.runeName;\n                document.getElementById('result-rune-desc').innerText = remedy.runeDesc;\n                document.getElementById('result-action').innerText = remedy.action;\n\n                resultSection.classList.remove('hidden');\n                setTimeout(() => { resultSection.classList.remove('opacity-0'); }, 100);\n            }\n\n            \/\/ --- FONCTION D'AFFICHAGE HERBIER ---\n            const grid = document.getElementById('plants-grid');\n\n            function renderPlants(filter = 'all') {\n                grid.innerHTML = ''; \n                \n                plantsData.forEach(plant => {\n                    if (filter !== 'all' && plant.planet !== filter) return;\n\n                    const card = document.createElement('div');\n                    \/\/ Style \"Parchemin\" : Fond blanc cr\u00e8me, texte sombre, bordure fine\n                    card.className = \"bg-white p-6 rounded-xl border border-alchemy-gold\/30 hover:border-[#ffd700] hover:shadow-lg transition-all duration-300 group flex flex-col h-full\";\n                    \n                    let planetColor = \"text-gray-500\";\n                    if(plant.planet === \"Soleil\") planetColor = \"text-yellow-600\";\n                    if(plant.planet === \"Mars\") planetColor = \"text-red-600\";\n                    if(plant.planet === \"Lune\") planetColor = \"text-blue-500\";\n                    if(plant.planet === \"Jupiter\") planetColor = \"text-purple-600\";\n\n                    card.innerHTML = `\n                        <div class=\"flex justify-between items-start mb-4\">\n                            <div class=\"text-4xl bg-alchemy-wash p-3 rounded-full border border-alchemy-gold\/20\">${plant.image}<\/div>\n                            <div class=\"text-right\">\n                                <span class=\"text-xs uppercase tracking-widest text-gray-400 block\">${plant.latin}<\/span>\n                                <div class=\"flex items-center justify-end gap-2 mt-1\">\n                                    <span class=\"text-xs border border-gray-200 rounded px-2 py-0.5 ${planetColor} font-bold bg-gray-50\">${plant.planetIcon} ${plant.planet}<\/span>\n                                    <span class=\"text-xs border border-gray-200 rounded px-2 py-0.5 text-gray-500 bg-gray-50\">${plant.element}<\/span>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        \n                        <h3 class=\"text-xl font-bold text-alchemy-dark mb-2 group-hover:text-alchemy-green transition-colors\">${plant.name}<\/h3>\n                        \n                        <div class=\"mb-4 flex-grow\">\n                            <p class=\"text-sm text-gray-600 mb-2\"><strong class=\"text-alchemy-green\">Physique :<\/strong> ${plant.medicinal}<\/p>\n                            <p class=\"text-sm text-gray-600 italic\"><strong class=\"text-alchemy-gold\">Quantique :<\/strong> \"${plant.quantum}\"<\/p>\n                        <\/div>\n                        \n                        <div class=\"mt-auto pt-4 border-t border-gray-100\">\n                            <p class=\"text-xs text-gray-500\"><strong>Usage :<\/strong> ${plant.usage}<\/p>\n                        <\/div>\n                    `;\n                    grid.appendChild(card);\n                });\n            }\n\n            function filterPlants(category) {\n                renderPlants(category);\n                const buttons = document.querySelectorAll('#plant-filters button');\n                buttons.forEach(btn => {\n                    btn.classList.remove('bg-alchemy-gold', 'text-white');\n                    btn.classList.add('bg-white', 'text-alchemy-dark'); \/\/ Reset style\n                    \n                    \/\/ Style actif\n                    if(btn.textContent.includes(category) || (category === 'all' && btn.textContent.includes('Tout'))) {\n                        btn.classList.remove('bg-white', 'text-alchemy-dark');\n                        btn.classList.add('bg-alchemy-gold', 'text-white');\n                    }\n                });\n            }\n\n            \/\/ Initialisation au chargement\n            document.addEventListener('DOMContentLoaded', () => {\n                renderPlants();\n            });\n        <\/script>\n\n        <!-- ORACLE V\u00c9G\u00c9TAL -->\n        <section id=\"oracle\" class=\"py-24 relative overflow-hidden\">\n            <div class=\"absolute right-0 top-0 w-1\/2 h-full bg-gradient-to-l from-white\/40 to-transparent pointer-events-none\"><\/div>\n            <div class=\"max-w-4xl mx-auto px-4 relative z-10\">\n                <div class=\"text-center mb-10\">\n                    <span class=\"text-alchemy-gold font-bold uppercase tracking-widest text-xs flex items-center justify-center gap-2\">\n                        <span class=\"w-8 h-[1px] bg-alchemy-gold\"><\/span>Intelligence Quantique<span class=\"w-8 h-[1px] bg-alchemy-gold\"><\/span>\n                    <\/span>\n                    <h2 class=\"text-4xl font-bold text-alchemy-dark mt-2\">L&#8217;Oracle de la Source<\/h2>\n                    <p class=\"text-gray-600 mt-2 italic\">Posez une question. L&#8217;esprit de la nature r\u00e9pondra.<\/p>\n                <\/div>\n\n                <div class=\"glass-panel p-8 rounded-lg shadow-2xl relative overflow-hidden transition-all hover:shadow-alchemy-gold\/20 hover:shadow-3xl\">\n                    <div class=\"absolute top-0 left-0 w-16 h-16 border-t-2 border-l-2 border-alchemy-gold\/30 rounded-tl-lg\"><\/div>\n                    <div class=\"absolute bottom-0 right-0 w-16 h-16 border-b-2 border-r-2 border-alchemy-gold\/30 rounded-br-lg\"><\/div>\n\n                    <form id=\"oracle-form\" class=\"relative z-10 mb-6\" onsubmit=\"askOracle(event)\">\n                        <div class=\"flex flex-col sm:flex-row gap-2\">\n                            <input type=\"text\" id=\"oracle-input\" placeholder=\"Ex: Quelle plante pour apaiser mon esprit ?\" class=\"flex-grow bg-white\/90 border border-alchemy-gold\/20 rounded-sm px-4 py-4 text-alchemy-dark placeholder-gray-400 focus:outline-none focus:border-alchemy-gold font-body shadow-inner transition-all focus:ring-1 focus:ring-alchemy-gold\/50\">\n                            <button type=\"submit\" class=\"bg-alchemy-gold text-white px-6 py-3 font-bold uppercase tracking-widest text-xs hover:bg-alchemy-dark transition-colors rounded-sm shadow-md flex items-center justify-center gap-2 sm:w-auto w-full\">\n                                <span>R\u00e9v\u00e9ler<\/span> <i data-lucide=\"sparkles\" class=\"w-4 h-4\"><\/i>\n                            <\/button>\n                        <\/div>\n                    <\/form>\n\n                    <div id=\"oracle-output\" class=\"hidden min-h-[100px] bg-alchemy-paper\/60 p-6 rounded border border-alchemy-gold\/10 transition-all duration-500\">\n                        <div class=\"flex items-start gap-4\">\n                            <div class=\"w-10 h-10 rounded-full bg-alchemy-dark text-alchemy-gold flex items-center justify-center flex-shrink-0 shadow-lg border border-alchemy-gold\/30\">\n                                <i data-lucide=\"bot\" class=\"w-6 h-6\"><\/i>\n                            <\/div>\n                            <div class=\"flex-grow w-full\">\n                                <h4 class=\"font-bold text-xs text-alchemy-gold uppercase tracking-wide mb-2\">R\u00e9ponse de Gaia<\/h4>\n                                <div id=\"oracle-text\" class=\"text-alchemy-dark font-serif text-lg leading-relaxed oracle-content opacity-0 transition-opacity duration-1000\"><\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- BOUTIQUE & M\u00c9DIATH\u00c8QUE (Contenu inchang\u00e9) -->\n        <section id=\"boutique\" class=\"py-20 bg-white border-t border-paper-border\">\n            <div class=\"max-w-7xl mx-auto px-4\">\n                <div class=\"grid grid-cols-1 md:grid-cols-2 gap-16\">\n                    <div>\n                        <div class=\"flex items-center gap-2 mb-6 border-b border-gray-200 pb-2\">\n                            <i data-lucide=\"image\" class=\"text-alchemy-gold\"><\/i>\n                            <h3 class=\"text-2xl font-bold text-alchemy-dark\">M\u00e9diath\u00e8que<\/h3>\n                        <\/div>\n                        <p class=\"text-sm text-gray-600 mb-6 italic\">La m\u00e9moire visuelle de notre \u00e9volution \u00e0 Doyet.<\/p>\n                        <div class=\"grid grid-cols-2 gap-4\">\n                            <div class=\"aspect-video bg-gray-100 rounded overflow-hidden relative group cursor-pointer shadow-sm\">\n                                <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1599598425947-50e2273b0632?ixlib=rb-1.2.1&#038;auto=format&#038;fit=crop&#038;w=600&#038;q=80\" class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-700 filter sepia-[.3]\">\n                            <\/div>\n                            <div class=\"aspect-video bg-gray-100 rounded overflow-hidden relative group cursor-pointer shadow-sm\">\n                                <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1585320806297-9794b3e4eeae?ixlib=rb-1.2.1&#038;auto=format&#038;fit=crop&#038;w=600&#038;q=80\" class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-700 filter sepia-[.3]\">\n                            <\/div>\n                        <\/div>\n                         <button class=\"mt-4 text-xs font-bold text-alchemy-gold uppercase tracking-widest hover:text-alchemy-dark transition-colors flex items-center gap-1\"><i data-lucide=\"plus\"><\/i> Ajouter un souvenir<\/button>\n                    <\/div>\n                    <div>\n                        <div class=\"flex items-center gap-2 mb-6 border-b border-gray-200 pb-2\">\n                            <i data-lucide=\"shopping-bag\" class=\"text-alchemy-gold\"><\/i>\n                            <h3 class=\"text-2xl font-bold text-alchemy-dark\">Boutique Cr\u00e9ative<\/h3>\n                        <\/div>\n                        <p class=\"text-sm text-gray-600 mb-6 italic\">Soutenez les artisans alchimistes de l&#8217;association.<\/p>\n                        <div class=\"space-y-4\">\n                            <div class=\"flex items-center gap-4 p-4 border border-gray-100 rounded hover:shadow-lg transition-all bg-paper-texture group cursor-pointer\">\n                                <div class=\"w-16 h-16 bg-alchemy-green\/10 rounded flex items-center justify-center text-alchemy-green group-hover:bg-alchemy-green group-hover:text-white transition-colors\"><i data-lucide=\"flask-conical\"><\/i><\/div>\n                                <div class=\"flex-grow\">\n                                    <h4 class=\"font-bold text-alchemy-dark group-hover:text-alchemy-green transition-colors\">Huile Essentielle Lavande<\/h4>\n                                    <p class=\"text-xs text-gray-500\">R\u00e9colte 2025 \u2022 Distillation locale<\/p>\n                                <\/div>\n                                <span class=\"font-bold text-alchemy-gold\">12.00 \u20ac<\/span>\n                            <\/div>\n                             <div class=\"flex items-center gap-4 p-4 border border-gray-100 rounded hover:shadow-lg transition-all bg-paper-texture group cursor-pointer\">\n                                <div class=\"w-16 h-16 bg-alchemy-green\/10 rounded flex items-center justify-center text-alchemy-green group-hover:bg-alchemy-green group-hover:text-white transition-colors\"><i data-lucide=\"book\"><\/i><\/div>\n                                <div class=\"flex-grow\">\n                                    <h4 class=\"font-bold text-alchemy-dark group-hover:text-alchemy-green transition-colors\">Grimoire Vierge<\/h4>\n                                    <p class=\"text-xs text-gray-500\">Reliure main \u2022 Papier recycl\u00e9<\/p>\n                                <\/div>\n                                <span class=\"font-bold text-alchemy-gold\">25.00 \u20ac<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- FOOTER -->\n        <footer class=\"bg-alchemy-dark text-alchemy-wash py-12 border-t-4 border-alchemy-gold\">\n            <div class=\"max-w-7xl mx-auto px-4 text-center\">\n                <i data-lucide=\"flower-2\" class=\"w-8 h-8 mx-auto text-alchemy-gold mb-4 animate-spin-slow\"><\/i>\n                <p class=\"font-serif text-xl mb-2\">FreedomUnityFr<\/p>\n                <p class=\"text-xs uppercase tracking-widest text-gray-400 mb-8\">Doyet, Auvergne \u2022 Terre d&#8217;Alchimie<\/p>\n            <\/div>\n        <\/footer>\n\n    <\/main>\n\n    <!-- MODAL GRIMOIRE ANCIEN (Rituels) -->\n    <div id=\"grimoire-modal\" class=\"fixed inset-0 z-[100] hidden grimoire-overlay flex justify-center items-center p-4 backdrop-blur-sm transition-all duration-700 opacity-0 scale-95 grimoire-scope\">\n        <button onclick=\"closeGrimoire()\" class=\"absolute top-5 right-5 text-white\/50 hover:text-alchemy-gold z-50\">\n            <i data-lucide=\"x\" class=\"w-10 h-10\"><\/i>\n        <\/button>\n        \n        <div class=\"grimoire-container\">\n            <div class=\"book-wrapper\">\n                \n                <!-- PAGE DE GAUCHE : Intro & Philosophie -->\n                <div class=\"page left\">\n                     <svg class=\"corner-decoration top-left\" viewBox=\"0 0 100 100\" fill=\"none\" stroke=\"#3e2723\" stroke-width=\"1\">\n                        <path d=\"M10,90 Q10,10 90,10\" \/><path d=\"M15,90 Q15,15 90,15\" \/><circle cx=\"10\" cy=\"10\" r=\"2\" fill=\"#3e2723\"\/>\n                    <\/svg>\n\n                    <div style=\"text-align: center; margin-bottom: 20px;\">\n                        <i data-lucide=\"flower-2\" style=\"width: 40px; height: 40px; color: #8b0000;\"><\/i>\n                    <\/div>\n\n                    <div style=\"text-align: center;\">\n                        <h1>Livre des Rituels<\/h1>\n                        <p style=\"font-style: italic; font-size: 1rem; margin-top: -10px;\">Archives secr\u00e8tes de FreedomUnity<\/p>\n                    <\/div>\n\n                    <div class=\"divider\">\n                        <svg width=\"200\" height=\"20\" viewBox=\"0 0 200 20\">\n                            <path d=\"M0,10 L90,10 M110,10 L200,10 M100,5 L105,10 L100,15 L95,10 Z\" stroke=\"currentColor\" fill=\"none\"\/>\n                        <\/svg>\n                    <\/div>\n\n                    <p class=\"drop-cap\">\n                        Bienvenue dans le cercle sacr\u00e9, cher chercheur. Ces pages contiennent les rituels anciens que nous pratiquons pour honorer la terre de Doyet et aligner nos esprits avec les cycles cosmiques.\n                    <\/p>\n\n                    <p>\n                        Ici, l&#8217;alchimie n&#8217;est pas une l\u00e9gende, c&#8217;est une pratique quotidienne. Transformer le plomb de nos doutes en l&#8217;or de la connaissance.\n                    <\/p>\n\n                    <div class=\"image-frame\" style=\"width: 100%; height: 200px; border: 3px double var(--ink-color); margin: 20px 0; overflow: hidden; position: relative;\">\n                         <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1514539079130-25950c84af65?q=80&#038;w=600&#038;auto=format&#038;fit=crop\" style=\"width: 100%; height: 100%; object-fit: cover; filter: sepia(0.8) contrast(1.2);\" alt=\"Autel de rituels\">\n                    <\/div>\n                <\/div>\n\n                <!-- PAGE DE DROITE : Liste des Rituels -->\n                <div class=\"page right\">\n                     <svg class=\"corner-decoration top-right\" viewBox=\"0 0 100 100\" fill=\"none\" stroke=\"#3e2723\" stroke-width=\"1\">\n                        <path d=\"M10,10 Q90,10 90,90\" \/><path d=\"M10,15 Q85,15 85,90\" \/><circle cx=\"90\" cy=\"10\" r=\"2\" fill=\"#3e2723\"\/>\n                    <\/svg>\n\n                    <h2>Pratiques &#038; C\u00e9l\u00e9brations<\/h2>\n\n                    <p>\n                        Suivez les cycles de la Lune et les f\u00eates de la Roue de l&#8217;Ann\u00e9e (Wicca) pour harmoniser vos \u00e9nergies.\n                    <\/p>\n\n                    <ul style=\"list-style: none; padding-left: 20px; margin-bottom: 20px;\">\n                        <li style=\"margin-bottom: 15px; display: flex; align-items: start;\">\n                            <i data-lucide=\"moon\" style=\"margin-right: 10px; width: 18px; margin-top: 5px; color: #8b0000;\"><\/i> \n                            <div>\n                                <strong>Esbat de la Pleine Lune<\/strong><br>\n                                <span style=\"font-size: 0.9em; font-style: italic;\">Rituel de gratitude et de chargement des cristaux.<\/span>\n                            <\/div>\n                        <\/li>\n                        <li style=\"margin-bottom: 15px; display: flex; align-items: start;\">\n                            <i data-lucide=\"sun\" style=\"margin-right: 10px; width: 18px; margin-top: 5px; color: #c5a059;\"><\/i> \n                            <div>\n                                <strong>Sabbat de Litha (Solstice d&#8217;\u00c9t\u00e9)<\/strong><br>\n                                <span style=\"font-size: 0.9em; font-style: italic;\">C\u00e9l\u00e9bration du feu, de la puissance solaire et des herbes magiques.<\/span>\n                            <\/div>\n                        <\/li>\n                        <li style=\"margin-bottom: 15px; display: flex; align-items: start;\">\n                            <i data-lucide=\"sprout\" style=\"margin-right: 10px; width: 18px; margin-top: 5px; color: #4a6741;\"><\/i> \n                            <div>\n                                <strong>Rituel de la Graine Int\u00e9rieure<\/strong><br>\n                                <span style=\"font-size: 0.9em; font-style: italic;\">M\u00e9ditation pour planter une intention de croissance personnelle.<\/span>\n                            <\/div>\n                        <\/li>\n                    <\/ul>\n\n                    <div class=\"divider\">\u2726 \u2726 \u2726<\/div>\n\n                    <div style=\"text-align: center; margin-top: auto;\">\n                        <p style=\"font-size: 0.9rem;\">&#8220;Que votre volont\u00e9 soit faite, en harmonie avec le Tout.&#8221;<\/p>\n                        <div class=\"signature\">La Gardienne<\/div>\n                    <\/div>\n                    \n                     <svg class=\"corner-decoration bottom-right\" viewBox=\"0 0 100 100\" fill=\"none\" stroke=\"#3e2723\" stroke-width=\"1\">\n                        <path d=\"M10,10 Q10,90 90,90\" \/><path d=\"M15,10 Q15,85 90,85\" \/>\n                    <\/svg>\n                <\/div>\n\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- MODAL AJOUT GRAINE (inchang\u00e9) -->\n    <div id=\"seed-modal\" class=\"fixed inset-0 z-[60] hidden\">\n        <div class=\"absolute inset-0 bg-alchemy-dark\/60 backdrop-blur-sm transition-opacity\" onclick=\"closeModal('seed-modal')\"><\/div>\n        <div class=\"absolute top-1\/2 left-1\/2 transform -translate-x-1\/2 -translate-y-1\/2 w-full max-w-md bg-alchemy-paper p-8 rounded shadow-2xl border border-alchemy-gold animate-fade-in\">\n            <h3 class=\"font-serif text-2xl text-alchemy-dark mb-4 text-center\">Nouvelle Semence<\/h3>\n            <form id=\"seed-form\" onsubmit=\"addSeed(event)\" class=\"space-y-4\">\n                <div>\n                    <label class=\"block text-xs font-bold uppercase tracking-widest text-gray-500 mb-1\">Nom de la plante<\/label>\n                    <input type=\"text\" id=\"seed-name\" required class=\"w-full p-2 border border-gray-300 rounded focus:border-alchemy-gold outline-none bg-white\">\n                <\/div>\n                <div class=\"grid grid-cols-2 gap-4\">\n                    <div>\n                        <label class=\"block text-xs font-bold uppercase tracking-widest text-gray-500 mb-1\">Type<\/label>\n                        <select id=\"seed-type\" class=\"w-full p-2 border border-gray-300 rounded focus:border-alchemy-gold outline-none bg-white\">\n                            <option value=\"L\u00e9gume\">L\u00e9gume<\/option>\n                            <option value=\"Fleur\">Fleur<\/option>\n                            <option value=\"M\u00e9dicinale\">M\u00e9dicinale<\/option>\n                            <option value=\"Arbre\">Arbre<\/option>\n                        <\/select>\n                    <\/div>\n                    <div>\n                        <label class=\"block text-xs font-bold uppercase tracking-widest text-gray-500 mb-1\">Quantit\u00e9<\/label>\n                        <input type=\"text\" id=\"seed-qty\" placeholder=\"Ex: 20 graines\" required class=\"w-full p-2 border border-gray-300 rounded focus:border-alchemy-gold outline-none bg-white\">\n                    <\/div>\n                <\/div>\n                <div>\n                    <label class=\"block text-xs font-bold uppercase tracking-widest text-gray-500 mb-1\">Notes Alchimiques<\/label>\n                    <textarea id=\"seed-notes\" rows=\"3\" placeholder=\"P\u00e9riode de semis, vertus, lune favorable...\" class=\"w-full p-2 border border-gray-300 rounded focus:border-alchemy-gold outline-none bg-white\"><\/textarea>\n                <\/div>\n                <div class=\"flex gap-4 pt-2\">\n                    <button type=\"button\" onclick=\"closeModal('seed-modal')\" class=\"flex-1 py-2 text-xs font-bold uppercase tracking-widest text-gray-500 hover:text-alchemy-dark\">Annuler<\/button>\n                    <button type=\"submit\" class=\"flex-1 bg-alchemy-gold text-white py-2 rounded text-xs font-bold uppercase tracking-widest hover:bg-alchemy-dark transition-colors\">D\u00e9poser<\/button>\n                <\/div>\n            <\/form>\n        <\/div>\n    <\/div>\n\n    <!-- JAVASCRIPT LOGIC -->\n    <script type=\"module\">\n        import { initializeApp } from \"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-app.js\";\n        import { getAuth, signInAnonymously, onAuthStateChanged } from \"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-auth.js\";\n        import { getFirestore, collection, addDoc, onSnapshot, query, orderBy, serverTimestamp } from \"https:\/\/www.gstatic.com\/firebasejs\/11.6.1\/firebase-firestore.js\";\n\n        \/\/ --- CONFIGURATION ---\n        const firebaseConfig = {\n            apiKey: \"AIzaSyBCM1buPKpJ_XjlC6ykqdjLyQrLAdAO41Y\",\n            authDomain: \"freedomunityfr-38760.firebaseapp.com\",\n            projectId: \"freedomunityfr-38760\",\n            storageBucket: \"freedomunityfr-38760.firebasestorage.app\",\n            messagingSenderId: \"123006436672\",\n            appId: \"1:123006436672:web:3eecac93735c634eb266a5\",\n            measurementId: \"G-HY4R8DR7D8\"\n        };\n        const GEMINI_API_KEY = \"AIzaSyCFedvBYBG3mftVIYDW0lLyOdr78zVvD6Y\"; \n\n        let db, auth;\n        lucide.createIcons();\n\n        \/\/ --- GESTION GRIMOIRE (MODAL) ---\n        window.openGrimoire = () => {\n            const modal = document.getElementById('grimoire-modal');\n            modal.classList.remove('hidden');\n            \/\/ Petit d\u00e9lai pour l'animation CSS\n            setTimeout(() => {\n                modal.classList.remove('opacity-0', 'scale-95');\n                modal.classList.add('opacity-100', 'scale-100');\n            }, 50);\n            lucide.createIcons(); \/\/ Re-render icones dans le modal\n        };\n\n        window.closeGrimoire = () => {\n            const modal = document.getElementById('grimoire-modal');\n            modal.classList.remove('opacity-100', 'scale-100');\n            modal.classList.add('opacity-0', 'scale-95');\n            setTimeout(() => {\n                modal.classList.add('hidden');\n            }, 700); \/\/ Attendre fin transition\n        };\n\n        \/\/ --- LOGIQUE METEO ---\n        const LAT = 46.3364;\n        const LON = 2.5478;\n        \n        function getWeatherDetails(code) {\n            const data = {\n                0: { label: \"Ciel Clair\", icon: \"sun\", tip: \"Profitez-en pour a\u00e9rer les serres et pailler.\" },\n                1: { label: \"Peu Nuageux\", icon: \"cloud-sun\", tip: \"Temps id\u00e9al pour les semis en pleine terre.\" },\n                2: { label: \"Nuageux\", icon: \"cloud-sun\", tip: \"V\u00e9rifiez l'humidit\u00e9 sous le paillage.\" },\n                3: { label: \"Couvert\", icon: \"cloud\", tip: \"Bon moment pour le d\u00e9sherbage ou la taille.\" },\n                45: { label: \"Brouillard\", icon: \"cloud-fog\", tip: \"Attention aux maladies cryptogamiques.\" },\n                48: { label: \"Givre\", icon: \"snowflake\", tip: \"Prot\u00e9gez les plantes fragiles ce soir.\" },\n                51: { label: \"Bruine\", icon: \"cloud-drizzle\", tip: \"Id\u00e9al pour planter les salades.\" },\n                53: { label: \"Bruine\", icon: \"cloud-drizzle\", tip: \"R\u00e9coltez de l'eau si possible.\" },\n                55: { label: \"Bruine Forte\", icon: \"cloud-drizzle\", tip: \"Abri n\u00e9cessaire pour les jeunes pousses.\" },\n                61: { label: \"Pluie\", icon: \"cloud-rain\", tip: \"Laissez la nature arroser, reposez-vous.\" },\n                63: { label: \"Pluie\", icon: \"cloud-rain\", tip: \"Surveillez les limaces ce soir !\" },\n                65: { label: \"Forte Pluie\", icon: \"cloud-rain-wind\", tip: \"V\u00e9rifiez que les tuteurs tiennent bon.\" },\n                71: { label: \"Neige\", icon: \"snowflake\", tip: \"La neige prot\u00e8ge le sol, laissez-la.\" },\n                73: { label: \"Neige\", icon: \"snowflake\", tip: \"Secouez les branches des conif\u00e8res.\" },\n                75: { label: \"Temp\u00eate Neige\", icon: \"snowflake\", tip: \"Restez au chaud, \u00e9tudiez vos livres.\" },\n                80: { label: \"Averses\", icon: \"cloud-hail\", tip: \"Le temps change vite, restez vigilant.\" },\n                95: { label: \"Orage\", icon: \"cloud-lightning\", tip: \"\u00c9loignez-vous des grands arbres.\" },\n                96: { label: \"Orage & Gr\u00eale\", icon: \"cloud-lightning\", tip: \"Prot\u00e9gez les cultures si possible !\" }\n            };\n            return data[code] || { label: \"Inconnu\", icon: \"help-circle\", tip: \"Observez la nature et fiez-vous \u00e0 votre instinct.\" };\n        }\n\n        async function fetchWeather() {\n            try {\n                const response = await fetch(`https:\/\/api.open-meteo.com\/v1\/forecast?latitude=${LAT}&longitude=${LON}&current=temperature_2m,relative_humidity_2m,weather_code,wind_speed_10m&daily=weather_code,temperature_2m_max,temperature_2m_min&timezone=Europe%2FBerlin`);\n                const data = await response.json();\n\n                const now = new Date();\n                const options = { weekday: 'long', day: 'numeric', month: 'long' };\n                document.getElementById('current-date-meteo').textContent = now.toLocaleDateString('fr-FR', options);\n\n                const current = data.current;\n                const weatherInfo = getWeatherDetails(current.weather_code);\n                \n                document.getElementById('current-temp').textContent = `${Math.round(current.temperature_2m)}\u00b0`;\n                document.getElementById('weather-desc').textContent = weatherInfo.label;\n                document.getElementById('humidity').textContent = `${current.relative_humidity_2m}%`;\n                document.getElementById('wind-speed').textContent = `${current.wind_speed_10m} km\/h`;\n                document.getElementById('weather-tip').textContent = `\"${weatherInfo.tip}\"`;\n\n                const mainIconEl = document.getElementById('main-icon');\n                mainIconEl.setAttribute('data-lucide', weatherInfo.icon);\n                mainIconEl.classList.remove('animate-spin'); \n\n                const forecastContainer = document.getElementById('forecast-container');\n                forecastContainer.innerHTML = ''; \n\n                for(let i = 1; i <= 3; i++) {\n                    const date = new Date(data.daily.time[i]);\n                    const dayName = date.toLocaleDateString('fr-FR', { weekday: 'short' }).replace('.', '');\n                    const code = data.daily.weather_code[i];\n                    const info = getWeatherDetails(code);\n                    const maxTemp = Math.round(data.daily.temperature_2m_max[i]);\n                    const minTemp = Math.round(data.daily.temperature_2m_min[i]);\n\n                    const div = document.createElement('div');\n                    div.className = \"flex flex-col items-center p-2 border border-stone-800\/10 rounded hover:bg-alchemy-gold\/10 transition-colors\";\n                    div.innerHTML = `\n                        <span class=\"text-[10px] font-bold text-gray-500 mb-1 uppercase tracking-wide font-cinzel\">${dayName}<\/span>\n                        <i data-lucide=\"${info.icon}\" class=\"w-5 h-5 text-alchemy-dark mb-1\"><\/i>\n                        <div class=\"text-sm font-bold text-alchemy-dark\">\n                            ${maxTemp}\u00b0 <span class=\"text-gray-400 font-normal text-xs\">${minTemp}\u00b0<\/span>\n                        <\/div>\n                    `;\n                    forecastContainer.appendChild(div);\n                }\n\n                const knownNewMoon = new Date('2024-01-11');\n                const diffTime = Math.abs(now - knownNewMoon);\n                const diffDays = Math.ceil(diffTime \/ (1000 * 60 * 60 * 24));\n                const cycleDay = diffDays % 29.53;\n                let moonIcon = '\ud83c\udf11';\n                let moonText = 'Nouvelle';\n                \n                if(cycleDay < 7.4) { moonIcon = '\ud83c\udf12'; moonText = 'Croissante'; }\n                else if(cycleDay < 14.8) { moonIcon = '\ud83c\udf15'; moonText = 'Pleine'; }\n                else if(cycleDay < 22.1) { moonIcon = '\ud83c\udf16'; moonText = 'D\u00e9crois.'; }\n                else { moonIcon = '\ud83c\udf18'; moonText = 'Balsamique'; }\n\n                document.getElementById('moon-icon').textContent = moonIcon;\n                document.getElementById('moon-phase').textContent = moonText;\n\n                lucide.createIcons();\n            } catch (error) {\n                console.error(\"Erreur m\u00e9t\u00e9o:\", error);\n            }\n        }\n\n        \/\/ --- GESTION UI GENERALE ---\n        const mockSeeds = [\n            { name: \"Tomate Noire de Crim\u00e9e\", type: \"L\u00e9gume\", qty: \"30 graines\", notes: \"Vari\u00e9t\u00e9 ancienne, go\u00fbt fum\u00e9. \u00c0 semer en lune montante.\" },\n            { name: \"Calendula Officinal\", type: \"M\u00e9dicinale\", qty: \"Une poign\u00e9e\", notes: \"Pour les baumes apaisants. Fleurs solaires.\" },\n            { name: \"Courge Butternut\", type: \"L\u00e9gume\", qty: \"12 graines\", notes: \"Coureuse. Besoin d'un sol riche en compost.\" },\n            { name: \"Sauge Blanche\", type: \"M\u00e9dicinale\", qty: \"Rare\", notes: \"Purification des lieux. Demande du soleil et un sol drain\u00e9.\" },\n        ];\n\n        function renderSeeds(seeds) {\n            const container = document.getElementById('seed-list');\n            container.innerHTML = '';\n            seeds.forEach(seed => {\n                const card = document.createElement('div');\n                card.className = \"bg-white p-6 rounded border border-gray-100 shadow-sm hover:shadow-md transition-all hover:-translate-y-1 relative overflow-hidden group\";\n                let icon = 'sprout';\n                let color = 'text-alchemy-green';\n                if(seed.type === 'Fleur') { icon = 'flower'; color = 'text-pink-600'; }\n                if(seed.type === 'M\u00e9dicinale') { icon = 'flask-conical'; color = 'text-purple-600'; }\n\n                card.innerHTML = `\n                    <div class=\"absolute top-0 right-0 p-2 opacity-10 group-hover:opacity-20 transition-opacity\">\n                        <i data-lucide=\"${icon}\" class=\"w-16 h-16 ${color}\"><\/i>\n                    <\/div>\n                    <span class=\"text-[10px] font-bold uppercase tracking-widest text-gray-400 border border-gray-200 px-2 py-1 rounded-full\">${seed.type}<\/span>\n                    <h4 class=\"font-serif text-lg text-alchemy-dark mt-3 font-bold\">${seed.name}<\/h4>\n                    <p class=\"text-sm text-alchemy-gold font-bold mb-2\">${seed.qty}<\/p>\n                    <p class=\"text-xs text-gray-500 italic leading-relaxed border-t border-gray-100 pt-2\">\"${seed.notes}\"<\/p>\n                    <button class=\"mt-4 w-full text-center text-xs font-bold uppercase tracking-widest text-alchemy-dark hover:bg-alchemy-wash py-2 rounded transition-colors group-hover:bg-alchemy-gold group-hover:text-white\">R\u00e9server<\/button>\n                `;\n                container.appendChild(card);\n            });\n            lucide.createIcons();\n        }\n\n        window.toggleMobileMenu = () => document.getElementById('mobile-menu').classList.toggle('hidden');\n        window.switchTab = (tabName) => {\n            document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden'));\n            document.querySelectorAll('.tab-btn').forEach(el => el.classList.remove('active'));\n            document.getElementById(`tab-${tabName}`).classList.remove('hidden');\n            if(tabName === 'seeds') document.getElementById('tab-seeds-btn').classList.add('active');\n            else document.getElementById('tab-know-btn').classList.add('active');\n        };\n        window.openModal = (id) => document.getElementById(id).classList.remove('hidden');\n        window.closeModal = (id) => document.getElementById(id).classList.add('hidden');\n        window.filterSeeds = (type) => { if(type === 'all') renderSeeds(mockSeeds); else renderSeeds(mockSeeds.filter(s => s.type === type)); };\n        window.addSeed = (e) => {\n            e.preventDefault();\n            const name = document.getElementById('seed-name').value;\n            const type = document.getElementById('seed-type').value;\n            const qty = document.getElementById('seed-qty').value;\n            const notes = document.getElementById('seed-notes').value;\n            mockSeeds.unshift({name, type, qty, notes});\n            renderSeeds(mockSeeds);\n            closeModal('seed-modal');\n            showToast(`Semence de ${name} ajout\u00e9e au conservatoire !`, 'success');\n            e.target.reset();\n        };\n\n        window.askOracle = async (e) => {\n            e.preventDefault();\n            const input = document.getElementById('oracle-input');\n            const output = document.getElementById('oracle-output');\n            const textEl = document.getElementById('oracle-text');\n            const question = input.value;\n            if(!question) return;\n\n            output.classList.remove('hidden');\n            textEl.style.opacity = '0';\n            textEl.innerHTML = '<span class=\"animate-pulse flex items-center gap-2\"><i data-lucide=\"loader\" class=\"w-4 h-4 animate-spin\"><\/i> Connexion \u00e0 la Noosph\u00e8re...<\/span>';\n            lucide.createIcons();\n\n            try {\n                const response = await fetch(`https:\/\/generativelanguage.googleapis.com\/v1beta\/models\/gemini-2.5-flash-preview-09-2025:generateContent?key=${GEMINI_API_KEY}`, {\n                    method: \"POST\", headers: { \"Content-Type\": \"application\/json\" },\n                    body: JSON.stringify({\n                        contents: [{ parts: [{ text: `Tu incarnes l'esprit d'une vieille druidesse alchimiste vivant \u00e0 Doyet. Tu es bienveillante, myst\u00e9rieuse et tr\u00e8s connect\u00e9e \u00e0 la terre. IMPORTANT: R\u00e9ponds \u00e0 la question suivante en utilisant le format Markdown pour structurer ta r\u00e9ponse. Utilise du **gras** pour les mots cl\u00e9s importants. Utilise des listes \u00e0 puces si tu donnes plusieurs conseils. Fais des paragraphes courts. Reste po\u00e9tique mais donne un conseil pratique. Question: \"${question}\"` }] }]\n                    })\n                });\n                const data = await response.json();\n                if (data.error) throw new Error(data.error.message);\n                const aiResponse = data.candidates[0].content.parts[0].text;\n                const htmlContent = marked.parse(aiResponse);\n                textEl.innerHTML = htmlContent;\n                requestAnimationFrame(() => { textEl.style.opacity = '1'; });\n            } catch (error) {\n                console.error(\"Erreur Oracle:\", error);\n                textEl.innerHTML = \"<em>Les nuages cachent la lune ce soir... R\u00e9essayez plus tard.<\/em>\";\n                textEl.style.opacity = '1';\n            }\n        };\n\n        function showToast(message, type = 'info') {\n            const container = document.getElementById('toast-container');\n            const toast = document.createElement('div');\n            toast.className = \"bg-alchemy-dark text-white px-6 py-3 rounded shadow-lg flex items-center gap-3 animate-fade-in border border-alchemy-gold\/50\";\n            toast.innerHTML = `<i data-lucide=\"leaf\" class=\"text-alchemy-gold w-4 h-4\"><\/i> <span class=\"text-sm font-bold\">${message}<\/span>`;\n            container.appendChild(toast);\n            lucide.createIcons();\n            setTimeout(() => toast.remove(), 4000);\n        }\n\n        document.addEventListener('DOMContentLoaded', () => {\n            fetchWeather();\n            setInterval(fetchWeather, 1800000);\n            renderSeeds(mockSeeds);\n            try {\n                const app = initializeApp(firebaseConfig);\n                auth = getAuth(app);\n                db = getFirestore(app);\n                signInAnonymously(auth).then(() => {\n                    document.getElementById('auth-dot').className = \"w-2 h-2 rounded-full bg-green-500 animate-pulse shadow-[0_0_8px_rgba(34,197,94,0.6)]\";\n                    document.getElementById('user-display').textContent = \"Gardien Connect\u00e9\";\n                    showToast(\"Connexion au r\u00e9seau Doyet \u00e9tablie.\", \"success\");\n                }).catch(err => {\n                    console.error(\"Erreur Auth:\", err);\n                    document.getElementById('user-display').textContent = \"Mode Invit\u00e9\";\n                });\n            } catch(err) { console.log(\"Erreur Init:\", err); }\n        });\n    <\/script>\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>FreedomUnityFr &#8211; Portail Alchimique Association Doyet FreedomUnity Almanach S\u00e9mioth\u00e8que Oracle Boutique Connexion&#8230; Almanach S\u00e9mioth\u00e8que Oracle Boutique L&#8217;Alliance de la Terre &#038; de l&#8217;Esprit &#8220;Un portail quantique \u00e0 Doyet. Cultivez votre jardin, interrogez l&#8217;Oracle et partagez l&#8217;abondance de la Nature.&#8221; \u00c9changer des Graines Parler \u00e0 l&#8217;Oracle Doyet Chargement&#8230; &#8211;\u00b0 Analyse&#8230; &#8211;% &#8212; km\/h Conseil du jour &#8220;Connectez-vous \u00e0 la terre&#8230;&#8221; Pr\u00e9visions 3 Jours Lune \ud83c\udf11 Cycle Calcul&#8230; La S\u00e9mioth\u00e8que &#8220;Une graine contient toutes les for\u00eats futures.&#8221; Semences Herbier &#038; Rituels Filtrer : Tout \ud83e\udd55 L\u00e9gumes \ud83c\udf38 Fleurs \ud83c\udf3f Soins D\u00e9poser une graine Ouverture des tiroirs&#8230; Grimoire des Rituels &#8220;Ouvrez le livre ancien pour d\u00e9couvrir les cycles lunaires et la magie naturelle.&#8221; Consulter Fiches Plantes En cours de r\u00e9daction&#8230; \u269b\ufe0f Le Creuset Int\u00e9rieur &#8220;D\u00e9posez ici votre charge (le Plomb), nous en ferons de la Lumi\u00e8re (l&#8217;Or).&#8221; Quel est l&#8217;\u00e9tat de l&#8217;esprit ou du corps ? &#8212; Choisissez une fr\u00e9quence &#8212;\u26a1 Stress \/ Anxi\u00e9t\u00e9 (Trop d&#8217;\u00e9nergie mentale)\ud83d\udd0b Fatigue \/ \u00c9puisement (Manque de Feu)\u2601\ufe0f Doute \/ Confusion (Brouillard)\ud83d\udd25 Col\u00e8re \/ Frustration (Feu destructeur)\ud83c\udfa8 Blocage Cr\u00e9atif (Stagnation) Transmuter \u2697\ufe0f \u2728 Votre Ordonnance Alchimique \ud83c\udf3f L&#8217;Alli\u00e9 V\u00e9g\u00e9tal Nom de la plante Description&#8230; \u16dc La Fr\u00e9quence Runique \u16c9 Algiz Protection divine \ud83e\uddd8 L&#8217;Action Quantique &#8220;Faire ceci&#8230;&#8221; L&#8217;Herbier des Signatures &#8220;Ainsi,ce qui est en bas est comme en hauts .&#8221; R\u00e9pertoire des alli\u00e9s v\u00e9g\u00e9taux, class\u00e9s par influences plan\u00e9taires et vertus quantiques. \u267e\ufe0f Tout Voir \u2600\ufe0f Soleil (Vitalit\u00e9) \ud83c\udf11 Lune (Intuition) \u2642\ufe0f Mars (D\u00e9fense) \u2643 Jupiter (Sagesse) Intelligence Quantique L&#8217;Oracle de la Source Posez une question. L&#8217;esprit de la nature r\u00e9pondra. R\u00e9v\u00e9ler R\u00e9ponse de Gaia M\u00e9diath\u00e8que La m\u00e9moire visuelle de notre \u00e9volution \u00e0 Doyet. Ajouter un souvenir Boutique Cr\u00e9ative Soutenez les artisans alchimistes de l&#8217;association. Huile Essentielle Lavande R\u00e9colte 2025 \u2022 Distillation locale 12.00 \u20ac Grimoire Vierge Reliure main \u2022 Papier recycl\u00e9 25.00 \u20ac FreedomUnityFr Doyet, Auvergne \u2022 Terre d&#8217;Alchimie Livre des Rituels Archives secr\u00e8tes de FreedomUnity Bienvenue dans le cercle sacr\u00e9, cher chercheur. Ces pages contiennent les rituels anciens que nous pratiquons pour honorer la terre de Doyet et aligner nos esprits avec les cycles cosmiques. Ici, l&#8217;alchimie n&#8217;est pas une l\u00e9gende, c&#8217;est une pratique quotidienne. Transformer le plomb de nos doutes en l&#8217;or de la connaissance. Pratiques &#038; C\u00e9l\u00e9brations Suivez les cycles de la Lune et les f\u00eates de la Roue de l&#8217;Ann\u00e9e (Wicca) pour harmoniser vos \u00e9nergies. Esbat de la Pleine Lune Rituel de gratitude et de chargement des cristaux. Sabbat de Litha (Solstice d&#8217;\u00c9t\u00e9) C\u00e9l\u00e9bration du feu, de la puissance solaire et des herbes magiques. Rituel de la Graine Int\u00e9rieure M\u00e9ditation pour planter une intention de croissance personnelle. \u2726 \u2726 \u2726 &#8220;Que votre volont\u00e9 soit faite, en harmonie avec le Tout.&#8221; La Gardienne Nouvelle Semence Nom de la plante Type L\u00e9gumeFleurM\u00e9dicinaleArbre Quantit\u00e9 Notes Alchimiques Annuler D\u00e9poser<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"blank-slate-template.php","meta":{"footnotes":""},"class_list":["post-140","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/pages\/140","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/comments?post=140"}],"version-history":[{"count":6,"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/pages\/140\/revisions"}],"predecessor-version":[{"id":175,"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/pages\/140\/revisions\/175"}],"wp:attachment":[{"href":"https:\/\/freedomunityfr.org\/index.php\/wp-json\/wp\/v2\/media?parent=140"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}