diff --git a/.githooks/pre-commit b/.githooks/pre-commit
new file mode 100755
index 0000000..e55d6f7
--- /dev/null
+++ b/.githooks/pre-commit
@@ -0,0 +1,14 @@
+#!/usr/bin/env sh
+set -eu
+
+ROOT_DIR="$(git rev-parse --show-toplevel)"
+cd "$ROOT_DIR"
+
+if ! command -v python3 >/dev/null 2>&1; then
+  echo "[sitemap] python3 not found; cannot generate sitemap." >&2
+  exit 1
+fi
+
+python3 scripts/generate_sitemap.py
+git add sitemap.html
+
diff --git a/.github/workflows/sitemap-scheduled-update.yml b/.github/workflows/sitemap-scheduled-update.yml
new file mode 100644
index 0000000..8613391
--- /dev/null
+++ b/.github/workflows/sitemap-scheduled-update.yml
@@ -0,0 +1,38 @@
+name: Scheduled Sitemap Update
+
+on:
+  schedule:
+    - cron: "23 2 * * *"
+  workflow_dispatch:
+
+permissions:
+  contents: write
+
+jobs:
+  update-sitemap:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: "3.11"
+
+      - name: Generate sitemap
+        run: python3 scripts/generate_sitemap.py
+
+      - name: Commit and push if changed
+        run: |
+          if git diff --quiet -- sitemap.html; then
+            echo "No sitemap changes."
+            exit 0
+          fi
+
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          git add sitemap.html
+          git commit -m "chore: auto-update sitemap"
+          git push
diff --git a/news/data/index.html b/news/data/index.html
index b127809..c417d28 100644
--- a/news/data/index.html
+++ b/news/data/index.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Data - GasGx Mining News</title>
+    <title>GasGx Canada Dashboard</title>
 
     <script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
     <script src="https://cdn.tailwindcss.com"></script>
diff --git "a/news/flash/index - \345\211\257\346\234\254.html" "b/news/flash/index - \345\211\257\346\234\254.html"
index 49ad336..46f9274 100644
--- "a/news/flash/index - \345\211\257\346\234\254.html"	
+++ "b/news/flash/index - \345\211\257\346\234\254.html"	
@@ -195,7 +195,7 @@ <h3 class="text-white font-bold text-xl mb-2 font-header tracking-wide uppercase
 
                 <div class="tech-card rounded-xl p-6 bg-[#080808]">
                     <div class="flex items-center justify-between mb-4">
-                        <h3 class="text-sm font-bold text-white uppercase tracking-widest">Market Pulse</h3>
+                        <h3 class="text-sm font-bold text-white uppercase tracking-widest">Homepage Pulse</h3>
                         <span class="w-2 h-2 rounded-full bg-gas-green animate-pulse"></span>
                     </div>
                     <div id="sidebar-market-pulse" class="space-y-3">
@@ -465,16 +465,16 @@ <h3 class="text-lg lg:text-xl font-bold text-white mb-3 leading-relaxed lg:leadi
                 const container = document.getElementById('sidebar-market-pulse');
                 if(!container) return;
                 try {
-                    const { data } = await _supabase.from('market_metrics').select('*').limit(5);
+                    const { data } = await _supabase.from('homepage_scrolling_data').select('*').order('sort_order').limit(5);
                     if(data) {
                         container.innerHTML = data.map(item => `
                             <div class="flex items-center justify-between border-b border-white/5 pb-2 last:border-0">
                                 <div>
                                     <div class="text-[10px] text-gray-500 uppercase">${item.label}</div>
-                                    <div class="text-sm font-mono font-bold text-white">${item.value} <span class="text-[10px] text-gray-600">${item.unit||''}</span></div>
+                                    <div class="text-sm font-mono font-bold text-white">${item.display_value ?? item.value ?? '--'} <span class="text-[10px] text-gray-600">${item.unit||''}</span></div>
                                 </div>
-                                <div class="${item.trend=='up'?'text-gas-green':(item.trend=='down'?'text-red-500':'text-gray-500')} text-xs font-bold">
-                                    ${item.change_24h}
+                                <div class="${item.status==='positive'?'text-gas-green':(item.status==='negative'?'text-red-500':'text-gray-500')} text-xs font-bold">
+                                    ${item.secondary_text ?? item.change_24h ?? '--'}
                                 </div>
                             </div>
                         `).join('');
@@ -577,4 +577,3 @@ <h3 class="text-lg lg:text-xl font-bold text-white mb-3 leading-relaxed lg:leadi
 <script type="module" src="/news/shared/modules/legacy-shell.bootstrap.js"></script>
 </body>
 </html>
-
diff --git a/news/modules/main.module.js b/news/modules/main.module.js
index 7fa76af..3baad92 100644
--- a/news/modules/main.module.js
+++ b/news/modules/main.module.js
@@ -13,6 +13,9 @@ const DB_NAME = 'GasGxFlashDB';
 const DB_VERSION = 1;
 const FLASH_FETCH_LIMIT = 120;
 const FLASH_POLL_INTERVAL_MS = 600000;
+const HERO_IMAGE_ROTATE_INTERVAL_MS = 15 * 60 * 1000;
+const HERO_REFRESH_INTERVAL_MS = 60 * 1000;
+const HERO_FETCH_LIMIT = 60;
 
 const MAIN_TEMPLATE = `
 <section class="ggx-main-module">
@@ -48,7 +51,7 @@ const MAIN_TEMPLATE = `
         <div class="mb-12">
             <h3 class="text-lg font-bold text-white mb-4 flex items-center gap-2 px-1">
                 <i class="fa-solid fa-wave-square text-gas-green"></i>
-                <span>Market Pulse</span>
+                <span>Homepage Pulse</span>
             </h3>
             <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4" id="ggx-market-pulse-container">
                 <div class="bg-[#111] h-24 rounded-xl animate-pulse"></div>
@@ -194,6 +197,8 @@ export function createNewsHomeApp() {
             currentOffset: 0,
             isLoading: false,
             flashData: [],
+            homepageMetricsCache: null,
+            homepageMetricsPromise: null,
             translations: {},
             generatedPosterUrl: null,
             currentUser: null,
@@ -202,12 +207,17 @@ export function createNewsHomeApp() {
             flashPollTimer: null,
             flashVisibilityHandler: null,
             lastFlashAutoFetchAt: 0,
+            heroRefreshTimer: null,
+            heroVisibilityHandler: null,
+            lastHeroRefreshAt: 0,
+            feedDedupKeys: new Set(),
         },
 
         async init() {
             await this.initAuth();
             this.renderNav();
-            this.loadHero();
+            await this.loadHero();
+            this.startHeroAutoRefresh();
             this.loadMarketPulse();
             this.loadLiveData();
             this.loadFeed('latest', true);
@@ -244,6 +254,54 @@ export function createNewsHomeApp() {
             });
         },
 
+        startHeroAutoRefresh() {
+            this.state.lastHeroRefreshAt = Date.now();
+            if (this.state.heroRefreshTimer) clearInterval(this.state.heroRefreshTimer);
+            this.state.heroRefreshTimer = setInterval(() => {
+                if (!document.hidden && this.shouldRunHeroAutoFetch()) this.loadHero(true);
+            }, HERO_REFRESH_INTERVAL_MS);
+
+            if (this.state.heroVisibilityHandler) {
+                document.removeEventListener('visibilitychange', this.state.heroVisibilityHandler);
+            }
+            this.state.heroVisibilityHandler = () => {
+                if (!document.hidden && this.shouldRunHeroAutoFetch()) this.loadHero(true);
+            };
+            document.addEventListener('visibilitychange', this.state.heroVisibilityHandler);
+        },
+
+        async ensureHomepageMetrics() {
+            if (Array.isArray(this.state.homepageMetricsCache)) {
+                return this.state.homepageMetricsCache;
+            }
+            if (this.state.homepageMetricsPromise) {
+                return this.state.homepageMetricsPromise;
+            }
+
+            this.state.homepageMetricsPromise = _supabase
+                .from('homepage_scrolling_data')
+                .select('*')
+                .order('sort_order', { ascending: true })
+                .then(({ data, error }) => {
+                    if (error) {
+                        console.error(error);
+                        return [];
+                    }
+                    return Array.isArray(data) ? data : [];
+                })
+                .catch((error) => {
+                    console.error(error);
+                    return [];
+                })
+                .finally(() => {
+                    this.state.homepageMetricsPromise = null;
+                });
+
+            const metrics = await this.state.homepageMetricsPromise;
+            this.state.homepageMetricsCache = metrics;
+            return metrics;
+        },
+
         async initAuth() {
             try {
                 const {
@@ -352,6 +410,10 @@ export function createNewsHomeApp() {
             return Date.now() - this.state.lastFlashAutoFetchAt >= FLASH_POLL_INTERVAL_MS;
         },
 
+        shouldRunHeroAutoFetch() {
+            return Date.now() - this.state.lastHeroRefreshAt >= HERO_REFRESH_INTERVAL_MS;
+        },
+
         async fetchAndMergeFlash(isAuto = false) {
             if (isAuto) this.state.lastFlashAutoFetchAt = Date.now();
             try {
@@ -738,6 +800,83 @@ export function createNewsHomeApp() {
             return `https://www.gasgx.com/news/article/${articleId}/images/${normalizedCover}`;
         },
 
+        hasRenderableCover(item) {
+            if (!item || typeof item !== 'object') return false;
+            const articleId = item.app_id || item.api_id || item.id;
+            const coverImage = String(item.cover_image || '').trim();
+            if (!coverImage) return false;
+            if (/^https?:\/\//i.test(coverImage)) return true;
+            return Boolean(articleId);
+        },
+
+        async fetchFeedRows(category, from, limit, seenDedupKeys = null) {
+            if (category !== 'latest') {
+                let query = _supabase.from('articles').select('*').order('time', { ascending: false }).range(from, from + limit - 1);
+                query = query.eq('tag', `${category.charAt(0).toUpperCase()}${category.slice(1)}`);
+                const { data, error } = await query;
+                if (error) throw error;
+                const rows = Array.isArray(data) ? data : [];
+                return {
+                    rows,
+                    nextOffset: from + rows.length,
+                    exhausted: rows.length < limit,
+                };
+            }
+
+            const batchSize = Math.max(limit, 8);
+            let cursor = from;
+            let exhausted = false;
+            const rows = [];
+            const pickedKeys = new Set();
+            const alreadySeen = seenDedupKeys instanceof Set ? seenDedupKeys : null;
+
+            for (let guard = 0; guard < 10 && rows.length < limit; guard += 1) {
+                const { data, error } = await _supabase
+                    .from('articles')
+                    .select('*')
+                    .order('time', { ascending: false })
+                    .range(cursor, cursor + batchSize - 1);
+                if (error) throw error;
+
+                const chunk = Array.isArray(data) ? data : [];
+                if (!chunk.length) {
+                    exhausted = true;
+                    break;
+                }
+
+                cursor += chunk.length;
+                const uniques = chunk.filter((item) => {
+                    if (!this.hasRenderableCover(item)) return false;
+                    const dedupKey = this.getArticleDedupKey(item) || `id:${this.getArticleIdentity(item)}`;
+                    if (!dedupKey) return true;
+                    if (pickedKeys.has(dedupKey)) return false;
+                    if (alreadySeen && alreadySeen.has(dedupKey)) return false;
+                    pickedKeys.add(dedupKey);
+                    return true;
+                });
+                rows.push(...uniques);
+
+                if (chunk.length < batchSize) {
+                    exhausted = true;
+                    break;
+                }
+            }
+
+            const finalRows = rows.slice(0, limit);
+            if (alreadySeen) {
+                finalRows.forEach((item) => {
+                    const dedupKey = this.getArticleDedupKey(item) || `id:${this.getArticleIdentity(item)}`;
+                    if (dedupKey) alreadySeen.add(dedupKey);
+                });
+            }
+
+            return {
+                rows: finalRows,
+                nextOffset: cursor,
+                exhausted,
+            };
+        },
+
         getAuthorAvatarUrl(item) {
             const fallback = '/news/author_avatar/GasGx-Researcher.png';
             if (!item || typeof item !== 'object') return fallback;
@@ -764,13 +903,89 @@ export function createNewsHomeApp() {
             return articleId ? `https://www.gasgx.com/news/article/${articleId}` : '#';
         },
 
-        async loadHero() {
+        getArticleIdentity(item) {
+            if (!item || typeof item !== 'object') return '';
+            return String(item.app_id || item.api_id || item.id || '');
+        },
+
+        getHeroRotationSeed() {
+            return Math.floor(Date.now() / HERO_IMAGE_ROTATE_INTERVAL_MS);
+        },
+
+        normalizeArticleText(value) {
+            return String(value || '')
+                .trim()
+                .toLowerCase()
+                .replace(/\s+/g, ' ');
+        },
+
+        normalizeCoverKey(value) {
+            const raw = String(value || '').trim();
+            if (!raw) return '';
+            if (/^https?:\/\//i.test(raw)) {
+                try {
+                    const parsed = new URL(raw);
+                    return `${parsed.hostname}${parsed.pathname}`.toLowerCase();
+                } catch (e) {
+                    return raw.toLowerCase();
+                }
+            }
+            return raw.replace(/^\.?\/*(images\/)?/i, '').toLowerCase();
+        },
+
+        getArticleDedupKey(item) {
+            if (!item || typeof item !== 'object') return '';
+
+            const title = this.normalizeArticleText(item.main_title);
+            const cover = this.normalizeCoverKey(item.cover_image);
+            const link = this.normalizeArticleText(item.link);
+            const subheading = this.normalizeArticleText(item.subheading);
+
+            if (title && cover) return `tc:${title}::${cover}`;
+            if (title && link) return `tl:${title}::${link}`;
+            if (title && subheading) return `ts:${title}::${subheading}`;
+            if (title) return `t:${title}`;
+
+            const articleId = this.getArticleIdentity(item);
+            return articleId ? `id:${articleId}` : '';
+        },
+
+        pickNextBySeed(items, seed, usedIds = new Set(), usedDedupKeys = new Set()) {
+            if (!Array.isArray(items) || items.length === 0) return null;
+            const normalizedUsed = new Set(Array.from(usedIds).map((id) => String(id)));
+            const normalizedDedup = new Set(Array.from(usedDedupKeys).map((key) => String(key)));
+            const start = Math.abs(seed) % items.length;
+            for (let offset = 0; offset < items.length; offset += 1) {
+                const candidate = items[(start + offset) % items.length];
+                const candidateId = this.getArticleIdentity(candidate);
+                const candidateKey = this.getArticleDedupKey(candidate);
+                const idDup = candidateId && normalizedUsed.has(candidateId);
+                const keyDup = candidateKey && normalizedDedup.has(candidateKey);
+                if (!idDup && !keyDup) return candidate;
+            }
+            return null;
+        },
+
+        async loadHero(isAuto = false) {
             const container = document.getElementById('ggx-hero-grid-container');
             if (!container) return;
+            if (isAuto) this.state.lastHeroRefreshAt = Date.now();
 
             try {
-                const { data: articles } = await _supabase.from('articles').select('*').in('homepage_mark', [1, 2, 3]).order('time', { ascending: false });
-                const { data: spark } = await _supabase.from('market_metrics').select('*').eq('id', 'spark_spread').single();
+                const { data: articles, error: articlesError } = await _supabase
+                    .from('articles')
+                    .select('*')
+                    .not('time', 'is', null)
+                    .order('time', { ascending: false })
+                    .limit(HERO_FETCH_LIMIT);
+                if (articlesError) throw articlesError;
+
+                const metrics = await this.ensureHomepageMetrics();
+                const spark =
+                    metrics.find((item) => String(item.id || '').toLowerCase() === 'spark_spread') ||
+                    metrics.find((item) => String(item.label || '').toLowerCase().includes('spark')) ||
+                    metrics[0] ||
+                    null;
 
                 const sparkData = spark || {
                     label: 'Spark Spread',
@@ -778,17 +993,38 @@ export function createNewsHomeApp() {
                     value: '18.50',
                     unit: '$ / MWh',
                 };
-                const displayValue = sparkData.value.startsWith('$') ? sparkData.value : `$${sparkData.value}`;
-                const displayUnit = sparkData.unit.replace('$', '').trim();
+                const sparkValue = String(sparkData.display_value ?? sparkData.value ?? '--');
+                const displayValue = sparkValue.startsWith('$') ? sparkValue : `$${sparkValue}`;
+                const displayUnit = String(sparkData.unit || '').replace('$', '').trim();
+                const sparkChange = String(sparkData.secondary_text ?? sparkData.change_24h ?? 'Live from homepage data');
 
                 if (!articles || articles.length === 0) {
                     container.innerHTML = '<div class="col-span-4 text-center">No hero content.</div>';
                     return;
                 }
 
-                const hero1 = articles.find((d) => d.homepage_mark === 1) || articles[0];
-                const hero2 = articles.find((d) => d.homepage_mark === 2);
-                const hero3 = articles.find((d) => d.homepage_mark === 3);
+                const imageCandidates = articles.filter((item) => this.hasRenderableCover(item));
+                const rotationSeed = this.getHeroRotationSeed();
+                const hero1 = this.pickNextBySeed(imageCandidates, rotationSeed) || articles[0];
+                const usedHeroIds = new Set();
+                const usedHeroDedupKeys = new Set();
+                const hero1Id = this.getArticleIdentity(hero1);
+                if (hero1Id) usedHeroIds.add(hero1Id);
+                const hero1Key = this.getArticleDedupKey(hero1);
+                if (hero1Key) usedHeroDedupKeys.add(hero1Key);
+
+                const hero2 =
+                    this.pickNextBySeed(imageCandidates, rotationSeed + 1, usedHeroIds, usedHeroDedupKeys) ||
+                    this.pickNextBySeed(articles, rotationSeed + 1, usedHeroIds, usedHeroDedupKeys);
+                const hero2Id = this.getArticleIdentity(hero2);
+                if (hero2Id) usedHeroIds.add(hero2Id);
+                const hero2Key = this.getArticleDedupKey(hero2);
+                if (hero2Key) usedHeroDedupKeys.add(hero2Key);
+
+                const textCandidates = articles.filter((item) => !this.hasRenderableCover(item));
+                const hero3 =
+                    this.pickNextBySeed(textCandidates, rotationSeed, usedHeroIds, usedHeroDedupKeys) ||
+                    this.pickNextBySeed(articles, rotationSeed + 2, usedHeroIds, usedHeroDedupKeys);
                 const img1 = this.getImageUrl(hero1);
                 const img2 = hero2 ? this.getImageUrl(hero2) : '';
                 const hero1Url = this.getArticleUrl(hero1);
@@ -796,17 +1032,19 @@ export function createNewsHomeApp() {
                 const hero3Url = hero3 ? this.getArticleUrl(hero3) : '#';
 
                 container.innerHTML = `
-                    <div class="lg:col-span-2 lg:row-span-2 relative group rounded-xl overflow-hidden cursor-pointer ggx-tech-card border-0" onclick="window.location.href='${hero1Url}'">
-                        <img src="${img1}" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105 opacity-80 group-hover:opacity-100">
-                        <div class="absolute inset-0 bg-gradient-to-t from-black via-black/40 to-transparent p-8 flex flex-col justify-end">
-                            <div class="flex items-center gap-2 mb-3"><span class="bg-gas-green text-black text-[10px] font-bold px-2 py-0.5 rounded shadow-neon uppercase tracking-wide">${hero1.secondary_tag || hero1.tag}</span><span class="text-gray-300 text-xs">${new Date(hero1.time).toLocaleDateString()}</span></div>
-                            <h2 class="text-3xl md:text-4xl font-bold text-white leading-tight mb-2 font-header">${hero1.main_title}</h2>
+                    <div class="lg:col-span-2 lg:row-span-2 relative group rounded-xl overflow-hidden cursor-pointer ggx-tech-card ggx-hero-card-main border-0" onclick="window.location.href='${hero1Url}'">
+                        <img src="${img1}" class="ggx-hero-image transition-transform duration-700 group-hover:scale-105 opacity-80 group-hover:opacity-100">
+                        <div class="absolute inset-0 p-8 flex flex-col justify-end ggx-hero-overlay ggx-hero-overlay-main">
+                            <div class="ggx-hero-text-shell ggx-hero-text-shell-main">
+                                <div class="ggx-hero-meta mb-3"><span class="bg-gas-green text-black text-[10px] font-bold px-2 py-0.5 rounded shadow-neon uppercase tracking-wide">${hero1.secondary_tag || hero1.tag}</span><span class="text-gray-300 text-xs">${new Date(hero1.time).toLocaleDateString()}</span></div>
+                                <h2 class="font-bold text-white mb-2 font-header ggx-hero-title ggx-hero-title-main">${hero1.main_title}</h2>
+                            </div>
                         </div>
                     </div>
-                    ${hero2 ? `<div class="lg:col-span-1 lg:row-span-1 relative group rounded-xl overflow-hidden cursor-pointer ggx-tech-card border-0" onclick="window.location.href='${hero2Url}'"><img src="${img2}" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110"><div class="absolute inset-0 bg-gradient-to-t from-black via-transparent to-transparent p-6 flex flex-col justify-end"><span class="text-gas-green text-[10px] font-bold uppercase mb-1">${hero2.secondary_tag || hero2.tag}</span><h3 class="text-lg font-bold text-white leading-snug">${hero2.main_title}</h3></div></div>` : '<div class="lg:col-span-1 lg:row-span-1 bg-[#111]"></div>'}
+                    ${hero2 ? `<div class="lg:col-span-1 lg:row-span-1 relative group rounded-xl overflow-hidden cursor-pointer ggx-tech-card ggx-hero-card-compact border-0" onclick="window.location.href='${hero2Url}'"><img src="${img2}" class="ggx-hero-image transition-transform duration-700 group-hover:scale-110"><div class="absolute inset-0 p-6 flex flex-col justify-end ggx-hero-overlay ggx-hero-overlay-compact"><div class="ggx-hero-text-shell ggx-hero-text-shell-compact"><span class="text-gas-green text-[10px] font-bold uppercase mb-1">${hero2.secondary_tag || hero2.tag}</span><h3 class="font-bold text-white ggx-hero-title ggx-hero-title-compact">${hero2.main_title}</h3></div></div></div>` : '<div class="lg:col-span-1 lg:row-span-1 bg-[#111]"></div>'}
                     <div class="lg:col-span-1 lg:row-span-1 bg-[#111] border border-white/5 rounded-xl p-6 flex flex-col justify-between group cursor-pointer relative overflow-hidden">
                         <div class="grid-bg absolute inset-0"></div>
-                        <div class="relative z-10"><div class="flex justify-between items-start mb-4"><i class="fa-solid fa-chart-area text-2xl text-gas-green"></i><span class="text-[10px] text-gray-500 font-mono border border-gray-700 px-1 rounded">LIVE</span></div><h3 class="text-lg font-bold text-white mb-1">${sparkData.label}</h3><p class="text-xs text-gray-400">${sparkData.change_24h}</p></div>
+                        <div class="relative z-10"><div class="flex justify-between items-start mb-4"><i class="fa-solid fa-chart-area text-2xl text-gas-green"></i><span class="text-[10px] text-gray-500 font-mono border border-gray-700 px-1 rounded">LIVE</span></div><h3 class="text-lg font-bold text-white mb-1">${sparkData.label}</h3><p class="text-xs text-gray-400">${sparkChange}</p></div>
                         <div class="text-3xl font-mono font-bold text-white group-hover:text-gas-green transition-colors relative z-10">${displayValue} <span class="text-xs text-gray-500 font-sans font-normal">${displayUnit}</span></div>
                     </div>
                     ${hero3 ? `<div class="lg:col-span-2 lg:row-span-1 bg-[#121212] border border-white/5 rounded-xl p-6 flex items-center justify-between group cursor-pointer" onclick="window.location.href='${hero3Url}'"><div class="max-w-[70%]"><span class="text-orange-500 text-[10px] font-bold uppercase mb-2 block"><i class="fa-solid fa-fire mr-1"></i> ${hero3.secondary_tag || hero3.tag}</span><h3 class="text-xl font-bold text-white leading-snug group-hover:text-orange-400">${hero3.main_title}</h3></div><div class="w-12 h-12 rounded-full border border-gray-700 flex items-center justify-center text-gray-500 group-hover:text-gas-green bg-[#1a1a1a]"><i class="fa-solid fa-arrow-right"></i></div></div>` : ''}
@@ -821,16 +1059,23 @@ export function createNewsHomeApp() {
             if (!container) return;
 
             try {
-                const { data } = await _supabase.from('market_metrics').select('*');
-                if (data) {
-                    const filtered = data.filter((i) => i.id !== 'spark_spread').slice(0, 4);
-                    container.innerHTML = filtered
-                        .map((item) => {
-                            const trendClass = item.trend === 'up' ? 'text-gas-green' : item.trend === 'down' ? 'text-red-500' : 'text-blue-400';
-                            return `<div class="bg-[#0A0A0A] border border-white/10 rounded-xl p-4 flex flex-col justify-between h-24 hover:border-gas-green/30 transition-all group"><div class="text-[10px] font-bold text-gray-500 uppercase tracking-wider truncate">${item.label}</div><div><div class="text-xl font-mono font-bold text-white flex items-baseline gap-1">${item.value} <span class="text-[10px] text-gray-600 font-sans font-normal">${item.unit || ''}</span></div><div class="text-[10px] font-bold ${trendClass} mt-1 flex items-center gap-1">${item.trend === 'up' ? '<i class="fa-solid fa-caret-up"></i>' : item.trend === 'down' ? '<i class="fa-solid fa-caret-down"></i>' : ''} ${item.change_24h || '--'}</div></div></div>`;
-                        })
-                        .join('');
+                const metrics = await this.ensureHomepageMetrics();
+                const filtered = metrics
+                    .filter((i) => String(i.id || '').toLowerCase() !== 'spark_spread')
+                    .slice(0, 4);
+                if (!filtered.length) {
+                    container.innerHTML = '<div class="bg-[#0A0A0A] border border-white/10 rounded-xl p-4 text-xs text-gray-500 col-span-full">No homepage metrics available.</div>';
+                    return;
                 }
+
+                container.innerHTML = filtered
+                    .map((item) => {
+                        const status = String(item.status || '').toLowerCase();
+                        const trendClass = status === 'positive' ? 'text-gas-green' : status === 'negative' ? 'text-red-500' : 'text-blue-400';
+                        const trendIcon = status === 'positive' ? '<i class="fa-solid fa-caret-up"></i>' : status === 'negative' ? '<i class="fa-solid fa-caret-down"></i>' : '';
+                        return `<div class="bg-[#0A0A0A] border border-white/10 rounded-xl p-4 flex flex-col justify-between h-24 hover:border-gas-green/30 transition-all group"><div class="text-[10px] font-bold text-gray-500 uppercase tracking-wider truncate">${item.label}</div><div><div class="text-xl font-mono font-bold text-white flex items-baseline gap-1">${item.display_value ?? item.value ?? '--'} <span class="text-[10px] text-gray-600 font-sans font-normal">${item.unit || ''}</span></div><div class="text-[10px] font-bold ${trendClass} mt-1 flex items-center gap-1">${trendIcon} ${item.secondary_text || '--'}</div></div></div>`;
+                    })
+                    .join('');
             } catch (e) {
                 console.error(e);
             }
@@ -841,7 +1086,7 @@ export function createNewsHomeApp() {
             if (!container) return;
 
             try {
-                const { data } = await _supabase.from('homepage_scrolling_data').select('*').order('sort_order', { ascending: true });
+                const data = await this.ensureHomepageMetrics();
                 if (data && data.length > 0) {
                     const itemsHtml = data
                         .map((item) => {
@@ -870,6 +1115,7 @@ export function createNewsHomeApp() {
             if (isReset) {
                 this.state.currentCategory = category;
                 this.state.currentOffset = 0;
+                this.state.feedDedupKeys = new Set();
                 container.innerHTML = '<div class="text-center text-gray-500 py-10"><i class="fa-solid fa-circle-notch fa-spin mr-2"></i> Loading Articles...</div>';
                 container.className = category === 'latest' ? 'space-y-4 min-h-[300px]' : 'grid grid-cols-1 md:grid-cols-2 gap-4 min-h-[300px]';
                 btnContainer.style.display = 'none';
@@ -881,20 +1127,18 @@ export function createNewsHomeApp() {
 
             const limit = isReset ? 4 : 5;
             const from = this.state.currentOffset;
-            const to = from + limit - 1;
 
             try {
-                let query = _supabase.from('articles').select('*').order('time', { ascending: false }).range(from, to);
-                if (category !== 'latest') query = query.eq('tag', `${category.charAt(0).toUpperCase()}${category.slice(1)}`);
-                const { data } = await query;
+                const dedupTracker = category === 'latest' ? this.state.feedDedupKeys : null;
+                const { rows, nextOffset, exhausted } = await this.fetchFeedRows(category, from, limit, dedupTracker);
 
-                if (isReset && (!data || data.length === 0)) {
+                if (isReset && rows.length === 0) {
                     container.innerHTML = '<div class="text-center text-gray-500 py-8">No articles found in this section.</div>';
                     btnContainer.style.display = 'none';
                     return;
                 }
 
-                const html = data
+                const html = rows
                     .map((art) => {
                         const imgUrl = this.getImageUrl(art);
                         const articleUrl = this.getArticleUrl(art);
@@ -931,11 +1175,11 @@ export function createNewsHomeApp() {
                 if (isReset) container.innerHTML = html;
                 else container.insertAdjacentHTML('beforeend', html);
 
-                this.state.currentOffset += data.length;
+                this.state.currentOffset = nextOffset;
                 this.state.isLoading = false;
                 btnContainer.style.display = 'block';
                 spinner.classList.add('hidden');
-                if (data.length < limit) loadBtn.style.display = 'none';
+                if (exhausted || rows.length < limit) loadBtn.style.display = 'none';
                 else {
                     loadBtn.style.display = 'inline-block';
                     loadBtn.classList.remove('hidden');
diff --git a/news/modules/styles/main.module.css b/news/modules/styles/main.module.css
index 1c04a11..742c6a2 100644
--- a/news/modules/styles/main.module.css
+++ b/news/modules/styles/main.module.css
@@ -45,6 +45,64 @@
     min-height: 11rem;
 }
 
+.ggx-main-module .ggx-hero-overlay {
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0.14) 0%, rgba(0, 0, 0, 0.62) 56%, rgba(0, 0, 0, 0.94) 100%);
+}
+
+.ggx-main-module .ggx-hero-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    object-position: center;
+}
+
+.ggx-main-module .ggx-hero-overlay.ggx-hero-overlay-compact {
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.68) 52%, rgba(0, 0, 0, 0.96) 100%);
+}
+
+.ggx-main-module .ggx-hero-meta {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-wrap: wrap;
+}
+
+.ggx-main-module .ggx-hero-text-shell {
+    width: fit-content;
+    max-width: 100%;
+    padding: 10px 12px;
+    border-radius: 12px;
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.72) 100%);
+    border: 1px solid rgba(255, 255, 255, 0.12);
+    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45);
+    backdrop-filter: blur(2px);
+}
+
+.ggx-main-module .ggx-hero-text-shell.ggx-hero-text-shell-compact {
+    padding: 8px 10px;
+}
+
+.ggx-main-module .ggx-hero-title {
+    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.95), 0 0 2px rgba(0, 0, 0, 0.9);
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+}
+
+.ggx-main-module .ggx-hero-title-main {
+    font-size: clamp(1.75rem, 2.8vw, 2.45rem);
+    line-height: 1.1;
+    letter-spacing: -0.01em;
+    -webkit-line-clamp: 4;
+}
+
+.ggx-main-module .ggx-hero-title-compact {
+    font-size: clamp(1rem, 1.35vw, 1.18rem);
+    line-height: 1.2;
+    letter-spacing: -0.005em;
+    -webkit-line-clamp: 4;
+}
+
 @media (min-width: 768px) {
     .ggx-main-module #ggx-news-feed-container > article.ggx-latest-card {
         flex-direction: row;
@@ -64,6 +122,36 @@
     }
 }
 
+@media (max-width: 767px) {
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-card-main {
+        min-height: 340px;
+    }
+
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-card-compact {
+        min-height: 230px;
+    }
+
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-overlay {
+        padding: 14px;
+    }
+
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-text-shell {
+        width: 100%;
+        padding: 8px 10px;
+        border-radius: 10px;
+    }
+
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-title-main {
+        font-size: clamp(1.5rem, 7.2vw, 2rem);
+        -webkit-line-clamp: 4;
+    }
+
+    .ggx-main-module #ggx-hero-grid-container .ggx-hero-title-compact {
+        font-size: clamp(1.2rem, 5.6vw, 1.5rem);
+        -webkit-line-clamp: 3;
+    }
+}
+
 .ggx-main-module .line-clamp-1,
 .ggx-main-module .line-clamp-2,
 .ggx-main-module .line-clamp-3 {
diff --git a/news/shared/config/navigation.config.js b/news/shared/config/navigation.config.js
index 7cf4b1c..bcaa992 100644
--- a/news/shared/config/navigation.config.js
+++ b/news/shared/config/navigation.config.js
@@ -15,6 +15,12 @@ export const HEADER_NAVIGATION = [
              */
         ],
     },
+    {
+        title: 'GasGx',
+        path: '/index.html',
+        icon: 'fa-globe',
+        children: [],
+    },
     {
         title: 'FLASH',
         path: '/news/flash',
diff --git a/news/shared/modules/channel-page.shared.js b/news/shared/modules/channel-page.shared.js
index 09dda59..7aee961 100644
--- a/news/shared/modules/channel-page.shared.js
+++ b/news/shared/modules/channel-page.shared.js
@@ -4,37 +4,135 @@ import { HEADER_NAVIGATION } from '../config/navigation.config.js';
 const SUPABASE_URL = 'https://mkpcliytqudclkwtewru.supabase.co';
 const SUPABASE_KEY = 'sb_publishable_S2uWAddQEXhWJgGeIF_ZbQ_H_thz2hw';
 const DEFAULT_COVER = '/news/advertisement/zhanwei.jpg';
+const GOOGLE_CHARTS_LOADER = 'https://www.gstatic.com/charts/loader.js';
+const CANADA_LOCAL_TIMEZONE = 'Asia/Shanghai';
+
+const CANADA_CHART_SPECS = {
+    gas_alberta_vs_regulated: {
+        containerId: 'ggx-chart-gas-alberta-vs-regulated',
+        seriesOrder: ['Gas Alberta', 'WTD AVG', 'DERS', 'AUI'],
+        colors: ['#3dd6f5', '#5dd62c', '#ff6b6b', '#f7b84a'],
+        lineIndexes: [2, 3],
+    },
+    retailer_rates: {
+        containerId: 'ggx-chart-retailer-rates',
+        seriesOrder: ['Monthly Index', 'Forecast', 'ATCO 5 Year', 'ENCOR 5 Year', 'ENMAX 5 Year'],
+        colors: ['#ff6b6b', '#3dd6f5', '#f7b84a', '#5dd62c', '#a88bff'],
+        lineIndexes: [2, 3, 4],
+    },
+    aeco_ng_current: {
+        containerId: 'ggx-chart-aeco-ng-current',
+        seriesOrder: ['Daily Index', 'Monthly Index'],
+        colors: ['#3dd6f5', '#ff6b6b'],
+        lineIndexes: [1],
+    },
+    aeco_ng_prior: {
+        containerId: 'ggx-chart-aeco-ng-prior',
+        seriesOrder: ['Daily Index', 'Monthly Index'],
+        colors: ['#3dd6f5', '#ff6b6b'],
+        lineIndexes: [1],
+    },
+    aeco_c_futures: {
+        containerId: 'ggx-chart-aeco-c-futures',
+        seriesOrder: ['Current', 'One Year Ago', 'One Month Ago'],
+        colors: ['#3dd6f5', '#f7b84a', '#ff6b6b'],
+        lineIndexes: [1, 2],
+    },
+};
+
+const DATA_REGION_CONFIGS = [
+    {
+        key: 'ca-ab',
+        label: 'Canada · Alberta (AB)',
+        shortLabel: 'CA-AB',
+        articleKeywords: ['alberta', 'aeco', 'calgary', 'edmonton', 'henry hub gas'],
+        chartKeywords: ['alberta', 'aeco', 'intra_alberta', 'retailer_rates'],
+    },
+    {
+        key: 'ca-bc',
+        label: 'Canada · British Columbia (BC)',
+        shortLabel: 'CA-BC',
+        articleKeywords: ['british columbia', 'vancouver', 'fort st. john', 'montney basin'],
+        chartKeywords: ['british columbia', 'bc gas', 'bc utility'],
+    },
+    {
+        key: 'us-tx',
+        label: 'United States · Texas (TX)',
+        shortLabel: 'US-TX',
+        articleKeywords: ['texas', 'permian', 'midland', 'eagle ford'],
+        chartKeywords: ['texas', 'permian'],
+    },
+    {
+        key: 'us-la',
+        label: 'United States · Louisiana (LA)',
+        shortLabel: 'US-LA',
+        articleKeywords: ['louisiana', 'haynesville', 'lake charles'],
+        chartKeywords: ['louisiana', 'haynesville'],
+    },
+    {
+        key: 'us-pa',
+        label: 'United States · Pennsylvania (PA)',
+        shortLabel: 'US-PA',
+        articleKeywords: ['pennsylvania', 'marcellus', 'appalachia'],
+        chartKeywords: ['pennsylvania', 'marcellus'],
+    },
+    {
+        key: 'us-ok',
+        label: 'United States · Oklahoma (OK)',
+        shortLabel: 'US-OK',
+        articleKeywords: ['oklahoma', 'scooop', 'stack play', 'ankha'],
+        chartKeywords: ['oklahoma', 'scooop', 'stack'],
+    },
+];
+const DATA_UPDATING_TEXT = 'Data is being updated. More coming soon.';
+
+const GASGX_UI_ICONS = {
+    dashboard:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><rect x="3.5" y="4.5" width="17" height="15" rx="2.5" stroke="currentColor" stroke-width="1.5"/><path d="M7 9.5h10M7 13h5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>',
+    chartBars:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 19.5V12.5M12 19.5V8.5M19 19.5V5.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/><path d="M4 19.5h16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>',
+    rates:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 18.5h14M7.5 18.5v-5.5M12 18.5v-8.5M16.5 18.5v-3.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/><path d="M5.5 8.5l3-3 2.5 2.5 4-4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>',
+    currentMonth:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><rect x="4" y="5.5" width="16" height="14" rx="2.5" stroke="currentColor" stroke-width="1.5"/><path d="M4 9.5h16M9 3.8v3.4M15 3.8v3.4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><circle cx="12" cy="14" r="2" fill="currentColor"/></svg>',
+    priorMonth:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><rect x="4" y="5.5" width="16" height="14" rx="2.5" stroke="currentColor" stroke-width="1.5"/><path d="M4 9.5h16M9 3.8v3.4M15 3.8v3.4M14.8 14h-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>',
+    futures:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M4.5 18.5h15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M6 15.5l3.8-3.8 3 2.9 5.2-5.1" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/><path d="M17 9.5h2.5V12" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>',
+    table:
+        '<svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><rect x="3.5" y="5.5" width="17" height="13" rx="2.5" stroke="currentColor" stroke-width="1.5"/><path d="M3.5 10h17M9 10v8.5M14.8 10v8.5" stroke="currentColor" stroke-width="1.4"/></svg>',
+};
 
 const CHANNEL_CONFIGS = {
     'gas-energy': {
         navTitle: 'GAS ENERGY',
-        layout: 'editorial',
-        pageTitle: 'Gas Energy Command',
-        pageSubtitle: 'Pipeline volatility, flare capture and dispatch intelligence for power-dense compute operations.',
+        layout: 'gas-energy',
+        pageTitle: 'Gas Energy Insights',
+        pageSubtitle: 'Latest news, tech updates, and market analysis on natural gas power for crypto mining.',
         feedTitle: 'Energy Dispatch',
         icon: 'fa-fire-flame-curved',
-        accent: '#00d7ff',
-        accentSoft: 'rgba(0, 215, 255, 0.16)',
-        accentGlow: 'rgba(0, 215, 255, 0.35)',
+        accent: '#00E676',
+        accentSoft: 'rgba(0, 230, 118, 0.16)',
+        accentGlow: 'rgba(0, 230, 118, 0.36)',
         chips: ['Pipeline', 'Flare Recovery', 'Merchant Power'],
     },
     generators: {
         navTitle: 'GENERATORS',
-        layout: 'editorial',
-        pageTitle: 'Generator Fleet Monitor',
-        pageSubtitle: 'Track turbine and reciprocating engine narratives with operating context from hardware data.',
+        layout: 'generators',
+        pageTitle: 'Generators & Engines',
+        pageSubtitle: 'Hardware reviews, technical analysis, and equipment news.',
         feedTitle: 'Fleet Logs',
         icon: 'fa-gears',
-        accent: '#ff9f1c',
-        accentSoft: 'rgba(255, 159, 28, 0.16)',
-        accentGlow: 'rgba(255, 159, 28, 0.35)',
+        accent: '#00E676',
+        accentSoft: 'rgba(0, 230, 118, 0.16)',
+        accentGlow: 'rgba(0, 230, 118, 0.36)',
         chips: ['Gas Turbines', 'Recip Engines', 'Maintenance'],
     },
     mining: {
         navTitle: 'MINING',
-        layout: 'editorial',
-        pageTitle: 'Bitcoin Mining War Room',
-        pageSubtitle: 'Hashrate, ASIC cycle and market impact signals focused on energy-backed mining operations.',
+        layout: 'btc-mining',
+        pageTitle: 'BTC Mining Operations',
+        pageSubtitle: 'Economics, Hashrate Analysis, and Farm Management.',
         feedTitle: 'Mining Signals',
         icon: 'fa-bitcoin-sign',
         accent: '#f7931a',
@@ -115,6 +213,59 @@ function getChannelConfig(channelKey) {
     return CHANNEL_CONFIGS[channelKey] || CHANNEL_CONFIGS.mining;
 }
 
+let googleChartsReadyPromise = null;
+
+function ensureScriptLoaded(src, id) {
+    return new Promise((resolve, reject) => {
+        const existing = document.querySelector(`script[src="${src}"]`);
+        if (existing) {
+            if (existing.dataset.loaded === 'true') {
+                resolve();
+                return;
+            }
+            existing.addEventListener('load', () => resolve(), { once: true });
+            existing.addEventListener('error', () => reject(new Error(`Failed to load script: ${src}`)), { once: true });
+            return;
+        }
+
+        const script = document.createElement('script');
+        if (id) script.id = id;
+        script.src = src;
+        script.async = true;
+        script.onload = () => {
+            script.dataset.loaded = 'true';
+            resolve();
+        };
+        script.onerror = () => reject(new Error(`Failed to load script: ${src}`));
+        document.head.appendChild(script);
+    });
+}
+
+async function ensureGoogleChartsLoaded() {
+    if (window.google?.visualization?.ComboChart) return;
+    if (googleChartsReadyPromise) {
+        await googleChartsReadyPromise;
+        return;
+    }
+
+    googleChartsReadyPromise = (async () => {
+        await ensureScriptLoaded(GOOGLE_CHARTS_LOADER, 'ggx-google-charts-loader');
+        await new Promise((resolve, reject) => {
+            if (!window.google?.charts) {
+                reject(new Error('Google Charts runtime unavailable.'));
+                return;
+            }
+            window.google.charts.load('current', { packages: ['corechart'] });
+            window.google.charts.setOnLoadCallback(() => {
+                if (window.google?.visualization?.ComboChart) resolve();
+                else reject(new Error('Google Charts corechart package failed to initialize.'));
+            });
+        });
+    })();
+
+    await googleChartsReadyPromise;
+}
+
 function escapeHtml(value) {
     return String(value ?? '')
         .replace(/&/g, '&amp;')
@@ -124,6 +275,10 @@ function escapeHtml(value) {
         .replace(/'/g, '&#39;');
 }
 
+function renderGasGxUiIcon(iconName) {
+    return `<span class="ggx-ui-icon">${GASGX_UI_ICONS[iconName] || GASGX_UI_ICONS.dashboard}</span>`;
+}
+
 function toLower(value) {
     return String(value || '').trim().toLowerCase();
 }
@@ -133,6 +288,22 @@ function containsAny(text, keywords = []) {
     return keywords.some((keyword) => source.includes(toLower(keyword)));
 }
 
+function textMatchesRegion(text, keywords = []) {
+    const source = toLower(text);
+    return (keywords || []).some((keyword) => {
+        const token = toLower(keyword);
+        if (!token) return false;
+        return source.includes(token);
+    });
+}
+
+function hasRegionStructuredData(regionView) {
+    if (!regionView || typeof regionView !== 'object') return false;
+    const pointCount = Array.isArray(regionView.pointRows) ? regionView.pointRows.length : 0;
+    const tableCount = Array.isArray(regionView.tableRows) ? regionView.tableRows.length : 0;
+    return pointCount + tableCount > 0;
+}
+
 function isGasGxHost(url) {
     return /^https?:\/\/(www\.)?gasgx\.com/i.test(url || '');
 }
@@ -157,6 +328,41 @@ function formatDateTime(value) {
     });
 }
 
+function buildTopicTagUrl(tagText) {
+    const text = String(tagText || '').trim();
+    if (!text) return '/news/topic/';
+    return `/news/topic/?tag=${encodeURIComponent(text)}`;
+}
+
+function formatUtcDateTime(value) {
+    if (!value) return '--';
+    const date = value instanceof Date ? value : new Date(value);
+    if (Number.isNaN(date.getTime())) return '--';
+    return date.toISOString().replace('T', ' ').replace('.000Z', ' UTC');
+}
+
+function formatDateTimeByTimezone(value, timezone, locale = 'zh-CN') {
+    if (!value) return '--';
+    const date = value instanceof Date ? value : new Date(value);
+    if (Number.isNaN(date.getTime())) return '--';
+    return new Intl.DateTimeFormat(locale, {
+        timeZone: timezone,
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit',
+        hour12: false,
+    }).format(date);
+}
+
+function toIsoDateTime(value) {
+    const date = value ? new Date(value) : new Date();
+    if (Number.isNaN(date.getTime())) return new Date().toISOString();
+    return date.toISOString();
+}
+
 function cleanSummary(value) {
     if (!value) return '';
     return String(value).replace(/<[^>]*>/g, '').replace(/\s+/g, ' ').trim();
@@ -165,7 +371,7 @@ function cleanSummary(value) {
 function getArticleUrl(item) {
     if (!item || typeof item !== 'object') return '#';
 
-    const articleId = item.api_id || item.id;
+    const articleId = item.app_id || item.api_id || item.id;
     if (articleId) return `https://www.gasgx.com/news/article/${articleId}`;
 
     const link = String(item.link || '').trim();
@@ -175,7 +381,7 @@ function getArticleUrl(item) {
 function getImageUrl(item) {
     if (!item || typeof item !== 'object') return DEFAULT_COVER;
 
-    const articleId = item.api_id || item.id;
+    const articleId = item.app_id || item.api_id || item.id;
     const coverImage = String(item.cover_image || '').trim();
     if (!coverImage || !articleId) return DEFAULT_COVER;
 
@@ -184,11 +390,134 @@ function getImageUrl(item) {
     return `https://www.gasgx.com/news/article/${articleId}/images/${normalizedCover}`;
 }
 
+function hasRenderableCover(item) {
+    if (!item || typeof item !== 'object') return false;
+    const articleId = item.app_id || item.api_id || item.id;
+    const coverImage = String(item.cover_image || '').trim();
+    if (!coverImage) return false;
+    if (/^https?:\/\//i.test(coverImage)) return true;
+    return Boolean(articleId);
+}
+
+function normalizeArticleText(value) {
+    return String(value || '')
+        .trim()
+        .toLowerCase()
+        .replace(/\s+/g, ' ');
+}
+
+function normalizeCoverKey(value) {
+    const raw = String(value || '').trim();
+    if (!raw) return '';
+    if (/^https?:\/\//i.test(raw)) {
+        try {
+            const parsed = new URL(raw);
+            return `${parsed.hostname}${parsed.pathname}`.toLowerCase();
+        } catch {
+            return raw.toLowerCase();
+        }
+    }
+    return raw.replace(/^\.?\/*(images\/)?/i, '').toLowerCase();
+}
+
+function getArticleDedupKey(item) {
+    if (!item || typeof item !== 'object') return '';
+
+    const title = normalizeArticleText(item.main_title);
+    const cover = normalizeCoverKey(item.cover_image);
+    const link = normalizeArticleText(item.link);
+    const summary = normalizeArticleText(item.subheading);
+
+    if (title && cover) return `tc:${title}|${cover}`;
+    if (title && link) return `tl:${title}|${link}`;
+    if (title && summary) return `ts:${title}|${summary.slice(0, 120)}`;
+    if (title) return `t:${title}`;
+    return String(item.app_id || item.api_id || item.id || '');
+}
+
+function dedupeArticles(items = []) {
+    if (!Array.isArray(items)) return [];
+    const seen = new Set();
+    const rows = [];
+
+    items.forEach((item) => {
+        const key = getArticleDedupKey(item);
+        if (key && seen.has(key)) return;
+        if (key) seen.add(key);
+        rows.push(item);
+    });
+    return rows;
+}
+
+function collectArticlesWithCover(primary = [], fallback = [], minCount = 0) {
+    const result = [];
+    const seen = new Set();
+
+    const pushRows = (rows) => {
+        rows.forEach((row) => {
+            if (!hasRenderableCover(row)) return;
+            const key = getArticleDedupKey(row) || String(row.app_id || row.api_id || row.id || `${row.main_title || ''}-${row.time || ''}`);
+            if (seen.has(key)) return;
+            seen.add(key);
+            result.push(row);
+        });
+    };
+
+    if (Array.isArray(primary)) pushRows(primary);
+    if (result.length < minCount && Array.isArray(fallback)) pushRows(fallback);
+    return result;
+}
+
+function estimateReadMinutes(article) {
+    const text = `${article?.main_title || ''} ${cleanSummary(article?.subheading) || ''}`.replace(/\s+/g, '');
+    const minutes = Math.ceil(text.length / 420);
+    return Math.max(3, Math.min(12, minutes || 3));
+}
+
+function articleTag(article, fallback = 'News') {
+    return article?.secondary_tag || article?.tag || article?.type || fallback;
+}
+
+function resolveTagTone(tag) {
+    const value = toLower(tag);
+    if (containsAny(value, ['market', 'spec', 'review', 'maintenance', 'price'])) return 'orange';
+    if (containsAny(value, ['compliance', 'policy', 'permit', 'regulation', 'bc'])) return 'purple';
+    return 'green';
+}
+
+function toneClasses(tone) {
+    if (tone === 'orange') {
+        return {
+            badge: 'border-[#FF6D00]/60 bg-[#FF6D00]/16 text-[#FF9D58]',
+            cardHover: 'hover:border-[#FF6D00]/70 hover:shadow-[0_0_18px_rgba(255,109,0,0.2)]',
+        };
+    }
+    if (tone === 'purple') {
+        return {
+            badge: 'border-purple-300/45 bg-purple-500/12 text-purple-200',
+            cardHover: 'hover:border-purple-300/65 hover:shadow-[0_0_18px_rgba(168,85,247,0.2)]',
+        };
+    }
+    return {
+        badge: 'border-[#00E676]/50 bg-[#00E676]/12 text-[#00E676]',
+        cardHover: 'hover:border-[#00E676]/70 hover:shadow-[0_0_18px_rgba(0,230,118,0.2)]',
+    };
+}
+
+function findMetricByKeywords(metrics = [], keywords = []) {
+    if (!Array.isArray(metrics)) return null;
+    return (
+        metrics.find((item) => containsAny(item.label, keywords)) ||
+        metrics.find((item) => containsAny(item.id, keywords)) ||
+        null
+    );
+}
+
 function getAuthorAvatarUrl(item) {
     const fallback = '/news/author_avatar/GasGx-Researcher.png';
     if (!item || typeof item !== 'object') return fallback;
 
-    const articleId = item.api_id || item.id;
+    const articleId = item.app_id || item.api_id || item.id;
     const authorAvatar = String(item.author_avatar || '').trim();
     if (authorAvatar) {
         if (/^https?:\/\//i.test(authorAvatar)) return authorAvatar;
@@ -242,31 +571,54 @@ function matchArticleByRule(article, channelKey) {
     return score >= minScore;
 }
 
+function scoreArticleByRule(article, channelKey) {
+    const rule = CHANNEL_RULES[channelKey];
+    if (!rule) return 0;
+
+    const type = toLower(article.type);
+    const tag = toLower(article.tag);
+    const secondaryTag = toLower(article.secondary_tag);
+    const topics = toLower(article.topics);
+    const textBlock = [article.main_title, article.subheading, article.keywords, article.publisher].map((v) => String(v || '')).join(' ');
+
+    let score = 0;
+    if (containsAny(type, rule.types)) score += 6;
+    if (containsAny(tag, rule.tags)) score += 3;
+    if (containsAny(secondaryTag, rule.tags)) score += 2;
+    if (containsAny(topics, rule.keywords)) score += 3;
+    if (containsAny(textBlock, rule.keywords)) score += 2;
+    if (channelKey === 'events' && containsAny(textBlock, ['summit', 'expo', 'forum', 'conference', 'webinar'])) score += 2;
+    return score;
+}
+
 function filterArticlesByChannel(articles, channelKey) {
     if (!Array.isArray(articles)) return [];
 
-    const rule = CHANNEL_RULES[channelKey];
-    if (rule && Array.isArray(rule.types) && rule.types.length) {
-        const typeMatched = articles.filter((article) => containsAny(article.type, rule.types));
-        if (typeMatched.length >= 8) return typeMatched;
-        if (channelKey === 'events' && typeMatched.length >= 3) return typeMatched;
-    }
-
-    const matched = articles.filter((article) => matchArticleByRule(article, channelKey));
+    const source = dedupeArticles(articles);
+    const matched = source.filter((article) => matchArticleByRule(article, channelKey));
     const minMatched = channelKey === 'data' ? 6 : 10;
     if (matched.length >= minMatched) return matched;
 
-    if (channelKey === 'events') {
-        const byType = articles.filter((article) => toLower(article.type).includes('event'));
-        if (byType.length >= 3) return byType;
-    }
+    const scored = source
+        .map((article) => ({
+            article,
+            score: scoreArticleByRule(article, channelKey),
+            ts: new Date(article.time || 0).getTime() || 0,
+        }))
+        .sort((a, b) => (b.score !== a.score ? b.score - a.score : b.ts - a.ts));
 
-    return articles.slice(0, 32);
+    const positive = scored.filter((item) => item.score > 0).map((item) => item.article);
+    if (positive.length >= 6) return positive.slice(0, 48);
+
+    return source.slice(0, 48);
 }
 
 function renderEditorialTemplate(config) {
     const chips = (config.chips || [])
-        .map((chip, index) => `<button class="ggx-chip${index === 0 ? ' active' : ''}">${escapeHtml(chip)}</button>`)
+        .map(
+            (chip, index) =>
+                `<a href="${buildTopicTagUrl(chip)}" class="ggx-chip${index === 0 ? ' active' : ''}">${escapeHtml(chip)}</a>`,
+        )
         .join('');
 
     return `
@@ -305,44 +657,345 @@ function renderEditorialTemplate(config) {
 </section>`;
 }
 
+function renderGasEnergyTemplate(config) {
+    return `
+<main id="gas-energy-news" class="mx-auto w-full max-w-[1700px] px-4 pb-12 pt-6 sm:px-6 lg:px-8">
+    <!-- Channel Header / Breadcrumb -->
+    <section class="mb-6 rounded-2xl border border-white/10 bg-[#121212]/80 p-5 sm:p-6 lg:p-7">
+        <p class="text-xs uppercase tracking-[0.22em] text-gray-400">
+            <a href="/news/" class="transition-colors hover:text-[#00E676]">Home</a>
+            <span class="px-2 text-gray-500">&gt;</span>
+            <span class="text-gray-300">Gas Energy</span>
+        </p>
+        <h1 class="mt-3 text-3xl font-bold text-white sm:text-4xl" style="font-family: 'Oswald', sans-serif;">
+            ${escapeHtml(config.pageTitle)}
+        </h1>
+        <p class="mt-3 max-w-3xl text-sm leading-relaxed text-gray-300 sm:text-base">
+            ${escapeHtml(config.pageSubtitle)}
+        </p>
+    </section>
+
+    <!-- Featured Hero Article -->
+    <article class="mb-6 overflow-hidden rounded-2xl border border-white/10 bg-gray-900/90 transition duration-300 hover:border-[#00E676]/70 hover:shadow-[0_0_24px_rgba(0,230,118,0.2)]">
+        <div class="grid gap-0 lg:grid-cols-12">
+            <figure id="ggx-gas-featured-media" class="relative min-h-[220px] bg-gradient-to-br from-gray-800 to-[#1b1f2a] sm:min-h-[300px] lg:col-span-7 lg:min-h-[420px]">
+                <div class="absolute inset-0 bg-[radial-gradient(circle_at_20%_20%,rgba(0,230,118,0.18),transparent_48%),radial-gradient(circle_at_80%_70%,rgba(168,85,247,0.16),transparent_46%)]"></div>
+                <div class="absolute inset-0 flex items-center justify-center text-sm uppercase tracking-widest text-gray-400">
+                    Loading featured cover...
+                </div>
+            </figure>
+            <div id="ggx-gas-featured-content" class="flex flex-col justify-between p-5 sm:p-6 lg:col-span-5 lg:p-8">
+                <div class="ggx-empty">Loading featured article...</div>
+            </div>
+        </div>
+    </article>
+
+    <!-- Latest Articles Grid -->
+    <section aria-label="Latest gas energy articles">
+        <div class="mb-4 flex items-center justify-between">
+            <h2 class="text-xl font-semibold text-white sm:text-2xl">Latest Articles</h2>
+            <span class="rounded-full border border-orange-300/40 bg-orange-500/10 px-3 py-1 text-xs font-semibold uppercase tracking-wider text-orange-200">
+                Mining + Gas Power
+            </span>
+        </div>
+
+        <div id="ggx-gas-article-grid" class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3">
+            <div class="ggx-empty col-span-full">Loading gas energy articles...</div>
+        </div>
+    </section>
+
+    <!-- Pagination / Load More -->
+    <div class="ggx-load-more-wrap">
+        <button id="ggx-load-more-btn" class="ggx-load-more-btn" onclick="window.GGXChannelApp && window.GGXChannelApp.loadMore()">Load More Articles</button>
+    </div>
+</main>`;
+}
+
+function renderGeneratorsTemplate(config) {
+    return `
+<main id="generators-news" class="mx-auto w-full max-w-[1700px] px-4 pb-12 pt-6 sm:px-6 lg:px-8">
+    <!-- Channel Header & Filter Tabs -->
+    <section class="mb-6 rounded-2xl border border-gray-700/90 bg-[#121212]/88 p-5 sm:p-6 lg:p-7">
+        <h1 class="text-3xl font-bold text-white sm:text-4xl" style="font-family: 'Oswald', sans-serif;">
+            ${escapeHtml(config.pageTitle)}
+        </h1>
+        <p class="mt-3 max-w-3xl text-sm leading-relaxed text-gray-300 sm:text-base">
+            ${escapeHtml(config.pageSubtitle)}
+        </p>
+
+        <div class="mt-5 -mx-1 overflow-x-auto pb-1">
+            <div class="flex min-w-max gap-2 px-1">
+                <a href="/news/generators/" class="rounded-full border border-[#00E676]/60 bg-[#00E676]/15 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-[#00E676]">
+                    All
+                </a>
+                <a href="${buildTopicTagUrl('Hardware Reviews')}" class="rounded-full border border-gray-600/90 bg-gray-800/70 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-gray-300 transition hover:border-[#00E676]/60 hover:text-[#00E676]">
+                    Hardware Reviews
+                </a>
+                <a href="${buildTopicTagUrl('VMAN & Brands')}" class="rounded-full border border-gray-600/90 bg-gray-800/70 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-gray-300 transition hover:border-[#00E676]/60 hover:text-[#00E676]">
+                    VMAN &amp; Brands
+                </a>
+                <a href="${buildTopicTagUrl('Maintenance')}" class="rounded-full border border-gray-600/90 bg-gray-800/70 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-gray-300 transition hover:border-[#00E676]/60 hover:text-[#00E676]">
+                    Maintenance
+                </a>
+                <a href="${buildTopicTagUrl('Tech Specs')}" class="rounded-full border border-gray-600/90 bg-gray-800/70 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-gray-300 transition hover:border-[#00E676]/60 hover:text-[#00E676]">
+                    Tech Specs
+                </a>
+            </div>
+        </div>
+    </section>
+
+    <section class="grid gap-6 lg:grid-cols-12">
+        <div class="space-y-6 lg:col-span-9">
+            <!-- Hardware Spotlight -->
+            <article class="overflow-hidden rounded-2xl border border-gray-700/80 bg-gray-900/88 transition duration-300 hover:border-[#FF6D00]/75 hover:shadow-[0_0_24px_rgba(255,109,0,0.2)]">
+                <div class="grid gap-0 lg:grid-cols-12">
+                    <figure id="ggx-generators-featured-media" class="relative aspect-video bg-gradient-to-br from-gray-800 to-[#1b1f29] lg:col-span-7">
+                        <div class="absolute inset-0 bg-[radial-gradient(circle_at_20%_20%,rgba(0,230,118,0.2),transparent_45%),radial-gradient(circle_at_80%_65%,rgba(255,109,0,0.2),transparent_42%)]"></div>
+                        <div class="absolute inset-0 flex items-center justify-center text-sm uppercase tracking-widest text-gray-400">
+                            Loading featured hardware cover...
+                        </div>
+                    </figure>
+                    <div id="ggx-generators-featured-content" class="flex flex-col justify-between p-5 sm:p-6 lg:col-span-5 lg:p-8">
+                        <div class="ggx-empty">Loading hardware spotlight...</div>
+                    </div>
+                </div>
+            </article>
+
+            <!-- Equipment News Feed -->
+            <section aria-label="Equipment news feed">
+                <h2 class="text-xl font-semibold text-white sm:text-2xl">Equipment News Feed</h2>
+                <div id="ggx-generators-article-grid" class="mt-4 grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3">
+                    <div class="ggx-empty col-span-full">Loading equipment articles...</div>
+                </div>
+            </section>
+
+            <!-- Pagination / Load More -->
+            <div class="ggx-load-more-wrap">
+                <button id="ggx-load-more-btn" class="ggx-load-more-btn" onclick="window.GGXChannelApp && window.GGXChannelApp.loadMore()">Load More Articles</button>
+            </div>
+        </div>
+
+        <!-- Trending Tech Specs Sidebar (Desktop) -->
+        <aside class="hidden lg:block lg:col-span-3">
+            <div class="sticky top-24 rounded-2xl border border-gray-700/90 bg-gray-900/92 p-5">
+                <h3 class="text-lg font-semibold text-white">Top Rated Engines</h3>
+                <ul id="ggx-generators-top-engines" class="mt-4 space-y-3">
+                    <li class="ggx-empty">Loading top rated engines...</li>
+                </ul>
+            </div>
+        </aside>
+    </section>
+</main>`;
+}
+
+function renderBtcMiningTemplate(config) {
+    return `
+<main id="btc-mining-news" class="mx-auto w-full max-w-[1700px] px-4 pb-12 pt-6 sm:px-6 lg:px-8">
+    <!-- Channel Header + Live Mining Metrics Ticker -->
+    <section class="mb-6 rounded-2xl border border-gray-700/90 bg-[#121212]/88 p-5 sm:p-6 lg:p-7">
+        <h1 class="text-3xl font-bold text-white sm:text-4xl" style="font-family: 'Oswald', sans-serif;">
+            ${escapeHtml(config.pageTitle)}
+        </h1>
+        <p class="mt-3 max-w-3xl text-sm leading-relaxed text-gray-300 sm:text-base">
+            ${escapeHtml(config.pageSubtitle)}
+        </p>
+
+        <div class="mt-5 overflow-hidden rounded-xl border border-gray-700/90 bg-[#1A1A1A]/95 py-2">
+            <div class="flex min-w-max items-center animate-marquee">
+                <div class="flex items-center gap-8 whitespace-nowrap px-4 text-xs uppercase tracking-wider text-gray-300">
+                    <span id="ggx-btc-ticker-price">BTC Price: --</span>
+                    <span id="ggx-btc-ticker-hashrate">Global Hashrate: --</span>
+                    <span id="ggx-btc-ticker-difficulty">Network Difficulty: --</span>
+                    <span id="ggx-btc-ticker-adjustment">Next Adjustment: --</span>
+                </div>
+                <div class="flex items-center gap-8 whitespace-nowrap px-4 text-xs uppercase tracking-wider text-gray-300" aria-hidden="true">
+                    <span id="ggx-btc-ticker-price-dup">BTC Price: --</span>
+                    <span id="ggx-btc-ticker-hashrate-dup">Global Hashrate: --</span>
+                    <span id="ggx-btc-ticker-difficulty-dup">Network Difficulty: --</span>
+                    <span id="ggx-btc-ticker-adjustment-dup">Next Adjustment: --</span>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Featured Operations Hero + Aside Snapshot -->
+    <section class="mb-6 grid gap-4 lg:grid-cols-12">
+        <article class="overflow-hidden rounded-2xl border border-gray-700/90 bg-[#1A1A1A]/95 transition duration-300 hover:border-[#F7931A]/70 hover:shadow-[0_0_22px_rgba(247,147,26,0.2)] lg:col-span-8">
+            <figure id="ggx-btc-featured-media" class="relative aspect-video bg-gradient-to-br from-gray-800 to-[#1e2430]">
+                <div class="absolute inset-0 bg-[radial-gradient(circle_at_15%_18%,rgba(0,230,118,0.2),transparent_45%),radial-gradient(circle_at_82%_70%,rgba(247,147,26,0.22),transparent_44%)]"></div>
+                <div class="absolute inset-0 flex items-center justify-center text-sm uppercase tracking-widest text-gray-400">
+                    Loading featured mining cover...
+                </div>
+            </figure>
+            <div id="ggx-btc-featured-content" class="p-5 sm:p-6">
+                <div class="ggx-empty">Loading featured mining article...</div>
+            </div>
+        </article>
+
+        <aside class="rounded-2xl border border-gray-700/90 bg-[#1A1A1A]/95 p-5 lg:col-span-4">
+            <h3 class="text-lg font-semibold text-white">Operations Snapshot</h3>
+            <ul class="mt-4 space-y-3">
+                <li class="rounded-lg border border-gray-700/80 bg-gray-800/70 p-3">
+                    <p class="text-xs uppercase tracking-wider text-gray-400">Fleet Uptime</p>
+                    <p class="mt-1 text-base font-semibold text-[#00E676]">98.4% across 14 sites</p>
+                </li>
+                <li class="rounded-lg border border-gray-700/80 bg-gray-800/70 p-3">
+                    <p class="text-xs uppercase tracking-wider text-gray-400">Power Cost Band</p>
+                    <p class="mt-1 text-base font-semibold text-[#F7931A]">$0.039 - $0.052 / kWh</p>
+                </li>
+                <li class="rounded-lg border border-gray-700/80 bg-gray-800/70 p-3">
+                    <p class="text-xs uppercase tracking-wider text-gray-400">Regional Compliance</p>
+                    <p class="mt-1 text-base font-semibold text-purple-300">2 pending permit updates in BC</p>
+                </li>
+            </ul>
+        </aside>
+    </section>
+
+    <!-- Mining News & Analysis Feed -->
+    <section aria-label="Mining news and analysis feed">
+        <h2 class="text-xl font-semibold text-white sm:text-2xl">Mining News &amp; Analysis</h2>
+        <div id="ggx-btc-article-grid" class="mt-4 grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3">
+            <div class="ggx-empty col-span-full">Loading mining articles...</div>
+        </div>
+    </section>
+
+    <div class="ggx-load-more-wrap mt-5">
+        <button id="ggx-load-more-btn" class="ggx-load-more-btn" onclick="window.GGXChannelApp && window.GGXChannelApp.loadMore()">Load More Articles</button>
+    </div>
+
+    <!-- Newsletter / Alert Signup -->
+    <section class="mt-8 rounded-2xl border border-gray-700/90 bg-gray-800/70 p-6 sm:p-8">
+        <h2 class="text-2xl font-semibold text-white sm:text-3xl" style="font-family: 'Oswald', sans-serif;">
+            Get the Weekly Mining Difficulty &amp; Gas Price Digest
+        </h2>
+        <p class="mt-2 text-sm text-gray-300 sm:text-base">
+            Receive curated updates on hashrate trends, gas market shifts, and operational benchmarks for mining operators.
+        </p>
+        <form class="mt-5 flex flex-col gap-3 sm:flex-row" action="#" method="post">
+            <label for="ggx-btc-newsletter-email" class="sr-only">Email address</label>
+            <input
+                id="ggx-btc-newsletter-email"
+                type="email"
+                name="email"
+                required
+                placeholder="you@company.com"
+                class="w-full rounded-xl border border-gray-600 bg-[#121212] px-4 py-3 text-sm text-white placeholder:text-gray-500 focus:border-[#00E676] focus:outline-none"
+            />
+            <button type="submit" class="rounded-xl bg-[#00E676] px-6 py-3 text-sm font-semibold text-[#03200f] transition duration-300 hover:brightness-105 hover:shadow-[0_0_20px_rgba(0,230,118,0.3)]">
+                Subscribe
+            </button>
+        </form>
+    </section>
+</main>`;
+}
+
 function renderDataTemplate(config) {
     return `
 <section class="ggx-channel-shell">
     <main class="ggx-channel-main">
         <section class="ggx-channel-card ggx-mini-card" id="ggx-data-headline">
             <h3>${escapeHtml(config.pageTitle)}</h3>
-            <p class="ggx-mini-caption">${escapeHtml(config.pageSubtitle)}</p>
+            <p class="ggx-mini-caption">GasGx Canada dashboard one-page terminal with charts and parsed static tables.</p>
+        </section>
+
+        <section class="ggx-channel-card p-4 mt-4">
+            <div class="ggx-section-head">
+                <h2><i class="fa-solid fa-globe"></i> Regional Data Views</h2>
+                <span class="ggx-chip active">Scope Selector</span>
+            </div>
+            <div id="ggx-data-region-tabs" class="ggx-chip-row"></div>
+            <p id="ggx-data-region-subtitle" class="ggx-mini-caption mt-3">Loading regional coverage...</p>
+        </section>
+
+        <section class="ggx-channel-card p-4 mt-4">
+            <div class="ggx-section-head">
+                <h2>${renderGasGxUiIcon('dashboard')}<span>Canada Gas Dashboard</span></h2>
+                <span class="ggx-chip active">Integrated View</span>
+            </div>
+            <p class="ggx-mini-caption">Sourced from canada_scrape_runs, canada_chart_points and canada_chart_tables only.</p>
+
+            <div class="ggx-canada-run-grid mt-3">
+                <article class="ggx-canada-run-card">
+                    <div class="ggx-canada-run-label">Latest Successful Run</div>
+                    <div id="ggx-canada-run-local" class="ggx-canada-run-value">--</div>
+                    <div id="ggx-canada-run-utc" class="ggx-canada-run-meta">--</div>
+                    <div id="ggx-canada-run-id" class="ggx-canada-run-meta">run_id: --</div>
+                </article>
+                <article id="ggx-canada-status" class="ggx-canada-status-box">
+                    <span class="text-yellow-300 font-semibold">LOADING</span> Fetching Canada dashboard data...
+                </article>
+            </div>
         </section>
 
-        <section class="ggx-data-grid mt-4">
-            <div class="ggx-channel-card p-4">
+        <section class="ggx-canada-chart-grid mt-4">
+            <article class="ggx-channel-card p-4">
                 <div class="ggx-section-head">
-                    <h2><i class="fa-solid fa-wave-square"></i> Market Metrics</h2>
+                    <h2>${renderGasGxUiIcon('chartBars')}<span>Gas Alberta vs Regulated</span></h2>
                 </div>
-                <div id="ggx-metric-grid" class="ggx-metric-grid"></div>
-            </div>
+                <div id="ggx-chart-gas-alberta-vs-regulated" class="ggx-canada-chart"></div>
+            </article>
+            <article class="ggx-channel-card p-4">
+                <div class="ggx-section-head">
+                    <h2>${renderGasGxUiIcon('rates')}<span>Retailer Rates</span></h2>
+                </div>
+                <div id="ggx-chart-retailer-rates" class="ggx-canada-chart"></div>
+            </article>
+            <article class="ggx-channel-card p-4">
+                <div class="ggx-section-head">
+                    <h2>${renderGasGxUiIcon('currentMonth')}<span>AECO Current Month</span></h2>
+                </div>
+                <div id="ggx-chart-aeco-ng-current" class="ggx-canada-chart"></div>
+            </article>
+            <article class="ggx-channel-card p-4">
+                <div class="ggx-section-head">
+                    <h2>${renderGasGxUiIcon('priorMonth')}<span>AECO Prior Month</span></h2>
+                </div>
+                <div id="ggx-chart-aeco-ng-prior" class="ggx-canada-chart"></div>
+            </article>
+        </section>
 
-            <div class="ggx-channel-card p-4">
+        <section class="mt-4">
+            <article class="ggx-channel-card p-4">
                 <div class="ggx-section-head">
-                    <h2><i class="fa-solid fa-layer-group"></i> Fuel Mix Snapshot</h2>
+                    <h2>${renderGasGxUiIcon('futures')}<span>AECO C Futures Pricing</span></h2>
                 </div>
-                <ul id="ggx-fuel-mix" class="ggx-signal-list"></ul>
-            </div>
+                <div id="ggx-chart-aeco-c-futures" class="ggx-canada-chart"></div>
+            </article>
         </section>
 
-        <section class="ggx-data-grid mt-4">
-            <div class="ggx-channel-card p-4">
+        <section class="mt-4">
+            <article class="ggx-channel-card p-4">
                 <div class="ggx-section-head">
-                    <h2><i class="fa-solid fa-server"></i> Equipment Data</h2>
+                    <h2>${renderGasGxUiIcon('table')}<span>Canada Static Tables (Parsed)</span></h2>
                 </div>
-                <div id="ggx-equipment-table" class="ggx-table-wrap"></div>
-            </div>
+                <div id="ggx-canada-static-tables" class="ggx-canada-static-grid"></div>
+            </article>
+        </section>
+
+        <section class="mt-4">
+            <article class="ggx-channel-card p-4">
+                <div class="ggx-section-head">
+                    <h2><i class="fa-solid fa-signal"></i> Homepage Metrics</h2>
+                </div>
+                <div id="ggx-metric-grid" class="ggx-metric-grid"></div>
+            </article>
+        </section>
 
-            <div class="ggx-channel-card p-4">
+        <section class="mt-4">
+            <article class="ggx-channel-card p-4">
                 <div class="ggx-section-head">
-                    <h2><i class="fa-solid fa-file-lines"></i> Data Notes</h2>
+                    <h2><i class="fa-solid fa-gears"></i> Equipment Baseline</h2>
                 </div>
-                <div id="ggx-data-notes" class="ggx-feed-stack"></div>
+                <div id="ggx-equipment-table" class="ggx-table-wrap"></div>
+            </article>
+        </section>
+
+        <section class="mt-4">
+            <div class="ggx-section-head">
+                <h2><i class="fa-solid fa-book-open"></i> Data Notes</h2>
+            </div>
+            <div id="ggx-data-notes" class="ggx-events-grid">
+                <div class="ggx-empty">Loading data notes...</div>
             </div>
         </section>
     </main>
@@ -365,9 +1018,9 @@ function renderEventsTemplate(config) {
         <div class="ggx-section-head mt-4">
             <h2><i class="fa-solid ${escapeHtml(config.icon)}"></i> ${escapeHtml(config.feedTitle)}</h2>
             <div class="ggx-chip-row">
-                <span class="ggx-chip active">Articles</span>
-                <span class="ggx-chip">Saved Sources</span>
-                <span class="ggx-chip">Chronological</span>
+                <a href="/news/events/" class="ggx-chip active">Articles</a>
+                <a href="${buildTopicTagUrl('Saved Sources')}" class="ggx-chip">Saved Sources</a>
+                <a href="${buildTopicTagUrl('Chronological')}" class="ggx-chip">Chronological</a>
             </div>
         </div>
 
@@ -390,7 +1043,13 @@ export function mountChannelMain(container, channelKey) {
     if (!container) return;
     const config = getChannelConfig(channelKey);
 
-    if (config.layout === 'data') {
+    if (config.layout === 'gas-energy') {
+        container.innerHTML = renderGasEnergyTemplate(config);
+    } else if (config.layout === 'generators') {
+        container.innerHTML = renderGeneratorsTemplate(config);
+    } else if (config.layout === 'btc-mining') {
+        container.innerHTML = renderBtcMiningTemplate(config);
+    } else if (config.layout === 'data') {
         container.innerHTML = renderDataTemplate(config);
     } else if (config.layout === 'events') {
         container.innerHTML = renderEventsTemplate(config);
@@ -408,14 +1067,24 @@ export function createChannelApp(channelKey) {
         state: {
             currentUser: null,
             displayName: null,
-            marketMetrics: [],
+            homepageMetrics: [],
             equipmentData: [],
             allArticles: [],
             filteredArticles: [],
             savedNews: [],
             eventsRows: [],
-            visibleCount: config.layout === 'events' ? 6 : 7,
-            pageSize: config.layout === 'events' ? 6 : 6,
+            canadaRun: null,
+            canadaPointRows: [],
+            canadaTableRows: [],
+            dataRegionViews: [],
+            activeDataRegion: 'ca-ab',
+            canadaStatus: {
+                type: 'loading',
+                message: 'Fetching Canada dashboard data...',
+            },
+            canadaResizeBound: false,
+            visibleCount: config.layout === 'editorial' ? 7 : 6,
+            pageSize: 6,
             scrollBound: false,
             activeTag: '',
         },
@@ -424,17 +1093,23 @@ export function createChannelApp(channelKey) {
             this.applyTheme();
             await this.initAuth();
             this.renderNav();
-            this.loadLiveData();
+            if (config.layout !== 'data') this.loadLiveData();
+            else this.hideLiveDataStrip();
 
-            await Promise.allSettled([
-                this.loadArticles(),
-                this.loadMarketMetrics(),
-                this.loadEquipmentData(),
-                this.loadSavedNews(),
-            ]);
+            let loadTasks = [];
+            if (config.layout === 'data') {
+                loadTasks = [this.loadCanadaDashboardData(), this.loadArticles(), this.loadHomepageMetrics(), this.loadEquipmentData()];
+            } else {
+                loadTasks = [this.loadArticles(), this.loadHomepageMetrics(), this.loadEquipmentData(), this.loadSavedNews()];
+            }
+            await Promise.allSettled(loadTasks);
+            if (config.layout === 'data') this.buildDataRegionViews();
 
             if (config.layout === 'data') this.renderDataLayout();
             else if (config.layout === 'events') this.renderEventsLayout();
+            else if (config.layout === 'gas-energy') this.renderGasEnergyLayout();
+            else if (config.layout === 'generators') this.renderGeneratorsLayout();
+            else if (config.layout === 'btc-mining') this.renderBtcMiningLayout();
             else this.renderEditorialLayout();
 
             this.bindScroll();
@@ -502,6 +1177,19 @@ export function createChannelApp(channelKey) {
             });
         },
 
+        hideLiveDataStrip() {
+            const liveData = document.getElementById('ggx-live-data-container');
+            if (!liveData) return;
+
+            const stripRow = liveData.parentElement?.parentElement;
+            const stripShell = stripRow?.parentElement;
+
+            if (stripRow) stripRow.remove();
+            if (stripShell) {
+                stripShell.classList.remove('border-b', 'border-white/5', 'shadow-sm');
+            }
+        },
+
         toggleMobileMenu() {
             const menu = document.getElementById('ggx-mobile-menu-container');
             const overlay = document.getElementById('ggx-mobile-menu-overlay');
@@ -557,7 +1245,7 @@ export function createChannelApp(channelKey) {
 
         async loadArticles() {
             try {
-                const maxRows = config.layout === 'events' ? 599 : 199;
+                const maxRows = config.layout === 'events' ? 999 : 799;
                 const { data } = await _supabase.from('articles').select('*').order('time', { ascending: false }).range(0, maxRows);
                 this.state.allArticles = Array.isArray(data) ? data : [];
                 this.state.filteredArticles = filterArticlesByChannel(this.state.allArticles, channelKey);
@@ -568,12 +1256,27 @@ export function createChannelApp(channelKey) {
             }
         },
 
-        async loadMarketMetrics() {
+        async loadHomepageMetrics() {
             try {
-                const { data } = await _supabase.from('market_metrics').select('*').order('id', { ascending: true });
-                this.state.marketMetrics = Array.isArray(data) ? data : [];
+                const { data } = await _supabase
+                    .from('homepage_scrolling_data')
+                    .select('*')
+                    .order('sort_order', { ascending: true });
+
+                this.state.homepageMetrics = Array.isArray(data)
+                    ? data.map((item) => {
+                          const status = String(item.status || '').toLowerCase();
+                          const trend = status === 'positive' ? 'up' : status === 'negative' ? 'down' : 'flat';
+                          return {
+                              ...item,
+                              value: item.display_value ?? item.value ?? '--',
+                              change_24h: item.secondary_text ?? item.change_24h ?? '--',
+                              trend,
+                          };
+                      })
+                    : [];
             } catch {
-                this.state.marketMetrics = [];
+                this.state.homepageMetrics = [];
             }
         },
 
@@ -603,10 +1306,190 @@ export function createChannelApp(channelKey) {
             }
         },
 
+        async loadCanadaDashboardData() {
+            this.state.canadaStatus = {
+                type: 'loading',
+                message: 'Fetching latest successful run from Supabase...',
+            };
+
+            try {
+                const run = await this.loadCanadaLatestRun();
+                this.state.canadaRun = run;
+
+                const rows = await this.loadCanadaRows(run.run_hour_utc);
+                this.state.canadaPointRows = rows.pointRows;
+                this.state.canadaTableRows = rows.tableRows;
+
+                if (!this.state.canadaPointRows.length) {
+                    this.state.canadaStatus = {
+                        type: 'error',
+                        message: `No point data found for run_hour ${run.run_hour_utc}.`,
+                    };
+                    return;
+                }
+
+                this.state.canadaStatus = {
+                    type: 'ok',
+                    message: `Loaded ${this.state.canadaPointRows.length} point rows and ${this.state.canadaTableRows.length} static tables.`,
+                };
+            } catch (error) {
+                console.error('Canada dashboard load failed:', error);
+                this.state.canadaRun = null;
+                this.state.canadaPointRows = [];
+                this.state.canadaTableRows = [];
+                this.state.canadaStatus = {
+                    type: 'error',
+                    message: error?.message || 'Failed to load Canada dashboard data.',
+                };
+            }
+        },
+
+        async loadCanadaLatestRun() {
+            const { data, error } = await _supabase
+                .from('canada_scrape_runs')
+                .select('run_id,run_at_utc,run_hour_utc,status,chart_success_count,point_count')
+                .eq('status', 'success')
+                .order('run_hour_utc', { ascending: false })
+                .limit(1);
+
+            if (error) throw error;
+            if (!Array.isArray(data) || !data.length) {
+                throw new Error('No successful Canada scrape run found.');
+            }
+            return data[0];
+        },
+
+        async loadCanadaRows(runHourUtc) {
+            const [pointsRes, tablesRes] = await Promise.all([
+                _supabase
+                    .from('canada_chart_points')
+                    .select('chart_id,chart_title,row_index,x_label,x_date,series_name,series_value,currency,unit')
+                    .eq('run_hour_utc', runHourUtc)
+                    .order('row_index', { ascending: true }),
+                _supabase
+                    .from('canada_chart_tables')
+                    .select('chart_id,chart_title,headers,table_rows,row_count,source_asset_url')
+                    .eq('run_hour_utc', runHourUtc),
+            ]);
+
+            if (pointsRes.error) throw pointsRes.error;
+            if (tablesRes.error) throw tablesRes.error;
+
+            return {
+                pointRows: Array.isArray(pointsRes.data) ? pointsRes.data : [],
+                tableRows: Array.isArray(tablesRes.data) ? tablesRes.data : [],
+            };
+        },
+
+        getActiveDataRegionView() {
+            if (!Array.isArray(this.state.dataRegionViews) || this.state.dataRegionViews.length === 0) return null;
+            return this.state.dataRegionViews.find((region) => region.key === this.state.activeDataRegion) || this.state.dataRegionViews[0];
+        },
+
+        buildDataRegionViews() {
+            const articleRows = dedupeArticles(Array.isArray(this.state.allArticles) ? this.state.allArticles : []);
+            const metricRows = Array.isArray(this.state.homepageMetrics) ? this.state.homepageMetrics : [];
+            const equipmentRows = Array.isArray(this.state.equipmentData) ? this.state.equipmentData : [];
+            const pointRows = Array.isArray(this.state.canadaPointRows) ? this.state.canadaPointRows : [];
+            const tableRows = Array.isArray(this.state.canadaTableRows) ? this.state.canadaTableRows : [];
+
+            this.state.dataRegionViews = DATA_REGION_CONFIGS.map((region) => {
+                const chartRows = pointRows.filter((row) => textMatchesRegion(`${row?.chart_id || ''} ${row?.chart_title || ''}`, region.chartKeywords));
+                const staticRows = tableRows.filter((row) => textMatchesRegion(`${row?.chart_id || ''} ${row?.chart_title || ''}`, region.chartKeywords));
+
+                const notes = articleRows.filter((article) => {
+                    const text = [article.main_title, article.subheading, article.topics, article.publisher, article.tag, article.type].join(' ');
+                    return textMatchesRegion(text, region.articleKeywords);
+                });
+
+                const metrics = metricRows.filter((metric) => {
+                    const text = [metric.id, metric.label, metric.secondary_text, metric.change_24h].join(' ');
+                    return textMatchesRegion(text, region.articleKeywords);
+                });
+
+                const equipment = equipmentRows.filter((row) => {
+                    const text = [row.manufacturer, row.model, row.fuel_type, row.notes].join(' ');
+                    return textMatchesRegion(text, region.articleKeywords);
+                });
+
+                const resolvedPointRows = region.key === 'ca-ab' ? (chartRows.length ? chartRows : pointRows) : chartRows;
+                const resolvedTableRows = region.key === 'ca-ab' ? (staticRows.length ? staticRows : tableRows) : staticRows;
+
+                return {
+                    ...region,
+                    pointRows: resolvedPointRows,
+                    tableRows: resolvedTableRows,
+                    notes,
+                    metrics,
+                    equipment,
+                };
+            });
+
+            if (!this.state.dataRegionViews.some((region) => region.key === this.state.activeDataRegion)) {
+                this.state.activeDataRegion = this.state.dataRegionViews[0]?.key || 'ca-ab';
+            }
+        },
+
+        switchDataRegion(regionKey) {
+            if (config.layout !== 'data') return;
+            if (!regionKey || this.state.activeDataRegion === regionKey) return;
+            if (!this.state.dataRegionViews.some((region) => region.key === regionKey)) return;
+
+            this.state.activeDataRegion = regionKey;
+            this.renderDataLayout();
+        },
+
+        renderDataRegionTabs() {
+            const tabs = document.getElementById('ggx-data-region-tabs');
+            const subtitle = document.getElementById('ggx-data-region-subtitle');
+            if (!tabs || !subtitle) return;
+
+            const regions = Array.isArray(this.state.dataRegionViews) ? this.state.dataRegionViews : [];
+            if (!regions.length) {
+                tabs.innerHTML = '<span class="ggx-chip">No region configs</span>';
+                subtitle.textContent = 'No regional mapping available.';
+                return;
+            }
+
+            tabs.innerHTML = regions
+                .map((region) => {
+                    const isActive = region.key === this.state.activeDataRegion;
+                    const activeClass = isActive ? ' ggx-data-region-tab-active' : '';
+                    const pointCount = Array.isArray(region.pointRows) ? region.pointRows.length : 0;
+                    return `<button type="button" class="ggx-chip ggx-data-region-tab${activeClass}" onclick="window.GGXChannelApp && window.GGXChannelApp.switchDataRegion('${escapeHtml(region.key)}')">${escapeHtml(region.shortLabel)} <span class="text-[10px] opacity-80">(${pointCount})</span></button>`;
+                })
+                .join('');
+
+            const active = this.getActiveDataRegionView();
+            if (!active) {
+                subtitle.textContent = 'No active regional view.';
+                return;
+            }
+
+            const pointCount = Array.isArray(active.pointRows) ? active.pointRows.length : 0;
+            const tableCount = Array.isArray(active.tableRows) ? active.tableRows.length : 0;
+            const noteCount = Array.isArray(active.notes) ? active.notes.length : 0;
+            if (!hasRegionStructuredData(active)) {
+                subtitle.textContent = `${active.label}: ${DATA_UPDATING_TEXT}`;
+            } else {
+                subtitle.textContent = `${active.label}: structured points ${pointCount}, tables ${tableCount}, matched notes ${noteCount}.`;
+            }
+        },
+
         loadMore() {
             this.state.visibleCount += this.state.pageSize;
             if (config.layout === 'events') this.renderEventsCards();
             else if (config.layout === 'editorial') this.renderEditorialFeed();
+            else if (config.layout === 'gas-energy') this.renderGasEnergyLayout();
+            else if (config.layout === 'generators') this.renderGeneratorsLayout();
+            else if (config.layout === 'btc-mining') this.renderBtcMiningLayout();
+        },
+
+        toggleLoadMoreButton(visibleRows, totalRows) {
+            const btn = document.getElementById('ggx-load-more-btn');
+            if (!btn) return;
+            if (visibleRows >= totalRows) btn.style.display = 'none';
+            else btn.style.display = 'inline-flex';
         },
 
         renderEditorialLayout() {
@@ -615,6 +1498,288 @@ export function createChannelApp(channelKey) {
             this.renderEditorialAside();
         },
 
+        renderGasEnergyLayout() {
+            const featuredMedia = document.getElementById('ggx-gas-featured-media');
+            const featuredContent = document.getElementById('ggx-gas-featured-content');
+            const grid = document.getElementById('ggx-gas-article-grid');
+            if (!featuredMedia || !featuredContent || !grid) return;
+
+            const rows = collectArticlesWithCover(this.state.filteredArticles, this.state.allArticles, 8);
+            if (!rows.length) {
+                featuredContent.innerHTML = '<div class="ggx-empty">No featured article with cover image.</div>';
+                grid.innerHTML = '<div class="ggx-empty col-span-full">No article cards with cover image.</div>';
+                this.toggleLoadMoreButton(0, 0);
+                return;
+            }
+
+            const featured = rows[0];
+            const featuredUrl = getArticleUrl(featured);
+            const featuredTag = articleTag(featured, 'Featured');
+            const featuredSummary = cleanSummary(featured.subheading) || config.pageSubtitle;
+            const featuredDateValue = featured.time || new Date();
+
+            featuredMedia.innerHTML = `
+                <img src="${escapeHtml(getImageUrl(featured))}" alt="${escapeHtml(featured.main_title || '')}" class="absolute inset-0 h-full w-full object-cover opacity-85" loading="lazy" onerror="this.remove()">
+                <div class="absolute inset-0 bg-gradient-to-t from-black/75 via-black/20 to-transparent"></div>
+            `;
+
+            featuredContent.innerHTML = `
+                <div>
+                    <span class="inline-flex items-center rounded-full border border-[#00E676]/50 bg-[#00E676]/15 px-3 py-1 text-xs font-semibold uppercase tracking-wider text-[#00E676]">
+                        ${escapeHtml(featuredTag)}
+                    </span>
+                    <h2 class="mt-4 text-2xl font-semibold leading-tight text-white sm:text-3xl">
+                        <a ${buildLinkAttrs(featuredUrl)} class="transition-colors hover:text-[#7DFFBA]">${escapeHtml(featured.main_title || 'Untitled')}</a>
+                    </h2>
+                    <p class="mt-4 text-sm leading-relaxed text-gray-300 sm:text-base">${escapeHtml(featuredSummary)}</p>
+                </div>
+                <footer class="mt-6 flex flex-wrap items-center gap-x-4 gap-y-2 text-xs uppercase tracking-wider text-gray-400">
+                    <span>By ${escapeHtml(featured.publisher || 'GasGx Editorial Desk')}</span>
+                    <time datetime="${escapeHtml(toIsoDateTime(featuredDateValue))}">${escapeHtml(formatDate(featuredDateValue))}</time>
+                </footer>
+            `;
+
+            const sourceRows = rows.slice(1);
+            const feedRows = sourceRows.slice(0, this.state.visibleCount);
+            if (!feedRows.length) {
+                grid.innerHTML = '<div class="ggx-empty col-span-full">No additional article cards with cover image.</div>';
+                this.toggleLoadMoreButton(0, 0);
+                return;
+            }
+
+            grid.innerHTML = feedRows
+                .map((article) => {
+                    const tag = articleTag(article, 'News');
+                    const tone = toneClasses(resolveTagTone(tag));
+                    const url = getArticleUrl(article);
+                    const summary = cleanSummary(article.subheading) || 'No summary available.';
+
+                    return `
+                        <article class="group overflow-hidden rounded-xl border border-white/10 bg-gray-800/60 transition duration-300 hover:-translate-y-1 ${tone.cardHover}">
+                            <a ${buildLinkAttrs(url)} class="relative block aspect-video bg-gradient-to-br from-gray-700 to-[#1e2431]">
+                                <img src="${escapeHtml(getImageUrl(article))}" alt="${escapeHtml(article.main_title || '')}" class="h-full w-full object-cover opacity-85 transition duration-300 group-hover:opacity-100" loading="lazy" onerror="this.remove()">
+                            </a>
+                            <div class="p-4">
+                                <span class="inline-flex rounded-full border px-2.5 py-1 text-[11px] font-semibold uppercase tracking-wider ${tone.badge}">${escapeHtml(tag)}</span>
+                                <h2 class="mt-3 text-lg font-semibold leading-snug text-white">${escapeHtml(article.main_title || 'Untitled')}</h2>
+                                <p class="mt-2 text-sm leading-relaxed text-gray-300" style="display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">${escapeHtml(summary)}</p>
+                            </div>
+                            <footer class="flex items-center justify-between border-t border-white/10 px-4 py-3 text-xs text-gray-400">
+                                <time datetime="${escapeHtml(toIsoDateTime(article.time))}">${escapeHtml(formatDate(article.time))}</time>
+                                <a ${buildLinkAttrs(url)} class="font-semibold text-[#00E676] transition-colors hover:text-[#7DFFBA]">Read article -&gt;</a>
+                            </footer>
+                        </article>
+                    `;
+                })
+                .join('');
+
+            this.toggleLoadMoreButton(feedRows.length, sourceRows.length);
+        },
+
+        renderGeneratorsLayout() {
+            const featuredMedia = document.getElementById('ggx-generators-featured-media');
+            const featuredContent = document.getElementById('ggx-generators-featured-content');
+            const grid = document.getElementById('ggx-generators-article-grid');
+            const topEngines = document.getElementById('ggx-generators-top-engines');
+            if (!featuredMedia || !featuredContent || !grid || !topEngines) return;
+
+            const rows = collectArticlesWithCover(this.state.filteredArticles, this.state.allArticles, 8);
+            if (!rows.length) {
+                featuredContent.innerHTML = '<div class="ggx-empty">No hardware spotlight with cover image.</div>';
+                grid.innerHTML = '<div class="ggx-empty col-span-full">No equipment cards with cover image.</div>';
+                this.toggleLoadMoreButton(0, 0);
+            } else {
+                const featured = rows[0];
+                const featuredUrl = getArticleUrl(featured);
+                const featuredSummary = cleanSummary(featured.subheading) || 'No summary available.';
+                const featuredDateValue = featured.time || new Date();
+
+                featuredMedia.innerHTML = `
+                    <img src="${escapeHtml(getImageUrl(featured))}" alt="${escapeHtml(featured.main_title || '')}" class="absolute inset-0 h-full w-full object-cover opacity-85" loading="lazy" onerror="this.remove()">
+                    <div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/15 to-transparent"></div>
+                `;
+
+                featuredContent.innerHTML = `
+                    <div>
+                        <span class="inline-flex rounded-full border border-[#FF6D00]/60 bg-[#FF6D00]/20 px-3 py-1 text-xs font-semibold uppercase tracking-wider text-[#FF9D58]">
+                            In-Depth Review
+                        </span>
+                        <h2 class="mt-4 text-2xl font-semibold leading-tight text-white sm:text-3xl">
+                            <a ${buildLinkAttrs(featuredUrl)} class="transition-colors hover:text-[#FFB575]">${escapeHtml(featured.main_title || 'Untitled')}</a>
+                        </h2>
+                        <p class="mt-4 text-sm leading-relaxed text-gray-300 sm:text-base">${escapeHtml(featuredSummary)}</p>
+                    </div>
+                    <footer class="mt-6 flex flex-wrap items-center gap-x-4 gap-y-2 text-xs uppercase tracking-wider text-gray-400">
+                        <span>By ${escapeHtml(featured.publisher || 'GasGx Hardware Lab')}</span>
+                        <time datetime="${escapeHtml(toIsoDateTime(featuredDateValue))}">${escapeHtml(formatDate(featuredDateValue))}</time>
+                    </footer>
+                `;
+
+                const sourceRows = rows.slice(1);
+                const feedRows = sourceRows.slice(0, this.state.visibleCount);
+                if (!feedRows.length) {
+                    grid.innerHTML = '<div class="ggx-empty col-span-full">No equipment cards with cover image.</div>';
+                    this.toggleLoadMoreButton(0, 0);
+                } else {
+                    grid.innerHTML = feedRows
+                        .map((article) => {
+                            const tag = articleTag(article, 'News');
+                            const toneName = resolveTagTone(tag);
+                            const tone = toneClasses(toneName);
+                            const toneHover =
+                                toneName === 'orange'
+                                    ? 'hover:border-l-[#FF6D00] hover:border-[#FF6D00]/45'
+                                    : toneName === 'purple'
+                                      ? 'hover:border-l-purple-300 hover:border-purple-300/45'
+                                      : 'hover:border-l-[#00E676] hover:border-[#00E676]/45';
+                            const url = getArticleUrl(article);
+                            const summary = cleanSummary(article.subheading) || 'No summary available.';
+
+                            return `
+                                <article class="group overflow-hidden rounded-xl border border-gray-700/90 border-l-2 border-l-transparent bg-gray-800/70 transition duration-300 hover:-translate-y-1 ${toneHover}">
+                                    <a ${buildLinkAttrs(url)} class="relative block aspect-video bg-gradient-to-br from-gray-700 to-[#1f2430]">
+                                        <img src="${escapeHtml(getImageUrl(article))}" alt="${escapeHtml(article.main_title || '')}" class="h-full w-full object-cover opacity-85 transition duration-300 group-hover:opacity-100" loading="lazy" onerror="this.remove()">
+                                    </a>
+                                    <div class="p-4">
+                                        <span class="inline-flex rounded-full border px-2.5 py-1 text-[11px] font-semibold uppercase tracking-wider ${tone.badge}">${escapeHtml(tag)}</span>
+                                        <h2 class="mt-3 text-lg font-semibold leading-snug text-white">${escapeHtml(article.main_title || 'Untitled')}</h2>
+                                        <p class="mt-2 text-sm leading-relaxed text-gray-300" style="display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">${escapeHtml(summary)}</p>
+                                    </div>
+                                    <footer class="flex items-center justify-between border-t border-gray-700/85 px-4 py-3 text-xs text-gray-400">
+                                        <span>${escapeHtml(String(estimateReadMinutes(article)))} min read</span>
+                                        <a ${buildLinkAttrs(url)} class="font-semibold text-[#00E676] transition-colors hover:text-[#7DFFBA]">Read More -&gt;</a>
+                                    </footer>
+                                </article>
+                            `;
+                        })
+                        .join('');
+
+                    this.toggleLoadMoreButton(feedRows.length, sourceRows.length);
+                }
+            }
+
+            const ranked = Array.isArray(this.state.equipmentData) ? this.state.equipmentData.slice(0, 4) : [];
+            if (!ranked.length) {
+                topEngines.innerHTML = '<li class="ggx-empty">No equipment records available.</li>';
+                return;
+            }
+
+            topEngines.innerHTML = ranked
+                .map((item) => {
+                    const model = item.model || 'Unknown Model';
+                    const maker = item.manufacturer || 'Unknown Manufacturer';
+                    const efficiency = item.efficiency ?? '--';
+                    const output = item.power_output_kw ?? '--';
+                    return `
+                        <li class="rounded-lg border border-gray-700/90 bg-gray-800/70 p-3">
+                            <span class="text-sm font-semibold text-white">${escapeHtml(model)}</span>
+                            <p class="mt-1 text-xs text-gray-400">${escapeHtml(maker)} | Thermal Efficiency: ${escapeHtml(String(efficiency))}% | Output: ${escapeHtml(String(output))} kW</p>
+                        </li>
+                    `;
+                })
+                .join('');
+        },
+
+        renderBtcMiningLayout() {
+            const setTicker = (id, label, metric, valueClass = 'text-[#F7931A]') => {
+                const node = document.getElementById(id);
+                if (!node) return;
+                const value = metric ? `${metric.value || '--'}${metric.unit ? ` ${metric.unit}` : ''}` : '--';
+                const trendClass = metric?.trend === 'up' ? 'text-[#00E676]' : metric?.trend === 'down' ? 'text-red-400' : 'text-gray-400';
+                const change = metric?.change_24h ? `<span class="${trendClass}">${escapeHtml(metric.change_24h)}</span>` : '';
+                node.innerHTML = `${escapeHtml(label)}: <strong class="${valueClass}">${escapeHtml(value)}</strong>${change ? ` ${change}` : ''}`;
+            };
+
+            const metrics = this.state.homepageMetrics || [];
+            const btcMetric = findMetricByKeywords(metrics, ['btc', 'bitcoin']);
+            const hashrateMetric = findMetricByKeywords(metrics, ['hashrate']);
+            const difficultyMetric = findMetricByKeywords(metrics, ['difficulty']);
+            const adjustmentMetric = findMetricByKeywords(metrics, ['adjustment', 'next adjustment', 'block time']);
+
+            setTicker('ggx-btc-ticker-price', 'BTC Price', btcMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-hashrate', 'Global Hashrate', hashrateMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-difficulty', 'Network Difficulty', difficultyMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-adjustment', 'Next Adjustment', adjustmentMetric, 'text-[#00E676]');
+            setTicker('ggx-btc-ticker-price-dup', 'BTC Price', btcMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-hashrate-dup', 'Global Hashrate', hashrateMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-difficulty-dup', 'Network Difficulty', difficultyMetric, 'text-[#F7931A]');
+            setTicker('ggx-btc-ticker-adjustment-dup', 'Next Adjustment', adjustmentMetric, 'text-[#00E676]');
+
+            const featuredMedia = document.getElementById('ggx-btc-featured-media');
+            const featuredContent = document.getElementById('ggx-btc-featured-content');
+            const grid = document.getElementById('ggx-btc-article-grid');
+            if (!featuredMedia || !featuredContent || !grid) return;
+
+            const rows = collectArticlesWithCover(this.state.filteredArticles, this.state.allArticles, 8);
+            if (!rows.length) {
+                featuredContent.innerHTML = '<div class="ggx-empty">No featured mining article with cover image.</div>';
+                grid.innerHTML = '<div class="ggx-empty col-span-full">No mining cards with cover image.</div>';
+                this.toggleLoadMoreButton(0, 0);
+                return;
+            }
+
+            const featured = rows[0];
+            const featuredUrl = getArticleUrl(featured);
+            const featuredSummary = cleanSummary(featured.subheading) || config.pageSubtitle;
+            const featuredDateValue = featured.time || new Date();
+
+            featuredMedia.innerHTML = `
+                <img src="${escapeHtml(getImageUrl(featured))}" alt="${escapeHtml(featured.main_title || '')}" class="absolute inset-0 h-full w-full object-cover opacity-85" loading="lazy" onerror="this.remove()">
+                <div class="absolute inset-0 bg-gradient-to-t from-black/75 via-black/20 to-transparent"></div>
+            `;
+
+            featuredContent.innerHTML = `
+                <span class="inline-flex rounded-full border border-[#F7931A]/65 bg-[#F7931A]/18 px-3 py-1 text-xs font-semibold uppercase tracking-wider text-[#FFC37D]">
+                    Featured
+                </span>
+                <h2 class="mt-4 text-2xl font-semibold leading-tight text-white sm:text-3xl">
+                    <a ${buildLinkAttrs(featuredUrl)} class="transition-colors hover:text-[#FFC37D]">${escapeHtml(featured.main_title || 'Untitled')}</a>
+                </h2>
+                <p class="mt-3 text-sm leading-relaxed text-gray-300 sm:text-base">${escapeHtml(featuredSummary)}</p>
+                <footer class="mt-5 flex flex-wrap items-center gap-x-4 gap-y-2 text-xs uppercase tracking-wider text-gray-400">
+                    <span>${escapeHtml(String(estimateReadMinutes(featured)))} min read</span>
+                    <span>By ${escapeHtml(featured.publisher || 'GasGx Mining Desk')}</span>
+                    <time datetime="${escapeHtml(toIsoDateTime(featuredDateValue))}">${escapeHtml(formatDate(featuredDateValue))}</time>
+                </footer>
+            `;
+
+            const sourceRows = rows.slice(1);
+            const feedRows = sourceRows.slice(0, this.state.visibleCount);
+            if (!feedRows.length) {
+                grid.innerHTML = '<div class="ggx-empty col-span-full">No mining cards with cover image.</div>';
+                this.toggleLoadMoreButton(0, 0);
+                return;
+            }
+
+            grid.innerHTML = feedRows
+                .map((article) => {
+                    const tag = articleTag(article, 'Farm Ops');
+                    const tone = toneClasses(resolveTagTone(tag));
+                    const url = getArticleUrl(article);
+                    const summary = cleanSummary(article.subheading) || 'No summary available.';
+
+                    return `
+                        <article class="group overflow-hidden rounded-xl border border-gray-700/90 bg-[#1A1A1A]/95 transition duration-300 hover:-translate-y-1 ${tone.cardHover}">
+                            <a ${buildLinkAttrs(url)} class="relative block aspect-video bg-gradient-to-br from-gray-700 to-[#1f2430]">
+                                <img src="${escapeHtml(getImageUrl(article))}" alt="${escapeHtml(article.main_title || '')}" class="h-full w-full object-cover opacity-85 transition duration-300 group-hover:opacity-100" loading="lazy" onerror="this.remove()">
+                            </a>
+                            <div class="p-4">
+                                <span class="inline-flex rounded-full border px-2.5 py-1 text-[11px] font-semibold uppercase tracking-wider ${tone.badge}">${escapeHtml(tag)}</span>
+                                <h2 class="mt-3 text-lg font-semibold leading-snug text-white">${escapeHtml(article.main_title || 'Untitled')}</h2>
+                                <p class="mt-2 text-sm leading-relaxed text-gray-300" style="display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">${escapeHtml(summary)}</p>
+                            </div>
+                            <footer class="flex items-center justify-between border-t border-gray-700/85 px-4 py-3 text-xs text-gray-400">
+                                <span>${escapeHtml(article.publisher || 'GasGx Desk')} · <time datetime="${escapeHtml(toIsoDateTime(article.time))}">${escapeHtml(formatDate(article.time))}</time></span>
+                                <a ${buildLinkAttrs(url)} class="font-semibold text-[#00E676] transition-colors hover:text-[#7DFFBA]">Read Article</a>
+                            </footer>
+                        </article>
+                    `;
+                })
+                .join('');
+
+            this.toggleLoadMoreButton(feedRows.length, sourceRows.length);
+        },
+
         renderEditorialHero() {
             const heroContainer = document.getElementById('ggx-hero-main');
             const sidecards = document.getElementById('ggx-hero-sidecards');
@@ -646,12 +1811,15 @@ export function createChannelApp(channelKey) {
                 </div>
             `;
 
-            const spark = this.state.marketMetrics.find((item) => item.id === 'spark_spread') || this.state.marketMetrics[0];
+            const spark =
+                this.state.homepageMetrics.find((item) => String(item.id || '').toLowerCase() === 'spark_spread') ||
+                this.state.homepageMetrics.find((item) => String(item.label || '').toLowerCase().includes('spark')) ||
+                this.state.homepageMetrics[0];
             const equipmentTop = this.state.equipmentData[0];
 
             sidecards.innerHTML = `
                 <article class="ggx-channel-card ggx-mini-card">
-                    <h3>${escapeHtml(spark ? spark.label : 'Market Pulse')}</h3>
+                    <h3>${escapeHtml(spark ? spark.label : 'Homepage Pulse')}</h3>
                     <div class="ggx-mini-value">${escapeHtml(spark ? spark.value : '--')} <span class="text-sm text-gray-500">${escapeHtml(spark?.unit || '')}</span></div>
                     <p class="ggx-mini-caption">${escapeHtml(spark?.change_24h || 'No metric change available.')}</p>
                 </article>
@@ -721,7 +1889,10 @@ export function createChannelApp(channelKey) {
 
             const tagsHtml = topTags.length
                 ? topTags
-                      .map(([tag, count]) => `<li class="ggx-signal-item"><a href="#">${escapeHtml(tag.toUpperCase())} · ${escapeHtml(String(count))} hits</a></li>`)
+                      .map(
+                          ([tag, count]) =>
+                              `<li class="ggx-signal-item"><a href="${buildTopicTagUrl(tag)}">${escapeHtml(tag.toUpperCase())} · ${escapeHtml(String(count))} hits</a></li>`,
+                      )
                       .join('')
                 : '<li class="ggx-signal-item"><a href="#">No tag distribution available.</a></li>';
 
@@ -734,7 +1905,7 @@ export function createChannelApp(channelKey) {
                       .join('')
                 : '<li class="ggx-signal-item"><a href="#">No stream records yet.</a></li>';
 
-            const metrics = this.state.marketMetrics.slice(0, 4);
+            const metrics = this.state.homepageMetrics.slice(0, 4);
             const metricsHtml = metrics.length
                 ? metrics
                       .map(
@@ -745,7 +1916,7 @@ export function createChannelApp(channelKey) {
                     </li>`
                       )
                       .join('')
-                : '<li class="ggx-signal-item"><a href="#">No market metrics available.</a></li>';
+                : '<li class="ggx-signal-item"><a href="#">No homepage metrics available.</a></li>';
 
             container.innerHTML = `
                 <section class="ggx-channel-card p-4">
@@ -764,7 +1935,7 @@ export function createChannelApp(channelKey) {
 
                 <section class="ggx-channel-card p-4">
                     <div class="ggx-section-head">
-                        <h2><i class="fa-solid fa-chart-simple"></i> Metric Tape</h2>
+                            <h2><i class="fa-solid fa-chart-simple"></i> Metric Tape</h2>
                     </div>
                     <ul class="ggx-signal-list">${metricsHtml}</ul>
                 </section>
@@ -772,19 +1943,30 @@ export function createChannelApp(channelKey) {
         },
 
         renderDataLayout() {
+            if (!Array.isArray(this.state.dataRegionViews) || this.state.dataRegionViews.length === 0) {
+                this.buildDataRegionViews();
+            }
+            this.renderDataRegionTabs();
             this.renderDataMetrics();
-            this.renderFuelMix();
             this.renderEquipmentTable();
             this.renderDataNotes();
+            this.renderCanadaDashboard().catch((error) => {
+                console.error('Canada dashboard render failed:', error);
+                this.setCanadaStatus('error', 'Failed to render Canada dashboard charts.');
+            });
         },
 
         renderDataMetrics() {
             const container = document.getElementById('ggx-metric-grid');
             if (!container) return;
 
-            const metrics = this.state.marketMetrics.slice(0, 8);
+            const activeRegion = this.getActiveDataRegionView();
+            const metrics =
+                activeRegion && Array.isArray(activeRegion.metrics) && activeRegion.metrics.length
+                    ? activeRegion.metrics.slice(0, 8)
+                    : this.state.homepageMetrics.slice(0, 8);
             if (metrics.length === 0) {
-                container.innerHTML = '<div class="ggx-empty">No market metrics in table.</div>';
+                container.innerHTML = `<div class="ggx-empty">${escapeHtml(DATA_UPDATING_TEXT)}</div>`;
                 return;
             }
 
@@ -824,9 +2006,14 @@ export function createChannelApp(channelKey) {
             const container = document.getElementById('ggx-equipment-table');
             if (!container) return;
 
-            const rows = this.state.equipmentData.slice(0, 12);
+            const activeRegion = this.getActiveDataRegionView();
+            const regionRows =
+                activeRegion && Array.isArray(activeRegion.equipment) && activeRegion.equipment.length
+                    ? activeRegion.equipment
+                    : this.state.equipmentData;
+            const rows = regionRows.slice(0, 12);
             if (rows.length === 0) {
-                container.innerHTML = '<div class="ggx-empty">No equipment_data records.</div>';
+                container.innerHTML = `<div class="ggx-empty">${escapeHtml(DATA_UPDATING_TEXT)}</div>`;
                 return;
             }
 
@@ -866,10 +2053,16 @@ export function createChannelApp(channelKey) {
             const container = document.getElementById('ggx-data-notes');
             if (!container) return;
 
-            const notes = this.state.filteredArticles.length ? this.state.filteredArticles : this.state.allArticles;
+            const activeRegion = this.getActiveDataRegionView();
+            const notes =
+                activeRegion && Array.isArray(activeRegion.notes)
+                    ? activeRegion.notes
+                    : this.state.filteredArticles.length
+                      ? this.state.filteredArticles
+                      : this.state.allArticles;
             const rows = notes.slice(0, 8);
             if (!rows.length) {
-                container.innerHTML = '<div class="ggx-empty">No data-related article rows.</div>';
+                container.innerHTML = `<div class="ggx-empty">${escapeHtml(DATA_UPDATING_TEXT)}</div>`;
                 return;
             }
 
@@ -891,6 +2084,295 @@ export function createChannelApp(channelKey) {
                 .join('');
         },
 
+        setCanadaStatus(type, message) {
+            const container = document.getElementById('ggx-canada-status');
+            if (!container) return;
+
+            const normalizedType = String(type || 'loading').toLowerCase();
+            const color =
+                normalizedType === 'error'
+                    ? 'text-red-400'
+                    : normalizedType === 'ok'
+                      ? 'text-gas-green'
+                      : 'text-yellow-300';
+            container.innerHTML = `<span class="${color} font-semibold">${escapeHtml(normalizedType.toUpperCase())}</span> ${escapeHtml(message || '--')}`;
+        },
+
+        renderCanadaRunSummary(regionView = null) {
+            const runLocal = document.getElementById('ggx-canada-run-local');
+            const runUtc = document.getElementById('ggx-canada-run-utc');
+            const runId = document.getElementById('ggx-canada-run-id');
+            if (!runLocal || !runUtc || !runId) return;
+
+            const run = this.state.canadaRun;
+            if (!run) {
+                runLocal.textContent = '--';
+                runUtc.textContent = '--';
+                runId.textContent = 'run_id: --';
+                return;
+            }
+
+            runLocal.textContent = `${formatDateTimeByTimezone(run.run_at_utc, CANADA_LOCAL_TIMEZONE)} (${CANADA_LOCAL_TIMEZONE})`;
+            runUtc.textContent = formatUtcDateTime(run.run_at_utc);
+            runId.textContent = `${regionView?.shortLabel || 'GLOBAL'} · run_id: ${run.run_id || '--'}`;
+        },
+
+        toCanadaChartMatrix(rows, seriesOrder) {
+            const grouped = new Map();
+            rows.forEach((row) => {
+                const xLabel = String(row?.x_label || '').trim();
+                if (!xLabel) return;
+
+                if (!grouped.has(xLabel)) {
+                    grouped.set(xLabel, {
+                        x_label: xLabel,
+                        x_date: row?.x_date || '',
+                        row_index: Number(row?.row_index) || 0,
+                        values: {},
+                    });
+                }
+
+                grouped.get(xLabel).values[row.series_name] = Number(row.series_value);
+            });
+
+            return Array.from(grouped.values())
+                .sort((a, b) => {
+                    if (a.x_date && b.x_date) return String(a.x_date).localeCompare(String(b.x_date));
+                    if (a.row_index !== b.row_index) return a.row_index - b.row_index;
+                    return a.x_label.localeCompare(b.x_label);
+                })
+                .map((item) => [item.x_label, ...seriesOrder.map((name) => item.values[name] ?? null)]);
+        },
+
+        drawCanadaComboChart(spec, rows) {
+            const container = document.getElementById(spec.containerId);
+            if (!container) return;
+
+            if (!Array.isArray(rows) || rows.length === 0) {
+                container.innerHTML = '<div class="ggx-empty">No chart data.</div>';
+                return;
+            }
+
+            const table = new window.google.visualization.DataTable();
+            table.addColumn('string', 'Date');
+            spec.seriesOrder.forEach((seriesName) => table.addColumn('number', seriesName));
+            table.addRows(this.toCanadaChartMatrix(rows, spec.seriesOrder));
+
+            const formatter = new window.google.visualization.NumberFormat({ prefix: '$' });
+            for (let index = 1; index <= spec.seriesOrder.length; index += 1) {
+                formatter.format(table, index);
+            }
+
+            const seriesConfig = {};
+            spec.lineIndexes.forEach((index) => {
+                seriesConfig[index] = {
+                    type: 'line',
+                    lineWidth: 2.3,
+                    pointSize: 4.2,
+                    pointShape: 'circle',
+                    visibleInLegend: true,
+                };
+            });
+
+            const containerWidth = container.clientWidth || container.offsetWidth || 0;
+            const isWide = containerWidth >= 1280;
+            const isMedium = containerWidth >= 820;
+            const chartAreaLeft = isWide ? 56 : isMedium ? 58 : 62;
+            const chartAreaWidth = isWide ? '90%' : isMedium ? '88%' : '80%';
+            const chartAreaHeight = isMedium ? '70%' : '66%';
+
+            const options = {
+                width: '100%',
+                height: 420,
+                backgroundColor: 'transparent',
+                chartArea: {
+                    width: chartAreaWidth,
+                    height: chartAreaHeight,
+                    left: chartAreaLeft,
+                    top: 62,
+                    backgroundColor: { fill: 'rgba(255,255,255,0.02)', stroke: 'rgba(255,255,255,0.08)', strokeWidth: 1 },
+                },
+                legend: {
+                    position: 'top',
+                    alignment: 'start',
+                    maxLines: 2,
+                    textStyle: { color: '#d8dee9', fontSize: 11, bold: true },
+                },
+                bar: { groupWidth: '66%' },
+                focusTarget: 'category',
+                tooltip: {
+                    textStyle: { color: '#0e141c', fontSize: 11 },
+                    showColorCode: true,
+                },
+                crosshair: { trigger: 'focus', orientation: 'vertical', color: '#5dd62c' },
+                vAxis: {
+                    title: 'CDN$ / GJ',
+                    titleTextStyle: { color: '#e6edf5', bold: true, fontSize: 12 },
+                    textStyle: { color: '#a8b3c2', fontSize: 11 },
+                    gridlines: { color: 'rgba(255,255,255,0.14)' },
+                    minorGridlines: { color: 'rgba(255,255,255,0.06)' },
+                    format: 'currency',
+                },
+                hAxis: {
+                    slantedText: true,
+                    slantedTextAngle: 65,
+                    textStyle: { color: '#a8b3c2', fontSize: 10 },
+                    baselineColor: 'rgba(255,255,255,0.14)',
+                },
+                colors: spec.colors,
+                seriesType: 'bars',
+                series: seriesConfig,
+                animation: { startup: true, duration: 480, easing: 'out' },
+            };
+
+            const chart = new window.google.visualization.ComboChart(container);
+            chart.draw(table, options);
+        },
+
+        drawCanadaCharts(pointRows = null) {
+            const sourceRows = Array.isArray(pointRows) ? pointRows : this.state.canadaPointRows;
+            Object.entries(CANADA_CHART_SPECS).forEach(([chartId, spec]) => {
+                const rows = sourceRows.filter((row) => row.chart_id === chartId);
+                this.drawCanadaComboChart(spec, rows);
+            });
+        },
+
+        renderCanadaChartPlaceholders(message = 'No chart data.') {
+            Object.values(CANADA_CHART_SPECS).forEach((spec) => {
+                const container = document.getElementById(spec.containerId);
+                if (!container) return;
+                container.innerHTML = `<div class="ggx-empty">${escapeHtml(message)}</div>`;
+            });
+        },
+
+        parseMaybeArray(value) {
+            if (Array.isArray(value)) return value;
+            if (typeof value !== 'string') return [];
+            try {
+                const parsed = JSON.parse(value);
+                return Array.isArray(parsed) ? parsed : [];
+            } catch {
+                return [];
+            }
+        },
+
+        getCanadaTableCellValue(row, header, index) {
+            if (row && typeof row === 'object' && !Array.isArray(row)) return row[header] ?? '';
+            if (Array.isArray(row)) return row[index] ?? '';
+            return '';
+        },
+
+        renderCanadaStaticTables(tableRows = null, emptyMessage = 'No parsed Canada static tables in this run.') {
+            const wrap = document.getElementById('ggx-canada-static-tables');
+            if (!wrap) return;
+
+            const sourceRows = Array.isArray(tableRows) ? tableRows : this.state.canadaTableRows;
+            if (!sourceRows.length) {
+                wrap.innerHTML = `<div class="ggx-empty">${escapeHtml(emptyMessage)}</div>`;
+                return;
+            }
+
+            const preferredOrder = ['intra_alberta_cost_image', 'current_utility_delivery_costs_image'];
+            const sorted = [...sourceRows].sort((a, b) => {
+                const ai = preferredOrder.indexOf(a.chart_id);
+                const bi = preferredOrder.indexOf(b.chart_id);
+                if (ai === -1 && bi === -1) return String(a.chart_title || '').localeCompare(String(b.chart_title || ''));
+                if (ai === -1) return 1;
+                if (bi === -1) return -1;
+                return ai - bi;
+            });
+
+            wrap.innerHTML = sorted
+                .map((item) => {
+                    const headers = this.parseMaybeArray(item.headers);
+                    const rows = this.parseMaybeArray(item.table_rows);
+
+                    if (!headers.length) {
+                        return `
+                            <article class="ggx-channel-card p-4">
+                                <h3 class="ggx-event-title">${escapeHtml(item.chart_title || item.chart_id || 'Untitled')}</h3>
+                                <div class="ggx-empty mt-3">No parsed table headers in this record.</div>
+                            </article>
+                        `;
+                    }
+
+                    const headerHtml = headers
+                        .map((header) => `<th class="ggx-canada-head-cell">${escapeHtml(header)}</th>`)
+                        .join('');
+                    const bodyHtml = rows
+                        .map((row, rowIndex) => {
+                            const isSection = row && typeof row === 'object' && !Array.isArray(row) && row._row_type === 'section';
+                            const cellHtml = headers
+                                .map((header, index) => {
+                                    const raw = this.getCanadaTableCellValue(row, header, index);
+                                    const value = isSection && header !== 'Component' ? '' : raw;
+                                    const cellClass = isSection && header === 'Component' ? 'ggx-canada-cell ggx-canada-cell-section' : 'ggx-canada-cell';
+                                    return `<td class="${cellClass}">${escapeHtml(value)}</td>`;
+                                })
+                                .join('');
+                            const rowClass = isSection ? 'ggx-canada-row is-section' : `ggx-canada-row ${rowIndex % 2 === 0 ? 'is-even' : 'is-odd'}`;
+                            return `<tr class="${rowClass}">${cellHtml}</tr>`;
+                        })
+                        .join('');
+
+                    return `
+                        <article class="ggx-channel-card p-4">
+                            <h3 class="ggx-event-title">${escapeHtml(item.chart_title || item.chart_id || 'Untitled')}</h3>
+                            <div class="ggx-table-wrap mt-3">
+                                <table class="ggx-data-table ggx-canada-data-table">
+                                    <thead>
+                                        <tr>${headerHtml}</tr>
+                                    </thead>
+                                    <tbody>${bodyHtml}</tbody>
+                                </table>
+                            </div>
+                            <p class="ggx-mini-caption mt-3">Parsed rows: ${escapeHtml(String(item.row_count || 0))}</p>
+                        </article>
+                    `;
+                })
+                .join('');
+        },
+
+        async renderCanadaDashboard() {
+            const activeRegion = this.getActiveDataRegionView();
+            const pointRows = Array.isArray(activeRegion?.pointRows) ? activeRegion.pointRows : this.state.canadaPointRows;
+            const tableRows = Array.isArray(activeRegion?.tableRows) ? activeRegion.tableRows : this.state.canadaTableRows;
+            const noStructuredData = !pointRows.length && !tableRows.length;
+            const emptyRegionMessage = hasRegionStructuredData(activeRegion) ? 'No structured table data in this run.' : DATA_UPDATING_TEXT;
+
+            this.renderCanadaRunSummary(activeRegion);
+            if (noStructuredData) {
+                this.setCanadaStatus('loading', DATA_UPDATING_TEXT);
+            } else {
+                this.setCanadaStatus(
+                    this.state.canadaStatus.type,
+                    `${this.state.canadaStatus.message} Scope ${activeRegion?.shortLabel || 'GLOBAL'}: ${pointRows.length} points / ${tableRows.length} tables.`
+                );
+            }
+            this.renderCanadaStaticTables(tableRows, emptyRegionMessage);
+
+            if (!pointRows.length) {
+                this.renderCanadaChartPlaceholders(DATA_UPDATING_TEXT);
+                return;
+            }
+
+            await ensureGoogleChartsLoaded();
+            this.drawCanadaCharts(pointRows);
+
+            if (!this.state.canadaResizeBound) {
+                this.state.canadaResizeBound = true;
+                let resizeTimer = null;
+                window.addEventListener('resize', () => {
+                    clearTimeout(resizeTimer);
+                    resizeTimer = setTimeout(() => {
+                        const active = this.getActiveDataRegionView();
+                        const scopedRows = Array.isArray(active?.pointRows) ? active.pointRows : this.state.canadaPointRows;
+                        this.drawCanadaCharts(scopedRows);
+                    }, 180);
+                });
+            }
+        },
+
         async buildEventsRows() {
             const rows = [];
             const pushRow = (row) => {
@@ -1000,7 +2482,11 @@ export function createChannelApp(channelKey) {
                         <h3 class="ggx-event-title">${escapeHtml(item.title || 'Untitled')}</h3>
                         <p class="ggx-event-summary ggx-line-clamp-3">${escapeHtml(item.summary || 'No summary provided.')}</p>
                         <div class="ggx-event-actions">
-                            <span class="text-xs text-gray-500 uppercase tracking-wide">${escapeHtml(item.source || '--')} · ${escapeHtml(item.type || '--')}</span>
+                            <span class="text-xs text-gray-500 uppercase tracking-wide">
+                                <a href="${buildTopicTagUrl(item.source || 'source')}" class="hover:text-white transition-colors">${escapeHtml(item.source || '--')}</a>
+                                ·
+                                <a href="${buildTopicTagUrl(item.type || 'events')}" class="hover:text-white transition-colors">${escapeHtml(item.type || '--')}</a>
+                            </span>
                             <a ${buildLinkAttrs(item.url || '#')} class="ggx-event-link">Open Link</a>
                         </div>
                     </article>
diff --git a/news/shared/modules/styles/channel-page.shared.css b/news/shared/modules/styles/channel-page.shared.css
index 52e260b..121f22d 100644
--- a/news/shared/modules/styles/channel-page.shared.css
+++ b/news/shared/modules/styles/channel-page.shared.css
@@ -219,6 +219,40 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
     gap: 0.55rem;
 }
 
+.ggx-ui-icon {
+    width: 1.52rem;
+    height: 1.52rem;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 11px;
+    border: 1px solid color-mix(in srgb, var(--ggx-accent) 38%, white 10%);
+    color: color-mix(in srgb, var(--ggx-accent) 80%, white 20%);
+    background:
+        radial-gradient(145% 145% at 18% 12%, color-mix(in srgb, var(--ggx-accent) 18%, transparent), transparent 56%),
+        linear-gradient(160deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.02));
+    box-shadow:
+        inset 0 1px 0 rgba(255, 255, 255, 0.18),
+        inset 0 0 0 1px rgba(255, 255, 255, 0.03),
+        0 10px 24px -18px var(--ggx-accent-glow);
+    flex-shrink: 0;
+    transition: transform 0.2s ease, border-color 0.2s ease, color 0.2s ease;
+}
+
+.ggx-ui-icon svg {
+    width: 0.9rem;
+    height: 0.9rem;
+    display: block;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+}
+
+.ggx-section-head h2:hover .ggx-ui-icon {
+    transform: translateY(-1px);
+    border-color: color-mix(in srgb, var(--ggx-accent) 60%, white 12%);
+    color: color-mix(in srgb, var(--ggx-accent) 90%, white 10%);
+}
+
 .ggx-chip-row {
     display: flex;
     gap: 0.55rem;
@@ -244,6 +278,17 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
     background: color-mix(in srgb, var(--ggx-accent) 17%, transparent);
 }
 
+.ggx-data-region-tab {
+    cursor: pointer;
+}
+
+.ggx-data-region-tab-active {
+    border-color: color-mix(in srgb, var(--ggx-accent) 58%, white 12%);
+    color: #fff;
+    background: color-mix(in srgb, var(--ggx-accent) 22%, transparent);
+    box-shadow: 0 10px 22px -18px var(--ggx-accent-glow);
+}
+
 .ggx-channel-layout {
     display: grid;
     gap: 1rem;
@@ -420,6 +465,85 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
     grid-template-columns: repeat(1, minmax(0, 1fr));
 }
 
+.ggx-canada-run-grid {
+    display: grid;
+    gap: 0.85rem;
+    grid-template-columns: 1fr;
+}
+
+.ggx-canada-run-card,
+.ggx-canada-status-box {
+    padding: 0.9rem;
+    border: 1px solid var(--ggx-border);
+    border-radius: 14px;
+    background: rgba(255, 255, 255, 0.03);
+}
+
+.ggx-canada-run-label {
+    font-size: 10px;
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    color: var(--ggx-text-muted);
+}
+
+.ggx-canada-run-value {
+    margin-top: 0.45rem;
+    color: #fff;
+    font-size: 1.03rem;
+    font-weight: 700;
+}
+
+.ggx-canada-run-meta {
+    margin-top: 0.35rem;
+    color: #96a1af;
+    font-size: 11px;
+    font-family: 'JetBrains Mono', monospace;
+}
+
+.ggx-canada-status-box {
+    color: #d1d7e0;
+    font-size: 13px;
+    line-height: 1.5;
+}
+
+.ggx-canada-chart-grid {
+    display: grid;
+    gap: 0.95rem;
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.ggx-canada-chart {
+    width: 100%;
+    min-height: 420px;
+    border-radius: 14px;
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    background:
+        radial-gradient(110% 120% at 10% 8%, color-mix(in srgb, var(--ggx-accent) 12%, transparent), transparent 58%),
+        linear-gradient(165deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));
+    padding: 0.35rem;
+    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
+    overflow: hidden;
+}
+
+.ggx-canada-static-grid {
+    display: grid;
+    gap: 0.9rem;
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.ggx-canada-cell {
+    padding: 0.68rem 0.58rem;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+    color: #e0e7f0;
+    text-align: left;
+    font-size: 12px;
+}
+
+.ggx-canada-cell-section {
+    color: color-mix(in srgb, var(--ggx-accent) 88%, white 10%);
+    font-weight: 700;
+}
+
 .ggx-metric-grid {
     display: grid;
     gap: 0.75rem;
@@ -455,19 +579,23 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
 
 .ggx-table-wrap {
     overflow: auto;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 12px;
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
 }
 
 .ggx-data-table {
     width: 100%;
-    border-collapse: collapse;
+    border-collapse: separate;
+    border-spacing: 0;
     min-width: 620px;
     font-size: 12px;
 }
 
 .ggx-data-table th,
 .ggx-data-table td {
-    padding: 0.68rem 0.58rem;
-    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+    padding: 0.72rem 0.62rem;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
     text-align: left;
 }
 
@@ -482,6 +610,37 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
     color: #e0e7f0;
 }
 
+.ggx-canada-head-cell {
+    position: sticky;
+    top: 0;
+    z-index: 2;
+    color: #d7e1ee;
+    font-size: 10px;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    background:
+        linear-gradient(180deg, rgba(17, 24, 34, 0.95), rgba(11, 15, 22, 0.92)),
+        radial-gradient(160% 180% at 0% 0%, color-mix(in srgb, var(--ggx-accent) 18%, transparent), transparent 62%);
+    border-bottom: 1px solid color-mix(in srgb, var(--ggx-accent) 26%, white 12%);
+    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.04);
+}
+
+.ggx-canada-row.is-even td {
+    background: rgba(255, 255, 255, 0.01);
+}
+
+.ggx-canada-row.is-odd td {
+    background: rgba(255, 255, 255, 0.03);
+}
+
+.ggx-canada-row:hover td {
+    background: color-mix(in srgb, var(--ggx-accent) 12%, rgba(255, 255, 255, 0.04));
+}
+
+.ggx-canada-row.is-section td {
+    background: rgba(255, 255, 255, 0.015);
+}
+
 .ggx-events-grid {
     display: grid;
     gap: 0.95rem;
@@ -618,6 +777,18 @@ body.ggx-channel-page::-webkit-scrollbar-thumb:hover {
         grid-template-columns: 1.1fr 1fr;
     }
 
+    .ggx-canada-run-grid {
+        grid-template-columns: 1.25fr 1fr;
+    }
+
+    .ggx-canada-chart-grid {
+        grid-template-columns: repeat(1, minmax(0, 1fr));
+    }
+
+    .ggx-canada-static-grid {
+        grid-template-columns: repeat(1, minmax(0, 1fr));
+    }
+
     .ggx-events-grid {
         grid-template-columns: repeat(2, minmax(0, 1fr));
     }
diff --git a/private-use/diary-appscript.gs b/private-use/diary-appscript.gs
new file mode 100644
index 0000000..0bbff15
--- /dev/null
+++ b/private-use/diary-appscript.gs
@@ -0,0 +1,204 @@
+var DOC_ID = "1gH9-kc5tsF_XfUpvlaonIHIfKKX9atukvmqtAdcnca0";
+var ATTACHMENT_FOLDER_NAME = "DiaryAttachments";
+var TZ = "Asia/Shanghai";
+
+function doGet() {
+  return jsonOutput_({
+    status: "ok",
+    message: "Diary endpoint is running"
+  });
+}
+
+function doPost(e) {
+  try {
+    if (!e || !e.postData || !e.postData.contents) {
+      return jsonOutput_({ status: "error", message: "请求体为空" });
+    }
+
+    var payload = JSON.parse(e.postData.contents);
+    var formattedEntry = safeString_(payload.formattedEntry || payload.content).trim();
+    var rawText = safeString_(payload.rawText).trim();
+    var whatText = safeString_(payload.whatText).trim();
+    var reviewText = safeString_(payload.reviewText).trim();
+    var tags = normalizeTags_(payload.tags);
+    var energy = normalizeEnergy_(payload.energy);
+    var panelTime = safeString_(payload.panelTime).trim();
+    var attachments = Array.isArray(payload.attachments) ? payload.attachments : [];
+
+    if (!formattedEntry) {
+      formattedEntry = buildStandardTemplate_(whatText || rawText, reviewText, tags, energy, panelTime);
+    }
+
+    if (!formattedEntry && attachments.length === 0) {
+      return jsonOutput_({ status: "error", message: "内容不能为空" });
+    }
+
+    var doc = DocumentApp.openById(DOC_ID);
+    var body = doc.getBody();
+    appendMultiline_(body, formattedEntry);
+
+    var savedAttachments = [];
+    if (attachments.length > 0) {
+      var folder = getOrCreateFolder_();
+      body.appendParagraph("");
+      body.appendParagraph("**📎 附件**");
+
+      for (var i = 0; i < attachments.length; i++) {
+        var item = attachments[i];
+        if (!item) continue;
+
+        var name = sanitizeFileName_(safeString_(item.name) || ("file_" + (i + 1)));
+        var mimeType = safeString_(item.mimeType) || "application/octet-stream";
+        var kind = safeString_(item.kind) || "file";
+        var kindLabel = getAttachmentLabel_(kind);
+        var base64 = safeString_(item.base64);
+
+        if (!base64) {
+          body.appendParagraph("* [" + kindLabel + "] " + name + "（未上传原文件）");
+          continue;
+        }
+
+        var bytes = Utilities.base64Decode(base64);
+        var blob = Utilities.newBlob(bytes, mimeType, name);
+        var file = folder.createFile(blob);
+        var url = file.getUrl();
+
+        body.appendParagraph("* [" + kindLabel + "] " + name + "： " + url);
+
+        savedAttachments.push({
+          kind: kind,
+          name: name,
+          url: url
+        });
+      }
+    }
+
+    body.appendParagraph("");
+    doc.saveAndClose();
+
+    return jsonOutput_({
+      status: "success",
+      message: "写入成功",
+      attachmentCount: savedAttachments.length,
+      attachments: savedAttachments
+    });
+  } catch (error) {
+    return jsonOutput_({
+      status: "error",
+      message: (error && error.message) ? error.message : String(error)
+    });
+  }
+}
+
+function getOrCreateFolder_() {
+  var root = DriveApp.getRootFolder();
+  var folders = root.getFoldersByName(ATTACHMENT_FOLDER_NAME);
+  if (folders.hasNext()) return folders.next();
+  return root.createFolder(ATTACHMENT_FOLDER_NAME);
+}
+
+function sanitizeFileName_(name) {
+  return name.replace(/[\\/:*?"<>|#%&{}$!'@+=`]/g, "_").slice(0, 120);
+}
+
+function appendMultiline_(body, text) {
+  var lines = safeString_(text).replace(/\r\n/g, "\n").split("\n");
+  for (var i = 0; i < lines.length; i++) {
+    body.appendParagraph(lines[i]);
+  }
+}
+
+function normalizeTags_(tags) {
+  if (!Array.isArray(tags)) return [];
+  var list = [];
+  var seen = {};
+  for (var i = 0; i < tags.length; i++) {
+    var tag = safeString_(tags[i]).replace(/^#/, "").trim();
+    if (!tag || seen[tag]) continue;
+    list.push(tag);
+    seen[tag] = true;
+  }
+  return list;
+}
+
+function normalizeEnergy_(value) {
+  var n = Number(value);
+  if (!isFinite(n)) return 8;
+  n = Math.round(n);
+  if (n < 1) return 1;
+  if (n > 10) return 10;
+  return n;
+}
+
+function splitBulletItems_(text) {
+  var normalized = safeString_(text).replace(/\r\n/g, "\n");
+  var rows = normalized.split("\n");
+  var items = [];
+  for (var i = 0; i < rows.length; i++) {
+    var line = rows[i].replace(/^\s*[*-]\s*/, "").trim();
+    if (line) items.push(line);
+  }
+  return items;
+}
+
+function weekdayLabel_(date) {
+  var map = {
+    "1": "周一",
+    "2": "周二",
+    "3": "周三",
+    "4": "周四",
+    "5": "周五",
+    "6": "周六",
+    "7": "周日"
+  };
+  var index = Utilities.formatDate(date, TZ, "u");
+  return map[index] || "周一";
+}
+
+function buildStandardTemplate_(whatText, reviewText, tags, energy, panelTime) {
+  var now = new Date();
+  var dateLabel = Utilities.formatDate(now, TZ, "yyyy-MM-dd");
+  var weekday = weekdayLabel_(now);
+  var tagLine = tags.length ? tags.map(function(tag) { return "#" + tag; }).join(" ") : "（未选择）";
+  var whatItems = splitBulletItems_(whatText);
+  var reviewItems = splitBulletItems_(reviewText);
+  var lines = [];
+  lines.push("---");
+  lines.push("## " + dateLabel + " (" + weekday + ")");
+  lines.push("");
+  lines.push("**🕒 记录时分**：" + (panelTime || "--:--"));
+  lines.push("");
+  lines.push("**🏷️ 标签与状态**：" + tagLine + "| 精力值：" + energy + "/10");
+  lines.push("");
+  lines.push("**📝 今日记录 (What)**");
+  if (whatItems.length) {
+    for (var i = 0; i < whatItems.length; i++) lines.push("* " + whatItems[i]);
+  } else {
+    lines.push("* （待补充）");
+  }
+  lines.push("");
+  lines.push("**🧠 思考与复盘 (Why & How)**");
+  if (reviewItems.length) {
+    for (var j = 0; j < reviewItems.length; j++) lines.push("* " + reviewItems[j]);
+  } else {
+    lines.push("* （待补充）");
+  }
+  return lines.join("\n");
+}
+
+function getAttachmentLabel_(kind) {
+  if (kind === "camera") return "拍摄照片";
+  if (kind === "album") return "相册图片";
+  return kind || "附件";
+}
+
+function safeString_(value) {
+  if (value === null || value === undefined) return "";
+  return String(value);
+}
+
+function jsonOutput_(obj) {
+  return ContentService
+    .createTextOutput(JSON.stringify(obj))
+    .setMimeType(ContentService.MimeType.JSON);
+}
diff --git a/private-use/diary-logo.png b/private-use/diary-logo.png
new file mode 100644
index 0000000..737b381
Binary files /dev/null and b/private-use/diary-logo.png differ
diff --git a/private-use/diary-logo.svg b/private-use/diary-logo.svg
new file mode 100644
index 0000000..f3176d6
--- /dev/null
+++ b/private-use/diary-logo.svg
@@ -0,0 +1,41 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-labelledby="title desc">
+  <title id="title">Diary Mood Logo</title>
+  <desc id="desc">A playful diary icon with smiley mood and handwritten lines.</desc>
+
+  <defs>
+    <linearGradient id="bgGrad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#f6f3eb"/>
+      <stop offset="100%" stop-color="#e8e6df"/>
+    </linearGradient>
+    <linearGradient id="sunGrad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#ffd85e"/>
+      <stop offset="100%" stop-color="#f6b73e"/>
+    </linearGradient>
+    <pattern id="grid" width="24" height="24" patternUnits="userSpaceOnUse">
+      <path d="M24 0H0V24" fill="none" stroke="#ddd9d0" stroke-width="1"/>
+    </pattern>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feDropShadow dx="0" dy="8" stdDeviation="8" flood-color="#000" flood-opacity=".16"/>
+    </filter>
+  </defs>
+
+  <rect x="12" y="12" width="488" height="488" rx="110" fill="url(#bgGrad)"/>
+  <rect x="12" y="12" width="488" height="488" rx="110" fill="url(#grid)" opacity=".55"/>
+
+  <g filter="url(#shadow)">
+    <rect x="94" y="78" width="324" height="356" rx="26" fill="#f9f7f0" stroke="#1f1f1f" stroke-width="10"/>
+    <line x1="146" y1="112" x2="146" y2="400" stroke="#cf6363" stroke-width="8" stroke-linecap="round" opacity=".9"/>
+
+    <rect x="170" y="64" width="172" height="24" rx="10" fill="#a8ddb5" opacity=".95"/>
+
+    <circle cx="256" cy="164" r="52" fill="url(#sunGrad)" stroke="#e7a032" stroke-width="5"/>
+    <circle cx="238" cy="152" r="5.5" fill="#2a2a2a"/>
+    <circle cx="274" cy="152" r="5.5" fill="#2a2a2a"/>
+    <path d="M232 178c11 11 37 11 48 0" fill="none" stroke="#2a2a2a" stroke-width="6" stroke-linecap="round"/>
+
+    <rect x="176" y="232" width="170" height="20" rx="10" fill="#a8ddb5"/>
+    <path d="M179 286h168M179 319h168M179 352h168" stroke="#404040" stroke-width="7.5" stroke-linecap="round" opacity=".88"/>
+
+    <path d="M346 76l28 12-28 12z" fill="#2b2b2b"/>
+  </g>
+</svg>
diff --git a/private-use/diary.html b/private-use/diary.html
new file mode 100644
index 0000000..ac45b6a
--- /dev/null
+++ b/private-use/diary.html
@@ -0,0 +1,2221 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <title>Diary Mood</title>
+    <meta name="color-scheme" content="light">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="default">
+    <meta name="apple-mobile-web-app-title" content="Diary Mood">
+    <link rel="icon" type="image/svg+xml" href="./diary-logo.png">
+    <link rel="apple-touch-icon" href="./diary-logo.png">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&display=swap" rel="stylesheet">
+    <link rel="preconnect" href="https://script.google.com" crossorigin>
+    <link rel="preconnect" href="https://script.googleusercontent.com" crossorigin>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
+    <style>
+        :root {
+            --bg: #e9e9e5;
+            --ink: #171717;
+            --muted: #96918b;
+            --accent-soft: #a3d8b1;
+            --paper-grid: #e2e2de;
+            --paper: #f0f0eb;
+            --paper-border: #202020;
+            --red-ink: #cf6363;
+            --font-hand: "ZCOOL KuaiLe", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
+            --font-ui: "ZCOOL KuaiLe", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
+        }
+
+        * { box-sizing: border-box; }
+
+        html,
+        body {
+            height: 100%;
+            overflow: hidden;
+        }
+
+        body {
+            margin: 0;
+            background: var(--bg);
+            color: var(--ink);
+            font-family: var(--font-ui);
+            min-height: 100%;
+        }
+
+        .app {
+            width: min(100%, 430px);
+            height: 100dvh;
+            min-height: 100dvh;
+            margin: 0 auto;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .view {
+            display: none;
+            height: 100%;
+            min-height: 0;
+            padding: 4px 14px 22px;
+        }
+
+        .view.active {
+            display: flex;
+            flex-direction: column;
+        }
+
+        .picker-stage {
+            flex: 1;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            gap: 20px;
+            padding: 6px 0 2px;
+        }
+
+        .wheel-wrap {
+            position: relative;
+            width: min(100%, 404px);
+            height: clamp(320px, 52vh, 410px);
+            min-height: 320px;
+            display: grid;
+            place-items: center;
+        }
+
+        .mood-ring {
+            width: min(100%, 390px);
+            --ring-radius: 154px;
+            --ring-rotation: 0deg;
+            position: relative;
+            aspect-ratio: 1 / 1;
+            margin: 0;
+            touch-action: none;
+            cursor: grab;
+        }
+
+        .mood-ring.instant-rotate .mood-node {
+            transition: none !important;
+        }
+
+        .mood-ring.dragging {
+            cursor: grabbing;
+        }
+
+        .mood-ring::before {
+            content: "";
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            width: calc(var(--ring-radius) * 2);
+            height: calc(var(--ring-radius) * 2);
+            transform: translate(-50%, -50%);
+            border-radius: 50%;
+            border: 2px solid rgba(130, 130, 130, 0.26);
+            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
+            pointer-events: none;
+        }
+
+        .mood-node {
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            width: 96px;
+            height: 96px;
+            border-radius: 50%;
+            border: 0;
+            background: transparent;
+            transform: translate(-50%, -50%) rotate(calc(var(--angle) + var(--ring-rotation))) translateY(calc(var(--ring-radius) * -1)) rotate(calc((var(--angle) + var(--ring-rotation)) * -1));
+            transition: transform var(--ring-transition, 520ms) var(--ring-ease, cubic-bezier(0.2, 0.86, 0.32, 1)), filter 220ms ease;
+            cursor: pointer;
+            display: grid;
+            place-items: center;
+            color: #111;
+            font-size: 68px;
+            line-height: 1;
+            padding: 0;
+            box-shadow: none;
+            isolation: isolate;
+        }
+
+        .mood-node.active {
+            filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.14));
+            transform: translate(-50%, -50%) rotate(calc(var(--angle) + var(--ring-rotation))) translateY(calc(var(--ring-radius) * -1)) rotate(calc((var(--angle) + var(--ring-rotation)) * -1)) scale(2);
+        }
+
+        .mood-node:active {
+            transform: translate(-50%, -50%) rotate(calc(var(--angle) + var(--ring-rotation))) translateY(calc(var(--ring-radius) * -1)) rotate(calc((var(--angle) + var(--ring-rotation)) * -1)) scale(0.96);
+        }
+
+        .picker-confirm {
+            margin: 0 auto;
+            width: min(92%, 360px);
+            text-align: center;
+        }
+
+        .picker-confirm .tape {
+            font-size: 34px;
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            gap: 0.16em;
+            line-height: 1.15;
+            padding: 6px 16px 4px;
+            background: linear-gradient(180deg, transparent 62%, var(--accent-soft) 62%);
+        }
+
+        .picker-confirm .tape::before,
+        .picker-confirm .tape::after {
+            top: 62%;
+            border-top: 12px solid transparent;
+            border-bottom: 12px solid transparent;
+        }
+
+        .picker-desc {
+            margin: 8px 0 0;
+            font-family: var(--font-hand);
+            font-size: 20px;
+            color: #6f6a64;
+            line-height: 1.25;
+        }
+
+        .tape {
+            font-family: var(--font-hand);
+            font-size: 36px;
+            line-height: 1;
+            display: inline-block;
+            padding: 4px 8px 2px;
+            background: linear-gradient(180deg, transparent 48%, var(--accent-soft) 48%);
+            position: relative;
+        }
+
+        .tape::before,
+        .tape::after {
+            content: "";
+            position: absolute;
+            width: 12px;
+            top: 50%;
+            transform: translateY(-50%);
+            border-top: 13px solid transparent;
+            border-bottom: 13px solid transparent;
+        }
+
+        .tape::before {
+            left: -12px;
+            border-right: 12px solid var(--accent-soft);
+        }
+
+        .tape::after {
+            right: -12px;
+            border-left: 12px solid var(--accent-soft);
+        }
+
+        .picker-bottom {
+            margin-top: 16px;
+            padding: 6px 0 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-size: 40px;
+            line-height: 1;
+        }
+
+        .icon-btn {
+            border: 0;
+            background: transparent;
+            color: #111;
+            cursor: pointer;
+            width: 62px;
+            height: 62px;
+            border-radius: 31px;
+            display: grid;
+            place-items: center;
+        }
+
+        .icon-btn.center-next {
+            width: 72px;
+            height: 72px;
+            font-size: 58px;
+        }
+
+        .editor-view {
+            background:
+                linear-gradient(var(--paper-grid) 1px, transparent 1px),
+                linear-gradient(90deg, var(--paper-grid) 1px, transparent 1px);
+            background-size: 22px 22px;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .editor-dock {
+            margin-top: 6px;
+            display: flex;
+            flex-direction: column;
+            position: relative;
+            padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 6px);
+        }
+
+        .editor-tools {
+            margin-top: 10px;
+            padding: 0 8px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            border: 2px solid #c6c6c1;
+            border-radius: 8px;
+            background: rgba(255, 255, 255, 0.58);
+        }
+
+        .editor-tools .icon-btn {
+            width: 56px;
+            height: 56px;
+            font-size: 0;
+        }
+
+        .editor-tools .icon-btn i {
+            font-size: 42px;
+            line-height: 1;
+        }
+
+        .editor-tools .icon-btn.plus-btn i {
+            font-size: 38px;
+        }
+
+        .plus-menu {
+            position: absolute;
+            left: 14px;
+            bottom: calc(env(safe-area-inset-bottom, 0px) + 72px);
+            width: min(84vw, 340px);
+            background: #f4f4ef;
+            border: 1px solid #d8d8d2;
+            border-radius: 16px;
+            box-shadow: 0 14px 26px rgba(0, 0, 0, 0.16);
+            overflow: hidden;
+            display: none;
+            z-index: 48;
+        }
+
+        .plus-menu.show {
+            display: block;
+        }
+
+        .plus-item {
+            width: 100%;
+            border: 0;
+            border-bottom: 1px solid #dfdfda;
+            background: transparent;
+            padding: 12px 16px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            color: #131313;
+            font-size: 34px;
+            font-family: var(--font-hand);
+            line-height: 1.05;
+            cursor: pointer;
+            text-align: left;
+        }
+
+        .plus-item:last-child {
+            border-bottom: 0;
+        }
+
+        .plus-item:active {
+            background: #ebebe5;
+        }
+
+        .plus-item i {
+            font-size: 30px;
+            color: #202020;
+        }
+
+        .paper {
+            margin: 4px auto 0;
+            width: 100%;
+            flex: 1;
+            min-height: 0;
+            border: 3px solid var(--paper-border);
+            background:
+                linear-gradient(var(--paper-grid) 1px, transparent 1px),
+                linear-gradient(90deg, var(--paper-grid) 1px, transparent 1px),
+                var(--paper);
+            background-size: 22px 22px;
+            position: relative;
+            padding: 10px 14px 12px;
+            display: flex;
+            flex-direction: column;
+            overflow: hidden;
+        }
+
+        .paper-header {
+            display: grid;
+            grid-template-columns: 132px 1fr 46px;
+            align-items: start;
+            gap: 6px;
+        }
+
+        .paper-date {
+            font-family: var(--font-hand);
+            font-size: 32px;
+            line-height: 1.05;
+            display: flex;
+            flex-direction: column;
+            gap: 2px;
+            color: #181818;
+            min-width: 102px;
+            justify-self: start;
+        }
+
+        .paper-date .weekday {
+            font-size: 24px;
+            line-height: 1;
+            letter-spacing: 0.02em;
+        }
+
+        .paper-date .solar {
+            font-size: 46px;
+            line-height: 0.92;
+        }
+
+        .paper-date .lunar {
+            font-size: 22px;
+            line-height: 1;
+            color: #45413d;
+            white-space: nowrap;
+        }
+
+        .weather-trigger {
+            width: 46px;
+            height: 46px;
+            border: 0;
+            border-radius: 14px;
+            background: rgba(255, 255, 255, 0.35);
+            color: #1f1f1f;
+            display: grid;
+            place-items: center;
+            cursor: pointer;
+            font-size: 31px;
+            line-height: 1;
+            transition: transform 120ms ease, background 120ms ease;
+            justify-self: end;
+        }
+
+        .weather-trigger:hover {
+            background: rgba(255, 255, 255, 0.6);
+        }
+
+        .weather-trigger:active {
+            transform: scale(0.95);
+        }
+
+        .paper-hero {
+            justify-self: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
+
+        .paper-emoji {
+            margin: 0;
+            width: 138px;
+            height: 138px;
+            border-radius: 50%;
+            display: grid;
+            place-items: center;
+            font-size: 68px;
+            background: transparent;
+            cursor: pointer;
+            transition: transform 120ms ease;
+        }
+
+        .paper-emoji:active {
+            transform: scale(0.96);
+        }
+
+        .paper-mood-title {
+            text-align: center;
+            margin-top: 2px;
+            font-size: 34px;
+        }
+
+        .paper-mood-title .tape {
+            cursor: pointer;
+            background: transparent;
+            padding: 0;
+            display: inline-flex;
+            align-items: center;
+            gap: 0.12em;
+            white-space: nowrap;
+        }
+
+        .paper-mood-title .tape::before,
+        .paper-mood-title .tape::after {
+            display: none;
+        }
+
+        .write-block {
+            margin-top: 8px;
+            color: #1d1d1d;
+            font-family: var(--font-hand);
+            display: flex;
+            flex-direction: column;
+            flex: 1;
+            min-height: 0;
+            overflow: hidden;
+        }
+
+        .time-mark {
+            font-size: 31px;
+            line-height: 1;
+            margin-bottom: 6px;
+            color: #1b1b1b;
+            display: inline-flex;
+            align-items: center;
+            gap: 8px;
+        }
+
+        .time-mark i {
+            font-size: 24px;
+            opacity: 0.92;
+        }
+
+        .time-mark .time-value {
+            line-height: 1;
+        }
+
+        .template-fields {
+            display: flex;
+            flex-direction: column;
+            gap: 12px;
+            flex: 1;
+            min-height: 0;
+            overflow-y: auto;
+            -webkit-overflow-scrolling: touch;
+            padding-right: 2px;
+        }
+
+        .quick-fields {
+            position: sticky;
+            top: 0;
+            z-index: 2;
+            display: flex;
+            flex-direction: column;
+            gap: 10px;
+            padding-bottom: 6px;
+            background:
+                linear-gradient(var(--paper-grid) 1px, transparent 1px),
+                linear-gradient(90deg, var(--paper-grid) 1px, transparent 1px),
+                var(--paper);
+            background-size: 22px 22px;
+        }
+
+        .quick-fields.missing {
+            animation: required-shake 360ms ease-in-out 1;
+            box-shadow: inset 0 0 0 2px rgba(209, 103, 103, 0.26);
+            border-radius: 8px;
+        }
+
+        .field-label {
+            font-size: 21px;
+            line-height: 1;
+            color: #7a746e;
+        }
+
+        .field-label.required::after {
+            content: " *";
+            color: #d16767;
+            font-size: 0.9em;
+        }
+
+        .tag-chips {
+            margin-top: 6px;
+            display: grid;
+            grid-template-columns: repeat(4, minmax(0, 1fr));
+            gap: 8px;
+        }
+
+        .tag-chip {
+            border: 2px solid #c8c4be;
+            background: #fff;
+            color: #46413d;
+            border-radius: 12px;
+            font-family: var(--font-hand);
+            font-size: 19px;
+            line-height: 1;
+            padding: 9px 4px;
+            cursor: pointer;
+            transition: all 120ms ease;
+            text-align: center;
+        }
+
+        .tag-chip.active {
+            border-color: #262626;
+            background: #262626;
+            color: #fff;
+        }
+
+        .energy-row {
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+
+        #energyInput {
+            flex: 1;
+            accent-color: #262626;
+        }
+
+        .energy-value {
+            min-width: 58px;
+            text-align: right;
+            font-size: 22px;
+            line-height: 1;
+            color: #5f5953;
+        }
+
+        .structured-input {
+            width: 100%;
+            border: 0;
+            background: transparent;
+            resize: none;
+            outline: none;
+            color: inherit;
+            font-family: inherit;
+            font-size: 22px;
+            line-height: 1.5;
+            flex: 0 0 auto;
+            min-height: 90px;
+            overflow-y: auto;
+            -webkit-overflow-scrolling: touch;
+            caret-color: #1d1d1d;
+            letter-spacing: 0.01em;
+            margin: 0;
+            padding: 2px 2px 8px 0;
+            color: #1d1d1d;
+        }
+
+        .structured-input.what-input {
+            min-height: 120px;
+        }
+
+        .structured-input.review-input {
+            min-height: 120px;
+        }
+
+        .attachment-list {
+            margin-top: 6px;
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: center;
+            gap: 8px;
+            min-height: 0;
+        }
+
+        .attachment-chip {
+            max-width: 100%;
+            padding: 4px 10px;
+            border-radius: 999px;
+            background: rgba(255, 255, 255, 0.72);
+            border: 1px solid #d3d3ce;
+            display: inline-flex;
+            align-items: center;
+            gap: 8px;
+            font-size: 20px;
+            font-family: var(--font-hand);
+            color: #44403b;
+        }
+
+        .chip-remove {
+            border: 0;
+            background: transparent;
+            color: #8a8580;
+            font-size: 22px;
+            line-height: 1;
+            cursor: pointer;
+            padding: 0;
+        }
+
+        .status-msg {
+            display: none;
+        }
+
+        .status-msg.error { color: #b64545; }
+        .status-msg.ok { color: #2f8a4d; }
+        .status-msg.muted { color: #7f7a74; }
+
+        .weather-modal {
+            position: fixed;
+            inset: 0;
+            background: rgba(0, 0, 0, 0.2);
+            display: none;
+            align-items: center;
+            justify-content: center;
+            z-index: 40;
+            padding: 20px;
+        }
+
+        .weather-modal.show {
+            display: flex;
+        }
+
+        .weather-panel {
+            width: min(92vw, 360px);
+            background: #fff;
+            border-radius: 10px;
+            padding: 18px 16px 14px;
+            box-shadow: 0 18px 36px rgba(0, 0, 0, 0.18);
+        }
+
+        .weather-title {
+            margin: 0;
+            text-align: center;
+            font-family: var(--font-hand);
+            font-size: 38px;
+            line-height: 1;
+        }
+
+        .weather-grid {
+            margin-top: 12px;
+            display: grid;
+            grid-template-columns: repeat(4, minmax(0, 1fr));
+            gap: 12px;
+        }
+
+        .weather-option {
+            width: 100%;
+            aspect-ratio: 1 / 1;
+            border: 2px solid transparent;
+            border-radius: 12px;
+            background: transparent;
+            display: grid;
+            place-items: center;
+            color: #111;
+            font-size: 30px;
+            cursor: pointer;
+            transition: border-color 120ms ease, background 120ms ease;
+        }
+
+        .weather-option.active {
+            border-color: #53a2ff;
+            background: #eef5ff;
+        }
+
+        .weather-actions {
+            margin-top: 12px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+
+        .weather-action {
+            width: 56px;
+            height: 56px;
+            border: 0;
+            background: transparent;
+            font-size: 52px;
+            line-height: 1;
+            color: #111;
+            cursor: pointer;
+        }
+
+        .mood-panel {
+            width: min(92vw, 360px);
+        }
+
+        .mood-grid {
+            margin-top: 12px;
+            display: grid;
+            grid-template-columns: repeat(5, minmax(0, 1fr));
+            gap: 10px;
+        }
+
+        .mood-option {
+            width: 100%;
+            aspect-ratio: 1 / 1;
+            border-radius: 50%;
+            border: 2px solid transparent;
+            background: var(--mood-color, #f4b8b8);
+            font-size: 28px;
+            display: grid;
+            place-items: center;
+            cursor: pointer;
+        }
+
+        .mood-option.active {
+            border-color: #53a2ff;
+            box-shadow: 0 0 0 3px rgba(83, 162, 255, 0.18);
+        }
+
+        .sticker-grid {
+            margin-top: 12px;
+            display: grid;
+            grid-template-columns: repeat(6, minmax(0, 1fr));
+            gap: 10px;
+        }
+
+        .sticker-option {
+            width: 100%;
+            aspect-ratio: 1 / 1;
+            border: 2px solid transparent;
+            border-radius: 10px;
+            background: #f3f3ee;
+            display: grid;
+            place-items: center;
+            font-size: 30px;
+            cursor: pointer;
+        }
+
+        .sticker-option:active {
+            border-color: #53a2ff;
+            background: #eef5ff;
+        }
+
+        .hold-tip {
+            position: fixed;
+            left: 50%;
+            top: 42%;
+            transform: translate(-50%, -50%);
+            background: rgba(17, 17, 17, 0.88);
+            color: #fff;
+            padding: 9px 14px;
+            border-radius: 10px;
+            font-size: 21px;
+            font-family: var(--font-hand);
+            pointer-events: none;
+            opacity: 0;
+            transition: opacity 160ms ease;
+            z-index: 20;
+            white-space: nowrap;
+        }
+
+        .hold-tip.show { opacity: 1; }
+
+        .submit-overlay {
+            position: fixed;
+            inset: 0;
+            background: rgba(0, 0, 0, 0.16);
+            display: none;
+            align-items: center;
+            justify-content: center;
+            z-index: 90;
+            padding: 20px;
+        }
+
+        .submit-overlay.show {
+            display: flex;
+        }
+
+        .submit-card {
+            width: min(86vw, 300px);
+            border-radius: 20px;
+            border: 2px solid rgba(28, 28, 28, 0.14);
+            background: rgba(250, 250, 247, 0.95);
+            box-shadow: 0 16px 34px rgba(0, 0, 0, 0.2);
+            padding: 18px 16px 14px;
+            text-align: center;
+        }
+
+        .submit-emoji {
+            font-size: 48px;
+            line-height: 1;
+            animation: submit-pop 900ms ease-in-out infinite;
+            transform-origin: center bottom;
+        }
+
+        .submit-text {
+            margin-top: 10px;
+            font-family: var(--font-hand);
+            font-size: 26px;
+            color: #2f2b28;
+            line-height: 1.15;
+        }
+
+        .submit-dots {
+            margin-top: 10px;
+            display: inline-flex;
+            gap: 6px;
+        }
+
+        .submit-dots span {
+            width: 8px;
+            height: 8px;
+            border-radius: 50%;
+            background: #313131;
+            opacity: 0.24;
+            animation: submit-dot 800ms ease-in-out infinite;
+        }
+
+        .submit-dots span:nth-child(2) { animation-delay: 120ms; }
+        .submit-dots span:nth-child(3) { animation-delay: 240ms; }
+
+        .submit-overlay.success .submit-emoji {
+            animation: none;
+            filter: drop-shadow(0 4px 8px rgba(34, 128, 64, 0.25));
+        }
+
+        .submit-overlay.error .submit-emoji {
+            animation: submit-shake 340ms ease-in-out 1;
+        }
+
+        .submit-overlay.success .submit-dots,
+        .submit-overlay.error .submit-dots {
+            display: none;
+        }
+
+        @keyframes submit-pop {
+            0%, 100% { transform: translateY(0) scale(1); }
+            50% { transform: translateY(-4px) scale(1.08); }
+        }
+
+        @keyframes submit-dot {
+            0%, 100% { opacity: 0.24; transform: translateY(0); }
+            50% { opacity: 1; transform: translateY(-2px); }
+        }
+
+        @keyframes submit-shake {
+            0%, 100% { transform: translateX(0); }
+            20% { transform: translateX(-4px); }
+            40% { transform: translateX(4px); }
+            60% { transform: translateX(-3px); }
+            80% { transform: translateX(3px); }
+        }
+
+        @keyframes required-shake {
+            0%, 100% { transform: translateX(0); }
+            25% { transform: translateX(-3px); }
+            50% { transform: translateX(3px); }
+            75% { transform: translateX(-2px); }
+        }
+
+        @media (max-width: 390px) {
+            .mood-ring { --ring-radius: 142px; }
+            .mood-node { width: 86px; height: 86px; font-size: 56px; }
+            .tape { font-size: 30px; }
+            .wheel-wrap { height: clamp(300px, 48vh, 340px); min-height: 300px; }
+            .picker-confirm .tape { font-size: 30px; }
+            .picker-desc { font-size: 18px; }
+            .paper { min-height: 0; }
+            .paper-date { font-size: 28px; }
+            .paper-date .weekday { font-size: 22px; }
+            .paper-date .solar { font-size: 42px; }
+            .paper-date .lunar { font-size: 18px; }
+            .paper-emoji { width: 126px; height: 126px; font-size: 58px; margin-top: 0; }
+            .paper-mood-title { font-size: 30px; }
+            .editor-tools .icon-btn i { font-size: 40px; }
+            .editor-tools .icon-btn.plus-btn i { font-size: 36px; }
+            .weather-trigger { width: 42px; height: 42px; font-size: 26px; }
+            .time-mark { font-size: 28px; }
+            .field-label { font-size: 19px; }
+            .tag-chip { font-size: 17px; padding: 8px 2px; }
+            .energy-value { font-size: 20px; min-width: 52px; }
+            .structured-input { font-size: 20px; min-height: 100px; }
+            .status-msg { font-size: 17px; }
+            .plus-menu { width: min(84vw, 320px); bottom: calc(env(safe-area-inset-bottom, 0px) + 70px); }
+            .plus-item { font-size: 30px; }
+            .plus-item i { font-size: 26px; }
+            .attachment-chip { font-size: 18px; }
+            .submit-text { font-size: 22px; }
+        }
+    </style>
+</head>
+<body>
+    <main class="app">
+        <section id="pickerView" class="view active">
+            <div class="picker-stage">
+                <div class="wheel-wrap">
+                    <div id="moodRing" class="mood-ring"></div>
+                </div>
+                <div class="picker-confirm">
+                    <span id="pickerMoodTitle" class="tape">Hi,今天过的怎么样?</span>
+                    <p id="pickerMoodDesc" class="picker-desc">点一个表情，确认你此刻的心情。</p>
+                </div>
+            </div>
+            <div class="picker-bottom">
+                <button id="nextBtn" class="icon-btn center-next" type="button" aria-label="next">→</button>
+            </div>
+        </section>
+
+        <section id="editorView" class="view editor-view">
+            <article class="paper">
+                <div class="paper-header">
+                    <div id="paperDate" class="paper-date">
+                        <div class="weekday">周六</div>
+                        <div class="solar">02.14</div>
+                        <div class="lunar">农历腊月廿七</div>
+                    </div>
+                    <div class="paper-hero">
+                        <div id="paperEmoji" class="paper-emoji">🙂</div>
+                        <div class="paper-mood-title"><span id="paperMood" class="tape">扑通～❤️</span></div>
+                    </div>
+                    <button id="weatherBtn" class="weather-trigger" type="button" aria-label="选择天气">
+                        <i id="weatherBtnIcon" class="fa-solid fa-sun"></i>
+                    </button>
+                </div>
+
+                <div class="write-block">
+                    <div class="template-fields">
+                        <div class="quick-fields">
+                            <div>
+                                <div class="field-label required">标签与状态</div>
+                                <div id="tagChips" class="tag-chips"></div>
+                            </div>
+                            <div>
+                                <div class="field-label required">精力值</div>
+                                <div class="energy-row">
+                                    <input id="energyInput" type="range" min="1" max="10" step="1" value="8">
+                                    <span id="energyValue" class="energy-value">8/10</span>
+                                </div>
+                            </div>
+                        </div>
+                        <div id="timeMark" class="time-mark">
+                            <i class="fa-regular fa-clock" aria-hidden="true"></i>
+                            <span class="time-value">[18:54]</span>
+                        </div>
+                        <div class="field-label">今日记录 (What)</div>
+                        <textarea id="entryText" class="structured-input what-input" placeholder="每行一条，例如：推进了海外节点部署方案"></textarea>
+                        <div class="field-label">思考与复盘 (Why & How)</div>
+                        <textarea id="reviewText" class="structured-input review-input" placeholder="每行一条，例如：审批进度慢导致焦虑，需要备用方案"></textarea>
+                    </div>
+                </div>
+            </article>
+
+            <div class="editor-dock">
+                <div id="plusMenu" class="plus-menu" role="menu" aria-hidden="true">
+                    <button class="plus-item" type="button" data-action="camera">
+                        <span>拍摄照片</span><i class="fa-solid fa-camera"></i>
+                    </button>
+                    <button class="plus-item" type="button" data-action="album">
+                        <span>从相册选择</span><i class="fa-regular fa-images"></i>
+                    </button>
+                    <button class="plus-item" type="button" data-action="sticker">
+                        <span>自由贴图</span><i class="fa-regular fa-face-smile"></i>
+                    </button>
+                </div>
+
+                <div id="attachmentList" class="attachment-list"></div>
+
+                <div class="editor-tools">
+                    <button id="backBtn" class="icon-btn" type="button" aria-label="back">
+                        <i class="fa-solid fa-xmark" aria-hidden="true"></i>
+                    </button>
+                    <button id="plusBtn" class="icon-btn plus-btn" type="button" aria-label="plus">
+                        <i class="fa-solid fa-circle-plus" aria-hidden="true"></i>
+                    </button>
+                    <button id="submitBtn" class="icon-btn" type="button" aria-label="submit">
+                        <i class="fa-solid fa-check" aria-hidden="true"></i>
+                    </button>
+                </div>
+            </div>
+        </section>
+    </main>
+
+    <div id="weatherModal" class="weather-modal" role="dialog" aria-modal="true" aria-labelledby="weatherTitle">
+        <div class="weather-panel">
+            <h3 id="weatherTitle" class="weather-title">晴天</h3>
+            <div id="weatherGrid" class="weather-grid"></div>
+            <div class="weather-actions">
+                <button id="weatherCancelBtn" class="weather-action" type="button" aria-label="取消">✕</button>
+                <button id="weatherConfirmBtn" class="weather-action" type="button" aria-label="确认">✓</button>
+            </div>
+        </div>
+    </div>
+
+    <div id="moodModal" class="weather-modal" role="dialog" aria-modal="true" aria-labelledby="moodTitle">
+        <div class="weather-panel mood-panel">
+            <h3 id="moodTitle" class="weather-title">选择心情</h3>
+            <div id="moodGrid" class="mood-grid"></div>
+            <div class="weather-actions">
+                <button id="moodCancelBtn" class="weather-action" type="button" aria-label="取消">✕</button>
+                <button id="moodConfirmBtn" class="weather-action" type="button" aria-label="确认">✓</button>
+            </div>
+        </div>
+    </div>
+
+    <div id="stickerModal" class="weather-modal" role="dialog" aria-modal="true" aria-labelledby="stickerTitle">
+        <div class="weather-panel mood-panel">
+            <h3 id="stickerTitle" class="weather-title">自由贴图</h3>
+            <div id="stickerGrid" class="sticker-grid"></div>
+            <div class="weather-actions">
+                <button id="stickerCancelBtn" class="weather-action" type="button" aria-label="关闭">✕</button>
+                <button id="stickerDoneBtn" class="weather-action" type="button" aria-label="完成">✓</button>
+            </div>
+        </div>
+    </div>
+
+    <input id="cameraInput" type="file" accept="image/*" capture="environment" hidden>
+    <input id="albumInput" type="file" accept="image/*" multiple hidden>
+
+    <div id="holdTip" class="hold-tip">描述</div>
+
+    <div id="submitOverlay" class="submit-overlay" aria-live="polite" aria-hidden="true">
+        <div class="submit-card">
+            <div id="submitEmoji" class="submit-emoji">📝</div>
+            <div id="submitText" class="submit-text">正在把日记写进本子里...</div>
+            <div class="submit-dots">
+                <span></span><span></span><span></span>
+            </div>
+        </div>
+    </div>
+
+    <script>
+        const GAS_WEB_APP_URL = "https://script.google.com/macros/s/AKfycbziXL0Tq1hVWXtkNQfFhlPq6HOLG-46goSYM__12qVDjHCR_LElTW5wNxisgA4smuzh/exec";
+        const REQUEST_TIMEOUT_MS = 60000;
+        const MAX_REQUEST_TIMEOUT_MS = 330000;
+        const SUCCESS_REDIRECT_DELAY_MS = 1000;
+        const MAX_SINGLE_ATTACHMENT_BYTES = 12 * 1024 * 1024;
+        const MAX_TOTAL_ATTACHMENT_BYTES = 20 * 1024 * 1024;
+        const DRAFT_KEY = "gasgx_diary_hand_draft_v1";
+        const STATE_KEY = "gasgx_diary_hand_state_v1";
+        const APP_TZ = "Asia/Shanghai";
+        const TAG_OPTIONS = ["个人", "灵感", "生活", "家庭"];
+        const DEFAULT_ENERGY = 8;
+
+        const moods = [
+            { id: "neutral", emoji: "😐", title: "平稳～🍃", desc: "今天心情平稳，节奏正常。", color: "#38d27a", angle: 144 },
+            { id: "happy", emoji: "😊", title: "扑通～❤️", desc: "开心又轻松，想记录好事。", color: "#f6acae", angle: 36 },
+            { id: "calm", emoji: "😌", title: "静静～🌿", desc: "情绪平静，适合慢慢整理想法。", color: "#c9e8a8", angle: 72 },
+            { id: "smile", emoji: "🙂", title: "不错～✨", desc: "今天整体不错，有值得感谢的瞬间。", color: "#f9d34f", angle: 108 },
+            { id: "angry", emoji: "😠", title: "有点炸～🔥", desc: "有不爽的点，先写下来再消化。", color: "#ff4b70", angle: 180 },
+            { id: "sad", emoji: "🙁", title: "有点低落～🫧", desc: "想慢慢写写今天的压力和感受。", color: "#c7a3de", angle: 216 },
+            { id: "wink", emoji: "😉", title: "调皮一下～🎈", desc: "有点小得意，今天挺有趣。", color: "#ffb35a", angle: 252 },
+            { id: "blue", emoji: "☹️", title: "闷闷的～☁️", desc: "状态偏低，可以先写三件小事。", color: "#77a7cf", angle: 288 },
+            { id: "gray", emoji: "😟", title: "担心中～🫠", desc: "有焦虑，写出来会轻一点。", color: "#7f8da4", angle: 324 },
+            { id: "tan", emoji: "😑", title: "有点累～🪫", desc: "疲惫感明显，记录后早点休息。", color: "#ba9a74", angle: 0 }
+        ];
+
+        const weatherOptions = [
+            { id: "sunny", label: "晴天", iconClass: "fa-solid fa-sun" },
+            { id: "partly_cloudy", label: "晴间多云", iconClass: "fa-solid fa-cloud-sun" },
+            { id: "cloudy", label: "多云", iconClass: "fa-solid fa-cloud" },
+            { id: "night_cloudy", label: "夜间多云", iconClass: "fa-solid fa-cloud-moon" },
+            { id: "light_rain", label: "小雨", iconClass: "fa-solid fa-cloud-rain" },
+            { id: "heavy_rain", label: "大雨", iconClass: "fa-solid fa-cloud-showers-heavy" },
+            { id: "thunder", label: "雷阵雨", iconClass: "fa-solid fa-cloud-bolt" },
+            { id: "snow", label: "下雪", iconClass: "fa-solid fa-snowflake" },
+            { id: "fog", label: "雾", iconClass: "fa-solid fa-smog" },
+            { id: "windy", label: "大风", iconClass: "fa-solid fa-wind" },
+            { id: "tornado", label: "龙卷风", iconClass: "fa-solid fa-tornado" },
+            { id: "storm", label: "风暴", iconClass: "fa-solid fa-hurricane" },
+            { id: "drizzle", label: "阵雨", iconClass: "fa-solid fa-cloud-sun-rain" },
+            { id: "showers", label: "骤雨", iconClass: "fa-solid fa-umbrella" },
+            { id: "cold", label: "寒冷", iconClass: "fa-solid fa-temperature-low" },
+            { id: "rainbow", label: "雨后", iconClass: "fa-solid fa-rainbow" }
+        ];
+        const stickerOptions = ["✨", "❤️", "🌈", "🌙", "☕", "🎵", "🫧", "🌸", "📌", "📝", "💡", "🍀", "🔥", "✅", "❗", "🎈", "📎", "⭐"];
+        const attachmentMeta = {
+            camera: { label: "拍摄照片", icon: "📷" },
+            album: { label: "相册图片", icon: "🖼️" }
+        };
+
+        const pickerView = document.getElementById("pickerView");
+        const editorView = document.getElementById("editorView");
+        const moodRing = document.getElementById("moodRing");
+        const nextBtn = document.getElementById("nextBtn");
+        const backBtn = document.getElementById("backBtn");
+        const plusBtn = document.getElementById("plusBtn");
+        const plusMenu = document.getElementById("plusMenu");
+        const submitBtn = document.getElementById("submitBtn");
+        const pickerMoodTitle = document.getElementById("pickerMoodTitle");
+        const pickerMoodDesc = document.getElementById("pickerMoodDesc");
+        const weatherBtn = document.getElementById("weatherBtn");
+        const weatherBtnIcon = document.getElementById("weatherBtnIcon");
+        const weatherModal = document.getElementById("weatherModal");
+        const weatherTitle = document.getElementById("weatherTitle");
+        const weatherGrid = document.getElementById("weatherGrid");
+        const weatherCancelBtn = document.getElementById("weatherCancelBtn");
+        const weatherConfirmBtn = document.getElementById("weatherConfirmBtn");
+        const moodModal = document.getElementById("moodModal");
+        const moodGrid = document.getElementById("moodGrid");
+        const moodCancelBtn = document.getElementById("moodCancelBtn");
+        const moodConfirmBtn = document.getElementById("moodConfirmBtn");
+        const stickerModal = document.getElementById("stickerModal");
+        const stickerGrid = document.getElementById("stickerGrid");
+        const stickerCancelBtn = document.getElementById("stickerCancelBtn");
+        const stickerDoneBtn = document.getElementById("stickerDoneBtn");
+        const cameraInput = document.getElementById("cameraInput");
+        const albumInput = document.getElementById("albumInput");
+        const paperEmoji = document.getElementById("paperEmoji");
+        const paperMood = document.getElementById("paperMood");
+        const entryText = document.getElementById("entryText");
+        const reviewText = document.getElementById("reviewText");
+        const paperDate = document.getElementById("paperDate");
+        const timeMark = document.getElementById("timeMark");
+        const attachmentList = document.getElementById("attachmentList");
+        const statusMsg = document.getElementById("statusMsg");
+        const holdTip = document.getElementById("holdTip");
+        const submitOverlay = document.getElementById("submitOverlay");
+        const submitEmoji = document.getElementById("submitEmoji");
+        const submitText = document.getElementById("submitText");
+        const tagChips = document.getElementById("tagChips");
+        const energyInput = document.getElementById("energyInput");
+        const energyValue = document.getElementById("energyValue");
+        const quickFields = document.querySelector(".quick-fields");
+
+        let selectedMoodId = moods[1].id;
+        let pendingMoodId = selectedMoodId;
+        let selectedWeatherId = "sunny";
+        let pendingWeatherId = "sunny";
+        let selectedTag = "";
+        let energyLevel = DEFAULT_ENERGY;
+        let tagSelectedForEntry = false;
+        let energySelectedForEntry = false;
+        let attachments = [];
+        let ringRotationDeg = 0;
+        let holdTimer = null;
+        let isSubmitting = false;
+        let ignoreNodeClickUntil = 0;
+        let ringSpinTimer = null;
+        let isRingSpinning = false;
+        const ringDrag = {
+            active: false,
+            pointerId: null,
+            startAngle: 0,
+            startRotation: 0,
+            moved: false,
+            lastAngle: 0,
+            lastTs: 0,
+            velocity: 0
+        };
+
+        function setStatus(text, type = "muted") {
+            if (!statusMsg) return;
+            statusMsg.textContent = text;
+            statusMsg.className = `status-msg ${type}`;
+        }
+
+        function sleep(ms) {
+            return new Promise((resolve) => setTimeout(resolve, ms));
+        }
+
+        function showSubmitOverlay(mode = "loading", text = "正在提交...") {
+            if (!submitOverlay || !submitEmoji || !submitText) return;
+            submitOverlay.classList.add("show");
+            submitOverlay.classList.remove("success", "error");
+            submitOverlay.dataset.mode = mode;
+            submitOverlay.setAttribute("aria-hidden", "false");
+            submitText.textContent = text;
+            if (mode === "success") {
+                submitOverlay.classList.add("success");
+                submitEmoji.textContent = "🎉";
+            } else if (mode === "error") {
+                submitOverlay.classList.add("error");
+                submitEmoji.textContent = "🥲";
+            } else {
+                submitEmoji.textContent = "📝";
+            }
+        }
+
+        function hideSubmitOverlay() {
+            if (!submitOverlay) return;
+            submitOverlay.classList.remove("show", "success", "error");
+            submitOverlay.dataset.mode = "";
+            submitOverlay.setAttribute("aria-hidden", "true");
+        }
+
+        function nudgeRequiredFields() {
+            if (!quickFields) return;
+            quickFields.classList.remove("missing");
+            quickFields.offsetHeight;
+            quickFields.classList.add("missing");
+            setTimeout(() => {
+                quickFields.classList.remove("missing");
+            }, 420);
+        }
+
+        function formatClock(date = new Date()) {
+            return date.toLocaleTimeString("zh-CN", {
+                timeZone: APP_TZ,
+                hour: "2-digit",
+                minute: "2-digit",
+                hour12: false
+            });
+        }
+
+        function updateClock() {
+            const valueNode = timeMark.querySelector(".time-value");
+            const value = `[${formatClock()}]`;
+            if (valueNode) {
+                valueNode.textContent = value;
+            } else {
+                timeMark.textContent = value;
+            }
+        }
+
+        function getPanelDateInfo() {
+            const weekday = paperDate.querySelector(".weekday")?.textContent?.trim() || "";
+            const solar = paperDate.querySelector(".solar")?.textContent?.trim() || "";
+            const lunar = paperDate.querySelector(".lunar")?.textContent?.trim() || "";
+            return { weekday, solar, lunar };
+        }
+
+        function getPanelTimeMark() {
+            const valueNode = timeMark.querySelector(".time-value");
+            return (valueNode ? valueNode.textContent : timeMark.textContent || "").trim();
+        }
+
+        function normalizeEnergy(value) {
+            const n = Number(value);
+            if (!Number.isFinite(n)) return DEFAULT_ENERGY;
+            return Math.max(1, Math.min(10, Math.round(n)));
+        }
+
+        function updateEnergyUI() {
+            const normalized = normalizeEnergy(energyLevel);
+            energyLevel = normalized;
+            energyInput.value = String(normalized);
+            energyValue.textContent = `${normalized}/10`;
+        }
+
+        function renderTagChips() {
+            tagChips.innerHTML = "";
+            TAG_OPTIONS.forEach((tag) => {
+                const btn = document.createElement("button");
+                btn.type = "button";
+                btn.className = "tag-chip";
+                btn.textContent = `#${tag}`;
+                btn.classList.toggle("active", selectedTag === tag);
+                btn.setAttribute("aria-label", `标签 ${tag}`);
+                btn.addEventListener("click", () => {
+                    selectedTag = (selectedTag === tag) ? "" : tag;
+                    tagSelectedForEntry = selectedTag !== "";
+                    renderTagChips();
+                    saveDraft();
+                });
+                tagChips.appendChild(btn);
+            });
+        }
+
+        function getShanghaiDateParts(date = new Date()) {
+            const formatter = new Intl.DateTimeFormat("zh-CN", {
+                timeZone: APP_TZ,
+                year: "numeric",
+                month: "2-digit",
+                day: "2-digit",
+                weekday: "short"
+            });
+            const parts = formatter.formatToParts(date);
+            const map = {};
+            parts.forEach((part) => {
+                map[part.type] = part.value;
+            });
+            return {
+                dateLabel: `${map.year}-${map.month}-${map.day}`,
+                weekday: map.weekday || ""
+            };
+        }
+
+        function splitBulletItems(text) {
+            return String(text || "")
+                .split(/\r?\n/)
+                .map((line) => line.replace(/^\s*[*-]\s*/, "").trim())
+                .filter(Boolean);
+        }
+
+        function formatPaperDate(date = new Date()) {
+            const dateParts = getShanghaiDateParts(date);
+            const [, monthPart = "01", dayPart = "01"] = dateParts.dateLabel.split("-");
+            const month = monthPart;
+            const day = dayPart;
+            const weekday = dateParts.weekday;
+
+            let lunarLabel = "农历--";
+            try {
+                const lunarRaw = new Intl.DateTimeFormat("zh-CN-u-ca-chinese", {
+                    timeZone: APP_TZ,
+                    month: "long",
+                    day: "numeric"
+                }).format(date);
+                lunarLabel = `农历${lunarRaw.replace(/\s/g, "")}`;
+            } catch (err) {
+                console.debug("Lunar date unavailable:", err);
+            }
+
+            paperDate.innerHTML = `
+                <div class="weekday">${weekday}</div>
+                <div class="solar">${month}.${day}</div>
+                <div class="lunar">${lunarLabel}</div>
+            `;
+        }
+
+        function getSelectedMood() {
+            return moods.find((item) => item.id === selectedMoodId) || moods[0];
+        }
+
+        function getSelectedWeather() {
+            return weatherOptions.find((item) => item.id === selectedWeatherId) || weatherOptions[0];
+        }
+
+        function normalizeDegrees(value) {
+            let normalized = value % 360;
+            if (normalized < 0) normalized += 360;
+            return normalized;
+        }
+
+        function shortestDelta(current, target) {
+            return ((target - current + 540) % 360) - 180;
+        }
+
+        function clearRingSpinTimer() {
+            if (ringSpinTimer) {
+                clearTimeout(ringSpinTimer);
+                ringSpinTimer = null;
+            }
+        }
+
+        function resetRingMotionStyle() {
+            moodRing.style.removeProperty("--ring-transition");
+            moodRing.style.removeProperty("--ring-ease");
+        }
+
+        function cancelRingSpin() {
+            clearRingSpinTimer();
+            isRingSpinning = false;
+            resetRingMotionStyle();
+        }
+
+        function pickRandomMoodId(excludeId = "") {
+            const pool = moods.filter((mood) => mood.id !== excludeId);
+            const source = pool.length ? pool : moods;
+            return source[Math.floor(Math.random() * source.length)].id;
+        }
+
+        function getRingPointerAngle(clientX, clientY) {
+            const rect = moodRing.getBoundingClientRect();
+            const cx = rect.left + rect.width / 2;
+            const cy = rect.top + rect.height / 2;
+            const angle = Math.atan2(clientY - cy, clientX - cx) * (180 / Math.PI) + 90;
+            return normalizeDegrees(angle);
+        }
+
+        function getMoodClosestToBottom(rotationDeg = ringRotationDeg) {
+            const normalizedRotation = normalizeDegrees(rotationDeg);
+            let bestMoodId = selectedMoodId;
+            let minDistance = Number.POSITIVE_INFINITY;
+
+            moods.forEach((mood) => {
+                const nodeAngle = normalizeDegrees(mood.angle + normalizedRotation);
+                const distanceToBottom = Math.abs(shortestDelta(nodeAngle, 180));
+                if (distanceToBottom < minDistance) {
+                    minDistance = distanceToBottom;
+                    bestMoodId = mood.id;
+                }
+            });
+
+            return bestMoodId;
+        }
+
+        function startRingDrag(event) {
+            if (event.button !== undefined && event.button !== 0) return;
+            cancelRingSpin();
+            ringDrag.active = true;
+            ringDrag.pointerId = event.pointerId;
+            ringDrag.startAngle = getRingPointerAngle(event.clientX, event.clientY);
+            ringDrag.startRotation = ringRotationDeg;
+            ringDrag.moved = false;
+            ringDrag.lastAngle = ringDrag.startAngle;
+            ringDrag.lastTs = performance.now();
+            ringDrag.velocity = 0;
+            moodRing.classList.add("dragging", "instant-rotate");
+            try {
+                moodRing.setPointerCapture(event.pointerId);
+            } catch (err) {
+                console.debug("Pointer capture unavailable:", err);
+            }
+        }
+
+        function moveRingDrag(event) {
+            if (!ringDrag.active || event.pointerId !== ringDrag.pointerId) return;
+            const now = performance.now();
+            const currentAngle = getRingPointerAngle(event.clientX, event.clientY);
+            const delta = shortestDelta(ringDrag.startAngle, currentAngle);
+            const nextRotation = ringDrag.startRotation + delta;
+            const step = shortestDelta(ringDrag.lastAngle, currentAngle);
+            const dt = Math.max(1, now - ringDrag.lastTs);
+            ringDrag.velocity = step / dt;
+            ringDrag.lastAngle = currentAngle;
+            ringDrag.lastTs = now;
+            if (Math.abs(delta) > 2) {
+                ringDrag.moved = true;
+                clearTimeout(holdTimer);
+                hideHoldTip();
+            }
+            moodRing.style.setProperty("--ring-rotation", `${nextRotation}deg`);
+            ringRotationDeg = nextRotation;
+            const previewMoodId = getMoodClosestToBottom(nextRotation);
+            moodRing.querySelectorAll(".mood-node").forEach((node) => {
+                node.classList.toggle("active", node.dataset.id === previewMoodId);
+            });
+            event.preventDefault();
+        }
+
+        function spinRingToRandomMood(velocityDegPerMs = 0) {
+            cancelRingSpin();
+            isRingSpinning = true;
+            ignoreNodeClickUntil = Date.now() + 1000;
+            const direction = velocityDegPerMs === 0
+                ? (Math.random() < 0.5 ? 1 : -1)
+                : (velocityDegPerMs > 0 ? 1 : -1);
+            const speed = Math.min(1.2, Math.abs(velocityDegPerMs));
+            const extraTurns = Math.max(1, Math.min(4, 1 + Math.round(speed * 6)));
+            const targetMoodId = pickRandomMoodId(selectedMoodId);
+            const targetMood = moods.find((item) => item.id === targetMoodId);
+            if (!targetMood) {
+                isRingSpinning = false;
+                return;
+            }
+
+            const targetRotation = normalizeDegrees(180 - targetMood.angle);
+            const currentNormalized = normalizeDegrees(ringRotationDeg);
+            const directedDelta = direction > 0
+                ? (targetRotation - currentNormalized + 360) % 360
+                : -((currentNormalized - targetRotation + 360) % 360);
+            const destination = ringRotationDeg + directedDelta + direction * extraTurns * 360;
+            const durationMs = Math.round(900 + extraTurns * 220 + speed * 320);
+
+            moodRing.classList.remove("instant-rotate");
+            moodRing.style.setProperty("--ring-transition", `${durationMs}ms`);
+            moodRing.style.setProperty("--ring-ease", "cubic-bezier(0.08, 0.8, 0.16, 1)");
+            moodRing.style.setProperty("--ring-rotation", `${destination}deg`);
+            ringRotationDeg = destination;
+
+            ringSpinTimer = setTimeout(() => {
+                selectedMoodId = targetMoodId;
+                updateMoodUI(false);
+                saveDraft();
+                isRingSpinning = false;
+                resetRingMotionStyle();
+                ringSpinTimer = null;
+            }, durationMs + 30);
+        }
+
+        function endRingDrag(event) {
+            if (!ringDrag.active || event.pointerId !== ringDrag.pointerId) return;
+            moodRing.classList.remove("dragging", "instant-rotate");
+            if (ringDrag.moved) {
+                spinRingToRandomMood(ringDrag.velocity);
+            }
+            try {
+                moodRing.releasePointerCapture(event.pointerId);
+            } catch (err) {
+                console.debug("Pointer release unavailable:", err);
+            }
+            ringDrag.active = false;
+            ringDrag.pointerId = null;
+        }
+
+        function rotateRingToMood(moodId, animate = true) {
+            const mood = moods.find((item) => item.id === moodId);
+            if (!mood) return;
+
+            const targetRotation = normalizeDegrees(180 - mood.angle);
+            const nextRotation = animate
+                ? ringRotationDeg + shortestDelta(ringRotationDeg, targetRotation)
+                : targetRotation;
+
+            if (!animate) moodRing.classList.add("instant-rotate");
+            moodRing.style.setProperty("--ring-rotation", `${nextRotation}deg`);
+            ringRotationDeg = nextRotation;
+            if (!animate) {
+                moodRing.offsetHeight;
+                moodRing.classList.remove("instant-rotate");
+            }
+        }
+
+        function getPendingWeather() {
+            return weatherOptions.find((item) => item.id === pendingWeatherId) || weatherOptions[0];
+        }
+
+        function applyWeatherToUI() {
+            const weather = getSelectedWeather();
+            weatherBtnIcon.className = weather.iconClass;
+            weatherBtn.title = `天气：${weather.label}`;
+            weatherBtn.setAttribute("aria-label", `天气：${weather.label}`);
+        }
+
+        function renderWeatherGrid() {
+            weatherGrid.innerHTML = "";
+            weatherOptions.forEach((weather) => {
+                const btn = document.createElement("button");
+                btn.type = "button";
+                btn.className = "weather-option";
+                if (weather.id === pendingWeatherId) btn.classList.add("active");
+                btn.title = weather.label;
+                btn.setAttribute("aria-label", weather.label);
+                btn.innerHTML = `<i class="${weather.iconClass}" aria-hidden="true"></i>`;
+                btn.addEventListener("click", () => {
+                    pendingWeatherId = weather.id;
+                    weatherTitle.textContent = weather.label;
+                    weatherGrid.querySelectorAll(".weather-option").forEach((node) => node.classList.remove("active"));
+                    btn.classList.add("active");
+                });
+                weatherGrid.appendChild(btn);
+            });
+        }
+
+        function renderMoodGrid() {
+            moodGrid.innerHTML = "";
+            moods.forEach((mood) => {
+                const btn = document.createElement("button");
+                btn.type = "button";
+                btn.className = "mood-option";
+                if (mood.id === pendingMoodId) btn.classList.add("active");
+                btn.style.setProperty("--mood-color", mood.color);
+                btn.title = mood.title;
+                btn.setAttribute("aria-label", mood.title);
+                btn.textContent = mood.emoji;
+                btn.addEventListener("click", () => {
+                    pendingMoodId = mood.id;
+                    moodGrid.querySelectorAll(".mood-option").forEach((node) => node.classList.remove("active"));
+                    btn.classList.add("active");
+                });
+                moodGrid.appendChild(btn);
+            });
+        }
+
+        function openWeatherModal() {
+            closePlusMenu();
+            pendingWeatherId = selectedWeatherId;
+            weatherTitle.textContent = getPendingWeather().label;
+            renderWeatherGrid();
+            weatherModal.classList.add("show");
+        }
+
+        function closeWeatherModal(applySelection = false) {
+            if (applySelection) {
+                selectedWeatherId = pendingWeatherId;
+                applyWeatherToUI();
+                saveDraft();
+            }
+            weatherModal.classList.remove("show");
+        }
+
+        function openMoodModal() {
+            closePlusMenu();
+            pendingMoodId = selectedMoodId;
+            renderMoodGrid();
+            moodModal.classList.add("show");
+        }
+
+        function closeMoodModal(applySelection = false) {
+            if (applySelection) {
+                selectedMoodId = pendingMoodId;
+                updateMoodUI();
+                saveDraft();
+            }
+            moodModal.classList.remove("show");
+        }
+
+        function updateMoodUI(animate = true) {
+            const selected = getSelectedMood();
+            pickerMoodTitle.textContent = `${selected.emoji} ${selected.title}`;
+            pickerMoodDesc.textContent = selected.desc;
+            paperEmoji.textContent = selected.emoji;
+            paperEmoji.style.setProperty("--mood-color", selected.color);
+            paperMood.textContent = selected.title;
+            rotateRingToMood(selectedMoodId, animate);
+
+            moodRing.querySelectorAll(".mood-node").forEach((node) => {
+                node.classList.toggle("active", node.dataset.id === selectedMoodId);
+            });
+        }
+
+        function showHoldTip(text) {
+            holdTip.textContent = text;
+            holdTip.classList.add("show");
+        }
+
+        function hideHoldTip() {
+            holdTip.classList.remove("show");
+        }
+
+        function openPlusMenu() {
+            plusMenu.classList.add("show");
+            plusMenu.setAttribute("aria-hidden", "false");
+        }
+
+        function closePlusMenu() {
+            plusMenu.classList.remove("show");
+            plusMenu.setAttribute("aria-hidden", "true");
+        }
+
+        function togglePlusMenu() {
+            if (plusMenu.classList.contains("show")) {
+                closePlusMenu();
+            } else {
+                openPlusMenu();
+            }
+        }
+
+        function formatFileSize(size = 0) {
+            if (size < 1024) return `${size}B`;
+            if (size < 1024 * 1024) return `${Math.round(size / 1024)}KB`;
+            return `${(size / (1024 * 1024)).toFixed(1)}MB`;
+        }
+
+        function getTotalAttachmentSize() {
+            return attachments.reduce((total, item) => total + (Number(item.size) || 0), 0);
+        }
+
+        function fileToBase64(file) {
+            return new Promise((resolve, reject) => {
+                const reader = new FileReader();
+                reader.onload = () => {
+                    const result = reader.result;
+                    if (typeof result !== "string") {
+                        reject(new Error("读取文件失败"));
+                        return;
+                    }
+                    const commaIndex = result.indexOf(",");
+                    if (commaIndex === -1) {
+                        reject(new Error("文件编码失败"));
+                        return;
+                    }
+                    resolve(result.slice(commaIndex + 1));
+                };
+                reader.onerror = () => reject(new Error("文件读取异常"));
+                reader.readAsDataURL(file);
+            });
+        }
+
+        function insertTextAtCursor(text) {
+            const targetInput = document.activeElement === reviewText ? reviewText : entryText;
+            const value = targetInput.value;
+            const start = targetInput.selectionStart ?? value.length;
+            const end = targetInput.selectionEnd ?? value.length;
+            targetInput.value = `${value.slice(0, start)}${text}${value.slice(end)}`;
+            const nextPos = start + text.length;
+            targetInput.setSelectionRange(nextPos, nextPos);
+            targetInput.focus();
+        }
+
+        function renderAttachmentList() {
+            attachmentList.innerHTML = "";
+            attachments.forEach((item, index) => {
+                const chip = document.createElement("div");
+                chip.className = "attachment-chip";
+
+                const label = attachmentMeta[item.kind]?.label || "附件";
+                const icon = attachmentMeta[item.kind]?.icon || "📎";
+                const text = document.createElement("span");
+                text.textContent = `${icon} ${label}: ${item.name} (${formatFileSize(item.size)})`;
+
+                const removeBtn = document.createElement("button");
+                removeBtn.type = "button";
+                removeBtn.className = "chip-remove";
+                removeBtn.dataset.index = String(index);
+                removeBtn.setAttribute("aria-label", `删除 ${item.name}`);
+                removeBtn.textContent = "✕";
+
+                chip.append(text, removeBtn);
+                attachmentList.appendChild(chip);
+            });
+        }
+
+        async function addAttachment(kind, file) {
+            if (!file) return;
+            const fileSize = Number(file.size) || 0;
+            if (fileSize > MAX_SINGLE_ATTACHMENT_BYTES) {
+                setStatus(`单个文件不能超过 ${formatFileSize(MAX_SINGLE_ATTACHMENT_BYTES)}`, "error");
+                return;
+            }
+            if (getTotalAttachmentSize() + fileSize > MAX_TOTAL_ATTACHMENT_BYTES) {
+                setStatus(`附件总大小不能超过 ${formatFileSize(MAX_TOTAL_ATTACHMENT_BYTES)}`, "error");
+                return;
+            }
+
+            const safeName = file.name || "未命名文件";
+            const mimeType = file.type || "application/octet-stream";
+            let base64 = "";
+            try {
+                base64 = await fileToBase64(file);
+            } catch (err) {
+                setStatus("文件读取失败，请重试", "error");
+                return;
+            }
+
+            attachments.push({
+                id: `${Date.now()}_${Math.random().toString(36).slice(2, 8)}`,
+                kind,
+                name: safeName,
+                size: fileSize,
+                mimeType,
+                base64
+            });
+
+            const label = attachmentMeta[kind]?.label || "附件";
+            insertTextAtCursor(`\n[${label}] ${safeName}\n`);
+            renderAttachmentList();
+            saveDraft();
+            setStatus(`${label}已添加`, "muted");
+        }
+
+        async function handlePickedFiles(fileList, kind) {
+            const files = Array.from(fileList || []);
+            for (const file of files) {
+                await addAttachment(kind, file);
+            }
+        }
+
+        function renderStickerGrid() {
+            stickerGrid.innerHTML = "";
+            stickerOptions.forEach((sticker) => {
+                const btn = document.createElement("button");
+                btn.type = "button";
+                btn.className = "sticker-option";
+                btn.textContent = sticker;
+                btn.setAttribute("aria-label", `贴图 ${sticker}`);
+                btn.addEventListener("click", () => {
+                    insertTextAtCursor(sticker);
+                    closeStickerModal();
+                    saveDraft();
+                    setStatus("贴图已插入", "muted");
+                });
+                stickerGrid.appendChild(btn);
+            });
+        }
+
+        function openStickerModal() {
+            renderStickerGrid();
+            stickerModal.classList.add("show");
+        }
+
+        function closeStickerModal() {
+            stickerModal.classList.remove("show");
+        }
+
+        function handlePlusAction(action) {
+            switch (action) {
+                case "camera":
+                    cameraInput.value = "";
+                    cameraInput.click();
+                    break;
+                case "album":
+                    albumInput.value = "";
+                    albumInput.click();
+                    break;
+                case "sticker":
+                    openStickerModal();
+                    break;
+                default:
+                    break;
+            }
+        }
+
+        function saveDraft() {
+            const payload = {
+                moodId: selectedMoodId,
+                weatherId: selectedWeatherId,
+                text: entryText.value,
+                reviewText: reviewText.value,
+                tag: selectedTag,
+                energy: energyLevel,
+                tagSelectedForEntry,
+                energySelectedForEntry
+            };
+            localStorage.setItem(DRAFT_KEY, JSON.stringify(payload));
+        }
+
+        function restoreDraft() {
+            const raw = localStorage.getItem(DRAFT_KEY);
+            if (!raw) return;
+            try {
+                const data = JSON.parse(raw);
+                if (data && typeof data === "object") {
+                    if (typeof data.moodId === "string") selectedMoodId = data.moodId;
+                    if (typeof data.weatherId === "string") selectedWeatherId = data.weatherId;
+                    if (typeof data.text === "string") entryText.value = data.text;
+                    if (typeof data.reviewText === "string") reviewText.value = data.reviewText;
+                    if (typeof data.tag === "string" && TAG_OPTIONS.includes(data.tag)) selectedTag = data.tag;
+                    if (Array.isArray(data.tags) && !selectedTag) {
+                        const oldTag = data.tags.map((item) => String(item || "").trim()).find((item) => TAG_OPTIONS.includes(item));
+                        if (oldTag) selectedTag = oldTag;
+                    }
+                    if (data.energy !== undefined) energyLevel = normalizeEnergy(data.energy);
+                    if (typeof data.tagSelectedForEntry === "boolean") {
+                        tagSelectedForEntry = data.tagSelectedForEntry;
+                    } else {
+                        tagSelectedForEntry = selectedTag !== "";
+                    }
+                    if (typeof data.energySelectedForEntry === "boolean") {
+                        energySelectedForEntry = data.energySelectedForEntry;
+                    } else {
+                        energySelectedForEntry = false;
+                    }
+                }
+            } catch (err) {
+                console.warn("Draft parse failed:", err);
+            }
+        }
+
+        function saveViewState(viewName) {
+            localStorage.setItem(STATE_KEY, viewName);
+        }
+
+        function restoreViewState() {
+            return localStorage.getItem(STATE_KEY) || "picker";
+        }
+
+        function renderMoodRing() {
+            moodRing.innerHTML = "";
+            moods.forEach((mood) => {
+                const button = document.createElement("button");
+                button.type = "button";
+                button.className = "mood-node";
+                button.dataset.id = mood.id;
+                button.dataset.desc = mood.desc;
+                button.style.setProperty("--mood-color", mood.color);
+                button.style.setProperty("--angle", `${mood.angle}deg`);
+                button.textContent = mood.emoji;
+
+                button.addEventListener("click", () => {
+                    if (isRingSpinning) return;
+                    if (Date.now() < ignoreNodeClickUntil) return;
+                    selectedMoodId = mood.id;
+                    updateMoodUI();
+                    saveDraft();
+                });
+
+                const startHold = () => {
+                    clearTimeout(holdTimer);
+                    holdTimer = setTimeout(() => showHoldTip(mood.desc), 420);
+                };
+
+                const endHold = () => {
+                    clearTimeout(holdTimer);
+                    hideHoldTip();
+                };
+
+                button.addEventListener("mousedown", startHold);
+                button.addEventListener("touchstart", startHold, { passive: true });
+                button.addEventListener("mouseup", endHold);
+                button.addEventListener("mouseleave", endHold);
+                button.addEventListener("touchend", endHold);
+                button.addEventListener("touchcancel", endHold);
+
+                moodRing.appendChild(button);
+            });
+        }
+
+        function showPicker() {
+            closePlusMenu();
+            closeStickerModal();
+            pickerView.classList.add("active");
+            editorView.classList.remove("active");
+            saveViewState("picker");
+        }
+
+        function showEditor() {
+            closePlusMenu();
+            pickerView.classList.remove("active");
+            editorView.classList.add("active");
+            saveViewState("editor");
+            updateClock();
+            entryText.focus();
+        }
+
+        function composeStandardTemplate() {
+            const dateParts = getShanghaiDateParts();
+            const tagsLine = selectedTag ? `#${selectedTag}` : "（未选择）";
+            const energy = normalizeEnergy(energyLevel);
+            const panelTime = getPanelTimeMark();
+            const whatItems = splitBulletItems(entryText.value);
+            const reviewItems = splitBulletItems(reviewText.value);
+            const lines = [];
+            lines.push("---");
+            lines.push(`## ${dateParts.dateLabel} (${dateParts.weekday})`);
+            lines.push("");
+            lines.push(`**🕒 记录时分**：${panelTime || "--:--"}`);
+            lines.push("");
+            lines.push(`**🏷️ 标签与状态**：${tagsLine}| 精力值：${energy}/10`);
+            lines.push("");
+            lines.push("**📝 今日记录 (What)**");
+            (whatItems.length ? whatItems : ["（待补充）"]).forEach((item) => {
+                lines.push(`* ${item}`);
+            });
+            lines.push("");
+            lines.push("**🧠 思考与复盘 (Why & How)**");
+            (reviewItems.length ? reviewItems : ["（待补充）"]).forEach((item) => {
+                lines.push(`* ${item}`);
+            });
+            return lines.join("\n");
+        }
+
+        function setSubmitting(flag) {
+            isSubmitting = flag;
+            submitBtn.disabled = flag;
+            submitBtn.style.opacity = flag ? "0.5" : "1";
+        }
+
+        async function warmConnection() {
+            try {
+                await fetch(GAS_WEB_APP_URL, { method: "GET", mode: "no-cors", cache: "no-store" });
+            } catch (err) {
+                console.debug("Warmup skipped:", err);
+            }
+        }
+
+        async function submitDiary() {
+            if (isSubmitting) return;
+            const missingTag = !selectedTag || !tagSelectedForEntry;
+            const missingEnergy = !energySelectedForEntry;
+            if (missingTag || missingEnergy) {
+                nudgeRequiredFields();
+                let hint = "先把必选项选一下呀～";
+                if (missingTag && missingEnergy) hint = "先选标签并拖一下精力值吧～ ✨";
+                else if (missingTag) hint = "先点一个标签再继续呀～ 🏷️";
+                else if (missingEnergy) hint = "拖一下精力值滑杆再提交呀～ ⚡";
+                setStatus(hint, "error");
+                showSubmitOverlay("error", hint);
+                await sleep(1200);
+                hideSubmitOverlay();
+                return;
+            }
+            const whatText = entryText.value.trim();
+            const review = reviewText.value.trim();
+            if (!whatText && !review && attachments.length === 0) {
+                setStatus("请至少填写“今日记录”或“思考与复盘”", "error");
+                return;
+            }
+
+            setSubmitting(true);
+            setStatus("提交中...", "muted");
+            showSubmitOverlay("loading", "正在把今天写进日记本...");
+            saveDraft();
+
+            const selectedMood = getSelectedMood();
+            const selectedWeather = getSelectedWeather();
+            const panelDate = getPanelDateInfo();
+            const panelTime = getPanelTimeMark();
+            const templateText = composeStandardTemplate();
+            const requestBody = JSON.stringify({
+                content: templateText,
+                formattedEntry: templateText,
+                rawText: [whatText, review].filter(Boolean).join("\n"),
+                whatText,
+                reviewText: review,
+                tags: selectedTag ? [selectedTag] : [],
+                energy: normalizeEnergy(energyLevel),
+                mood: {
+                    id: selectedMood.id,
+                    emoji: selectedMood.emoji,
+                    title: selectedMood.title
+                },
+                weather: {
+                    id: selectedWeather.id,
+                    label: selectedWeather.label
+                },
+                panelDate,
+                panelTime,
+                attachments: attachments.map((item) => ({
+                    id: item.id,
+                    kind: item.kind,
+                    name: item.name,
+                    size: item.size,
+                    mimeType: item.mimeType || "application/octet-stream",
+                    base64: item.base64 || ""
+                }))
+            });
+            const requestBytes = new TextEncoder().encode(requestBody).length;
+            if (requestBytes > 24 * 1024 * 1024) {
+                setStatus("上传内容过大，请减少附件后重试", "error");
+                showSubmitOverlay("error", "内容太大啦，精简一点再试");
+                await sleep(1100);
+                hideSubmitOverlay();
+                setSubmitting(false);
+                return;
+            }
+            const payloadMb = requestBytes / (1024 * 1024);
+            const estimatedTimeoutMs = Math.min(
+                MAX_REQUEST_TIMEOUT_MS,
+                Math.max(
+                    REQUEST_TIMEOUT_MS,
+                    Math.ceil(payloadMb * 22000) + 40000
+                )
+            );
+            const controller = new AbortController();
+            const timer = setTimeout(() => controller.abort(), estimatedTimeoutMs);
+            const start = performance.now();
+
+            try {
+                const response = await fetch(GAS_WEB_APP_URL, {
+                    method: "POST",
+                    headers: { "Content-Type": "text/plain;charset=utf-8" },
+                    body: requestBody,
+                    cache: "no-store",
+                    signal: controller.signal
+                });
+
+                const rawText = await response.text();
+                let result = null;
+                try {
+                    result = rawText ? JSON.parse(rawText) : null;
+                } catch (err) {
+                    console.warn("Non-JSON response:", rawText);
+                }
+
+                if (!response.ok) {
+                    if (response.status === 401) {
+                        setStatus("401 未授权，请检查 Apps Script 访问权限", "error");
+                        showSubmitOverlay("error", "未授权，请检查脚本权限");
+                    } else {
+                        setStatus(`请求失败：HTTP ${response.status}`, "error");
+                        showSubmitOverlay("error", `请求失败：HTTP ${response.status}`);
+                    }
+                    await sleep(1200);
+                    hideSubmitOverlay();
+                    return;
+                }
+
+                if (result && result.status === "success") {
+                    const elapsed = Math.round(performance.now() - start);
+                    setStatus(`提交成功 ${elapsed}ms，正在返回首页...`, "ok");
+                    showSubmitOverlay("success", `提交成功 ${elapsed}ms`);
+                    await new Promise((resolve) => setTimeout(resolve, SUCCESS_REDIRECT_DELAY_MS));
+                    entryText.value = "";
+                    reviewText.value = "";
+                    selectedTag = "";
+                    energyLevel = DEFAULT_ENERGY;
+                    tagSelectedForEntry = false;
+                    energySelectedForEntry = false;
+                    attachments = [];
+                    renderTagChips();
+                    updateEnergyUI();
+                    renderAttachmentList();
+                    localStorage.removeItem(DRAFT_KEY);
+                    showPicker();
+                    setStatus("准备记录", "muted");
+                    hideSubmitOverlay();
+                } else {
+                    setStatus("提交失败，服务端返回异常", "error");
+                    showSubmitOverlay("error", "服务端返回异常，请重试");
+                    await sleep(1200);
+                    hideSubmitOverlay();
+                }
+            } catch (err) {
+                if (err && err.name === "AbortError") {
+                    setStatus("请求超时，请重试", "error");
+                    showSubmitOverlay("error", "请求超时，请重试");
+                } else {
+                    const msg = (err && err.message) ? `网络错误：${String(err.message).slice(0, 60)}` : "网络错误，请检查连接";
+                    setStatus(msg, "error");
+                    console.error("Submit failed:", err);
+                    showSubmitOverlay("error", "网络有点慢，稍后再试");
+                }
+                await sleep(1200);
+                hideSubmitOverlay();
+            } finally {
+                clearTimeout(timer);
+                if (submitOverlay?.dataset?.mode === "loading") hideSubmitOverlay();
+                setSubmitting(false);
+            }
+        }
+
+        function handleQuickSubmit(event) {
+            const isQuickSubmit = (event.ctrlKey || event.metaKey) && event.key === "Enter";
+            if (!isQuickSubmit) return;
+            event.preventDefault();
+            submitDiary();
+        }
+
+        renderMoodRing();
+        restoreDraft();
+        updateMoodUI(false);
+        applyWeatherToUI();
+        renderTagChips();
+        updateEnergyUI();
+        renderAttachmentList();
+        formatPaperDate();
+        updateClock();
+        warmConnection();
+
+        setInterval(updateClock, 15000);
+
+        nextBtn.addEventListener("click", showEditor);
+        backBtn.addEventListener("click", showPicker);
+        plusBtn.addEventListener("click", togglePlusMenu);
+        submitBtn.addEventListener("click", submitDiary);
+        moodRing.addEventListener("pointerdown", startRingDrag);
+        window.addEventListener("pointermove", moveRingDrag, { passive: false });
+        window.addEventListener("pointerup", endRingDrag);
+        window.addEventListener("pointercancel", endRingDrag);
+        plusMenu.addEventListener("click", (event) => {
+            const item = event.target.closest(".plus-item");
+            if (!item) return;
+            const action = item.dataset.action;
+            closePlusMenu();
+            handlePlusAction(action);
+        });
+        cameraInput.addEventListener("change", () => handlePickedFiles(cameraInput.files, "camera"));
+        albumInput.addEventListener("change", () => handlePickedFiles(albumInput.files, "album"));
+        attachmentList.addEventListener("click", (event) => {
+            const removeBtn = event.target.closest(".chip-remove");
+            if (!removeBtn) return;
+            const index = Number(removeBtn.dataset.index);
+            if (Number.isNaN(index) || index < 0 || index >= attachments.length) return;
+            attachments.splice(index, 1);
+            renderAttachmentList();
+            saveDraft();
+            setStatus("已删除附件", "muted");
+        });
+        weatherBtn.addEventListener("click", openWeatherModal);
+        weatherCancelBtn.addEventListener("click", () => closeWeatherModal(false));
+        weatherConfirmBtn.addEventListener("click", () => closeWeatherModal(true));
+        weatherModal.addEventListener("click", (event) => {
+            if (event.target === weatherModal) closeWeatherModal(false);
+        });
+        paperEmoji.addEventListener("click", openMoodModal);
+        paperMood.addEventListener("click", openMoodModal);
+        moodCancelBtn.addEventListener("click", () => closeMoodModal(false));
+        moodConfirmBtn.addEventListener("click", () => closeMoodModal(true));
+        moodModal.addEventListener("click", (event) => {
+            if (event.target === moodModal) closeMoodModal(false);
+        });
+        stickerCancelBtn.addEventListener("click", closeStickerModal);
+        stickerDoneBtn.addEventListener("click", closeStickerModal);
+        stickerModal.addEventListener("click", (event) => {
+            if (event.target === stickerModal) closeStickerModal();
+        });
+        energyInput.addEventListener("input", () => {
+            energyLevel = normalizeEnergy(energyInput.value);
+            energySelectedForEntry = true;
+            updateEnergyUI();
+            saveDraft();
+        });
+        entryText.addEventListener("input", saveDraft);
+        reviewText.addEventListener("input", saveDraft);
+        entryText.addEventListener("focus", closePlusMenu);
+        reviewText.addEventListener("focus", closePlusMenu);
+        entryText.addEventListener("keydown", handleQuickSubmit);
+        reviewText.addEventListener("keydown", handleQuickSubmit);
+
+        document.addEventListener("click", (event) => {
+            if (!plusMenu.classList.contains("show")) return;
+            const target = event.target;
+            if (plusMenu.contains(target) || plusBtn.contains(target)) return;
+            closePlusMenu();
+        });
+
+        document.addEventListener("keydown", (event) => {
+            if (event.key === "Escape" && plusMenu.classList.contains("show")) {
+                closePlusMenu();
+            }
+            if (event.key === "Escape" && weatherModal.classList.contains("show")) {
+                closeWeatherModal(false);
+            }
+            if (event.key === "Escape" && moodModal.classList.contains("show")) {
+                closeMoodModal(false);
+            }
+            if (event.key === "Escape" && stickerModal.classList.contains("show")) {
+                closeStickerModal();
+            }
+        });
+
+        if (restoreViewState() === "editor") {
+            showEditor();
+        }
+    </script>
+</body>
+</html>
diff --git "a/private-use/feeder - \345\211\257\346\234\254.html" "b/private-use/feeder - \345\211\257\346\234\254.html"
deleted file mode 100644
index 750fae7..0000000
--- "a/private-use/feeder - \345\211\257\346\234\254.html"	
+++ /dev/null
@@ -1,578 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-    <title>GasGx 移动采集台 v23</title>
-    <script src="https://cdn.tailwindcss.com"></script>
-    <script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
-    
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: {
-                        gas: { bg: '#050505', card: '#161616', green: '#5DD62C', border: '#333', text: '#ddd' }
-                    },
-                    boxShadow: {
-                        'glow': '0 0 10px rgba(93, 214, 44, 0.3)'
-                    }
-                }
-            }
-        }
-    </script>
-    <style>
-        body { background-color: #050505; color: #eee; -webkit-tap-highlight-color: transparent; padding-bottom: 80px; }
-        
-        .input-gas { background: #111; border: 1px solid #333; color: white; padding: 14px; width: 100%; border-radius: 12px; outline: none; transition: all 0.2s; font-size: 15px; }
-        .input-gas:focus { border-color: #5DD62C; background: #0a0a0a; }
-
-        .app-header { transition: transform 0.25s ease, opacity 0.25s ease; }
-        .header-hidden { transform: translateY(-110%); opacity: 0; }
-
-        :root { --header-offset: 72px; }
-        .sticky-url {
-            position: sticky; top: var(--header-offset); z-index: 9;
-            background: rgba(5, 5, 5, 0.88);
-            border: 1px solid #1e1e1e; border-radius: 16px;
-            padding: 12px; backdrop-filter: blur(10px);
-            box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
-        }
-        .url-shell {
-            background: #0f0f0f; border: 1px solid #2a2a2a;
-            border-radius: 14px; display: flex; align-items: center;
-            overflow: hidden;
-        }
-        .url-input {
-            background: transparent; border: 0; color: #f1f1f1;
-            padding: 14px 14px; flex: 1; font-size: 15px;
-        }
-        .url-input:focus { outline: none; }
-        .url-paste-btn {
-            width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;
-            background: #151515; border-left: 1px solid #2a2a2a; color: #9aa0a6;
-            transition: all 0.2s; cursor: pointer;
-        }
-        .url-paste-btn:hover { color: #5DD62C; background: #121a0f; }
-        .url-paste-btn:active { transform: scale(0.92); }
-        
-        .btn-gas { background: #5DD62C; color: black; font-weight: 800; padding: 16px; border-radius: 12px; width: 100%; text-transform: uppercase; letter-spacing: 1px; font-size: 16px; box-shadow: 0 4px 15px rgba(93, 214, 44, 0.2); transition: all 0.2s; }
-        .btn-gas:active { transform: scale(0.96); opacity: 0.9; }
-
-        .grid-select { display: grid; gap: 8px; }
-        .grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
-        .grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
-        
-        /* 选项卡片 */
-        .option-card {
-            background: #161616; border: 1px solid #333; border-radius: 8px;
-            padding: 10px 4px; text-align: center; font-size: 12px; font-weight: 600; color: #888;
-            cursor: pointer; transition: all 0.2s; display: flex; align-items: center; justify-content: center;
-            min-height: 44px; word-break: break-word; line-height: 1.2;
-            position: relative;
-        }
-        .option-card.custom-item { padding-right: 18px; }
-        .option-card.active {
-            background: rgba(93, 214, 44, 0.15); border-color: #5DD62C; color: #5DD62C;
-            box-shadow: 0 0 8px rgba(93, 214, 44, 0.1);
-        }
-        .option-card .delete-x {
-            position: absolute; top: 4px; right: 4px;
-            width: 16px; height: 16px; border-radius: 50%;
-            border: 1px solid #2e2e2e; background: #101010; color: #9aa0a6;
-            display: flex; align-items: center; justify-content: center;
-            font-size: 11px; line-height: 1; cursor: pointer;
-        }
-        .option-card .delete-x:hover { color: #ff6b6b; border-color: #3a2a2a; }
-        
-        /* DIY 输入框动画 */
-        .custom-input-wrapper { display: none; margin-top: 8px; animation: slideDown 0.2s ease-out; }
-        .custom-input-wrapper.show { display: block; }
-        
-        @keyframes slideDown {
-            from { opacity: 0; transform: translateY(-5px); }
-            to { opacity: 1; transform: translateY(0); }
-        }
-    </style>
-</head>
-<body class="max-w-md mx-auto relative">
-
-    <div id="appHeader" class="app-header sticky top-0 z-10 bg-gas-bg/95 backdrop-blur-md border-b border-gas-border px-4 py-4 flex items-center justify-between">
-        <div class="flex items-center gap-3">
-            <div class="w-9 h-9 bg-gas-card rounded-full flex items-center justify-center border border-gas-border shadow-glow">
-                <i class="fa-solid fa-gas-pump text-gas-green text-sm"></i>
-            </div>
-            <div>
-                <h1 class="text-lg font-bold font-mono text-white tracking-tight">GasGx Feeder</h1>
-                <p class="text-[10px] text-gray-500 uppercase tracking-widest">Mobile Link Control</p>
-            </div>
-        </div>
-        <div class="text-xs text-gas-green font-mono bg-gas-green/10 px-2 py-1 rounded">v23.0</div>
-    </div>
-
-    <form id="taskForm" class="px-4 py-6 space-y-6">
-        
-        <div class="sticky-url">
-            <label class="flex justify-between text-xs text-gray-500 mb-2 font-bold uppercase tracking-wider">
-                <span>Target URL</span>
-                <span class="text-gas-green text-[10px]"><i class="fa-solid fa-bolt"></i> Ready</span>
-            </label>
-            <div class="url-shell">
-                <input type="url" id="link" class="url-input" placeholder="https://..." required>
-                <button type="button" onclick="triggerPaste()" class="url-paste-btn" aria-label="Paste link">
-                    <i class="fa-solid fa-link text-lg"></i>
-                </button>
-            </div>
-        </div>
-
-        <div>
-            <label class="block text-xs text-gray-500 mb-2 font-bold uppercase tracking-wider">Category</label>
-            <div class="grid-select grid-cols-3" id="category-container"></div>
-            <div id="category-custom-wrapper" class="custom-input-wrapper">
-                <input type="text" id="category-custom-input" class="input-gas border-gas-green" placeholder="输入自定义 Category..." oninput="syncCustomValue('category', this.value)" onblur="persistCustomValue('category', this.value)">
-            </div>
-            <input type="hidden" id="category" value="gas-energy">
-        </div>
-
-        <div>
-            <label class="block text-xs text-gray-500 mb-2 font-bold uppercase tracking-wider">Publisher</label>
-            <div class="grid-select grid-cols-3" id="publisher-container"></div>
-            <div id="publisher-custom-wrapper" class="custom-input-wrapper">
-                <input type="text" id="publisher-custom-input" class="input-gas border-gas-green" placeholder="输入自定义 Publisher..." oninput="syncCustomValue('publisher', this.value)" onblur="persistCustomValue('publisher', this.value)">
-            </div>
-            <input type="hidden" id="publisher" value="GasGx-Researcher">
-        </div>
-
-        <div>
-            <label class="block text-xs text-gray-500 mb-2 font-bold uppercase tracking-wider">Main Tag</label>
-            <div class="grid-select grid-cols-3" id="tag-container"></div>
-            <div id="tag-custom-wrapper" class="custom-input-wrapper">
-                <input type="text" id="tag-custom-input" class="input-gas border-gas-green" placeholder="输入自定义 Tag..." oninput="syncCustomValue('tag', this.value)" onblur="persistCustomValue('tag', this.value)">
-            </div>
-            <input type="hidden" id="tag" value="Hardware">
-        </div>
-
-        <div>
-            <label class="block text-xs text-gray-500 mb-2 font-bold uppercase tracking-wider">Secondary Tag</label>
-            <div class="grid-select grid-cols-3" id="secondary_tag-container"></div>
-            <div id="secondary_tag-custom-wrapper" class="custom-input-wrapper">
-                <input type="text" id="secondary_tag-custom-input" class="input-gas border-gas-green" placeholder="输入自定义 Sec Tag..." oninput="syncCustomValue('secondary_tag', this.value)" onblur="persistCustomValue('secondary_tag', this.value)">
-            </div>
-            <input type="hidden" id="secondary_tag" value=""> 
-        </div>
-
-        <button type="submit" id="submitBtn" class="btn-gas mt-6 flex items-center justify-center gap-3">
-            <span>SEND TO CLOUD</span>
-            <i class="fa-solid fa-paper-plane"></i>
-        </button>
-
-    </form>
-
-    <div class="px-4 mt-2 mb-8">
-        <h3 class="text-xs text-gray-500 font-bold uppercase tracking-wider mb-3 border-b border-gray-800 pb-2">Recent Generated Links</h3>
-        <div id="history-list" class="space-y-3"></div>
-        <button onclick="clearHistory()" class="text-[10px] text-gray-600 mt-4 w-full text-center py-2 hover:text-red-500 transition-colors">Clear History</button>
-    </div>
-
-    <div id="toast" class="fixed top-20 left-1/2 -translate-x-1/2 bg-[#111] border border-gas-green text-white px-6 py-3 rounded-full text-sm font-bold shadow-2xl opacity-0 transition-all pointer-events-none flex items-center gap-3 z-50 transform scale-90">
-        <i class="fa-solid fa-circle-check text-gas-green text-lg"></i>
-        <span id="toast-msg">Task Added!</span>
-    </div>
-
-    <script>
-        // Supabase Init
-        const SUPABASE_URL = "https://mkpcliytqudclkwtewru.supabase.co";
-        const SUPABASE_KEY = "sb_publishable_S2uWAddQEXhWJgGeIF_ZbQ_H_thz2hw"; 
-        const client = supabase.createClient(SUPABASE_URL, SUPABASE_KEY);
-
-        // Data Config
-        const categories = [
-            { id: 'gas-energy', label: 'Gas Energy' },
-            { id: 'generators', label: 'Generators' },
-            { id: 'bitcoin-mining', label: 'BTC Mining' },
-            { id: 'flash', label: 'Flash' },
-            { id: 'insights', label: 'Insights' },
-            { id: 'data', label: 'Data' },
-            { id: 'events', label: 'Events' },
-            { id: 'custom', label: '+ DIY' } 
-        ];
-
-        const publishers = [
-            { id: 'GasGx-Researcher', label: 'GasGx' },
-            { id: 'WuShuoBlock', label: 'WuShuo' },
-            { id: 'Blockbeats', label: 'Blockbeats' },
-            { id: 'Chaincatcher', label: 'ChainC.' },
-            { id: 'Panewslab', label: 'Panews' },
-            { id: 'Odaily', label: 'Odaily' },
-            { id: 'Techflow', label: 'Techflow' },
-            { id: 'Linkein', label: 'LinkedIn' },
-            { id: 'custom', label: '+ DIY' }
-        ];
-
-        const mainTags = [
-            { id: 'Hardware', label: 'Hardware' },
-            { id: 'Policy', label: 'Policy' },
-            { id: 'Finance', label: 'Finance' },
-            { id: 'Tech', label: 'Tech' },
-            { id: 'Market', label: 'Market' },
-            { id: 'custom', label: '+ DIY' }
-        ];
-
-        const secTags = [
-            { id: 'Policy', label: 'Policy' },
-            { id: 'Newly released', label: 'New Release' },
-            { id: 'Guidance', label: 'Guidance' },
-            { id: 'Report', label: 'Report' },
-            { id: 'Hardware', label: 'Hardware' },
-            { id: 'Bitcoin', label: 'Bitcoin' },
-            { id: 'Mining', label: 'Mining' },
-            { id: 'Analysis', label: 'Analysis' },
-            { id: 'custom', label: '+ DIY' }
-        ];
-
-        // --- DIY Cache (LocalStorage) ---
-        const CUSTOM_STORE_PREFIX = 'gasgx_feeder_custom_';
-        const CUSTOM_MAX = 12;
-        const baseOptions = {
-            category: categories,
-            publisher: publishers,
-            tag: mainTags,
-            secondary_tag: secTags
-        };
-        const gridConfigMap = {
-            category: { containerId: 'category-container', items: categories, defaultVal: 'gas-energy' },
-            publisher: { containerId: 'publisher-container', items: publishers, defaultVal: 'GasGx-Researcher' },
-            tag: { containerId: 'tag-container', items: mainTags, defaultVal: 'Hardware' },
-            secondary_tag: { containerId: 'secondary_tag-container', items: secTags, defaultVal: '' }
-        };
-
-        function normalizeValue(value) {
-            return (value || '').toString().trim();
-        }
-
-        function getStoreKey(inputId) {
-            return `${CUSTOM_STORE_PREFIX}${inputId}`;
-        }
-
-        function loadCustomOptions(inputId) {
-            try {
-                const raw = localStorage.getItem(getStoreKey(inputId));
-                if (!raw) return [];
-                const list = JSON.parse(raw);
-                if (!Array.isArray(list)) return [];
-                return list.map(normalizeValue).filter(Boolean);
-            } catch (e) {
-                console.warn('Load custom options failed:', e);
-                return [];
-            }
-        }
-
-        function saveCustomOptions(inputId, list) {
-            try {
-                localStorage.setItem(getStoreKey(inputId), JSON.stringify(list));
-            } catch (e) {
-                console.warn('Save custom options failed:', e);
-            }
-        }
-
-        function persistCustomValue(inputId, value) {
-            const val = normalizeValue(value);
-            if (!val) return;
-            const baseList = (baseOptions[inputId] || []).map(item => (item.id || '').toString().toLowerCase());
-            if (baseList.includes(val.toLowerCase())) return;
-            let list = loadCustomOptions(inputId);
-            list.unshift(val);
-            list = list.filter((v, idx, arr) => arr.findIndex(x => x.toLowerCase() === v.toLowerCase()) === idx);
-            if (list.length > CUSTOM_MAX) list = list.slice(0, CUSTOM_MAX);
-            saveCustomOptions(inputId, list);
-        }
-
-        function mergeOptions(inputId, items) {
-            const customValues = loadCustomOptions(inputId);
-            if (!customValues.length) return items;
-            const customItems = customValues.map(val => ({ id: val, label: val, _isCustom: true }));
-            const seen = new Set();
-            const merged = [];
-            for (const item of items) {
-                if (item.id === 'custom') {
-                    for (const c of customItems) {
-                        const key = (c.id || '').toString().toLowerCase();
-                        if (!key || seen.has(key)) continue;
-                        seen.add(key);
-                        merged.push(c);
-                    }
-                    merged.push(item);
-                    continue;
-                }
-                const key = (item.id || '').toString().toLowerCase();
-                if (key && !seen.has(key)) {
-                    seen.add(key);
-                    merged.push(item);
-                }
-            }
-            return merged;
-        }
-
-        // --- 1. Paste Logic (点击图标触发) ---
-        async function triggerPaste() {
-            try {
-                const text = await navigator.clipboard.readText();
-                if (text) {
-                    const input = document.getElementById('link');
-                    input.value = text;
-                    // Visual Feedback
-                    input.classList.add('border-gas-green');
-                    setTimeout(() => input.classList.remove('border-gas-green'), 500);
-                    showToast("已粘贴内容");
-                } else {
-                    showToast("剪贴板为空");
-                }
-            } catch (err) {
-                console.error(err);
-                // Fallback prompt for security restrictions
-                showToast("请长按输入框手动粘贴");
-            }
-        }
-
-        // --- 2. Grid & DIY Logic ---
-        function renderGrid(containerId, inputId, items, defaultVal) {
-            const container = document.getElementById(containerId);
-            const hiddenInput = document.getElementById(inputId);
-            const mergedItems = mergeOptions(inputId, items);
-            
-            // Set default logic
-            if(!hiddenInput.value && defaultVal) hiddenInput.value = defaultVal;
-
-            container.innerHTML = mergedItems.map(item => {
-                const encodedId = encodeURIComponent(item.id);
-                const customClass = item._isCustom ? 'custom-item' : '';
-                const deleteBtn = item._isCustom
-                    ? `<button type="button" class="delete-x" onclick="removeCustomOption(event, '${inputId}', '${encodedId}')" aria-label="Delete cached option">x</button>`
-                    : '';
-                return `
-                    <div class="option-card ${customClass} ${item.id === hiddenInput.value ? 'active' : ''} ${item.id === 'custom' ? 'border-dashed border-gray-600 text-gray-500' : ''}"
-                         onclick="handleSelection('${inputId}', '${encodedId}', this)">
-                        ${item.label}
-                        ${deleteBtn}
-                    </div>
-                `;
-            }).join('');
-            
-            // Init check: if default was custom, show input
-            if(hiddenInput.value === 'custom') {
-               const wrap = document.getElementById(`${inputId}-custom-wrapper`);
-               if(wrap) wrap.classList.add('show');
-            }
-        }
-
-        function handleSelection(inputId, value, element) {
-            const decodedValue = decodeURIComponent(value);
-            const hiddenInput = document.getElementById(inputId);
-            const customWrapper = document.getElementById(`${inputId}-custom-wrapper`);
-            const customInput = document.getElementById(`${inputId}-custom-input`);
-
-            // 1. UI Style Update
-            const siblings = element.parentElement.children;
-            for(let el of siblings) el.classList.remove('active');
-            element.classList.add('active');
-
-            // 2. Data Logic
-            if(decodedValue === 'custom') {
-                // Show Input
-                if(customWrapper) customWrapper.classList.add('show');
-                if(customInput) {
-                    customInput.focus();
-                    // If user already typed something, use that. If empty, it's empty string.
-                    hiddenInput.value = customInput.value; 
-                }
-            } else {
-                // Hide Input & Set Value
-                if(customWrapper) customWrapper.classList.remove('show');
-                hiddenInput.value = decodedValue;
-            }
-
-            // Haptic
-            if(window.navigator && window.navigator.vibrate) window.navigator.vibrate(5);
-        }
-
-        // Called when user types in DIY box: Syncs to the hidden input which Supabase uses
-        function syncCustomValue(inputId, val) {
-            document.getElementById(inputId).value = val;
-        }
-
-        function removeCustomOption(event, inputId, encodedValue) {
-            if (event) event.stopPropagation();
-            const val = decodeURIComponent(encodedValue || '');
-            if (!val) return;
-            let list = loadCustomOptions(inputId);
-            list = list.filter(v => v.toLowerCase() !== val.toLowerCase());
-            saveCustomOptions(inputId, list);
-            const hiddenInput = document.getElementById(inputId);
-            if (hiddenInput && hiddenInput.value && hiddenInput.value.toLowerCase() === val.toLowerCase()) {
-                hiddenInput.value = '';
-            }
-            const cfg = gridConfigMap[inputId];
-            if (cfg) renderGrid(cfg.containerId, inputId, cfg.items, cfg.defaultVal);
-        }
-
-        // --- 3. History Logic (双链接) ---
-        function saveToHistory(newUrl, originalUrl) {
-            let currentHistory = getCookie("gas_url_list_v2");
-            let list = currentHistory ? JSON.parse(currentHistory) : [];
-            
-            list.unshift({ 
-                newUrl: newUrl, 
-                originalUrl: originalUrl,
-                time: new Date().toLocaleTimeString('en-US', {hour: '2-digit', minute:'2-digit'}) 
-            });
-            
-            if(list.length > 10) list.pop();
-            setCookie("gas_url_list_v2", JSON.stringify(list), 30);
-            renderHistory();
-        }
-
-        function renderHistory() {
-            const listEl = document.getElementById('history-list');
-            const currentHistory = getCookie("gas_url_list_v2");
-            
-            if (!currentHistory) {
-                listEl.innerHTML = '<div class="p-4 text-center text-xs text-gray-600 italic bg-gas-card rounded-lg border border-gas-border">No recent history</div>';
-                return;
-            }
-
-            try {
-                const list = JSON.parse(currentHistory);
-                listEl.innerHTML = list.map(item => `
-                    <div class="bg-gas-card border border-gas-border rounded-lg p-3 flex flex-col gap-2">
-                        <div class="flex justify-between items-center border-b border-gray-800 pb-2">
-                            <div class="flex items-center gap-2 overflow-hidden w-full">
-                                <span class="bg-gas-green text-black text-[9px] font-bold px-1 rounded flex-shrink-0">GAS</span>
-                                <a href="${item.newUrl}" target="_blank" class="text-sm font-bold text-white truncate flex-1 hover:text-gas-green">${item.newUrl}</a>
-                            </div>
-                        </div>
-                        
-                        <div class="flex justify-between items-center pt-1">
-                             <div class="flex items-center gap-2 overflow-hidden w-full">
-                                <span class="bg-gray-700 text-gray-300 text-[9px] font-bold px-1 rounded flex-shrink-0">SRC</span>
-                                <a href="${item.originalUrl}" target="_blank" class="text-xs text-gray-500 truncate flex-1 hover:text-gray-300">${item.originalUrl}</a>
-                            </div>
-                        </div>
-                    </div>
-                `).join('');
-            } catch (e) {
-                console.error(e);
-            }
-        }
-
-        function clearHistory() { setCookie("gas_url_list_v2", "", -1); renderHistory(); }
-        function setCookie(n, v, d) { let e=""; if(d){const dt=new Date();dt.setTime(dt.getTime()+(d*24*60*60*1000));e="; expires="+dt.toUTCString();} document.cookie=n+"="+(v||"")+e+"; path=/"; }
-        function getCookie(n) { const ne=n+"="; const ca=document.cookie.split(';'); for(let i=0;i<ca.length;i++){let c=ca[i];while(c.charAt(0)==' ')c=c.substring(1);if(c.indexOf(ne)==0)return c.substring(ne.length,c.length);}return null; }
-        
-        function showToast(msg) {
-            const toast = document.getElementById('toast');
-            document.getElementById('toast-msg').innerText = msg;
-            toast.classList.remove('opacity-0', 'scale-90', 'pointer-events-none');
-            setTimeout(() => toast.classList.add('opacity-0', 'scale-90', 'pointer-events-none'), 3000);
-        }
-
-        // --- Submit ---
-        const form = document.getElementById('taskForm');
-        const btn = document.getElementById('submitBtn');
-
-        form.addEventListener('submit', async (e) => {
-            e.preventDefault();
-            const originalText = btn.innerHTML;
-            btn.innerHTML = '<i class="fa-solid fa-circle-notch fa-spin"></i> Sending...';
-            btn.disabled = true;
-            btn.style.opacity = '0.7';
-
-            // Data Gathering
-            const link = document.getElementById('link').value;
-            const category = document.getElementById('category').value;
-            const publisher = document.getElementById('publisher').value;
-            const tag_choice = document.getElementById('tag').value;
-            const secondary_tag = document.getElementById('secondary_tag').value;
-
-            // Persist DIY values for reuse
-            persistCustomValue('category', category);
-            persistCustomValue('publisher', publisher);
-            persistCustomValue('tag', tag_choice);
-            persistCustomValue('secondary_tag', secondary_tag);
-
-            try {
-                const { data, error } = await client
-                    .from('scrape_queue')
-                    .insert([{ 
-                        link, category, publisher, tag_choice, secondary_tag, 
-                        status: 'pending' 
-                    }])
-                    .select();
-
-                if (error) throw error;
-
-                if (data && data.length > 0) {
-                    const newId = data[0].id;
-                    const newUrl = `https://www.gasgx.com/news/article/${newId}`;
-                    saveToHistory(newUrl, link);
-                    
-                    showToast("✅ 发布成功!");
-                    
-                    // Reset
-                    document.getElementById('link').value = '';
-                    document.querySelectorAll('.custom-input-wrapper').forEach(el => el.classList.remove('show'));
-                    document.querySelectorAll('.custom-input-wrapper input').forEach(el => el.value = '');
-                    
-                    // Re-render Defaults
-                    Object.entries(gridConfigMap).forEach(([inputId, cfg]) => {
-                        renderGrid(cfg.containerId, inputId, cfg.items, cfg.defaultVal);
-                    });
-                } else {
-                    showToast("⚠️ 已提交，但未返回ID");
-                }
-            } catch (err) {
-                console.error(err);
-                showToast("❌ Error: " + err.message);
-            } finally {
-                btn.innerHTML = originalText;
-                btn.disabled = false;
-                btn.style.opacity = '1';
-            }
-        });
-
-        // Init
-        document.addEventListener('DOMContentLoaded', () => {
-            Object.entries(gridConfigMap).forEach(([inputId, cfg]) => {
-                renderGrid(cfg.containerId, inputId, cfg.items, cfg.defaultVal);
-            });
-            renderHistory();
-        });
-
-        // Header auto-hide on scroll down, show on scroll up
-        let lastScrollY = 0;
-        const headerEl = document.getElementById('appHeader');
-
-        function updateHeaderOffset() {
-            if (!headerEl) return;
-            const headerH = headerEl.offsetHeight || 0;
-            const offset = headerEl.classList.contains('header-hidden') ? 0 : headerH;
-            document.documentElement.style.setProperty('--header-offset', `${offset}px`);
-        }
-
-        updateHeaderOffset();
-        window.addEventListener('resize', updateHeaderOffset);
-
-        window.addEventListener('scroll', () => {
-            if (!headerEl) return;
-            const currentY = window.scrollY || 0;
-            if (currentY > lastScrollY && currentY > 60) {
-                headerEl.classList.add('header-hidden');
-            } else {
-                headerEl.classList.remove('header-hidden');
-            }
-            updateHeaderOffset();
-            lastScrollY = currentY;
-        }, { passive: true });
-    </script>
-</body>
-</html>
diff --git a/scripts/generate_sitemap.py b/scripts/generate_sitemap.py
new file mode 100644
index 0000000..02b4ffc
--- /dev/null
+++ b/scripts/generate_sitemap.py
@@ -0,0 +1,149 @@
+#!/usr/bin/env python3
+"""Generate sitemap XML from public index.html pages."""
+
+from __future__ import annotations
+
+import argparse
+import subprocess
+from datetime import datetime, timezone
+from pathlib import Path
+from typing import Iterable
+from xml.etree.ElementTree import Element, SubElement, tostring
+from xml.dom import minidom
+
+
+EXCLUDE_DIR_PREFIXES = {
+    ".git",
+    ".github",
+    ".vscode",
+    "node_modules",
+    "news/test",
+    "private-use",
+}
+
+
+def parse_args() -> argparse.Namespace:
+    parser = argparse.ArgumentParser(description="Generate sitemap.xml from index.html files")
+    parser.add_argument("--root", default=".", help="Project root directory")
+    parser.add_argument("--base-url", default="https://www.gasgx.com", help="Site base URL")
+    parser.add_argument("--output", default="sitemap.html", help="Output sitemap file path")
+    return parser.parse_args()
+
+
+def should_exclude(relative_path: str) -> bool:
+    normalized = relative_path.replace("\\", "/")
+    return any(
+        normalized == prefix or normalized.startswith(f"{prefix}/")
+        for prefix in EXCLUDE_DIR_PREFIXES
+    )
+
+
+def route_from_index(index_file: Path, root: Path) -> str:
+    rel = index_file.relative_to(root).as_posix()
+    if rel == "index.html":
+        return "/"
+    route = "/" + rel.removesuffix("/index.html")
+    return route.rstrip("/") or "/"
+
+
+def infer_changefreq_priority(route: str) -> tuple[str, str]:
+    if route == "/":
+        return "daily", "1.0"
+    if route.startswith("/news"):
+        if route == "/news":
+            return "daily", "0.9"
+        return "daily", "0.8"
+
+    depth = route.count("/")
+    if depth <= 1:
+        return "weekly", "0.8"
+    return "weekly", "0.7"
+
+
+def iter_index_files(root: Path) -> Iterable[Path]:
+    for index_file in sorted(root.rglob("index.html")):
+        rel_parent = index_file.parent.relative_to(root).as_posix()
+        if rel_parent == ".":
+            rel_parent = ""
+        if should_exclude(rel_parent):
+            continue
+        yield index_file
+
+
+def resolve_lastmod(index_file: Path, root: Path) -> str:
+    rel = index_file.relative_to(root).as_posix()
+    git_date = ""
+
+    try:
+        result = subprocess.run(
+            ["git", "-C", str(root), "log", "-1", "--format=%cs", "--", rel],
+            check=False,
+            capture_output=True,
+            text=True,
+        )
+        if result.returncode == 0:
+            git_date = result.stdout.strip()
+    except OSError:
+        git_date = ""
+
+    if git_date:
+        return git_date
+
+    mtime = datetime.fromtimestamp(index_file.stat().st_mtime, tz=timezone.utc)
+    return mtime.strftime("%Y-%m-%d")
+
+
+def build_sitemap(root: Path, base_url: str) -> Element:
+    base = base_url.rstrip("/")
+    urlset = Element("urlset", xmlns="http://www.sitemaps.org/schemas/sitemap/0.9")
+
+    route_to_file: dict[str, Path] = {}
+    for index_file in iter_index_files(root):
+        route = route_from_index(index_file, root)
+        route_to_file.setdefault(route, index_file)
+
+    ordered_routes = sorted(route_to_file.keys(), key=lambda item: (item != "/", item))
+    for route in ordered_routes:
+        index_file = route_to_file[route]
+
+        url = SubElement(urlset, "url")
+        loc = SubElement(url, "loc")
+        loc.text = f"{base}{route}" if route != "/" else f"{base}/"
+
+        lastmod = SubElement(url, "lastmod")
+        lastmod.text = resolve_lastmod(index_file, root)
+
+        changefreq, priority = infer_changefreq_priority(route)
+        SubElement(url, "changefreq").text = changefreq
+        SubElement(url, "priority").text = priority
+
+    return urlset
+
+
+def write_xml(urlset: Element, output_path: Path) -> None:
+    raw = tostring(urlset, encoding="utf-8")
+    pretty = minidom.parseString(raw).toprettyxml(indent="  ", encoding="UTF-8")
+
+    lines = pretty.decode("utf-8").splitlines()
+    cleaned = [line for line in lines if line.strip()]
+
+    generated_at = datetime.now(timezone.utc).strftime("%Y-%m-%dT%H:%M:%SZ")
+    if cleaned and cleaned[0].startswith("<?xml"):
+        cleaned.insert(1, f"<!-- Auto-generated by scripts/generate_sitemap.py at {generated_at} -->")
+
+    output_path.write_text("\n".join(cleaned) + "\n", encoding="utf-8")
+
+
+def main() -> None:
+    args = parse_args()
+    root = Path(args.root).resolve()
+    output_path = Path(args.output)
+    if not output_path.is_absolute():
+        output_path = root / output_path
+
+    urlset = build_sitemap(root, args.base_url)
+    write_xml(urlset, output_path)
+
+
+if __name__ == "__main__":
+    main()
diff --git a/scripts/install_sitemap_hook.sh b/scripts/install_sitemap_hook.sh
new file mode 100755
index 0000000..29791b4
--- /dev/null
+++ b/scripts/install_sitemap_hook.sh
@@ -0,0 +1,17 @@
+#!/usr/bin/env sh
+set -eu
+
+ROOT_DIR="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$ROOT_DIR"
+
+if [ ! -f ".githooks/pre-commit" ]; then
+  echo "Missing .githooks/pre-commit"
+  exit 1
+fi
+
+chmod +x .githooks/pre-commit
+git config core.hooksPath .githooks
+
+echo "Installed Git hooks path: .githooks"
+echo "Sitemap pre-commit hook is active."
+
diff --git a/shared/ui/site-shell.config.js b/shared/ui/site-shell.config.js
index 2ed1183..bd82f6f 100644
--- a/shared/ui/site-shell.config.js
+++ b/shared/ui/site-shell.config.js
@@ -16,39 +16,150 @@
                 },
                 {
                         "title": {
-                                "zh": "解决方案",
-                                "en": "Solutions"
+                                "zh": "新闻资讯",
+                                "en": "News"
                         },
-                        "path": "/solutions",
+                        "path": "/news",
                         "type": "menu",
                         "children": [
                                 {
                                         "title": {
-                                                "zh": "油气井/伴生气发电",
-                                                "en": "Oil/Gas Field Power"
+                                                "zh": "新闻首页",
+                                                "en": "News Home"
+                                        },
+                                        "path": "/news"
+                                },
+                                {
+                                        "title": {
+                                                "zh": "快讯",
+                                                "en": "Flash"
+                                        },
+                                        "path": "/news/flash"
+                                },
+                                {
+                                        "title": {
+                                                "zh": "天然气能源",
+                                                "en": "Gas Energy"
+                                        },
+                                        "path": "/news/gas-energy"
+                                },
+                                {
+                                        "title": {
+                                                "zh": "发电机",
+                                                "en": "Generators"
+                                        },
+                                        "path": "/news/generators"
+                                },
+                                {
+                                        "title": {
+                                                "zh": "挖矿",
+                                                "en": "Mining"
                                         },
-                                        "path": "/solutions/oilfield"
+                                        "path": "/news/mining"
                                 },
                                 {
                                         "title": {
-                                                "zh": "工业园区与分布式能源",
-                                                "en": "Industrial Power"
+                                                "zh": "洞察",
+                                                "en": "Insights"
                                         },
-                                        "path": "/solutions/industrial"
+                                        "path": "/news/insights"
                                 },
                                 {
                                         "title": {
-                                                "zh": "数据中心 / 挖矿电力",
-                                                "en": "Data Center / Mining"
+                                                "zh": "数据",
+                                                "en": "Data"
                                         },
-                                        "path": "/solutions/mining"
+                                        "path": "/news/data"
                                 },
                                 {
                                         "title": {
-                                                "zh": "热电联供 CHP",
-                                                "en": "CHP Cogeneration"
+                                                "zh": "活动",
+                                                "en": "Events"
+                                        },
+                                        "path": "/news/events"
+                                }
+                        ]
+                },
+                {
+                        "title": {
+                                "zh": "解决方案",
+                                "en": "Solutions"
+                        },
+                        "path": "/solutions",
+                        "type": "mega",
+                        "gridCols": "grid-cols-2",
+                        "sections": [
+                                {
+                                        "header": {
+                                                "zh": "Applications",
+                                                "en": "Applications"
+                                        },
+                                        "items": [
+                                                {
+                                                        "title": {
+                                                                "zh": "油气井/伴生气发电",
+                                                                "en": "Oil/Gas Field Power"
+                                                        },
+                                                        "path": "/solutions/oilfield"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "工业园区与分布式能源",
+                                                                "en": "Industrial Power"
+                                                        },
+                                                        "path": "/solutions/industrial"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "数据中心 / 挖矿电力",
+                                                                "en": "Data Center / Mining"
+                                                        },
+                                                        "path": "/solutions/mining"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "热电联供 CHP",
+                                                                "en": "CHP Cogeneration"
+                                                        },
+                                                        "path": "/solutions/chp"
+                                                }
+                                        ]
+                                },
+                                {
+                                        "header": {
+                                                "zh": "Success Stories",
+                                                "en": "Success Stories"
                                         },
-                                        "path": "/solutions/chp"
+                                        "items": [
+                                                {
+                                                        "title": {
+                                                                "zh": "油气井 / 伴生气",
+                                                                "en": "Oilfield / Associated Gas"
+                                                        },
+                                                        "path": "/use-cases/oilfield"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "工业与园区能源",
+                                                                "en": "Industrial & Park"
+                                                        },
+                                                        "path": "/use-cases/industrial"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "挖矿 / 数据中心",
+                                                                "en": "Mining / Data Center"
+                                                        },
+                                                        "path": "/use-cases/mining"
+                                                },
+                                                {
+                                                        "title": {
+                                                                "zh": "CHP 热电联供",
+                                                                "en": "CHP"
+                                                        },
+                                                        "path": "/use-cases/chp"
+                                                }
+                                        ]
                                 }
                         ]
                 },
@@ -406,44 +517,6 @@
                                 }
                         ]
                 },
-                {
-                        "title": {
-                                "zh": "应用场景",
-                                "en": "Use Cases"
-                        },
-                        "path": "/use-cases",
-                        "type": "menu",
-                        "children": [
-                                {
-                                        "title": {
-                                                "zh": "油气井 / 伴生气",
-                                                "en": "Oilfield / Associated Gas"
-                                        },
-                                        "path": "/use-cases/oilfield"
-                                },
-                                {
-                                        "title": {
-                                                "zh": "工业与园区能源",
-                                                "en": "Industrial & Park"
-                                        },
-                                        "path": "/use-cases/industrial"
-                                },
-                                {
-                                        "title": {
-                                                "zh": "挖矿 / 数据中心",
-                                                "en": "Mining / Data Center"
-                                        },
-                                        "path": "/use-cases/mining"
-                                },
-                                {
-                                        "title": {
-                                                "zh": "CHP 热电联供",
-                                                "en": "CHP"
-                                        },
-                                        "path": "/use-cases/chp"
-                                }
-                        ]
-                },
                 {
                         "title": {
                                 "zh": "工具箱",
diff --git a/sitemap.html b/sitemap.html
index 1c9da97..466af99 100644
--- a/sitemap.html
+++ b/sitemap.html
@@ -1,168 +1,682 @@
 <?xml version="1.0" encoding="UTF-8"?>
+<!-- Auto-generated by scripts/generate_sitemap.py at 2026-02-19T04:28:43Z -->
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-  <!-- 首页2 High Priority -->
   <url>
     <loc>https://www.gasgx.com/</loc>
-    <lastmod>2026-01-16</lastmod>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>daily</changefreq>
-    <priority>2.0</priority>
+    <priority>1.0</priority>
   </url>
-
-  <!-- Solutions (解决方案1) -->
   <url>
-    <loc>https://www.gasgx.com/solutions/oil-gas-power</loc>
+    <loc>https://www.gasgx.com/about</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.8</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/solutions/industrial-power</loc>
+    <loc>https://www.gasgx.com/about/company</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
-    <priority>0.8</priority>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/solutions/data-center-mining</loc>
+    <loc>https://www.gasgx.com/about/contact</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.9</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/data</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/events</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/flash</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/gas-energy</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/generators</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/insights</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/mining</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/news/topic</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>daily</changefreq>
     <priority>0.8</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/solutions/chp-cogeneration</loc>
+    <loc>https://www.gasgx.com/openclaw</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.8</priority>
   </url>
-
-  <!-- Products (产品) - 推测路径 -->
   <url>
     <loc>https://www.gasgx.com/products</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.8</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/power/under-500kw</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/brands</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/power/500-1000kw</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/brands/china</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/power/1mw-plus</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/brands/overseas</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/cooling/air-cooled</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/cooling/air</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/cooling/liquid-cooled</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/cooling/liquid</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/type/natural-gas</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/deployment/ais</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/products/type/associated-gas</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/deployment/container</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
-
-  <!-- Rankings (排行榜) -->
   <url>
-    <loc>https://www.gasgx.com/rankings/performance</loc>
+    <loc>https://www.gasgx.com/products/deployment/skid</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/rankings/economics</loc>
+    <loc>https://www.gasgx.com/products/gas</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/rankings/quality-eco</loc>
+    <loc>https://www.gasgx.com/products/gas/associated</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
-
-  <!-- Tools (工具) -->
   <url>
-    <loc>https://www.gasgx.com/tools/lcoe-calculator</loc>
-    <changefreq>monthly</changefreq>
+    <loc>https://www.gasgx.com/products/gas/brands</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/tools/roi-estimator</loc>
-    <changefreq>monthly</changefreq>
+    <loc>https://www.gasgx.com/products/gas/brands/china</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/tools/gas-mining-revenue</loc>
-    <changefreq>daily</changefreq>
+    <loc>https://www.gasgx.com/products/gas/brands/overseas</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/cooling/air</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/tools/monte-carlo-sim</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/gas/cooling/liquid</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/tools/gas-fit-tool</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/gas/deployment/ais</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/tools/site-fit-wizard</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.6</priority>
+    <loc>https://www.gasgx.com/products/gas/deployment/container</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/miners-zone/revenue-calculator</loc>
-    <changefreq>daily</changefreq>
+    <loc>https://www.gasgx.com/products/gas/deployment/skid</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
     <priority>0.7</priority>
   </url>
-
-  <!-- Resources (资源) -->
   <url>
-    <loc>https://www.gasgx.com/resources/whitepapers</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.5</priority>
+    <loc>https://www.gasgx.com/products/gas/gas/associated</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/gas/low-methane</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/gas/natural</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/low-methane</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/natural</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/power-range/0-500kw</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/power-range/1mw-plus</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/gas/power-range/500-1000kw</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/power-range/0-500kw</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/power-range/1mw-plus</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/products/power-range/500-1000kw</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/canada</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/control-system</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/depreciation</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/efficiency</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/emissions</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/engine-efficiency</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/engine-roi</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/gas-consumption</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/generator</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/lcoe</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/maintenance-interval</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/middle-east</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/mtbf</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/noise</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/performance</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/reliability</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/roi</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/russia</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/resources/industry-reports</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.5</priority>
+    <loc>https://www.gasgx.com/rankings/spare-parts</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/thermal-efficiency</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/rankings/usa</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
   </url>
   <url>
     <loc>https://www.gasgx.com/resources/case-studies</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/case-studies/regions</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/case-studies/scenarios</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/certifications</loc>
+    <lastmod>2026-02-18</lastmod>
     <changefreq>weekly</changefreq>
-    <priority>0.6</priority>
+    <priority>0.7</priority>
   </url>
   <url>
     <loc>https://www.gasgx.com/resources/datasheets</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.5</priority>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/faq</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/reports</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/resources/videos</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
-
-  <!-- About Us (关于我们) -->
   <url>
-    <loc>https://www.gasgx.com/about/company-profile</loc>
-    <changefreq>yearly</changefreq>
-    <priority>0.4</priority>
+    <loc>https://www.gasgx.com/resources/whitepapers</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/about/contact-us</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.5</priority>
+    <loc>https://www.gasgx.com/solutions</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
   </url>
   <url>
-    <loc>https://www.gasgx.com/about/global-logistics</loc>
-    <changefreq>monthly</changefreq>
-    <priority>0.4</priority>
+    <loc>https://www.gasgx.com/solutions/chp</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/solutions/industrial</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/solutions/mining</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/solutions/oilfield</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/support</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/support/network</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/support/service</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/support/tech</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/3y-compare</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/aeco-price-forecast</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/emission</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/energy-conversion</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/engine-selection</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/gas-analyzer</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/gas-composition-heat</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/gas-cost-analysis</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/gas-fit</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/gas-location-analysis</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/global-compliance</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/global-logistics</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/lcoe-calculator</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/miner-buying-guide</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/miner-profitability</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/mining-income-calculator</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/mining-power-calc</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/monte-carlo-profit</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/oil-consumption</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/roi</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/site-fit</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/tools/vehicle-vs-industrial-10mw</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/use-cases</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.8</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/use-cases/chp</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/use-cases/industrial</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/use-cases/mining</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
+  <url>
+    <loc>https://www.gasgx.com/use-cases/oilfield</loc>
+    <lastmod>2026-02-18</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
   </url>
-
-</urlset>
\ No newline at end of file
+</urlset>
