refactor: restructure project as a monorepo and implement backend API

.editorconfig

@@ -0,0 +1,15 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[*.json]
+indent_size = 2

.env.example

@@ -0,0 +1,6 @@
+# Database
+DB_USER=ecoguide
+DB_PASSWORD=ecoguide_secret
+DB_NAME=ecoguide_db
+DB_HOST=localhost
+DB_PORT=5432

.gitignore

@@ -1,50 +1,50 @@
-# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
-
-# dependencies
-node_modules/
-
-# Expo
-.expo/
-dist/
-web-build/
-expo-env.d.ts
-
-# Native
-.kotlin/
-*.orig.*
-*.jks
-*.p8
-*.p12
-*.key
-*.mobileprovision
-
-# Metro
-.metro-health-check*
-
-# debug
-npm-debug.*
-yarn-debug.*
-yarn-error.*
-
-# macOS
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
 .DS_Store
-*.pem
-
-# local env files
-.env*.local
-
-# typescript
-*.tsbuildinfo
-
-# generated native folders
-/ios
-/android
-
-# backend specific ignores
-backend/node_modules/
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Env files
+.env
+.env.local
+.env.development
+.env.development.local
+.env.test
+.env.test.local
+.env.production
+.env.production.local
+
+# Frontend specific
+/frontend/dist
+
+# Backend specific
+/backend/prisma/data.db
+/backend/prisma/data.db-journal
+
+# build and coverage
+coverage
+build
+
+# Firebase keys
+firebase-key.json
 backend/firebase-key.json
-backend/database.json
-*adminsdk*.json
-*.json.key
-*.key.json
 

.prettierrc.json

@@ -0,0 +1,7 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "es5",
+  "printWidth": 100
+}

App.js

@@ -1,142 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { StyleSheet, View, SafeAreaView, Platform } from 'react-native';
-import { StatusBar } from 'expo-status-bar';
-import { COLORS } from './src/theme/theme';
-import { useResponsive } from './src/hooks/useResponsive';
-import { TopNavBar } from './src/components/TopNavBar';
-import { BottomTabBar } from './src/components/BottomTabBar';
-import { getUserId, API_BASE, getHeaders } from './src/config';
-
-// Import Screens
-import { AuthScreen } from './src/screens/AuthScreen';
-import { LandingPageScreen } from './src/screens/LandingPageScreen';
-import { CarbonCalculatorScreen } from './src/screens/CarbonCalculatorScreen';
-import { InsightsScreen } from './src/screens/InsightsScreen';
-import { GamificationScreen } from './src/screens/GamificationScreen';
-import { ProjectsScreen } from './src/screens/ProjectsScreen';
-import { MarketplaceScreen } from './src/screens/MarketplaceScreen';
-
-export default function App() {
-  const { isDesktop } = useResponsive();
-  const [activeTab, setActiveTab] = useState('home'); // home, calculate, analytics, projects, marketplace, impact
-
-  const currentUserId = getUserId();
-
-  const [cachedProfile, setCachedProfile] = useState(null);
-  const [cachedConfig, setCachedConfig] = useState(null);
-  const [cachedLeaderboard, setCachedLeaderboard] = useState(null);
-
-  // Preload and cache profile, config, and leaderboard on startup / user changes
-  useEffect(() => {
-    if (currentUserId) {
-      fetch(`${API_BASE}/config`, { headers: getHeaders() })
-        .then((res) => res.json())
-        .then((data) => {
-          if (data && !data.error) setCachedConfig(data);
-        })
-        .catch((err) => console.log('Error caching config:', err));
-
-      fetch(`${API_BASE}/profile`, { headers: getHeaders() })
-        .then((res) => res.json())
-        .then((data) => {
-          if (data && !data.error) setCachedProfile(data);
-        })
-        .catch((err) => console.log('Error caching profile:', err));
-
-      fetch(`${API_BASE}/leaderboard`, { headers: getHeaders() })
-        .then((res) => res.json())
-        .then((data) => {
-          if (data && !data.error) setCachedLeaderboard(data);
-        })
-        .catch((err) => console.log('Error caching leaderboard:', err));
-    }
-  }, [currentUserId]);
-
-  if (!currentUserId) {
-    return (
-      <SafeAreaView style={styles.appContainer}>
-        <StatusBar style="light" backgroundColor={COLORS.background} />
-        <AuthScreen onLoginSuccess={() => {
-          if (typeof window !== 'undefined') {
-            window.location.reload();
-          }
-        }} />
-      </SafeAreaView>
-    );
-  }
-
-  const renderActiveScreen = () => {
-    switch (activeTab) {
-      case 'home':
-        return <LandingPageScreen onStartCalculator={() => setActiveTab('calculate')} setActiveTab={setActiveTab} />;
-      case 'calculate':
-        return (
-          <CarbonCalculatorScreen
-            onBackHome={() => setActiveTab('home')}
-            setCachedProfile={setCachedProfile}
-            setCachedLeaderboard={setCachedLeaderboard}
-          />
-        );
-      case 'analytics':
-        return <InsightsScreen setActiveTab={setActiveTab} />;
-      case 'projects':
-        return <ProjectsScreen setActiveTab={setActiveTab} />;
-      case 'marketplace':
-        return (
-          <MarketplaceScreen
-            setActiveTab={setActiveTab}
-            cachedProfile={cachedProfile}
-            setCachedProfile={setCachedProfile}
-            setCachedLeaderboard={setCachedLeaderboard}
-          />
-        );
-      case 'impact':
-        return (
-          <GamificationScreen
-            setActiveTab={setActiveTab}
-            cachedProfile={cachedProfile}
-            setCachedProfile={setCachedProfile}
-            cachedLeaderboard={cachedLeaderboard}
-            setCachedLeaderboard={setCachedLeaderboard}
-          />
-        );
-      default:
-        return <LandingPageScreen onStartCalculator={() => setActiveTab('calculate')} setActiveTab={setActiveTab} />;
-    }
-  };
-
-  return (
-    <SafeAreaView style={styles.appContainer}>
-      <StatusBar style="light" backgroundColor={COLORS.background} />
-      
-      {/* Show top header navbar on desktop screens only */}
-      {isDesktop && (
-        <TopNavBar activeTab={activeTab} setActiveTab={setActiveTab} />
-      )}
-
-      {/* Screen Content Wrapper */}
-      <View style={[styles.contentContainer, isDesktop && styles.desktopPaddingTop]}>
-        {renderActiveScreen()}
-      </View>
-
-      {/* Show bottom tabbar navigation on mobile screens only */}
-      {!isDesktop && (
-        <BottomTabBar activeTab={activeTab} setActiveTab={setActiveTab} />
-      )}
-    </SafeAreaView>
-  );
-}
-
-const styles = StyleSheet.create({
-  appContainer: {
-    flex: 1,
-    backgroundColor: COLORS.background,
-  },
-  contentContainer: {
-    flex: 1,
-    backgroundColor: COLORS.background,
-  },
-  desktopPaddingTop: {
-    paddingTop: 64, // accounts for the fixed TopNavBar height
-  },
-});

CONTRIBUTING.md

@@ -0,0 +1,77 @@
+# Contributing to EcoGuide AI
+
+Thank you for your interest in contributing! This document explains how to get started.
+
+## Getting Started
+
+1. **Fork** the repository and clone your fork
+2. **Install** dependencies: `npm install` in both `backend/` and `frontend/`
+3. **Copy** `.env.example` to `.env` in both directories and fill in values
+4. **Run** migrations: `cd backend && npx prisma migrate deploy`
+5. **Start** dev servers: `npm run dev` in each directory
+
+## Development Workflow
+
+- Branch from `main` with a descriptive name: `feat/my-feature` or `fix/my-bug`
+- Keep commits focused and use conventional commit messages:
+  - `feat:` new feature
+  - `fix:` bug fix
+  - `security:` security improvement
+  - `perf:` performance improvement
+  - `test:` test addition or update
+  - `docs:` documentation update
+  - `chore:` tooling/config change
+
+## Code Standards
+
+- **No `var`** — use `const` / `let`
+- **Strict equality** — use `===` everywhere
+- **No console in production** — use `src/utils/logger.js` in frontend
+- **Sanitize all inputs** — use `src/utils/sanitize.js` for numeric/text fields
+- **JSDoc** — add JSDoc to all exported functions in `services/` and `utils/`
+- Run `npm run lint` before opening a PR — zero warnings expected
+
+## Testing
+
+All new features must include tests:
+
+```bash
+cd backend && npm test
+cd frontend && npm test
+```
+
+- **Backend**: add tests in `backend/src/tests/unit/`
+- **Frontend utilities**: add tests in `frontend/src/tests/`
+- Aim for >90% coverage on utility functions
+
+## Pull Request Checklist
+
+- [ ] Tests pass locally (`npm test` in both directories)
+- [ ] No ESLint warnings (`npm run lint`)
+- [ ] No hardcoded secrets or API keys
+- [ ] JSDoc added to new functions
+- [ ] README updated if adding new env vars or features
+
+## Reporting Issues
+
+Please open a GitHub Issue with:
+
+- Steps to reproduce
+- Expected vs. actual behaviour
+- Browser/Node.js version
+
+## Assumptions & Anonymous Sessions
+
+EcoGuide AI operates without user accounts. This means:
+
+- **Session identity** is an anonymous UUID generated on first visit and stored in `localStorage`. Clearing browser storage is equivalent to "logging out".
+- **Cross-device**: There is no sync across devices. Each browser gets its own independent session UUID and history.
+- **No authentication**: The backend accepts any UUID as a userId. The `POST /api/assessments` endpoint auto-creates a placeholder user record if the UUID is unknown (e.g. after a DB wipe or first use), so data is never silently lost.
+- **Synthetic emails**: When the backend creates a placeholder user it generates `${uuid}@ecoguide.ai` as a unique DB key. This is never used for email communication — it exists only to satisfy the database unique constraint.
+- **Privacy by design**: No names, real emails, or personally identifiable information are collected at any point. All data can be cleared by the user at any time through browser storage settings.
+
+If you extend the platform to support real accounts (e.g. OAuth), update the `useUser` hook, the `/api/users` route, and the Prisma `User` model — and remove the synthetic email fallback in `assessmentService.js`.
+
+## License
+
+By contributing, you agree your contributions will be licensed under the [MIT License](./LICENSE).

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 EcoGuide AI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

Mobile/carbon_calculator/code.html

@@ -1,357 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0, viewport-fit=cover" name="viewport"/>
-<title>EcoTrack AI - Carbon Calculator</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<style>
-        @import url('https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap');
-        
-        body {
-            font-family: 'Geist', sans-serif;
-            -webkit-font-smoothing: antialiased;
-        }
-
-        .glass-panel {
-            background: rgba(30, 41, 59, 0.5);
-            backdrop-filter: blur(12px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
-        }
-
-        .active-glow {
-            box-shadow: 0 0 15px rgba(78, 222, 163, 0.3);
-            border-color: #4edea3 !important;
-        }
-
-        .bioluminescent-btn {
-            box-shadow: 0 4px 14px 0 rgba(78, 222, 163, 0.3);
-        }
-
-        .custom-slider::-webkit-slider-thumb {
-            -webkit-appearance: none;
-            appearance: none;
-            width: 24px;
-            height: 24px;
-            background: #4edea3;
-            cursor: pointer;
-            border-radius: 50%;
-            box-shadow: 0 0 10px rgba(78, 222, 163, 0.5);
-        }
-
-        .step-indicator-active {
-            width: 2rem;
-            background: #4edea3;
-        }
-
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-        }
-    </style>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "surface-container-lowest": "#060e20",
-                    "inverse-surface": "#dae2fd",
-                    "on-error-container": "#ffdad6",
-                    "primary": "#4edea3",
-                    "on-primary-container": "#00422b",
-                    "surface": "#0b1326",
-                    "surface-container-highest": "#2d3449",
-                    "on-tertiary-container": "#523200",
-                    "surface-container": "#171f33",
-                    "on-surface": "#dae2fd",
-                    "outline-variant": "#3c4a42",
-                    "surface-variant": "#2d3449",
-                    "on-tertiary-fixed": "#2a1700",
-                    "on-tertiary-fixed-variant": "#653e00",
-                    "primary-fixed": "#6ffbbe",
-                    "on-secondary-container": "#00344e",
-                    "inverse-on-surface": "#283044",
-                    "tertiary-container": "#e29100",
-                    "tertiary": "#ffb95f",
-                    "surface-bright": "#31394d",
-                    "on-secondary-fixed-variant": "#004c6e",
-                    "error-container": "#93000a",
-                    "inverse-primary": "#006c49",
-                    "on-secondary": "#00344d",
-                    "on-primary": "#003824",
-                    "background": "#0b1326",
-                    "error": "#ffb4ab",
-                    "primary-fixed-dim": "#4edea3",
-                    "on-primary-fixed": "#002113",
-                    "on-tertiary": "#472a00",
-                    "secondary-fixed-dim": "#89ceff",
-                    "outline": "#86948a",
-                    "primary-container": "#10b981",
-                    "surface-tint": "#4edea3",
-                    "surface-dim": "#0b1326",
-                    "on-error": "#690005",
-                    "secondary-fixed": "#c9e6ff",
-                    "surface-container-low": "#131b2e",
-                    "on-secondary-fixed": "#001e2f",
-                    "on-surface-variant": "#bbcabf",
-                    "tertiary-fixed-dim": "#ffb95f",
-                    "secondary": "#89ceff",
-                    "tertiary-fixed": "#ffddb8",
-                    "surface-container-high": "#222a3d",
-                    "secondary-container": "#00a2e6",
-                    "on-primary-fixed-variant": "#005236",
-                    "on-background": "#dae2fd"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "md": "1.5rem",
-                    "unit": "4px",
-                    "xs": "0.5rem",
-                    "xl": "4rem",
-                    "margin": "2rem",
-                    "sm": "1rem",
-                    "gutter": "1.5rem",
-                    "lg": "2.5rem"
-            },
-            "fontFamily": {
-                    "caption": ["Geist"],
-                    "title-sm": ["Geist"],
-                    "display-lg": ["Geist"],
-                    "display-lg-mobile": ["Geist"],
-                    "headline-md": ["Geist"],
-                    "body-md": ["Geist"],
-                    "label-md": ["Geist"]
-            },
-            "fontSize": {
-                    "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                    "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}],
-                    "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                    "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-    body {
-      min-height: max(884px, 100dvh);
-    }
-  </style>
-</head>
-<body class="bg-surface text-on-surface min-h-screen selection:bg-primary/30">
-<!-- Top App Bar -->
-<header class="fixed top-0 w-full z-50 bg-surface/50 dark:bg-surface-container/50 backdrop-blur-xl border-b border-white/10 dark:border-white/5 shadow-sm backdrop-saturate-150">
-<div class="flex justify-between items-center px-margin h-16 w-full max-w-7xl mx-auto">
-<div class="flex items-center gap-3">
-<div class="w-8 h-8 rounded-lg bg-primary-container flex items-center justify-center">
-<span class="material-symbols-outlined text-on-primary-container" style="font-variation-settings: 'FILL' 1;">eco</span>
-</div>
-<h1 class="font-headline-md text-headline-md font-bold text-primary dark:text-primary-fixed tracking-tight">EcoTrack AI</h1>
-</div>
-<div class="flex items-center gap-2">
-<button class="p-2 rounded-full hover:bg-white/10 transition-colors">
-<span class="material-symbols-outlined text-on-surface-variant">notifications</span>
-</button>
-<div class="w-8 h-8 rounded-full overflow-hidden border border-primary/20">
-<img alt="User Profile" class="w-full h-full object-cover" src="https://lh3.googleusercontent.com/aida-public/AB6AXuAfbSvIgrFI6x0lhKY96zmb1J-w-37aVQ4Opk2XSRClQ1YuoU4F3toj_yXGDr_W41cVRtRCmrJR0nZo_QkcRcc66tZWU7QESsDjZZe93gMSl-X-Wu9fhiwYenNusSXUGy2RZ4JxIm1u62BwcA7brNAeE8zPtcfmIPmGAKKnmxCKmxGCRxB24C0aey6PWi51LvyE3i1FspwQqPH52nZVA1Z3yn13mpWGbVpwArBWa76MvPjkXSdbJEUslRgH6vlUNX3INq4IumEAUesq"/>
-</div>
-</div>
-</div>
-</header>
-<main class="pt-24 pb-48 px-margin max-w-lg mx-auto relative z-10">
-<!-- Wizard Header -->
-<div class="mb-lg">
-<div class="flex items-center justify-between mb-xs">
-<span class="font-label-md text-label-md text-primary uppercase tracking-widest">Step 02 of 05</span>
-<span class="font-label-md text-label-md text-on-surface-variant">Transportation</span>
-</div>
-<div class="flex gap-2 h-1 w-full bg-surface-container-highest rounded-full overflow-hidden">
-<div class="h-full bg-primary/40 w-1/5 rounded-full"></div>
-<div class="h-full bg-primary w-1/5 rounded-full shadow-[0_0_8px_rgba(78,222,163,0.5)]"></div>
-<div class="h-full bg-surface-container w-1/5 rounded-full"></div>
-<div class="h-full bg-surface-container w-1/5 rounded-full"></div>
-<div class="h-full bg-surface-container w-1/5 rounded-full"></div>
-</div>
-</div>
-<!-- Animation/Atmosphere -->
-<div class="absolute inset-0 -z-10 opacity-30 pointer-events-none">
-
-</div>
-<div class="space-y-lg">
-<!-- Transport Type Selection -->
-<section>
-<h2 class="font-title-sm text-title-sm mb-md flex items-center gap-2">
-<span class="material-symbols-outlined text-primary">directions_car</span>
-                    How do you get around?
-                </h2>
-<div class="grid grid-cols-4 gap-3">
-<button class="glass-panel active-glow flex flex-col items-center justify-center p-md rounded-xl transition-all hover:bg-white/5 active:scale-95 group" id="btn-car" onclick="selectTransport('car')">
-<span class="material-symbols-outlined text-primary mb-xs" data-icon="directions_car">directions_car</span>
-<span class="font-caption text-caption text-on-surface-variant group-hover:text-primary transition-colors">Car</span>
-</button>
-<button class="glass-panel flex flex-col items-center justify-center p-md rounded-xl transition-all hover:bg-white/5 active:scale-95 group" id="btn-bus" onclick="selectTransport('bus')">
-<span class="material-symbols-outlined text-on-surface-variant mb-xs" data-icon="directions_bus">directions_bus</span>
-<span class="font-caption text-caption text-on-surface-variant group-hover:text-primary transition-colors">Bus</span>
-</button>
-<button class="glass-panel flex flex-col items-center justify-center p-md rounded-xl transition-all hover:bg-white/5 active:scale-95 group" id="btn-bike" onclick="selectTransport('bike')">
-<span class="material-symbols-outlined text-on-surface-variant mb-xs" data-icon="directions_bike">directions_bike</span>
-<span class="font-caption text-caption text-on-surface-variant group-hover:text-primary transition-colors">Bike</span>
-</button>
-<button class="glass-panel flex flex-col items-center justify-center p-md rounded-xl transition-all hover:bg-white/5 active:scale-95 group" id="btn-walk" onclick="selectTransport('walk')">
-<span class="material-symbols-outlined text-on-surface-variant mb-xs" data-icon="directions_walk">directions_walk</span>
-<span class="font-caption text-caption text-on-surface-variant group-hover:text-primary transition-colors">Walk</span>
-</button>
-</div>
-</section>
-<!-- Commute Distance -->
-<section class="glass-panel p-md rounded-2xl">
-<div class="flex justify-between items-center mb-md">
-<h2 class="font-title-sm text-title-sm flex items-center gap-2">
-<span class="material-symbols-outlined text-primary">distance</span>
-                        Daily commute distance
-                    </h2>
-<span class="text-primary font-headline-md font-bold" id="distance-val">15<span class="text-label-md font-normal text-on-surface-variant ml-1">km</span></span>
-</div>
-<input class="w-full h-1.5 bg-surface-container-highest rounded-lg appearance-none cursor-pointer custom-slider" id="distance-slider" max="100" min="0" oninput="updateDistance(this.value)" step="1" type="range" value="15"/>
-<div class="flex justify-between mt-xs px-1">
-<span class="font-caption text-caption text-on-surface-variant">0km</span>
-<span class="font-caption text-caption text-on-surface-variant">100km+</span>
-</div>
-</section>
-<!-- Fuel Type Selection -->
-<section>
-<h2 class="font-title-sm text-title-sm mb-md flex items-center gap-2">
-<span class="material-symbols-outlined text-primary">ev_station</span>
-                    Vehicle fuel type
-                </h2>
-<div class="relative group">
-<select class="w-full bg-surface-container-low border border-white/10 rounded-xl px-md py-4 font-body-md text-on-surface appearance-none focus:outline-none focus:ring-2 focus:ring-primary/50 transition-all">
-<option value="electric">Electric (EV)</option>
-<option value="hybrid">Hybrid</option>
-<option selected="" value="gasoline">Gasoline</option>
-<option value="diesel">Diesel</option>
-<option value="lpg">LPG / Compressed Natural Gas</option>
-</select>
-<div class="absolute right-4 top-1/2 -translate-y-1/2 pointer-events-none text-on-surface-variant">
-<span class="material-symbols-outlined">expand_more</span>
-</div>
-</div>
-<p class="mt-xs font-caption text-caption text-on-surface-variant/70 flex items-center gap-1 px-1">
-<span class="material-symbols-outlined text-[14px]">info</span>
-                    Fuel type significantly impacts the final emission estimate.
-                </p>
-</section>
-</div>
-</main>
-<!-- Live Estimate Bottom Sheet -->
-<div class="fixed bottom-0 left-0 w-full z-40 bg-surface/70 dark:bg-surface-container-low/70 backdrop-blur-lg border-t border-white/10 dark:border-white/5 shadow-[0_-4px_20px_rgba(0,0,0,0.1)] rounded-t-xl px-4 pb-safe pt-4">
-<div class="max-w-7xl mx-auto">
-<!-- Glow Counter -->
-<div class="flex items-center justify-between mb-md glass-panel p-md rounded-xl border-primary/20">
-<div>
-<p class="font-label-md text-label-md text-on-surface-variant">Estimated Daily Impact</p>
-<div class="flex items-baseline gap-2">
-<span class="text-primary font-display-lg-mobile font-bold tracking-tight drop-shadow-[0_0_12px_rgba(78,222,163,0.4)]" id="live-carbon">2.4</span>
-<span class="text-on-surface font-headline-md font-medium">kg CO2e</span>
-</div>
-</div>
-<div class="h-12 w-12 rounded-full border-2 border-primary/20 flex items-center justify-center relative">
-<div class="absolute inset-0 rounded-full border-2 border-primary border-t-transparent animate-spin duration-700"></div>
-<span class="material-symbols-outlined text-primary" style="font-variation-settings: 'FILL' 1;">analytics</span>
-</div>
-</div>
-<!-- Footer Navigation -->
-<div class="flex gap-4 pb-4">
-<button class="flex-1 py-4 px-md rounded-xl font-label-md text-label-md font-bold text-on-surface-variant bg-surface-container hover:bg-surface-container-highest transition-all active:scale-95">
-                    BACK
-                </button>
-<button class="flex-[2] py-4 px-md rounded-xl font-label-md text-label-md font-bold text-on-primary bg-primary bioluminescent-btn hover:brightness-110 transition-all active:scale-95 flex items-center justify-center gap-2">
-                    NEXT STEP
-                    <span class="material-symbols-outlined text-[20px]">arrow_forward</span>
-</button>
-</div>
-</div>
-</div>
-<!-- Hidden Bottom Nav for top-level context checking -->
-<nav class="hidden md:flex fixed bottom-0 w-full z-50 rounded-t-xl bg-surface/70 dark:bg-surface-container-low/70 backdrop-blur-lg border-t border-white/10 dark:border-white/5 shadow-[0_-4px_20px_rgba(0,0,0,0.1)] justify-around items-center px-4 pb-safe pt-2">
-<!-- Suppression logic active: Navigation hidden on task-focused wizard screen -->
-</nav>
-<script>
-        let currentDistance = 15;
-        let transportFactor = 0.16; // kg CO2 per km for car
-
-        function updateDistance(val) {
-            currentDistance = val;
-            document.getElementById('distance-val').innerHTML = `${val}<span class="text-label-md font-normal text-on-surface-variant ml-1">km</span>`;
-            calculateLiveEstimate();
-        }
-
-        function selectTransport(type) {
-            // Reset all buttons
-            const buttons = ['car', 'bus', 'bike', 'walk'];
-            buttons.forEach(t => {
-                const btn = document.getElementById(`btn-${t}`);
-                btn.classList.remove('active-glow');
-                btn.querySelector('.material-symbols-outlined').classList.remove('text-primary');
-                btn.querySelector('.material-symbols-outlined').classList.add('text-on-surface-variant');
-            });
-
-            // Set active
-            const activeBtn = document.getElementById(`btn-${type}`);
-            activeBtn.classList.add('active-glow');
-            activeBtn.querySelector('.material-symbols-outlined').classList.add('text-primary');
-            activeBtn.querySelector('.material-symbols-outlined').classList.remove('text-on-surface-variant');
-
-            // Update factors
-            switch(type) {
-                case 'car': transportFactor = 0.16; break;
-                case 'bus': transportFactor = 0.08; break;
-                case 'bike': transportFactor = 0.005; break;
-                case 'walk': transportFactor = 0; break;
-            }
-            calculateLiveEstimate();
-        }
-
-        function calculateLiveEstimate() {
-            const result = (currentDistance * transportFactor).toFixed(1);
-            const display = document.getElementById('live-carbon');
-            
-            // Minimal animation for value change
-            let startValue = parseFloat(display.innerText);
-            let endValue = parseFloat(result);
-            let duration = 300;
-            let startTime = null;
-
-            function animate(currentTime) {
-                if (!startTime) startTime = currentTime;
-                const progress = Math.min((currentTime - startTime) / duration, 1);
-                const current = (startValue + (endValue - startValue) * progress).toFixed(1);
-                display.innerText = current;
-                if (progress < 1) requestAnimationFrame(animate);
-            }
-            requestAnimationFrame(animate);
-        }
-
-        // Add a subtle parallax effect to the glass cards
-        document.addEventListener('mousemove', (e) => {
-            const amount = 5;
-            const x = (e.clientX / window.innerWidth - 0.5) * amount;
-            const y = (e.clientY / window.innerHeight - 0.5) * amount;
-            const glassCards = document.querySelectorAll('.glass-panel');
-            glassCards.forEach(card => {
-                card.style.transform = `perspective(1000px) rotateX(${-y}deg) rotateY(${x}deg)`;
-            });
-        });
-    </script>
-</body></html>

Mobile/challenges_gamification/code.html

@@ -1,381 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0, viewport-fit=cover" name="viewport"/>
-<title>EcoTrack AI | Challenges &amp; Gamification</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "surface-container-lowest": "#060e20",
-                    "inverse-surface": "#dae2fd",
-                    "on-error-container": "#ffdad6",
-                    "primary": "#4edea3",
-                    "on-primary-container": "#00422b",
-                    "surface": "#0b1326",
-                    "surface-container-highest": "#2d3449",
-                    "on-tertiary-container": "#523200",
-                    "surface-container": "#171f33",
-                    "on-surface": "#dae2fd",
-                    "outline-variant": "#3c4a42",
-                    "surface-variant": "#2d3449",
-                    "on-tertiary-fixed": "#2a1700",
-                    "on-tertiary-fixed-variant": "#653e00",
-                    "primary-fixed": "#6ffbbe",
-                    "on-secondary-container": "#00344e",
-                    "inverse-on-surface": "#283044",
-                    "tertiary-container": "#e29100",
-                    "tertiary": "#ffb95f",
-                    "surface-bright": "#31394d",
-                    "on-secondary-fixed-variant": "#004c6e",
-                    "error-container": "#93000a",
-                    "inverse-primary": "#006c49",
-                    "on-secondary": "#00344d",
-                    "on-primary": "#003824",
-                    "background": "#0b1326",
-                    "error": "#ffb4ab",
-                    "primary-fixed-dim": "#4edea3",
-                    "on-primary-fixed": "#002113",
-                    "on-tertiary": "#472a00",
-                    "secondary-fixed-dim": "#89ceff",
-                    "outline": "#86948a",
-                    "primary-container": "#10b981",
-                    "surface-tint": "#4edea3",
-                    "surface-dim": "#0b1326",
-                    "on-error": "#690005",
-                    "secondary-fixed": "#c9e6ff",
-                    "surface-container-low": "#131b2e",
-                    "on-secondary-fixed": "#001e2f",
-                    "on-surface-variant": "#bbcabf",
-                    "tertiary-fixed-dim": "#ffb95f",
-                    "secondary": "#89ceff",
-                    "tertiary-fixed": "#ffddb8",
-                    "surface-container-high": "#222a3d",
-                    "secondary-container": "#00a2e6",
-                    "on-primary-fixed-variant": "#005236",
-                    "on-background": "#dae2fd"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "md": "1.5rem",
-                    "unit": "4px",
-                    "xs": "0.5rem",
-                    "xl": "4rem",
-                    "margin": "2rem",
-                    "sm": "1rem",
-                    "gutter": "1.5rem",
-                    "lg": "2.5rem"
-            },
-            "fontFamily": {
-                    "caption": ["Geist"],
-                    "title-sm": ["Geist"],
-                    "display-lg": ["Geist"],
-                    "display-lg-mobile": ["Geist"],
-                    "headline-md": ["Geist"],
-                    "body-md": ["Geist"],
-                    "label-md": ["Geist"]
-            },
-            "fontSize": {
-                    "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                    "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}],
-                    "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                    "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-        body {
-            background-color: #0b1326;
-            color: #dae2fd;
-            font-family: 'Geist', sans-serif;
-            overflow-x: hidden;
-        }
-        .glass-card {
-            background: rgba(30, 41, 59, 0.5);
-            backdrop-filter: blur(12px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05);
-        }
-        .bioluminescent-glow {
-            box-shadow: 0 0 15px rgba(78, 222, 163, 0.3);
-        }
-        .badge-glow {
-            filter: drop-shadow(0 0 8px rgba(78, 222, 163, 0.5));
-        }
-        .hide-scrollbar::-webkit-scrollbar {
-            display: none;
-        }
-        .hide-scrollbar {
-            -ms-overflow-style: none;
-            scrollbar-width: none;
-        }
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-        }
-    </style>
-<style>
-    body {
-      min-height: max(884px, 100dvh);
-    }
-  </style>
-  </head>
-<body class="bg-surface text-on-surface antialiased">
-<!-- Top App Bar -->
-<header class="fixed top-0 w-full z-50 bg-surface/50 dark:bg-surface-container/50 backdrop-blur-xl border-b border-white/10 dark:border-white/5 shadow-sm backdrop-saturate-150 h-16">
-<div class="flex justify-between items-center px-margin h-16 w-full max-w-7xl mx-auto">
-<div class="flex items-center gap-3">
-<div class="w-8 h-8 rounded-full overflow-hidden border border-primary/30">
-<img alt="User" class="w-full h-full object-cover" data-alt="A high-quality 3D rendered avatar of a stylish user with modern glasses and a slight smile, set against a vibrant emerald green background with soft depth of field. The style is clean, eco-futuristic, and professional." src="https://lh3.googleusercontent.com/aida-public/AB6AXuDJZ3069M3x_gKg08zWvrkPlz9nBZLxTZ5bGL5s6k04Cj4GlVi3WGv00YsqhI7GjOfu368xRGOy7LwdoOoMQcAHgLUQMmZaU-Ka-CM0zfRivG5tbswzPbsW3dFDAGcbb_EPWF7UjgnCBY8hVtC_RAGuycag_HcuQLk3m341XC3lQOiMb_AtzbYKhICyxQA4v3J7Ohal_-31yyR2wcdLqD9FJu0zs3GCpMcp2zni6yjzPT5ILv6cVVE3N98f2Id678SvyquhcKq_MNnu"/>
-</div>
-<span class="font-headline-md text-headline-md font-bold text-primary dark:text-primary-fixed tracking-tight">EcoTrack AI</span>
-</div>
-<button class="material-symbols-outlined text-on-surface-variant hover:bg-white/10 transition-colors p-2 rounded-full">notifications</button>
-</div>
-</header>
-<main class="pt-24 pb-32 px-4 space-y-8">
-<!-- Active Challenges Horizontal Scroll -->
-<section>
-<div class="flex items-center justify-between mb-4">
-<h2 class="font-headline-md text-headline-md text-on-surface">Active Challenges</h2>
-<span class="font-label-md text-label-md text-primary">3 Active</span>
-</div>
-<div class="flex gap-4 overflow-x-auto hide-scrollbar snap-x -mx-4 px-4">
-<!-- No-Car Week -->
-<div class="snap-center shrink-0 w-[280px] glass-card rounded-xl p-md flex flex-col justify-between relative overflow-hidden">
-<div class="absolute top-0 right-0 p-3">
-<span class="bg-primary/20 text-primary text-caption font-caption px-2 py-1 rounded-lg">+500 pts</span>
-</div>
-<div>
-<span class="material-symbols-outlined text-primary mb-2" style="font-variation-settings: 'FILL' 1;">directions_car</span>
-<h3 class="font-title-sm text-title-sm text-on-surface mb-1">No-Car Week</h3>
-<p class="font-label-md text-label-md text-on-surface-variant mb-4">4 days left</p>
-</div>
-<div class="space-y-2">
-<div class="flex justify-between text-caption font-caption">
-<span>Progress</span>
-<span>60%</span>
-</div>
-<div class="w-full bg-surface-container-highest h-2 rounded-full overflow-hidden">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[60%]"></div>
-</div>
-</div>
-</div>
-<!-- Vegan Weekend -->
-<div class="snap-center shrink-0 w-[280px] glass-card rounded-xl p-md flex flex-col justify-between relative overflow-hidden">
-<div class="absolute top-0 right-0 p-3">
-<span class="bg-tertiary/20 text-tertiary text-caption font-caption px-2 py-1 rounded-lg">+250 pts</span>
-</div>
-<div>
-<span class="material-symbols-outlined text-tertiary mb-2" style="font-variation-settings: 'FILL' 1;">eco</span>
-<h3 class="font-title-sm text-title-sm text-on-surface mb-1">Vegan Weekend</h3>
-<p class="font-label-md text-label-md text-on-surface-variant mb-4">Starts in 12h</p>
-</div>
-<div class="space-y-2">
-<div class="flex justify-between text-caption font-caption">
-<span>Progress</span>
-<span>0%</span>
-</div>
-<div class="w-full bg-surface-container-highest h-2 rounded-full overflow-hidden">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-0"></div>
-</div>
-</div>
-</div>
-<!-- Plastic-Free Challenge -->
-<div class="snap-center shrink-0 w-[280px] glass-card rounded-xl p-md flex flex-col justify-between relative overflow-hidden">
-<div class="absolute top-0 right-0 p-3">
-<span class="bg-primary/20 text-primary text-caption font-caption px-2 py-1 rounded-lg">+400 pts</span>
-</div>
-<div>
-<span class="material-symbols-outlined text-primary mb-2" style="font-variation-settings: 'FILL' 1;">shopping_bag</span>
-<h3 class="font-title-sm text-title-sm text-on-surface mb-1">Plastic-Free</h3>
-<p class="font-label-md text-label-md text-on-surface-variant mb-4">2 days left</p>
-</div>
-<div class="space-y-2">
-<div class="flex justify-between text-caption font-caption">
-<span>Progress</span>
-<span>85%</span>
-</div>
-<div class="w-full bg-surface-container-highest h-2 rounded-full overflow-hidden">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[85%]"></div>
-</div>
-</div>
-</div>
-</div>
-</section>
-<!-- Leaderboard Preview -->
-<section class="glass-card rounded-2xl p-md">
-<div class="flex items-center justify-between mb-6">
-<h2 class="font-title-sm text-title-sm text-on-surface">Leaderboard</h2>
-<button class="font-label-md text-label-md text-secondary">View All</button>
-</div>
-<div class="space-y-4">
-<!-- Rank 1 -->
-<div class="flex items-center justify-between p-3 rounded-xl bg-primary/10 border border-primary/20">
-<div class="flex items-center gap-4">
-<div class="relative">
-<img class="w-12 h-12 rounded-full border-2 border-primary" data-alt="A professional close-up of a person with warm features and a confident look, rendered in a crisp digital vector style with soft ambient lighting and eco-friendly primary green accents in the background." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAT1EPgeHbiCyiDKLGp868IabVBLWQJe-FbA4S09aQJipuS6tXAJnHYJnoD4VL-TBLlnzm4xoCEkS_WlOmVhbeXjuNHry4GZPGKfJ5_iQ8X-fVs2ZENwqa0MK2sTi6dgD_hmctOs2tY1U0dbsRFDclOP1Sy81nI9zy56ULwxCR3EAsmngeA71gDstnUUoOs0PVxPurXRdI32iJ5ScLE0CjWgOYh6n808_7lSn7PlX4m0EkobLUHN1beT5h43E4UGhZjiUdK2JjYPK9R"/>
-<span class="absolute -top-1 -right-1 bg-tertiary text-on-tertiary text-[10px] w-5 h-5 flex items-center justify-center rounded-full font-bold">1</span>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface">Sarah J.</p>
-<p class="font-caption text-caption text-primary">Master Guardian</p>
-</div>
-</div>
-<div class="text-right">
-<p class="font-title-sm text-title-sm text-on-surface">12,450</p>
-<p class="font-caption text-caption text-on-surface-variant">pts</p>
-</div>
-</div>
-<!-- Rank 2 -->
-<div class="flex items-center justify-between p-3 rounded-xl bg-white/5 border border-white/10">
-<div class="flex items-center gap-4">
-<div class="relative">
-<img class="w-12 h-12 rounded-full border-2 border-secondary" data-alt="A clean digital avatar of a young professional with a friendly smile, styled in a minimalist and modern eco-futuristic aesthetic with deep blue and slate tones in the lighting." src="https://lh3.googleusercontent.com/aida-public/AB6AXuC8P9QWmkdOOWXq6XrcEKt3wdPMsFJNegdG6UQznpU9ZMfLbsW_fKTfuIWlIHInf0YMPE4MLmRNL20P6VlcsCnd6KLkvc2A_RuBSwHsKvwumkpFZT8hQKxSFUve03mZ3vKJhUIOej633ww6102SdmOn6nfPmGNiLv7WvjtVfUwnGDsbyCIQyJ_B9mmnBqpiH6NUy4eYvDJfHlzbdZ2ZhVkzk8p547M03lRA615RwLExviMZ8p62ikv_uMg-K1FGpiL7YAMp8suTSGhZ"/>
-<span class="absolute -top-1 -right-1 bg-secondary text-on-secondary text-[10px] w-5 h-5 flex items-center justify-center rounded-full font-bold">2</span>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface">James W.</p>
-<p class="font-caption text-caption text-on-surface-variant">Nature Enthusiast</p>
-</div>
-</div>
-<div class="text-right">
-<p class="font-title-sm text-title-sm text-on-surface">11,200</p>
-<p class="font-caption text-caption text-on-surface-variant">pts</p>
-</div>
-</div>
-<!-- Rank 3 -->
-<div class="flex items-center justify-between p-3 rounded-xl bg-white/5 border border-white/10">
-<div class="flex items-center gap-4">
-<div class="relative">
-<img class="w-12 h-12 rounded-full border-2 border-surface-container-highest" data-alt="A high-end character illustration of a person with vibrant energy, rendered with smooth gradients and soft digital lighting, fitting an eco-futuristic tech brand identity with vibrant emerald and sky blue highlights." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAYkzfO_UyJ2G530wb-ov-OwK5ff3WIT-F_PjNiklYBaBkSnYBGSr6Qup5sIOA0s5OdV_QDLc6gODbXBElL5UckyQ-9ktreb80hwwU5qos-sJXJIUnmCOsYy7tFKmczpTrMWwqioCB6SoLP3N7Du7iecb4edZ5a9O_cI7FgGiIxp29xjkaFWOVWfQ26O3L3nh-gswqV1XGraa-PB8EllrAXdrATbGiQycXKanj1dS3hpbO_kdffmXE-76_8Ol_flCoWuo5gdCpgSfkp"/>
-<span class="absolute -top-1 -right-1 bg-surface-variant text-on-surface-variant text-[10px] w-5 h-5 flex items-center justify-center rounded-full font-bold">3</span>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface">Mila K.</p>
-<p class="font-caption text-caption text-on-surface-variant">Carbon Reducer</p>
-</div>
-</div>
-<div class="text-right">
-<p class="font-title-sm text-title-sm text-on-surface">10,890</p>
-<p class="font-caption text-caption text-on-surface-variant">pts</p>
-</div>
-</div>
-</div>
-</section>
-<!-- Earned Badges Grid -->
-<section>
-<h2 class="font-headline-md text-headline-md text-on-surface mb-6">Achievements</h2>
-<div class="grid grid-cols-3 gap-6">
-<!-- Tree Planter -->
-<div class="flex flex-col items-center gap-2 group">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center badge-glow border-primary/50 relative">
-<span class="material-symbols-outlined text-4xl text-primary" style="font-variation-settings: 'FILL' 1;">forest</span>
-<div class="absolute inset-0 bg-primary/10 rounded-full blur-xl opacity-50 group-hover:opacity-80 transition-opacity"></div>
-</div>
-<span class="font-label-md text-label-md text-center">Tree Planter</span>
-</div>
-<!-- Carbon Ninja -->
-<div class="flex flex-col items-center gap-2 group">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center badge-glow border-secondary/50 relative">
-<span class="material-symbols-outlined text-4xl text-secondary" style="font-variation-settings: 'FILL' 1;">shutter_speed</span>
-<div class="absolute inset-0 bg-secondary/10 rounded-full blur-xl opacity-50 group-hover:opacity-80 transition-opacity"></div>
-</div>
-<span class="font-label-md text-label-md text-center">Carbon Ninja</span>
-</div>
-<!-- Ocean Guard -->
-<div class="flex flex-col items-center gap-2 group grayscale opacity-50">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center border-white/10">
-<span class="material-symbols-outlined text-4xl text-on-surface-variant" style="font-variation-settings: 'FILL' 0;">water_drop</span>
-</div>
-<span class="font-label-md text-label-md text-center">Ocean Guard</span>
-</div>
-<!-- Solar Pro -->
-<div class="flex flex-col items-center gap-2 group grayscale opacity-50">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center border-white/10">
-<span class="material-symbols-outlined text-4xl text-on-surface-variant" style="font-variation-settings: 'FILL' 0;">wb_sunny</span>
-</div>
-<span class="font-label-md text-label-md text-center">Solar Pro</span>
-</div>
-<!-- Zero Waste -->
-<div class="flex flex-col items-center gap-2 group">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center badge-glow border-tertiary/50 relative">
-<span class="material-symbols-outlined text-4xl text-tertiary" style="font-variation-settings: 'FILL' 1;">recycling</span>
-<div class="absolute inset-0 bg-tertiary/10 rounded-full blur-xl opacity-50 group-hover:opacity-80 transition-opacity"></div>
-</div>
-<span class="font-label-md text-label-md text-center">Zero Waste</span>
-</div>
-<!-- Eco Voyager -->
-<div class="flex flex-col items-center gap-2 group grayscale opacity-50">
-<div class="w-20 h-20 rounded-full glass-card flex items-center justify-center border-white/10">
-<span class="material-symbols-outlined text-4xl text-on-surface-variant" style="font-variation-settings: 'FILL' 0;">explore</span>
-</div>
-<span class="font-label-md text-label-md text-center">Eco Voyager</span>
-</div>
-</div>
-</section>
-<!-- CTA -->
-<section class="pt-4">
-<button class="w-full py-4 bg-primary text-on-primary font-headline-md rounded-2xl bioluminescent-glow hover:scale-[1.02] active:scale-95 transition-all">
-                Discover More Challenges
-            </button>
-</section>
-</main>
-<!-- Bottom Navigation Bar -->
-<nav class="fixed bottom-0 w-full z-50 rounded-t-xl bg-surface/70 dark:bg-surface-container-low/70 backdrop-blur-lg border-t border-white/10 dark:border-white/5 shadow-[0_-4px_20px_rgba(0,0,0,0.1)]">
-<div class="flex justify-around items-center px-4 pb-safe pt-2 w-full h-20">
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined" data-icon="home_app_logo">home_app_logo</span>
-<span class="font-caption text-caption">Home</span>
-</div>
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined" data-icon="calculate">calculate</span>
-<span class="font-caption text-caption">Calculate</span>
-</div>
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined" data-icon="analytics">analytics</span>
-<span class="font-caption text-caption">Insights</span>
-</div>
-<div class="flex flex-col items-center justify-center text-primary dark:text-primary-fixed bg-primary/10 rounded-xl px-3 py-1">
-<span class="material-symbols-outlined" data-icon="workspace_premium" style="font-variation-settings: 'FILL' 1;">workspace_premium</span>
-<span class="font-caption text-caption">Impact</span>
-</div>
-</div>
-</nav>
-<script>
-        // Micro-interactions for horizontal scroll
-        const scrollContainer = document.querySelector('.hide-scrollbar');
-        scrollContainer.addEventListener('scroll', () => {
-            // Placeholder for potential scroll-based parallax or animations
-        });
-
-        // Simple button click ripple effect
-        document.querySelectorAll('button').forEach(button => {
-            button.addEventListener('mousedown', function() {
-                this.classList.add('scale-95');
-            });
-            button.addEventListener('mouseup', function() {
-                this.classList.remove('scale-95');
-            });
-            button.addEventListener('mouseleave', function() {
-                this.classList.remove('scale-95');
-            });
-        });
-    </script>
-</body></html>

Mobile/landing_page/code.html

@@ -1,318 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0, viewport-fit=cover" name="viewport"/>
-<title>EcoTrack AI | Track. Reduce. Restore.</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com" rel="preconnect"/>
-<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
-<link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<style>
-        :root {
-            --glass-border: rgba(255, 255, 255, 0.1);
-            --glass-bg: rgba(30, 41, 59, 0.5);
-            --emerald-glow: rgba(78, 222, 163, 0.3);
-        }
-        body {
-            background-color: #0b1326;
-            color: #dae2fd;
-            font-family: 'Geist', sans-serif;
-            overflow-x: hidden;
-        }
-        .glass-card {
-            backdrop-filter: blur(12px);
-            background: var(--glass-bg);
-            border: 1px solid var(--glass-border);
-            box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
-        }
-        .emerald-glow-btn {
-            box-shadow: 0 0 20px var(--emerald-glow);
-            transition: all 0.3s ease;
-        }
-        .emerald-glow-btn:active {
-            transform: scale(0.95);
-            box-shadow: 0 0 10px var(--emerald-glow);
-        }
-        .eco-gradient-text {
-            background: linear-gradient(135deg, #4edea3 0%, #89ceff 100%);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-        }
-        .floating {
-            animation: floating 6s ease-in-out infinite;
-        }
-        @keyframes floating {
-            0% { transform: translateY(0px); }
-            50% { transform: translateY(-20px); }
-            100% { transform: translateY(0px); }
-        }
-        .mesh-gradient {
-            background-color: #0b1326;
-            background-image: 
-                radial-gradient(at 0% 0%, rgba(78, 222, 163, 0.15) 0, transparent 50%), 
-                radial-gradient(at 100% 0%, rgba(0, 162, 230, 0.15) 0, transparent 50%);
-        }
-    </style>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "surface-container-lowest": "#060e20",
-                    "inverse-surface": "#dae2fd",
-                    "on-error-container": "#ffdad6",
-                    "primary": "#4edea3",
-                    "on-primary-container": "#00422b",
-                    "surface": "#0b1326",
-                    "surface-container-highest": "#2d3449",
-                    "on-tertiary-container": "#523200",
-                    "surface-container": "#171f33",
-                    "on-surface": "#dae2fd",
-                    "outline-variant": "#3c4a42",
-                    "surface-variant": "#2d3449",
-                    "on-tertiary-fixed": "#2a1700",
-                    "on-tertiary-fixed-variant": "#653e00",
-                    "primary-fixed": "#6ffbbe",
-                    "on-secondary-container": "#00344e",
-                    "inverse-on-surface": "#283044",
-                    "tertiary-container": "#e29100",
-                    "tertiary": "#ffb95f",
-                    "surface-bright": "#31394d",
-                    "on-secondary-fixed-variant": "#004c6e",
-                    "error-container": "#93000a",
-                    "inverse-primary": "#006c49",
-                    "on-secondary": "#00344d",
-                    "on-primary": "#003824",
-                    "background": "#0b1326",
-                    "error": "#ffb4ab",
-                    "primary-fixed-dim": "#4edea3",
-                    "on-primary-fixed": "#002113",
-                    "on-tertiary": "#472a00",
-                    "secondary-fixed-dim": "#89ceff",
-                    "outline": "#86948a",
-                    "primary-container": "#10b981",
-                    "surface-tint": "#4edea3",
-                    "surface-dim": "#0b1326",
-                    "on-error": "#690005",
-                    "secondary-fixed": "#c9e6ff",
-                    "surface-container-low": "#131b2e",
-                    "on-secondary-fixed": "#001e2f",
-                    "on-surface-variant": "#bbcabf",
-                    "tertiary-fixed-dim": "#ffb95f",
-                    "secondary": "#89ceff",
-                    "tertiary-fixed": "#ffddb8",
-                    "surface-container-high": "#222a3d",
-                    "secondary-container": "#00a2e6",
-                    "on-primary-fixed-variant": "#005236",
-                    "on-background": "#dae2fd"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "md": "1.5rem",
-                    "unit": "4px",
-                    "xs": "0.5rem",
-                    "xl": "4rem",
-                    "margin": "2rem",
-                    "sm": "1rem",
-                    "gutter": "1.5rem",
-                    "lg": "2.5rem"
-            },
-            "fontFamily": {
-                    "caption": ["Geist"],
-                    "title-sm": ["Geist"],
-                    "display-lg": ["Geist"],
-                    "display-lg-mobile": ["Geist"],
-                    "headline-md": ["Geist"],
-                    "body-md": ["Geist"],
-                    "label-md": ["Geist"]
-            },
-            "fontSize": {
-                    "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                    "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}],
-                    "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                    "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-    body {
-      min-height: max(884px, 100dvh);
-    }
-  </style>
-  </head>
-<body class="mesh-gradient min-h-screen flex flex-col items-center">
-<!-- Top Navigation Bar (Shared Component) -->
-<nav class="fixed top-0 w-full z-50 bg-surface/50 dark:bg-surface-container/50 backdrop-blur-xl border-b border-white/10 dark:border-white/5 shadow-sm backdrop-saturate-150">
-<div class="flex justify-between items-center px-margin h-16 w-full max-w-7xl mx-auto">
-<div class="flex items-center gap-3">
-<div class="w-8 h-8 rounded-full overflow-hidden bg-primary-container flex items-center justify-center">
-<span class="material-symbols-outlined text-on-primary-container text-[20px]">eco</span>
-</div>
-<span class="font-headline-md text-headline-md font-bold text-primary dark:text-primary-fixed tracking-tight">EcoTrack AI</span>
-</div>
-<button class="w-10 h-10 rounded-full flex items-center justify-center text-on-surface-variant dark:text-on-surface-variant hover:bg-white/10 transition-colors active:scale-95 duration-100">
-<span class="material-symbols-outlined">notifications</span>
-</button>
-</div>
-</nav>
-<main class="w-full pt-24 pb-32 px-4 max-w-md">
-<!-- Hero Section -->
-<section class="flex flex-col items-center text-center space-y-8 mb-16">
-<div class="relative w-full aspect-square max-w-[280px] flex items-center justify-center">
-<!-- 3D Effect Globe Graphic (Placeholder for visualization) -->
-<div class="absolute inset-0 bg-primary/10 rounded-full blur-[60px] animate-pulse"></div>
-<div class="relative z-10 floating">
-<img alt="Eco Globe Graphic" class="w-48 h-48 drop-shadow-[0_0_30px_rgba(78,222,163,0.5)]" data-alt="A futuristic, high-tech 3D render of a stylized digital Earth globe. The globe is translucent and glowing with neon emerald and sky blue pulse lines that represent carbon data streams. It is set against a deep navy blue atmospheric background with soft particle effects, reflecting an optimistic and visionary eco-technology aesthetic. Soft cinematic lighting highlights the smooth edges and glass-like texture of the digital continents." src="https://lh3.googleusercontent.com/aida-public/AB6AXuARn6LPgO5xyl1SYMESvfRFJ_QHX4-deMVJfFEy08qvNhxSsOptjhx-Iigx2GLU0wmocEvqJilo9lEz9WA235ci5zKt-rwHvD3Ljr_LWLBQn18zAHnjvCzaPQ0IWbBWa1mKgQM8tWpBcp9tfLDIK16fbSpto8P6iXJW8jnqwSv-OUg1iSBbL9nvTdwra8Ji6ZdTWJNu8Lnc6W7ubegZqVewLe59t5RHwRX-o2dSR3A6xOJKSNAhvxMNj5gProo2em903alVTcOr_3Ty"/>
-</div>
-</div>
-<div class="space-y-4">
-<h1 class="font-display-lg-mobile text-display-lg-mobile eco-gradient-text tracking-tight uppercase">
-                    EcoTrack AI
-                </h1>
-<p class="font-title-sm text-title-sm text-on-surface-variant">
-                    Track. Reduce. Restore.
-                </p>
-<p class="font-body-md text-body-md text-on-surface/70 px-4">
-                    The world's most advanced AI-powered individual carbon accounting platform.
-                </p>
-</div>
-<button class="w-full py-4 bg-primary text-on-primary font-headline-md text-[18px] rounded-xl emerald-glow-btn font-bold">
-                Start Your Journey
-            </button>
-</section>
-<!-- Stats Grid -->
-<section class="grid grid-cols-2 gap-4 mb-16">
-<div class="glass-card rounded-xl p-4 text-center">
-<span class="font-display-lg-mobile text-[24px] text-primary block">50k+</span>
-<span class="font-caption text-caption text-on-surface-variant uppercase tracking-wider">Tons CO2 Saved</span>
-</div>
-<div class="glass-card rounded-xl p-4 text-center">
-<span class="font-display-lg-mobile text-[24px] text-secondary block">100k+</span>
-<span class="font-caption text-caption text-on-surface-variant uppercase tracking-wider">Eco Warriors</span>
-</div>
-</section>
-<!-- Feature Cards Section -->
-<section class="space-y-6">
-<h2 class="font-headline-md text-headline-md text-primary px-2">Ecosystem Features</h2>
-<!-- Real-time Tracking -->
-<div class="glass-card rounded-2xl p-6 flex flex-col space-y-4">
-<div class="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center">
-<span class="material-symbols-outlined text-primary text-[32px]">query_stats</span>
-</div>
-<div>
-<h3 class="font-title-sm text-title-sm text-white mb-2">Real-time Tracking</h3>
-<p class="font-body-md text-body-md text-on-surface-variant">Automated daily carbon footprint monitoring powered by IoT and bank integration.</p>
-</div>
-</div>
-<!-- AI Coach -->
-<div class="glass-card rounded-2xl p-6 flex flex-col space-y-4">
-<div class="w-12 h-12 bg-secondary/10 rounded-lg flex items-center justify-center">
-<span class="material-symbols-outlined text-secondary text-[32px]">smart_toy</span>
-</div>
-<div>
-<h3 class="font-title-sm text-title-sm text-white mb-2">AI Coach</h3>
-<p class="font-body-md text-body-md text-on-surface-variant">Personalized reduction strategies and smart suggestions based on your lifestyle data.</p>
-</div>
-</div>
-<!-- Global Challenges -->
-<div class="glass-card rounded-2xl p-6 flex flex-col space-y-4">
-<div class="w-12 h-12 bg-tertiary/10 rounded-lg flex items-center justify-center">
-<span class="material-symbols-outlined text-tertiary text-[32px]">public</span>
-</div>
-<div>
-<h3 class="font-title-sm text-title-sm text-white mb-2">Global Challenges</h3>
-<p class="font-body-md text-body-md text-on-surface-variant">Join worldwide missions to plant forests and restore coral reefs with your saved credits.</p>
-</div>
-</div>
-</section>
-<!-- Progress Visualizer (Visual extra) -->
-<section class="mt-16 glass-card rounded-2xl p-6 overflow-hidden relative">
-<div class="relative z-10">
-<h3 class="font-title-sm text-title-sm mb-4">Global Sustainability Progress</h3>
-<div class="h-3 w-full bg-surface-container-highest rounded-full overflow-hidden">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[65%] rounded-full relative">
-<div class="absolute inset-0 bg-white/20 animate-[pulse_2s_infinite]"></div>
-</div>
-</div>
-<div class="flex justify-between mt-2 font-caption text-caption text-on-surface-variant">
-<span>Current: 65% Target</span>
-<span>Goal: 100% Net Zero</span>
-</div>
-</div>
-</section>
-</main>
-<!-- Bottom Navigation Bar (Shared Component) -->
-<nav class="fixed bottom-0 w-full z-50 rounded-t-xl bg-surface/70 dark:bg-surface-container-low/70 backdrop-blur-lg border-t border-white/10 dark:border-white/5 shadow-[0_-4px_20px_rgba(0,0,0,0.1)]">
-<div class="flex justify-around items-center px-4 pb-safe pt-2 w-full h-16">
-<div class="flex flex-col items-center justify-center text-primary dark:text-primary-fixed bg-primary/10 rounded-xl px-3 py-1 scale-90 duration-200">
-<span class="material-symbols-outlined" style="font-variation-settings: 'FILL' 1;">home_app_logo</span>
-<span class="font-caption text-caption mt-0.5">Home</span>
-</div>
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined">calculate</span>
-<span class="font-caption text-caption mt-0.5">Calculate</span>
-</div>
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined">analytics</span>
-<span class="font-caption text-caption mt-0.5">Insights</span>
-</div>
-<div class="flex flex-col items-center justify-center text-on-surface-variant dark:text-on-surface-variant/70 hover:text-primary transition-all">
-<span class="material-symbols-outlined">workspace_premium</span>
-<span class="font-caption text-caption mt-0.5">Impact</span>
-</div>
-</div>
-</nav>
-<script>
-        // Simple counter animation for stats
-        const counters = document.querySelectorAll('.glass-card span.font-display-lg-mobile');
-        const speed = 200;
-
-        counters.forEach(counter => {
-            const animate = () => {
-                const targetText = counter.innerText;
-                const value = parseInt(targetText.replace(/[^\d]/g, ''));
-                const suffix = targetText.replace(/[\d]/g, '');
-                
-                let current = 0;
-                const step = value / speed;
-                
-                const update = () => {
-                    if (current < value) {
-                        current += step;
-                        counter.innerText = Math.ceil(current) + suffix;
-                        setTimeout(update, 1);
-                    } else {
-                        counter.innerText = targetText;
-                    }
-                }
-                update();
-            }
-            animate();
-        });
-
-        // Add touch feedback to cards
-        document.querySelectorAll('.glass-card').forEach(card => {
-            card.addEventListener('touchstart', () => {
-                card.style.transform = 'scale(0.98)';
-                card.style.transition = 'transform 0.1s ease';
-            });
-            card.addEventListener('touchend', () => {
-                card.style.transform = 'scale(1)';
-            });
-        });
-    </script>
-</body></html>

README.md

@@ -1,114 +1,398 @@
-# EcoTrack AI - Full-Spectrum Carbon Intelligence Platform
+---
+title: EcoTracker II
+emoji: 📉
+colorFrom: yellow
+colorTo: purple
+sdk: docker
+pinned: false
+short_description: Backend for the event Prompt Wars
+---
+
+# EcoTrack AI — Advanced Carbon Footprint Awareness Platform
+
+EcoTrack AI is a state-of-the-art web application designed to help users measure, understand, and reduce their carbon footprint. Powered by **Groq Cloud AI**, the platform offers a personalized AI sustainability coach, 30-day carbon reduction action plans, interactive "what-if" simulations, and a gamified leaderboard with streaks, points, and badges to drive user engagement.
+
+[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](./LICENSE)
+[![Node.js](https://img.shields.io/badge/Node.js-18%2B-brightgreen)](https://nodejs.org/)
+[![Database: Firestore](https://img.shields.io/badge/Database-Firebase_Firestore-orange.svg)](https://firebase.google.com/)
+[![AI: Groq Cloud](https://img.shields.io/badge/AI-Groq_Llama3-blueviolet)](https://groq.com/)
+[![Tests: Passing](https://img.shields.io/badge/Tests-167_Passing-brightgreen)](#testing-and-verification)
+
+**Live Demo:** [eco-tracker-ii-123.vercel.app](https://eco-tracker-ii-123.vercel.app/)
+
+---
+
+## Table of Contents
+
+1. [Architecture & Database Transition](#architecture--database-transition)
+2. [Groq AI Integration & Usage](#groq-ai-integration--usage)
+3. [Scientific Calculation & Emission Factors](#scientific-calculation--emission-factors)
+4. [Scoring & Benchmark Interpolation](#scoring--benchmark-interpolation)
+5. [Gamification & Achievements System](#gamification--achievements-system)
+6. [Tech Stack](#tech-stack)
+7. [Security Hardening Techniques](#security-hardening-techniques)
+8. [Folder Structure](#folder-structure)
+9. [Page Use Cases & Features](#page-use-cases--features)
+10. [Installation & Setup](#installation--setup)
+11. [Testing and Verification](#testing-and-verification)
+
+---
+
+## Architecture & Database Transition
+
+Originally built on top of a relational schema using Prisma and PostgreSQL, EcoTrack AI was transitioned to **Firebase Firestore** to align with modern serverless and document-based practices.
+
+```
+┌─────────────────────────────────┐                 ┌───────────────────────────────┐
+│       React 18 Frontend         │ ──────────────► │       Express 4 Backend       │
+│   (Vite, Tailwind, Recharts)    │    HTTPS/REST   │   (Helmet, Rate-Limiting, Zod)│
+└─────────────────────────────────┘                 └──────────────┬────────────────┘
+                                                                   │
+                                                     firebase-admin│  groq-sdk
+                                                                   ▼  ▼
+                                                    ┌───────────────────────────────┐
+                                                    │  Firebase Firestore Database  │
+                                                    │  (Users, Assessments, Streaks)│
+                                                    └───────────────────────────────┘
+```
+
+### Why Firebase Firestore?
+
+- **Document-Centric Model**: Carbon assessments and simulation states are inherently tree-like, hierarchical data. A document-based NoSQL database allows storing user metrics and footprints as direct, rich documents rather than performing heavy relational joins.
+- **Schema Flexibility**: Enables future expansion of assessment categories (e.g., adding home heating types or detailed food options) without writing complex SQL schema migrations.
+- **Serverless Scale**: Low-latency reads and writes that scale automatically, providing instantaneous calculations and ranking checks.
+- **Data Schema Details**:
+  - `users`: Stores user credentials, streaks, ranks, points, and earned badges.
+  - `assessments`: Flat collection storing historical carbon footprints indexed by `userId`.
+  - `simulations`: Captures user configuration states for what-if scenarios.
+
+### Hermetic Test Mocking
+
+To ensure integration and unit tests run instantly and are completely insulated from external database network states, the backend uses a custom in-memory Firestore engine in [`firebaseClient.js`](./backend/src/utils/firebaseClient.js).
+
+- When running in `test` environment, the Firebase Admin connection is bypassed.
+- A robust, virtual mock store runs in memory to manage users and assessments, executing 160+ tests in under 5 seconds with zero server dependencies.
+
+### Version 1 to Version 2 Database Migration
+
+To preserve history, the backend includes a migration utility in [`migrateDb.js`](./backend/src/utils/migrateDb.js). This script reads historical footprint documents from the V1 subcollection structure (`users/{userId}/history`) and migrates them into flat V2 collections. It parses legacy breakdown objects (extracting transport, electricity, food, waste, and shopping emissions) and populates modern metadata variables automatically.
+
+---
 
-**Live Deployment (Vercel):** [https://eco-tracker-virid.vercel.app/](https://eco-tracker-virid.vercel.app/)
+## Groq AI Integration & Usage
 
-EcoTrack AI is a modern, responsive, and secure carbon footprint intelligence platform designed for individuals and enterprises to understand, track, and reduce their environmental impact. Built with React Native (Expo) and Node.js, the platform offers dynamic calculation metrics, personalized AI coaching, green gamification leaderboards, and an offset marketplace.
+EcoTrack AI integrates the **Groq SDK** to provide lightning-fast, context-aware artificial intelligence. Powered by high-throughput Llama-3 inference models, the AI operates across five main areas:
+
+1. **AI Sustainability Coach (`POST /api/ai/chat`)**
+   - An interactive chat assistant where users can ask for eco-friendly recommendations.
+   - Provides immediate, real-world advice based on the user's specific carbon footprint breakdown.
+2. **30-Day Net-Zero Action Plan (`POST /api/ai/plan`)**
+   - Generates a step-by-step 30-day timeline designed to lower the user's carbon footprint.
+   - Customizes actions depending on whether the user's highest emissions originate from Transport, Energy, Food, or Shopping.
+3. **Narrative Score Analysis (`POST /api/ai/score`)**
+   - Looks at a user's numerical sustainability score and writes a narrative assessment explaining what their rating signifies.
+4. **Daily Eco Micro-Tip (`GET /api/ai/tip`)**
+   - Generates a daily tip centered on sustainable living.
+   - Caches tips on the server for 24 hours to minimize API hits.
+5. **Narrative Comparison Analysis (`POST /api/ai/compare`)**
+   - Explains how the user's footprint compares to global averages and the Paris Agreement target (2,000 kg CO₂e/yr).
 
 ---
 
-## 🌟 Key Features
+## Scientific Calculation & Emission Factors
+
+EcoTrack AI calculates carbon footprints utilizing annualized kilograms of carbon dioxide equivalent ($kg\text{ CO}_2\text{e/year}$) based on coefficients compiled from peer-reviewed databases (including IPCC AR6, US EPA, and UK BEIS/DEFRA 2023).
+
+### Reference Emission Factors
+
+| Source Category | Asset/Habit Type  | Carbon Coefficient | Unit                                                               |
+| :-------------- | :---------------- | :----------------- | :----------------------------------------------------------------- |
+| **Transport**   | Petrol Car        | `0.21`             | $kg\text{ CO}_2\text{ / km}$                                       |
+|                 | Diesel Car        | `0.17`             | $kg\text{ CO}_2\text{ / km}$                                       |
+|                 | Hybrid Car        | `0.105`            | $kg\text{ CO}_2\text{ / km}$                                       |
+|                 | Electric Car      | `0.047`            | $kg\text{ CO}_2\text{ / km}$                                       |
+|                 | Public Transport  | `0.089`            | $kg\text{ CO}_2\text{ / km}$ (Bus average)                         |
+|                 | Train             | `0.041`            | $kg\text{ CO}_2\text{ / km}$                                       |
+|                 | Short-Haul Flight | `255.0`            | $kg\text{ CO}_2\text{ / return flight } (<3\text{ hrs})$           |
+|                 | Long-Haul Flight  | `1620.0`           | $kg\text{ CO}_2\text{ / return flight } (>3\text{ hrs})$           |
+| **Energy**      | Grid Electricity  | `0.233`            | $kg\text{ CO}_2\text{ / kWh}$ (UK Grid 2023)                       |
+| **Food & Diet** | Heavy Meat Diet   | `3300.0`           | $kg\text{ CO}_2\text{ / year}$                                     |
+|                 | Mixed Diet        | `2500.0`           | $kg\text{ CO}_2\text{ / year}$                                     |
+|                 | Vegetarian Diet   | `1700.0`           | $kg\text{ CO}_2\text{ / year}$                                     |
+|                 | Vegan Diet        | `1500.0`           | $kg\text{ CO}_2\text{ / year}$                                     |
+| **Shopping**    | Clothing Item     | `33.0`             | $kg\text{ CO}_2\text{ / item}$ (Manufacturing + Transport)         |
+|                 | Electronic Device | `300.0`            | $kg\text{ CO}_2\text{ / device}$ (Lifecycle manufacturing average) |
 
-* **Full-Spectrum Carbon Calculator**: Calculates detailed monthly and yearly emissions across transportation, electricity usage, dietary habits, plastic waste, and shopping frequency.
-* **AI Sustainability Coach**: Generates real-time, personalized action plans to reduce your footprint based on category breakdown spikes.
-* **Missions & Leaderboard**: Complete green challenges (e.g., *No-Car Week*, *Vegan Weekend*), earn points, unlock levels, and rank on a global user leaderboard.
-* **Offset Marketplace**: Sponsor high-impact carbon offset initiatives (Amazon reforestation, wind infrastructure, coastal mangroves, solar panel programs) directly from your profile.
-* **Net-Zero Projects Ledger**: Launch and track timeline progress for custom carbon reduction projects (e.g., office lighting upgrades).
-* **Cross-Platform Accessibility**: Full screen-reader accessibility integration (`accessible`, roles, labels, hints) across all mobile and web layouts.
-* **Bank-Grade Security**: Shielded by `helmet` security headers, strict IP rate limit controls, and input validation/XSS sanitization.
+### Formula Systems
+
+- **Transport Emissions**:
+  $$\text{Emissions}_{\text{transport}} = (\text{Daily Car Km} \times \text{Factor}_{\text{car}} \times 365) + (\text{Public Transport Km/Week} \times 52 \times 0.089) + (\text{Short Flights} \times 255) + (\text{Long Flights} \times 1620)$$
+- **Home Energy Emissions** (incorporating renewable energy tariff credits):
+  $$\text{Emissions}_{\text{energy}} = \text{Monthly Electricity (kWh)} \times 12 \times 0.233 \times \left(1 - \frac{\text{Renewable \%}}{100}\right)$$
+- **Shopping Emissions**:
+  $$\text{Emissions}_{\text{shopping}} = (\text{Clothing/Year} \times 33) + (\text{Electronics/Year} \times 300)$$
 
 ---
 
-## 🛠️ Tech Stack & Architecture
+## Scoring & Benchmark Interpolation
+
+Sustainability scores range from **0 to 100** based on the total annualized carbon footprint. Instead of flat rating brackets, EcoTrack AI applies **piecewise linear interpolation** across five primary benchmark reference points:
+
+- **Paris Agreement 2050 Target**: $2,000\text{ kg CO}_2\text{e/year}$ (Score: **100**)
+- **Excellent Threshold**: $3,000\text{ kg CO}_2\text{e/year}$ (Score: **90**)
+- **Good Threshold**: $5,000\text{ kg CO}_2\text{e/year}$ (Score: **70**)
+- **Moderate Threshold**: $7,500\text{ kg CO}_2\text{e/year}$ (Score: **50**)
+- **High/Poor Threshold**: $12,000\text{ kg CO}_2\text{e/year}$ (Score: **0**)
+
+### Score Interpolation Logic
+
+- **If emissions $\le 2000$**: Score is **100**.
+- **If $2000 < \text{emissions} \le 3000$**:
+  $$\text{Score} = 90 + \left(\frac{3000 - \text{emissions}}{3000 - 2000}\right) \times 10$$
+- **If $3000 < \text{emissions} \le 5000$**:
+  $$\text{Score} = 70 + \left(\frac{5000 - \text{emissions}}{5000 - 3000}\right) \times 20$$
+- **If $5000 < \text{emissions} \le 7500$**:
+  $$\text{Score} = 50 + \left(\frac{7500 - \text{emissions}}{7500 - 5000}\right) \times 20$$
+- **If $7500 < \text{emissions} < 12000$**:
+  $$\text{Score} = \left(\frac{12000 - \text{emissions}}{12000 - 7500}\right) \times 50$$
+- **If emissions $\ge 12000$**: Score is **0**.
+
+---
+
+## Gamification & Achievements System
+
+EcoTrack AI builds tracking habits by rewarding sustainable choices through a points, streaks, badges, and rank titles system.
 
-### Frontend (Mobile & Web)
-* **Framework**: React Native with Expo (Web + iOS/Android support).
-* **Styling**: Vanilla React Native StyleSheet with custom HSL/RGB glassmorphism dark-theme palette.
-* **Graphics**: Svg vector paths (`react-native-svg`) for charts and telemetry.
+### Points Allocation
 
-### Backend (API Server)
-* **Runtime**: Node.js & Express.
-* **Database**: Google Cloud Firebase Firestore with a built-in JSON file mock fallback database (`database.json`) for zero-config offline developer setup.
-* **Testing**: Automated integration testing suite via Jest & Supertest.
-* **Security**: Helmet, Express-Rate-Limit, Regex validations, and parameter sanitization.
+- **Assessment Submission**: Base reward of **$100\text{ points}$** per unique assessment log.
+- **Streak Milestone Bonuses**:
+  - **3-Day Streak**: Adds a **$+50\text{ points}$** bonus.
+  - **7-Day Streak**: Adds a **$+250\text{ points}$** bonus.
+
+### Ranks & Levels
+
+Based on total points accumulated, users level up through ranks:
+
+| Points Required   | Rank Title                          |
+| :---------------- | :---------------------------------- |
+| `0 - 999`         | **Eco Novice** (Baseline tier)      |
+| `1,000 - 2,999`   | **Green Sprout**                    |
+| `3,000 - 5,999`   | **Carbon Reducer**                  |
+| `6,000 - 9,999`   | **Nature Enthusiast**               |
+| `10,000 - 14,999` | **Ocean Guardian**                  |
+| `15,000 - 24,999` | **Climate Champion**                |
+| `25,000+`         | **Master Guardian** (Ultimate tier) |
+
+### Achievements & Badges
+
+Badges are analyzed during calculation routines and unlocked when meeting the following criteria:
+
+| Badge Image/Title | Criteria for Unlocking                                                                        |
+| :---------------- | :-------------------------------------------------------------------------------------------- |
+| **Tree Planter**  | User reports a `vegan` or `vegetarian` dietType.                                              |
+| **Carbon Ninja**  | User drives `0 km` daily OR drives a `hybrid`/`electric` vehicle OR has `none` for fuel type. |
+| **Zero Waste**    | User buys less than `5` clothes per year AND `0` electronics items per year.                  |
 
 ---
 
-## 🚀 Getting Started
+## Tech Stack
+
+| Layer        | Technologies Used                                                  |
+| ------------ | ------------------------------------------------------------------ |
+| **Core**     | HTML5, Vanilla CSS, Javascript (ES Modules)                        |
+| **Frontend** | React 18, Vite 5, Tailwind CSS 3, Recharts, Axios, React Router v6 |
+| **Backend**  | Node.js 18+, Express 4, Helmet, Zod, Groq SDK, Firebase Admin SDK  |
+| **Database** | Firebase Firestore (Real-time Document Store)                      |
+| **Testing**  | Vitest, JSDOM, React Testing Library, Supertest                    |
 
-### 1. Prerequisites
-* [Node.js](https://nodejs.org/) (v16 or higher)
-* [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/)
+---
+
+## Security Hardening Techniques
+
+EcoTrack AI implements a multi-layer defense-in-depth security model:
+
+- **Strict Content Security Policy (CSP)**: Managed through Helmet.js middleware, restriction rules block execution of inline script payloads. Approved connect boundaries (`connectSrc`) are configured for local development and production Vercel apps.
+- **Rate Limiting**: Custom rate limits are established via `express-rate-limit`:
+  - **Default API Limit**: `100 requests / 15 minutes` across the app.
+  - **User Registration (`/api/users`)**: Restricted to `15 registrations / hour` to prevent identity spoofing and sybil attacks.
+  - **Assessment Submissions (`/api/assessments`)**: Capped at `30 submissions / hour` to mitigate database flooding.
+- **Input Sanitization**: Built via custom XSS sanitizers (`sanitize.js`) in the backend route controllers. Any user text input (such as sustainability plan goals or coach chat messages) is parsed to strip out HTML tags and characters matching script patterns.
+- **Zod Schema Parsing**: Validates matching data types, structures, and bounds for all API requests. Unrecognized schema keys in requests are rejected immediately.
+- **Safe Key Isolation**: Firebase Service Account keys are read from `firebase-key.json` and are ignored in git commits by `.gitignore`.
+
+---
 
-### 2. Backend Setup
-1. Navigate to the `backend` folder:
+## Folder Structure
+
+```
+carbon/
+├── backend/
+│   ├── src/
+│   │   ├── controllers/   # Express route controllers (User, Assessment, AI, etc.)
+│   │   ├── middleware/    # Rate limiters, error handling schemas
+│   │   ├── routes/        # API route definitions (ai.js, users.js, assessments.js, etc.)
+│   │   ├── services/      # Business logic (scoring, carbon math, Groq AI coach)
+│   │   ├── tests/         # Unit and integration test suites
+│   │   └── utils/         # firebaseClient, logger, sanitize helpers, migrateDb script
+│   ├── .env.example
+│   ├── firebase-key.json  # Git-ignored Firebase credential file
+│   └── package.json
+├── frontend/
+│   ├── src/
+│   │   ├── components/    # Reusable UI widgets, charts, and layout components
+│   │   ├── hooks/         # Custom React hooks (useUser, useAssessment)
+│   │   ├── pages/         # Page components (Calculator, Dashboard, Coach, Leaderboard)
+│   │   ├── services/      # API axios instances
+│   │   ├── tests/         # Frontend component and integration tests
+│   │   └── utils/         # Debouncing, formatting, and cache handlers
+│   ├── .env.example
+│   └── package.json
+├── .gitignore
+├── package.json           # Monorepo management
+└── README.md
+```
+
+---
+
+## Page Use Cases & Features
+
+### 1. Carbon Footprint Calculator
+
+- **Use Case**: Allows users to input daily habits across 4 distinct categories (Transport, Energy, Food, Shopping).
+- **Details**: Dynamic progress indicators, validation feedback, and instant emission calculations (annualized kg CO₂e).
+
+### 2. Interactive Dashboard
+
+- **Use Case**: Visual representation of the carbon footprint.
+- **Details**: Powered by Recharts. Renders category emission pie charts, progress over time, and comparative benchmark sliders (comparing user footprint to global and Paris Agreement targets).
+
+### 3. What-If Simulation Widget
+
+- **Use Case**: Lets users simulate changes in their habits (e.g. eating less meat, walking more, reducing electricity usage).
+- **Details**: Provides instant, dynamic reductions feedback showing how lifestyle changes impact their overall carbon footprint in real-time.
+
+### 4. AI Coach Chat & Planner
+
+- **Use Case**: Direct interactive messaging with the sustainability coach.
+- **Details**: Users get custom 30-day timelines, daily tips, and structured advice for lowering their footprints.
+
+### 5. Gamification & Leaderboards
+
+- **Use Case**: Encourages continuous tracking and eco-friendly competition.
+- **Details**: Shows user streaks, points earned for low footprints, ranks (e.g., "Eco Warrior"), and achievement badges (e.g., "Renewable Pioneer").
+
+---
+
+## Installation & Setup
+
+### Prerequisites
+
+- **Node.js** ≥ 18.0.0
+- **npm** ≥ 9
+- A **Firebase Firestore** project database (Free tier)
+
+### 1. Configure the Backend
+
+1. Navigate to `/backend` and create a `.env` file from the example:
    ```bash
    cd backend
+   cp .env.example .env
    ```
-2. Install dependencies:
-   ```bash
-   npm install
-   ```
-3. *(Optional)* Setup Cloud Firestore:
-   * Generate a private key JSON from the Firebase Console (Project Settings -> Service Accounts).
-   * Place the file in `backend/firebase-key.json`.
-   * *If no key is added, EcoTrack will automatically fallback to the local mock database file.*
-4. Start the API server in developer mode:
-   ```bash
-   npm run dev
-   ```
-   The backend server runs locally on **`http://localhost:5000`** (or port `7860` if configured).
+2. Populate the `.env` file:
+   - Add your `GROQ_API_KEY` (obtained from [console.groq.com](https://console.groq.com)).
+3. Save your Firebase Service Account JSON credentials file as `firebase-key.json` in the `/backend` folder. _(Alternatively, stringify the JSON key and paste it as the `FIREBASE_SERVICE_ACCOUNT` value in your `.env`)_.
+
+### 2. Configure the Frontend
 
-### 3. Frontend Setup
-1. Navigate back to the root folder:
+1. Navigate to `/frontend` and create a `.env` file:
    ```bash
-   cd ..
+   cd ../frontend
+   cp .env.example .env
    ```
-2. Install dependencies:
-   ```bash
-   npm install
+2. By default, it points to local development:
+   ```env
+   VITE_API_URL=http://localhost:3001/api
    ```
-3. Set your environment variables:
-   * Create a `.env` or configuration mapping setting `EXPO_PUBLIC_API_BASE` pointing to your backend IP (e.g. `http://localhost:5000` for local run).
-4. Run the Expo development web environment:
-   ```bash
-   npx expo start --web
-   ```
-   The app will compile and launch on **`http://localhost:8081`**.
 
----
+### 3. Start the Development Servers
+
+In the root directory, install all dependencies:
 
-## 🧪 Testing
+```bash
+# Root directory
+npm install
+```
+
+Start the backend API server:
+
+```bash
+# In backend/
+npm run dev
+```
 
-The backend includes a comprehensive automated suite to test calculations, database inputs, validations, and leaderboard sorting.
+Start the React development server:
 
-Run the tests inside the `backend` directory:
 ```bash
-npm run test
+# In frontend/
+npm run dev
 ```
 
-Testing utilizes `database.test.json` to prevent polluting development environment databases.
+Open **http://localhost:5173** to run the application locally.
 
 ---
 
-## 📦 Deployment Guide
+## Deployment (Free Tier Hosting)
 
-### Backend (Hugging Face Spaces)
-The backend is packaged inside a custom Docker container optimized for port 7860:
-1. Define space env variables:
-   * `FIREBASE_SERVICE_ACCOUNT`: Copy the raw JSON text from your service account key.
-2. Build and trigger:
-   * Use the provided `backend/Dockerfile` to compile the image. Hugging Face Spaces will automatically run a health check on `/` and mark the container online.
+The platform is designed to be hosted for free using a split server/client architecture:
 
-### Frontend (Vercel / Expo Web)
-Deploy the built web bundle using Vercel overrides:
-* **Framework Preset**: Create React App (or Other)
-* **Build Command**: `npx expo export`
-* **Output Directory**: `dist`
-* **Environment Variable**: `EXPO_PUBLIC_API_BASE` pointing to your deployed Hugging Face Space URL.
+### 1. Backend: Hugging Face Spaces (Docker)
+
+The Node.js/Express backend runs in a free Hugging Face Space using Docker.
+
+- **Hardware:** CPU Basic (Free Tier - 2 vCPU · 16 GB).
+- **Environment Variables & Secrets:**
+  - `PORT`: `7860` (assigned automatically by Hugging Face)
+  - `GROQ_API_KEY`: Your Groq Cloud API key.
+  - `CORS_ORIGIN`: Your deployed Vercel frontend URL (e.g., `https://eco-tracker-ii-123.vercel.app`).
+  - `FIREBASE_SERVICE_ACCOUNT`: The stringified JSON content of your `firebase-key.json` file.
+- **Dockerfile:** Create this at the root directory:
+  ```dockerfile
+  FROM node:18-alpine
+  WORKDIR /app
+  COPY package*.json ./
+  COPY backend/package*.json ./backend/
+  RUN npm install && npm install --prefix backend
+  COPY backend/ ./backend/
+  ENV NODE_ENV=production
+  ENV PORT=7860
+  EXPOSE 7860
+  WORKDIR /app/backend
+  CMD ["npm", "start"]
+  ```
+
+### 2. Frontend: Vercel (Static Web Hosting)
+
+The React/Vite client is hosted on Vercel (Live at: `https://eco-tracker-ii-123.vercel.app`).
+
+- **Root Directory:** `frontend`
+- **Environment Variables:**
+  - `VITE_API_URL`: Your Hugging Face Space endpoint (e.g., `https://akash-dragon-ecotracker-ii.hf.space/api`).
 
 ---
 
-## 🔒 Security Policy
-* **Rate Limits**: Active throttle rules protect endpoints from DoS and script attacks.
-* **Helmet Headers**: Blocks iframe clickjacking, MIME injection, and restricts unsafe browser scripts.
-* **Input Validation**: Strictly inspects email domains and filters strings to protect data streams.
+## Testing and Verification
+
+To run tests across both the backend and frontend, run the following command in the root folder:
+
+```bash
+# From the project root folder
+npm test
+```
+
+### Coverage
+
+- **Backend**: Includes tests for emissions calculation formulas, rate limits, Zod schema validation, and Express routes.
+- **Frontend**: Includes tests for React hooks, cached calculations, custom debouncing utility, HTML sanitization, and the multi-step calculator workflow.
+
+# EcoTracker-II

SECURITY.md

@@ -0,0 +1,52 @@
+# Security Policy — EcoGuide AI
+
+## Supported Versions
+
+Only the current version of EcoGuide AI is actively supported with security updates.
+
+| Version | Supported |
+| ------- | --------- |
+| 1.0.x   | Yes       |
+| < 1.0   | No        |
+
+## Reporting a Vulnerability
+
+We take the security of EcoGuide AI seriously. If you find any security vulnerabilities, please do **not** report them via public GitHub issues. Instead, report them privately by emailing:
+
+**[security@ecoguide.ai](mailto:security@ecoguide.ai)**
+
+We will acknowledge receipt of your report within 48 hours and provide a timeline for mitigation.
+
+---
+
+## Threat Model & Security Architecture
+
+EcoGuide AI has been designed from the ground up with defensive security best practices to protect user data and maintain service availability.
+
+### 1. Data Minimization & Privacy
+
+- **Anonymous Sessions**: EcoGuide AI does **not** collect, process, or store any Personally Identifiable Information (PII) such as names, passwords, or emails.
+- **UUID-Only Identifiers**: Users are identified solely by randomly generated client-side UUIDs (`crypto.randomUUID()`) saved in the browser's local storage.
+- **Synthetic Email Generation**: The backend generates dummy emails (`${uuid}@ecoguide.ai`) purely to satisfy database unique constraints for relational user models. These are never used for communications or authentication.
+
+### 2. SQL Injection Prevention
+
+- **Prisma ORM Parameterization**: All database interactions use Prisma Client. Prisma parameterized query builders ensure input values are never interpolated directly into SQL queries, neutralizing SQL injection vectors by design.
+
+### 3. API Security & Over-Posting Protections
+
+- **Input Validation (Zod)**: All endpoints validate incoming request payloads against strict Zod schemas.
+- **Unknown-Key Guard**: The assessment creation route rejects any request containing extra, undeclared JSON body keys. This prevents over-posting attacks where malicious users try to inject variables like roles or metadata.
+- **Strict Size Limits**: Express request body parser sizes are limited to `100kb` to prevent memory exhaustion and Denial of Service (DoS) attacks via oversized payloads.
+
+### 4. Client-Side Security (XSS / CSRF)
+
+- **Input Sanitization**: Client-side inputs are programmatically sanitized and validated prior to transmission, stripping HTML elements and script tags.
+- **DOM Injection Avoidance**: The frontend codebase avoids the use of `dangerouslySetInnerHTML`. Text content is rendered using secure DOM elements.
+- **Strict CORS Policy**: Cross-Origin Resource Sharing is locked down to standard trusted domains, local developers, and subdomains of the hosting environment (`*.vercel.app`).
+- **Content Security Policy (CSP)**: Secure CSP rules restrict script sources to `'self'`. Dynamic CSS styling uses `'unsafe-inline'` exclusively to accommodate Vite dev server hot reloading and Tailwind CSS class injection, with comments detailing this exception.
+
+### 5. Rate Limiting & Denial of Service
+
+- **IP-based Limits**: All `/api/` endpoints are rate-limited to 100 requests per 15 minutes per IP address using `express-rate-limit` to prevent brute force attacks and resource starvation.
+- **Reverse Proxy Setup**: `trust proxy` is enabled to securely capture the correct client IP address behind API hosting gateways.

Web-design/carbon_calculator_desktop/code.html

@@ -1,424 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-<title>EcoTrack AI | Carbon Calculator</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<style>
-        @import url('https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap');
-        
-        body {
-            font-family: 'Geist', sans-serif;
-            overflow-x: hidden;
-        }
-
-        .glass-card {
-            background: rgba(30, 41, 59, 0.5);
-            backdrop-filter: blur(12px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05);
-        }
-
-        .emerald-glow {
-            box-shadow: 0 0 15px rgba(78, 222, 163, 0.3);
-        }
-
-        .custom-slider::-webkit-slider-thumb {
-            -webkit-appearance: none;
-            appearance: none;
-            width: 18px;
-            height: 18px;
-            background: #4edea3;
-            cursor: pointer;
-            border-radius: 50%;
-            border: 2px solid #0b1326;
-            box-shadow: 0 0 10px rgba(78, 222, 163, 0.5);
-        }
-
-        .step-active {
-            @apply border-primary text-primary;
-        }
-
-        .step-inactive {
-            @apply border-white/10 text-on-surface-variant;
-        }
-
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-        }
-    </style>
-<script id="tailwind-config">
-        tailwind.config = {
-          darkMode: "class",
-          theme: {
-            extend: {
-              "colors": {
-                      "tertiary-container": "#e29100",
-                      "surface": "#0b1326",
-                      "on-secondary": "#00344d",
-                      "on-primary-fixed-variant": "#005236",
-                      "primary-fixed": "#6ffbbe",
-                      "on-surface": "#dae2fd",
-                      "surface-container-lowest": "#060e20",
-                      "on-tertiary-fixed-variant": "#653e00",
-                      "on-secondary-fixed": "#001e2f",
-                      "error-container": "#93000a",
-                      "background": "#0b1326",
-                      "surface-tint": "#4edea3",
-                      "outline": "#86948a",
-                      "primary-container": "#10b981",
-                      "outline-variant": "#3c4a42",
-                      "surface-dim": "#0b1326",
-                      "secondary-container": "#00a2e6",
-                      "surface-container-highest": "#2d3449",
-                      "tertiary-fixed": "#ffddb8",
-                      "surface-container-low": "#131b2e",
-                      "surface-container": "#171f33",
-                      "on-secondary-fixed-variant": "#004c6e",
-                      "on-background": "#dae2fd",
-                      "primary": "#4edea3",
-                      "inverse-surface": "#dae2fd",
-                      "secondary-fixed-dim": "#89ceff",
-                      "surface-container-high": "#222a3d",
-                      "on-error-container": "#ffdad6",
-                      "secondary-fixed": "#c9e6ff",
-                      "on-secondary-container": "#00344e",
-                      "on-primary-container": "#00422b",
-                      "on-primary": "#003824",
-                      "tertiary-fixed-dim": "#ffb95f",
-                      "on-surface-variant": "#bbcabf",
-                      "on-tertiary-container": "#523200",
-                      "primary-fixed-dim": "#4edea3",
-                      "on-tertiary": "#472a00",
-                      "secondary": "#89ceff",
-                      "on-error": "#690005",
-                      "inverse-primary": "#006c49",
-                      "on-tertiary-fixed": "#2a1700",
-                      "on-primary-fixed": "#002113",
-                      "inverse-on-surface": "#283044",
-                      "error": "#ffb4ab",
-                      "tertiary": "#ffb95f",
-                      "surface-bright": "#31394d",
-                      "surface-variant": "#2d3449"
-              },
-              "borderRadius": {
-                      "DEFAULT": "0.25rem",
-                      "lg": "0.5rem",
-                      "xl": "0.75rem",
-                      "full": "9999px"
-              },
-              "spacing": {
-                      "xl": "4rem",
-                      "unit": "4px",
-                      "gutter": "1.5rem",
-                      "margin": "2rem",
-                      "sm": "1rem",
-                      "xs": "0.5rem",
-                      "md": "1.5rem",
-                      "lg": "2.5rem"
-              },
-              "fontFamily": {
-                      "display-lg": ["Geist"],
-                      "label-md": ["Geist"],
-                      "headline-md": ["Geist"],
-                      "body-md": ["Geist"],
-                      "display-lg-mobile": ["Geist"],
-                      "caption": ["Geist"],
-                      "title-sm": ["Geist"]
-              },
-              "fontSize": {
-                      "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                      "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}],
-                      "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                      "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                      "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                      "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                      "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}]
-              }
-            },
-          },
-        }
-      </script>
-</head>
-<body class="bg-surface text-on-surface min-h-screen flex">
-<!-- Background Shader -->
-
-<!-- SideNavBar (Authority: JSON) -->
-<aside class="fixed left-0 top-0 h-full flex flex-col pt-20 pb-margin px-sm bg-surface-container/50 backdrop-blur-xl border-r border-white/10 shadow-lg w-64 z-40">
-<div class="mb-lg px-sm">
-<h1 class="font-headline-md text-headline-md font-bold text-primary">EcoTrack AI</h1>
-<p class="font-label-md text-label-md text-on-surface-variant">Precision Sustainability</p>
-</div>
-<nav class="flex-1 space-y-xs">
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all cursor-pointer" href="#">
-<span class="material-symbols-outlined">dashboard</span>
-<span class="font-label-md text-label-md">Dashboard</span>
-</a>
-<a class="flex items-center gap-xs bg-primary/10 text-primary rounded-lg px-sm py-xs hover:bg-white/5 hover:text-primary transition-all cursor-pointer" href="#">
-<span class="material-symbols-outlined">eco</span>
-<span class="font-label-md text-label-md">Projects</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all cursor-pointer" href="#">
-<span class="material-symbols-outlined">bar_chart</span>
-<span class="font-label-md text-label-md">Analytics</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all cursor-pointer" href="#">
-<span class="material-symbols-outlined">storefront</span>
-<span class="font-label-md text-label-md">Marketplace</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all cursor-pointer" href="#">
-<span class="material-symbols-outlined">description</span>
-<span class="font-label-md text-label-md">Reports</span>
-</a>
-</nav>
-<div class="mt-auto px-sm pt-md border-t border-white/5">
-<button class="w-full py-xs px-sm bg-primary text-on-primary font-label-md text-label-md rounded-lg emerald-glow hover:brightness-110 transition-all">
-                Upgrade to Pro
-            </button>
-</div>
-</aside>
-<!-- Main Content Canvas -->
-<main class="ml-64 flex-1 p-gutter min-h-screen relative flex gap-gutter overflow-hidden">
-<!-- Wizard Content Area -->
-<div class="flex-1 max-w-4xl space-y-md">
-<!-- Step Progress Indicator -->
-<header class="mb-lg pt-12">
-<h2 class="font-display-lg text-display-lg text-primary mb-xs">Carbon Calculator</h2>
-<div class="flex items-center gap-sm mt-md">
-<div class="flex items-center gap-xs group">
-<div class="w-8 h-8 rounded-full border-2 flex items-center justify-center font-bold text-caption border-primary text-primary">1</div>
-<span class="font-label-md text-label-md text-primary">Housing</span>
-</div>
-<div class="w-12 h-px bg-white/10"></div>
-<div class="flex items-center gap-xs">
-<div class="w-8 h-8 rounded-full border-2 flex items-center justify-center font-bold text-caption border-primary bg-primary text-on-primary">2</div>
-<span class="font-label-md text-label-md text-on-surface">Transportation</span>
-</div>
-<div class="w-12 h-px bg-white/10"></div>
-<div class="flex items-center gap-xs">
-<div class="w-8 h-8 rounded-full border-2 flex items-center justify-center font-bold text-caption border-white/10 text-on-surface-variant">3</div>
-<span class="font-label-md text-label-md text-on-surface-variant">Diet</span>
-</div>
-<div class="w-12 h-px bg-white/10"></div>
-<div class="flex items-center gap-xs">
-<div class="w-8 h-8 rounded-full border-2 flex items-center justify-center font-bold text-caption border-white/10 text-on-surface-variant">4</div>
-<span class="font-label-md text-label-md text-on-surface-variant">Results</span>
-</div>
-</div>
-</header>
-<!-- Main Form Card -->
-<section class="glass-card rounded-xl p-lg space-y-lg relative overflow-hidden">
-<div class="absolute top-0 left-0 w-1 h-full bg-gradient-to-b from-primary to-secondary"></div>
-<div class="space-y-xs">
-<h3 class="font-headline-md text-headline-md text-on-surface">Your Transit Profile</h3>
-<p class="font-body-md text-body-md text-on-surface-variant">How do you move through the world? Select your primary modes of travel.</p>
-</div>
-<!-- Transport Selection Grid -->
-<div class="grid grid-cols-2 md:grid-cols-4 gap-sm">
-<!-- Car -->
-<div class="glass-card p-md rounded-lg cursor-pointer border-primary bg-primary/5 transition-all group active:scale-95 border" onclick="toggleSelect(this)">
-<div class="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-sm group-hover:bg-primary/20 transition-colors">
-<span class="material-symbols-outlined text-primary" style="font-variation-settings: 'FILL' 1;">directions_car</span>
-</div>
-<span class="block font-title-sm text-title-sm text-on-surface">Car</span>
-<span class="text-caption font-caption text-on-surface-variant">Personal use</span>
-</div>
-<!-- Bus -->
-<div class="glass-card p-md rounded-lg cursor-pointer border-white/10 hover:border-primary/50 transition-all group active:scale-95 border" onclick="toggleSelect(this)">
-<div class="w-12 h-12 rounded-lg bg-surface-container flex items-center justify-center mb-sm group-hover:bg-primary/10 transition-colors">
-<span class="material-symbols-outlined text-on-surface-variant group-hover:text-primary">directions_bus</span>
-</div>
-<span class="block font-title-sm text-title-sm text-on-surface">Bus</span>
-<span class="text-caption font-caption text-on-surface-variant">Public transit</span>
-</div>
-<!-- Bike -->
-<div class="glass-card p-md rounded-lg cursor-pointer border-white/10 hover:border-primary/50 transition-all group active:scale-95 border" onclick="toggleSelect(this)">
-<div class="w-12 h-12 rounded-lg bg-surface-container flex items-center justify-center mb-sm group-hover:bg-primary/10 transition-colors">
-<span class="material-symbols-outlined text-on-surface-variant group-hover:text-primary">directions_bike</span>
-</div>
-<span class="block font-title-sm text-title-sm text-on-surface">Bike</span>
-<span class="text-caption font-caption text-on-surface-variant">Manual/Electric</span>
-</div>
-<!-- Walk -->
-<div class="glass-card p-md rounded-lg cursor-pointer border-white/10 hover:border-primary/50 transition-all group active:scale-95 border" onclick="toggleSelect(this)">
-<div class="w-12 h-12 rounded-lg bg-surface-container flex items-center justify-center mb-sm group-hover:bg-primary/10 transition-colors">
-<span class="material-symbols-outlined text-on-surface-variant group-hover:text-primary">directions_walk</span>
-</div>
-<span class="block font-title-sm text-title-sm text-on-surface">Walk</span>
-<span class="text-caption font-caption text-on-surface-variant">Foot travel</span>
-</div>
-</div>
-<!-- Car Configuration Details -->
-<div class="pt-md border-t border-white/5 space-y-md">
-<div class="grid grid-cols-1 md:grid-cols-2 gap-lg">
-<!-- Distance Slider -->
-<div class="space-y-sm">
-<div class="flex justify-between items-center">
-<label class="font-label-md text-label-md text-on-surface">Weekly Distance (km)</label>
-<span class="text-primary font-bold" id="distance-val">120 km</span>
-</div>
-<input class="w-full h-1 bg-surface-container-highest rounded-lg appearance-none cursor-pointer custom-slider" max="1000" min="0" oninput="updateDistance(this.value)" type="range" value="120"/>
-<div class="flex justify-between font-caption text-caption text-on-surface-variant">
-<span>0 km</span>
-<span>1000 km</span>
-</div>
-</div>
-<!-- Fuel Dropdown -->
-<div class="space-y-sm">
-<label class="font-label-md text-label-md text-on-surface">Fuel or Energy Type</label>
-<div class="relative">
-<select class="w-full bg-surface-container-low border border-white/10 rounded-lg py-sm px-md font-body-md text-body-md text-on-surface focus:outline-none focus:border-secondary transition-colors appearance-none">
-<option value="petrol">Unleaded Petrol</option>
-<option value="diesel">Diesel</option>
-<option value="hybrid">Hybrid (PHEV)</option>
-<option selected="" value="electric">Electric (EV)</option>
-<option value="hydrogen">Hydrogen Fuel Cell</option>
-</select>
-<span class="material-symbols-outlined absolute right-md top-1/2 -translate-y-1/2 pointer-events-none text-on-surface-variant">expand_more</span>
-</div>
-</div>
-</div>
-</div>
-<!-- Navigation Buttons -->
-<div class="flex justify-between items-center pt-lg border-t border-white/5">
-<button class="px-lg py-sm rounded-lg font-label-md text-label-md text-on-surface hover:bg-white/5 transition-all flex items-center gap-xs">
-<span class="material-symbols-outlined text-sm">arrow_back</span>
-                        Back
-                    </button>
-<button class="px-xl py-sm bg-primary text-on-primary rounded-lg font-label-md text-label-md emerald-glow hover:brightness-110 transition-all flex items-center gap-xs">
-                        Continue to Diet
-                        <span class="material-symbols-outlined text-sm">arrow_forward</span>
-</button>
-</div>
-</section>
-<!-- Decorative Visual Section -->
-<div class="grid grid-cols-2 gap-md">
-<div class="glass-card rounded-xl p-md overflow-hidden relative h-40">
-<div class="absolute inset-0 z-0">
-<img class="w-full h-full object-cover opacity-30 grayscale mix-blend-screen" data-alt="A futuristic electric vehicle charging station at dusk, with soft cyan neon lights illuminating the sleek silver car bodies. The environment is clean and modern, representing sustainable urban mobility and high-tech infrastructure with a serene, optimistic atmosphere." src="https://lh3.googleusercontent.com/aida-public/AB6AXuA_v4Oqe2NJdMrpTVvD1C5lj7C6wtbNNmYfDIWjWY2ss72Zgvdqw7E746C0WdPckog-vtcnxLFejOTcr1RQyL867WIX5DQr2sxK7XCgL45FO8Ky2RgX26kB3BZeh7d21Q3qLhm3QjA6l86dac5Xy6a7CMtRYJswJhmyLDvG4obA3_ZrutBtcLfzS9TGaLEwe_-2Lcdcq7KJWKZm0p8z97AzmqOGL-XOQwC6Lsoc3MdkhYWGUmlFDwja8irxFoekQWxIrxL9SASpzVWW"/>
-</div>
-<div class="relative z-10">
-<span class="px-xs py-1 bg-secondary/10 text-secondary border border-secondary/20 rounded-full font-caption text-caption mb-xs inline-block">Eco Tip</span>
-<h4 class="font-title-sm text-title-sm text-on-surface mb-xs">EV Adoption</h4>
-<p class="font-caption text-caption text-on-surface-variant line-clamp-2">Switching to an electric vehicle can reduce your transport footprint by up to 70% in high-renewable grids.</p>
-</div>
-</div>
-<div class="glass-card rounded-xl p-md overflow-hidden relative h-40">
-<div class="absolute inset-0 z-0">
-<img class="w-full h-full object-cover opacity-30 grayscale mix-blend-screen" data-alt="A lush green urban park with modern bicycle paths weaving through mature trees and vibrant flower beds. People are seen commuting on bicycles under a bright, high-key sun, evoking a sense of community health and environmental harmony within a futuristic city landscape." src="https://lh3.googleusercontent.com/aida-public/AB6AXuBU1UimV8bEm_X2Si6vLLhZSgv80rmv_e1qrvoHlo2_Q04YvBa5cpZJfI6uVpGA6TLCr3xJsbemdHC0sHVmRNp1aGuCATut89V_vSIoQb-e0eIaVsd7ADCix5gJEP-hw5wBVLiZsSWfHEOo9hB55gri6XMO36k4vTFt0vREgLpW_MvDq0Dpjm8ed4hOuhWXACMFeEfYVg18fwLcw2ghgyIu0j1-j7st_kgd1Ca6Ps06D0n7yNaGdfo1sGBu4UdzsE3D614d-GGAltRk"/>
-</div>
-<div class="relative z-10">
-<span class="px-xs py-1 bg-primary/10 text-primary border border-primary/20 rounded-full font-caption text-caption mb-xs inline-block">Impact Hub</span>
-<h4 class="font-title-sm text-title-sm text-on-surface mb-xs">Micro-mobility</h4>
-<p class="font-caption text-caption text-on-surface-variant line-clamp-2">Using a bicycle for distances under 5km saves an average of 1.2kg CO2e per trip.</p>
-</div>
-</div>
-</div>
-</div>
-<!-- Right Side Live Estimate Panel -->
-<aside class="w-80 h-[calc(100vh-3rem)] sticky top-gutter flex flex-col gap-gutter">
-<div class="glass-card flex-1 rounded-xl p-lg flex flex-col border-secondary/20">
-<div class="flex items-center gap-xs mb-lg">
-<span class="material-symbols-outlined text-secondary" style="font-variation-settings: 'FILL' 1;">bolt</span>
-<h3 class="font-title-sm text-title-sm text-on-surface">Live Estimate</h3>
-</div>
-<!-- Main Metric -->
-<div class="text-center py-lg border-b border-white/5 mb-lg">
-<span class="font-display-lg text-display-lg text-secondary block" id="co2-value">1.82</span>
-<span class="font-label-md text-label-md text-on-surface-variant uppercase tracking-widest">Tons CO2e / Year</span>
-</div>
-<!-- Comparison Stats -->
-<div class="space-y-md flex-1">
-<div class="space-y-xs">
-<div class="flex justify-between font-caption text-caption text-on-surface-variant">
-<span>Your current impact</span>
-<span class="text-on-surface">1.82t</span>
-</div>
-<div class="w-full h-2 bg-surface-container-highest rounded-full overflow-hidden">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[45%] rounded-full shadow-[0_0_8px_rgba(137,206,255,0.4)]"></div>
-</div>
-<div class="flex justify-between font-caption text-caption text-on-surface-variant">
-<span>Global Avg (4.8t)</span>
-<span class="text-error">Goal (0.5t)</span>
-</div>
-</div>
-<div class="glass-card p-sm rounded-lg border-white/5 space-y-xs bg-white/5">
-<p class="font-caption text-caption text-on-surface-variant">Current Step Delta:</p>
-<div class="flex items-center gap-sm">
-<span class="material-symbols-outlined text-primary text-sm">trending_down</span>
-<span class="font-label-md text-label-md text-primary">-0.42t (Eco Driver)</span>
-</div>
-</div>
-</div>
-<!-- Visual Chart Placeholder -->
-<div class="h-32 bg-surface-container-low rounded-lg relative overflow-hidden group">
-<div class="absolute bottom-0 left-0 w-full h-full flex items-end px-xs gap-1 pb-1">
-<div class="flex-1 bg-primary/20 rounded-t h-[30%] transition-all duration-700 group-hover:h-[45%]"></div>
-<div class="flex-1 bg-primary/40 rounded-t h-[60%] transition-all duration-700 group-hover:h-[80%]"></div>
-<div class="flex-1 bg-primary/30 rounded-t h-[45%] transition-all duration-700 group-hover:h-[55%]"></div>
-<div class="flex-1 bg-secondary/50 rounded-t h-[85%] transition-all duration-700 group-hover:h-[95%]"></div>
-<div class="flex-1 bg-primary/20 rounded-t h-[40%] transition-all duration-700 group-hover:h-[50%]"></div>
-<div class="flex-1 bg-primary/50 rounded-t h-[65%] transition-all duration-700 group-hover:h-[75%]"></div>
-</div>
-</div>
-<div class="mt-lg pt-md border-t border-white/5">
-<p class="font-caption text-caption text-on-surface-variant text-center italic">Calculations updated 2s ago</p>
-</div>
-</div>
-</aside>
-</main>
-<!-- Footer (Authority: JSON) -->
-<footer class="fixed bottom-0 right-0 left-64 py-md px-gutter flex justify-between items-center bg-surface-container-lowest border-t border-white/10 z-40">
-<div class="flex items-center gap-md">
-<span class="font-title-sm text-title-sm text-on-surface">EcoTrack AI</span>
-<span class="font-caption text-caption text-secondary">© 2024 EcoTrack AI. Engineering a Sustainable Future.</span>
-</div>
-<div class="flex gap-md">
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Privacy Policy</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Terms of Service</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Carbon Methodology</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">API Docs</a>
-</div>
-</footer>
-<script>
-        function toggleSelect(el) {
-            const isActive = el.classList.contains('border-primary');
-            const icon = el.querySelector('.material-symbols-outlined');
-            
-            if (isActive) {
-                el.classList.remove('border-primary', 'bg-primary/5');
-                el.classList.add('border-white/10');
-                icon.classList.remove('text-primary');
-                icon.classList.add('text-on-surface-variant');
-                icon.style.fontVariationSettings = "'FILL' 0";
-            } else {
-                el.classList.add('border-primary', 'bg-primary/5');
-                el.classList.remove('border-white/10');
-                icon.classList.add('text-primary');
-                icon.classList.remove('text-on-surface-variant');
-                icon.style.fontVariationSettings = "'FILL' 1";
-            }
-            simulateRealTimeUpdate();
-        }
-
-        function updateDistance(val) {
-            document.getElementById('distance-val').innerText = val + ' km';
-            simulateRealTimeUpdate();
-        }
-
-        function simulateRealTimeUpdate() {
-            const co2El = document.getElementById('co2-value');
-            const current = parseFloat(co2El.innerText);
-            // Just a visual simulation effect
-            co2El.classList.add('scale-110', 'text-white');
-            setTimeout(() => {
-                const noise = (Math.random() * 0.05 - 0.025);
-                co2El.innerText = (current + noise).toFixed(2);
-                co2El.classList.remove('scale-110', 'text-white');
-            }, 200);
-        }
-    </script>
-</body></html>

Web-design/challenges_gamification_desktop/code.html

@@ -1,436 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-<title>EcoTrack AI | Challenges &amp; Gamification</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "tertiary-container": "#e29100",
-                    "surface": "#0b1326",
-                    "on-secondary": "#00344d",
-                    "on-primary-fixed-variant": "#005236",
-                    "primary-fixed": "#6ffbbe",
-                    "on-surface": "#dae2fd",
-                    "surface-container-lowest": "#060e20",
-                    "on-tertiary-fixed-variant": "#653e00",
-                    "on-secondary-fixed": "#001e2f",
-                    "error-container": "#93000a",
-                    "background": "#0b1326",
-                    "surface-tint": "#4edea3",
-                    "outline": "#86948a",
-                    "primary-container": "#10b981",
-                    "outline-variant": "#3c4a42",
-                    "surface-dim": "#0b1326",
-                    "secondary-container": "#00a2e6",
-                    "surface-container-highest": "#2d3449",
-                    "tertiary-fixed": "#ffddb8",
-                    "surface-container-low": "#131b2e",
-                    "surface-container": "#171f33",
-                    "on-secondary-fixed-variant": "#004c6e",
-                    "on-background": "#dae2fd",
-                    "primary": "#4edea3",
-                    "inverse-surface": "#dae2fd",
-                    "secondary-fixed-dim": "#89ceff",
-                    "surface-container-high": "#222a3d",
-                    "on-error-container": "#ffdad6",
-                    "secondary-fixed": "#c9e6ff",
-                    "on-secondary-container": "#00344e",
-                    "on-primary-container": "#00422b",
-                    "on-primary": "#003824",
-                    "tertiary-fixed-dim": "#ffb95f",
-                    "on-surface-variant": "#bbcabf",
-                    "on-tertiary-container": "#523200",
-                    "primary-fixed-dim": "#4edea3",
-                    "on-tertiary": "#472a00",
-                    "secondary": "#89ceff",
-                    "on-error": "#690005",
-                    "inverse-primary": "#006c49",
-                    "on-tertiary-fixed": "#2a1700",
-                    "on-primary-fixed": "#002113",
-                    "inverse-on-surface": "#283044",
-                    "error": "#ffb4ab",
-                    "tertiary": "#ffb95f",
-                    "surface-bright": "#31394d",
-                    "surface-variant": "#2d3449"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "xl": "4rem",
-                    "unit": "4px",
-                    "gutter": "1.5rem",
-                    "margin": "2rem",
-                    "sm": "1rem",
-                    "xs": "0.5rem",
-                    "md": "1.5rem",
-                    "lg": "2.5rem"
-            },
-            "fontFamily": {
-                    "display-lg": ["Geist"],
-                    "label-md": ["Geist"],
-                    "headline-md": ["Geist"],
-                    "body-md": ["Geist"],
-                    "display-lg-mobile": ["Geist"],
-                    "caption": ["Geist"],
-                    "title-sm": ["Geist"]
-            },
-            "fontSize": {
-                    "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}],
-                    "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                    "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                    "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-        body {
-            background-color: #0b1326;
-            color: #dae2fd;
-            font-family: 'Geist', sans-serif;
-            overflow-x: hidden;
-        }
-        .glass-card {
-            background: rgba(23, 31, 51, 0.5);
-            backdrop-filter: blur(12px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05);
-        }
-        .vibrant-emerald-glow {
-            box-shadow: 0 0 15px rgba(78, 222, 163, 0.3);
-        }
-        .custom-scrollbar::-webkit-scrollbar {
-            width: 4px;
-        }
-        .custom-scrollbar::-webkit-scrollbar-track {
-            background: rgba(255, 255, 255, 0.05);
-        }
-        .custom-scrollbar::-webkit-scrollbar-thumb {
-            background: #4edea3;
-            border-radius: 10px;
-        }
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-            vertical-align: middle;
-        }
-    </style>
-</head>
-<body class="flex min-h-screen">
-<!-- Sidebar Navigation -->
-<aside class="fixed left-0 top-0 h-full flex flex-col pt-20 pb-margin px-sm bg-surface-container/50 backdrop-blur-xl border-r border-white/10 shadow-lg w-64 z-40">
-<div class="mb-lg px-sm">
-<div class="flex items-center gap-xs">
-<span class="material-symbols-outlined text-primary text-headline-md">eco</span>
-<span class="font-headline-md text-headline-md font-bold text-primary">EcoTrack AI</span>
-</div>
-<p class="font-label-md text-label-md text-on-surface-variant opacity-70">Precision Sustainability</p>
-</div>
-<nav class="flex flex-col gap-xs flex-grow">
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all hover:translate-x-1" href="#">
-<span class="material-symbols-outlined" data-icon="dashboard">dashboard</span>
-<span class="font-label-md text-label-md">Dashboard</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all hover:translate-x-1" href="#">
-<span class="material-symbols-outlined" data-icon="bar_chart">bar_chart</span>
-<span class="font-label-md text-label-md">Analytics</span>
-</a>
-<a class="flex items-center gap-xs bg-primary/10 text-primary rounded-lg px-sm py-xs hover:translate-x-1 transition-transform" href="#">
-<span class="material-symbols-outlined" data-icon="eco">eco</span>
-<span class="font-label-md text-label-md">Projects</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all hover:translate-x-1" href="#">
-<span class="material-symbols-outlined" data-icon="storefront">storefront</span>
-<span class="font-label-md text-label-md">Marketplace</span>
-</a>
-<a class="flex items-center gap-xs text-on-surface-variant px-sm py-xs hover:bg-white/5 hover:text-primary transition-all hover:translate-x-1" href="#">
-<span class="material-symbols-outlined" data-icon="description">description</span>
-<span class="font-label-md text-label-md">Reports</span>
-</a>
-</nav>
-<div class="mt-auto px-sm">
-<button class="w-full py-xs px-sm bg-primary text-on-primary font-label-md rounded-lg vibrant-emerald-glow active:scale-95 transition-all">
-                Upgrade to Pro
-            </button>
-</div>
-</aside>
-<!-- Main Content Canvas -->
-<main class="ml-64 flex-1 p-margin flex flex-col gap-lg min-h-screen">
-<!-- Header Section -->
-<header class="flex justify-between items-end">
-<div>
-<h1 class="font-display-lg text-display-lg text-primary">EcoHub Challenges</h1>
-<p class="font-body-md text-body-md text-on-surface-variant">Gamified carbon reduction for a greener future.</p>
-</div>
-<div class="flex items-center gap-sm">
-<div class="glass-card px-sm py-xs rounded-xl flex items-center gap-xs">
-<span class="material-symbols-outlined text-tertiary">bolt</span>
-<span class="font-label-md text-label-md">Streak: 12 Days</span>
-</div>
-<div class="glass-card px-sm py-xs rounded-xl flex items-center gap-xs">
-<span class="material-symbols-outlined text-secondary" style="font-variation-settings: 'FILL' 1;">stars</span>
-<span class="font-label-md text-label-md">2,450 XP</span>
-</div>
-</div>
-</header>
-<!-- Bento Grid for Missions and Achievements -->
-<div class="grid grid-cols-12 gap-gutter">
-<!-- Active Missions Grid (Col 1-8) -->
-<section class="col-span-12 lg:col-span-8 space-y-md">
-<div class="flex justify-between items-center">
-<h2 class="font-headline-md text-headline-md text-on-surface flex items-center gap-xs">
-<span class="material-symbols-outlined text-primary">rocket_launch</span>
-                        Active Missions
-                    </h2>
-<button class="text-primary font-label-md hover:underline">View All</button>
-</div>
-<div class="grid grid-cols-1 md:grid-cols-2 gap-sm">
-<!-- Mission Card 1 -->
-<div class="glass-card p-md rounded-xl group hover:border-primary/50 transition-all cursor-pointer">
-<div class="flex justify-between items-start mb-sm">
-<div class="bg-primary/10 p-xs rounded-lg">
-<span class="material-symbols-outlined text-primary">commute</span>
-</div>
-<span class="font-caption text-caption text-primary bg-primary/10 px-xs py-1 rounded-full">3 Days Left</span>
-</div>
-<h3 class="font-title-sm text-title-sm mb-xs">The Cycle Sprint</h3>
-<p class="font-caption text-caption text-on-surface-variant mb-md">Commute by bicycle for 5 days this week to reduce your carbon footprint by 12kg.</p>
-<div class="w-full h-1.5 bg-surface-container rounded-full overflow-hidden mb-xs">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[60%]"></div>
-</div>
-<div class="flex justify-between items-center">
-<span class="font-caption text-caption text-on-surface-variant">3/5 days complete</span>
-<span class="font-label-md text-label-md text-primary">+450 XP</span>
-</div>
-</div>
-<!-- Mission Card 2 -->
-<div class="glass-card p-md rounded-xl group hover:border-primary/50 transition-all cursor-pointer">
-<div class="flex justify-between items-start mb-sm">
-<div class="bg-tertiary/10 p-xs rounded-lg">
-<span class="material-symbols-outlined text-tertiary">electric_bolt</span>
-</div>
-<span class="font-caption text-caption text-tertiary bg-tertiary/10 px-xs py-1 rounded-full">Weekly</span>
-</div>
-<h3 class="font-title-sm text-title-sm mb-xs">Phantom Power Hunter</h3>
-<p class="font-caption text-caption text-on-surface-variant mb-md">Unplug all non-essential electronics before bed for 7 consecutive nights.</p>
-<div class="w-full h-1.5 bg-surface-container rounded-full overflow-hidden mb-xs">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[85%]"></div>
-</div>
-<div class="flex justify-between items-center">
-<span class="font-caption text-caption text-on-surface-variant">6/7 nights complete</span>
-<span class="font-label-md text-label-md text-primary">+200 XP</span>
-</div>
-</div>
-<!-- Mission Card 3 -->
-<div class="glass-card p-md rounded-xl group hover:border-primary/50 transition-all cursor-pointer">
-<div class="flex justify-between items-start mb-sm">
-<div class="bg-secondary/10 p-xs rounded-lg">
-<span class="material-symbols-outlined text-secondary">eco</span>
-</div>
-<span class="font-caption text-caption text-secondary bg-secondary/10 px-xs py-1 rounded-full">New</span>
-</div>
-<h3 class="font-title-sm text-title-sm mb-xs">Waste Warrior</h3>
-<p class="font-caption text-caption text-on-surface-variant mb-md">Achieve a zero-plastic week by using reusable alternatives and reporting progress.</p>
-<div class="w-full h-1.5 bg-surface-container rounded-full overflow-hidden mb-xs">
-<div class="h-full bg-gradient-to-r from-secondary to-primary w-[10%]"></div>
-</div>
-<div class="flex justify-between items-center">
-<span class="font-caption text-caption text-on-surface-variant">Started today</span>
-<span class="font-label-md text-label-md text-primary">+600 XP</span>
-</div>
-</div>
-<!-- Mission Card 4 -->
-<div class="glass-card p-md rounded-xl group hover:border-primary/50 transition-all cursor-pointer border-dashed border-primary/30 bg-transparent flex flex-col items-center justify-center text-center">
-<span class="material-symbols-outlined text-primary mb-xs">add_circle</span>
-<h3 class="font-title-sm text-title-sm">Browse Challenges</h3>
-<p class="font-caption text-caption text-on-surface-variant">Find more ways to impact the planet.</p>
-</div>
-</div>
-<!-- Achievements Section -->
-<div class="pt-lg">
-<h2 class="font-headline-md text-headline-md text-on-surface mb-md flex items-center gap-xs">
-<span class="material-symbols-outlined text-tertiary" style="font-variation-settings: 'FILL' 1;">emoji_events</span>
-                        Achievements
-                    </h2>
-<div class="glass-card p-md rounded-xl flex gap-md overflow-x-auto custom-scrollbar pb-xs">
-<!-- Badge 1 -->
-<div class="flex flex-col items-center min-w-[100px] gap-xs text-center group">
-<div class="w-16 h-16 rounded-full bg-surface-container-high border border-primary/20 flex items-center justify-center group-hover:scale-110 transition-transform bg-[url('https://images.unsplash.com/photo-1542601906990-b4d3fb778b09?ixlib=rb-4.0.3&amp;auto=format&amp;fit=crop&amp;w=100&amp;q=80')] bg-cover bg-center overflow-hidden" data-alt="A stylized glowing digital badge of a tiny seedling emerging from a digital soil grid, representing growth and sustainability.">
-<div class="w-full h-full bg-primary/20 backdrop-blur-[2px] flex items-center justify-center">
-<span class="material-symbols-outlined text-primary text-3xl" style="font-variation-settings: 'FILL' 1;">forest</span>
-</div>
-</div>
-<span class="font-label-md text-label-md text-on-surface">Tree Planter</span>
-</div>
-<!-- Badge 2 -->
-<div class="flex flex-col items-center min-w-[100px] gap-xs text-center group">
-<div class="w-16 h-16 rounded-full bg-surface-container-high border border-secondary/20 flex items-center justify-center group-hover:scale-110 transition-transform bg-[url('https://images.unsplash.com/photo-1473341304170-971dccb5ac1e?ixlib=rb-4.0.3&amp;auto=format&amp;fit=crop&amp;w=100&amp;q=80')] bg-cover bg-center overflow-hidden" data-alt="A futuristic badge design featuring clean cyan geometric shapes and a stylized electrical spark, representing energy efficiency and technological advancement.">
-<div class="w-full h-full bg-secondary/20 backdrop-blur-[2px] flex items-center justify-center">
-<span class="material-symbols-outlined text-secondary text-3xl" style="font-variation-settings: 'FILL' 1;">bolt</span>
-</div>
-</div>
-<span class="font-label-md text-label-md text-on-surface">Kilowatt Killer</span>
-</div>
-<!-- Badge 3 -->
-<div class="flex flex-col items-center min-w-[100px] gap-xs text-center group">
-<div class="w-16 h-16 rounded-full bg-surface-container-high border border-tertiary/20 flex items-center justify-center group-hover:scale-110 transition-transform bg-[url('https://images.unsplash.com/photo-1518005020250-6eb5f3f2f669?ixlib=rb-4.0.3&amp;auto=format&amp;fit=crop&amp;w=100&amp;q=80')] bg-cover bg-center overflow-hidden" data-alt="A circular digital emblem depicting a stylized carbon atom being contained by a hexagonal mesh, using amber and dark blue tones for a professional scientific aesthetic.">
-<div class="w-full h-full bg-tertiary/20 backdrop-blur-[2px] flex items-center justify-center">
-<span class="material-symbols-outlined text-tertiary text-3xl" style="font-variation-settings: 'FILL' 1;">psychology</span>
-</div>
-</div>
-<span class="font-label-md text-label-md text-on-surface">Carbon Ninja</span>
-</div>
-<!-- Badge 4 Locked -->
-<div class="flex flex-col items-center min-w-[100px] gap-xs text-center group opacity-40 grayscale">
-<div class="w-16 h-16 rounded-full bg-surface-container border border-white/5 flex items-center justify-center">
-<span class="material-symbols-outlined text-on-surface-variant text-3xl">lock</span>
-</div>
-<span class="font-label-md text-label-md text-on-surface-variant">Global Hero</span>
-</div>
-<!-- Badge 5 Locked -->
-<div class="flex flex-col items-center min-w-[100px] gap-xs text-center group opacity-40 grayscale">
-<div class="w-16 h-16 rounded-full bg-surface-container border border-white/5 flex items-center justify-center">
-<span class="material-symbols-outlined text-on-surface-variant text-3xl">lock</span>
-</div>
-<span class="font-label-md text-label-md text-on-surface-variant">Water Saver</span>
-</div>
-</div>
-</div>
-</section>
-<!-- Leaderboard Sidebar (Col 9-12) -->
-<section class="col-span-12 lg:col-span-4 flex flex-col">
-<div class="glass-card rounded-xl flex-grow overflow-hidden flex flex-col sticky top-margin max-h-[870px]">
-<div class="p-md border-b border-white/10 flex justify-between items-center">
-<h2 class="font-headline-md text-headline-md text-on-surface">Global Leaderboard</h2>
-<span class="material-symbols-outlined text-on-surface-variant cursor-pointer">filter_list</span>
-</div>
-<div class="flex-1 overflow-y-auto custom-scrollbar">
-<!-- Rank 1 -->
-<div class="flex items-center gap-sm p-sm hover:bg-white/5 transition-colors border-b border-white/5">
-<div class="flex flex-col items-center min-w-[30px]">
-<span class="material-symbols-outlined text-tertiary text-lg" style="font-variation-settings: 'FILL' 1;">military_tech</span>
-<span class="font-label-md text-label-md text-tertiary">1</span>
-</div>
-<img alt="Avatar 1" class="w-10 h-10 rounded-full border border-primary/30" data-alt="A professional headshot of a friendly-looking man with a modern haircut, set against a blurred background of a sustainable glass-walled office with indoor plants." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAo0mxVMmgK0G8ytfb1rNX5JH6NqVRvROf7RIh5nMam96JfS5uTBz87S_rrFbUrgr0d3xA_kW6gcM3qxAy8m_V7_zZk0NBFNgm_2-UhJMw2tkDDS98w4qH5aMV1pAscVQ-F8dw0eoEAxfkX9huPjdipqj-5jQBxSYtzngDPCtQDyx_QO1leO0SfiEjboT49FL8HNHmkF9WYy0S9DhczQa-W0FawQnpsuG1_FIMsDZn0nUPtc_1lYqa5t_OCnAH6MXxMoGP6a-zdTEfY"/>
-<div class="flex-1">
-<p class="font-label-md text-label-md text-on-surface">Alex Rivera</p>
-<p class="font-caption text-caption text-on-surface-variant">Palo Alto, CA</p>
-</div>
-<span class="font-title-sm text-title-sm text-primary">12.4k</span>
-</div>
-<!-- Rank 2 -->
-<div class="flex items-center gap-sm p-sm hover:bg-white/5 transition-colors border-b border-white/5">
-<div class="flex flex-col items-center min-w-[30px]">
-<span class="font-label-md text-label-md text-on-surface-variant opacity-70">2</span>
-</div>
-<img alt="Avatar 2" class="w-10 h-10 rounded-full border border-white/10" data-alt="A portrait of a confident woman with short hair and glasses, wearing a smart casual outfit in a bright, modern studio with soft architectural lighting." src="https://lh3.googleusercontent.com/aida-public/AB6AXuBgxy9Vc1Og1X-KrYBrI1dS0qLIqG3debVeo6Uxdvx-4m2fZo93O988deugIgzBvIIixbJw-hSPADU8ioyM8b3ejzoJiMOp7H9KLSuUQEvwsNGek2JtY7Yc1sxnh-5lf5GB8zYGRt3lWpnVmlgGBhckgvQAXLHsblGdu6JG4rJSLgrVMFSoWb8jucEKx_4vMBPnbDYq5VGpT5JTaZ2MxYTh_0lh6rcv5g3ayoB1YbXFrEISZaUmszXbrRqgeREQj8l_hrMNmVLlQht9"/>
-<div class="flex-1">
-<p class="font-label-md text-label-md text-on-surface">Sarah Chen</p>
-<p class="font-caption text-caption text-on-surface-variant">Berlin, GER</p>
-</div>
-<span class="font-title-sm text-title-sm text-primary">11.8k</span>
-</div>
-<!-- User Current Rank -->
-<div class="flex items-center gap-sm p-sm bg-primary/10 border-y border-primary/20 my-xs">
-<div class="flex flex-col items-center min-w-[30px]">
-<span class="font-label-md text-label-md text-primary font-bold">142</span>
-</div>
-<div class="w-10 h-10 rounded-full bg-primary flex items-center justify-center text-on-primary font-bold">JD</div>
-<div class="flex-1">
-<p class="font-label-md text-label-md text-on-surface font-bold">You (Jane Doe)</p>
-<p class="font-caption text-caption text-on-surface-variant">Portland, OR</p>
-</div>
-<span class="font-title-sm text-title-sm text-primary font-bold">2.4k</span>
-</div>
-<!-- Other ranks... -->
-<div class="flex items-center gap-sm p-sm hover:bg-white/5 transition-colors border-b border-white/5">
-<div class="flex flex-col items-center min-w-[30px]">
-<span class="font-label-md text-label-md text-on-surface-variant opacity-70">3</span>
-</div>
-<img alt="Avatar 3" class="w-10 h-10 rounded-full border border-white/10" data-alt="A headshot of a middle-aged man with a neat beard and smiling eyes, photographed in a park with soft natural lighting and a green bokeh background." src="https://lh3.googleusercontent.com/aida-public/AB6AXuBBHaL6qaFLYyz3L7ppNpgusmPU6WlUwncEysvoU2c1bFbUSS5yv_TiRpJDZiZZv4KkNvqy_TjFlhfTMI1HNIUlF3M2dUjOJRsAX8yj_m16TOiam6tgUk9EDx1TfAuZ3tgp4W86UxQHwlvRgix25LXtJmAFPwoW3KnKGqRbTDzicvK10yBrBeaTfzz2_ERiq3lki4d5LYROb5yrShv4yZc_k0nAJh9VVBcaQiGUEz7tAMNpWuDqtpwv8RFUo13A8A-LhoK63wiq-yZz"/>
-<div class="flex-1">
-<p class="font-label-md text-label-md text-on-surface">Marcus Thorne</p>
-<p class="font-caption text-caption text-on-surface-variant">London, UK</p>
-</div>
-<span class="font-title-sm text-title-sm text-primary">10.2k</span>
-</div>
-<!-- Repeat similar for padding -->
-<div class="flex items-center gap-sm p-sm hover:bg-white/5 transition-colors border-b border-white/5">
-<div class="flex flex-col items-center min-w-[30px]">
-<span class="font-label-md text-label-md text-on-surface-variant opacity-70">4</span>
-</div>
-<img alt="Avatar 4" class="w-10 h-10 rounded-full border border-white/10" data-alt="A portrait of a young woman with a thoughtful expression, wearing a minimalist sustainable fashion piece, set against a clean concrete wall with industrial daylighting." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAZ_n3n4igOlbHnlFirkwtv1GmJaXi996tq-ab6aqPU6DAxlCqvpFW-vMYS6cJoWpk4GyzE2zCaWVazrNAz5jpcfvmV-7dS5kfKiuE9KgiQUv7MyA63hHuwtoGkw9ASkXLa9v3pCJBLcn_bdengfzsgCroJNV7iqJDEcPoVPxug-y2J3KkHMaJe_vhEkhI4KQiBBJcukLV2Vhk1P8j3KUkpzxalPUtxBzl62DRLBqWcCUZvAnMzmnEzUURb0D8-brJtLKpIJDxazKhV"/>
-<div class="flex-1">
-<p class="font-label-md text-label-md text-on-surface">Elena Vogt</p>
-<p class="font-caption text-caption text-on-surface-variant">Zurich, SUI</p>
-</div>
-<span class="font-title-sm text-title-sm text-primary">9.5k</span>
-</div>
-</div>
-<div class="p-md mt-auto bg-surface-container-high border-t border-white/10">
-<button class="w-full py-xs px-sm border border-primary text-primary font-label-md rounded-lg hover:bg-primary/10 transition-all">
-                            Challenge a Friend
-                        </button>
-</div>
-</div>
-</section>
-</div>
-<!-- Atmospheric Background Element -->
-<div class="fixed bottom-0 right-0 w-[500px] h-[500px] bg-primary/5 rounded-full blur-[120px] -z-10 pointer-events-none"></div>
-<div class="fixed top-0 left-0 w-[300px] h-[300px] bg-secondary/5 rounded-full blur-[100px] -z-10 pointer-events-none"></div>
-<!-- Footer -->
-<footer class="w-full py-md flex justify-between items-center mt-auto border-t border-white/10">
-<div class="flex flex-col">
-<span class="font-title-sm text-title-sm text-on-surface">EcoTrack AI</span>
-<span class="font-caption text-caption text-secondary opacity-70">© 2024 EcoTrack AI. Engineering a Sustainable Future.</span>
-</div>
-<div class="flex gap-md">
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Privacy Policy</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Terms of Service</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Carbon Methodology</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">API Docs</a>
-</div>
-</footer>
-</main>
-<!-- Micro-interaction Scripts -->
-<script>
-        document.querySelectorAll('.glass-card').forEach(card => {
-            card.addEventListener('mouseenter', () => {
-                card.style.transform = 'translateY(-4px)';
-                card.style.transition = 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)';
-            });
-            card.addEventListener('mouseleave', () => {
-                card.style.transform = 'translateY(0)';
-            });
-        });
-
-        // Simple animation for progress bars on load
-        window.addEventListener('DOMContentLoaded', () => {
-            const bars = document.querySelectorAll('.h-full.bg-gradient-to-r');
-            bars.forEach(bar => {
-                const finalWidth = bar.style.width;
-                bar.style.width = '0%';
-                setTimeout(() => {
-                    bar.style.transition = 'width 1.5s cubic-bezier(0.65, 0, 0.35, 1)';
-                    bar.style.width = finalWidth;
-                }, 300);
-            });
-        });
-    </script>
-</body></html>

Web-design/landing_page_desktop/code.html

@@ -1,348 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="en"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-<title>EcoTrack AI | Precision Sustainability</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "tertiary-container": "#e29100",
-                    "surface": "#0b1326",
-                    "on-secondary": "#00344d",
-                    "on-primary-fixed-variant": "#005236",
-                    "primary-fixed": "#6ffbbe",
-                    "on-surface": "#dae2fd",
-                    "surface-container-lowest": "#060e20",
-                    "on-tertiary-fixed-variant": "#653e00",
-                    "on-secondary-fixed": "#001e2f",
-                    "error-container": "#93000a",
-                    "background": "#0b1326",
-                    "surface-tint": "#4edea3",
-                    "outline": "#86948a",
-                    "primary-container": "#10b981",
-                    "outline-variant": "#3c4a42",
-                    "surface-dim": "#0b1326",
-                    "secondary-container": "#00a2e6",
-                    "surface-container-highest": "#2d3449",
-                    "tertiary-fixed": "#ffddb8",
-                    "surface-container-low": "#131b2e",
-                    "surface-container": "#171f33",
-                    "on-secondary-fixed-variant": "#004c6e",
-                    "on-background": "#dae2fd",
-                    "primary": "#4edea3",
-                    "inverse-surface": "#dae2fd",
-                    "secondary-fixed-dim": "#89ceff",
-                    "surface-container-high": "#222a3d",
-                    "on-error-container": "#ffdad6",
-                    "secondary-fixed": "#c9e6ff",
-                    "on-secondary-container": "#00344e",
-                    "on-primary-container": "#00422b",
-                    "on-primary": "#003824",
-                    "tertiary-fixed-dim": "#ffb95f",
-                    "on-surface-variant": "#bbcabf",
-                    "on-tertiary-container": "#523200",
-                    "primary-fixed-dim": "#4edea3",
-                    "on-tertiary": "#472a00",
-                    "secondary": "#89ceff",
-                    "on-error": "#690005",
-                    "inverse-primary": "#006c49",
-                    "on-tertiary-fixed": "#2a1700",
-                    "on-primary-fixed": "#002113",
-                    "inverse-on-surface": "#283044",
-                    "error": "#ffb4ab",
-                    "tertiary": "#ffb95f",
-                    "surface-bright": "#31394d",
-                    "surface-variant": "#2d3449"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "xl": "4rem",
-                    "unit": "4px",
-                    "gutter": "1.5rem",
-                    "margin": "2rem",
-                    "sm": "1rem",
-                    "xs": "0.5rem",
-                    "md": "1.5rem",
-                    "lg": "2.5rem"
-            },
-            "fontFamily": {
-                    "display-lg": ["Geist"],
-                    "label-md": ["Geist"],
-                    "headline-md": ["Geist"],
-                    "body-md": ["Geist"],
-                    "display-lg-mobile": ["Geist"],
-                    "caption": ["Geist"],
-                    "title-sm": ["Geist"]
-            },
-            "fontSize": {
-                    "display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "label-md": ["14px", {"lineHeight": "1.2", "letterSpacing": "0.01em", "fontWeight": "500"}],
-                    "headline-md": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
-                    "display-lg-mobile": ["32px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
-                    "caption": ["12px", {"lineHeight": "1.2", "fontWeight": "400"}],
-                    "title-sm": ["18px", {"lineHeight": "1.4", "fontWeight": "600"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-        body {
-            background-color: #0b1326;
-            color: #dae2fd;
-            font-family: 'Geist', sans-serif;
-            overflow-x: hidden;
-        }
-        .glass-card {
-            background: rgba(30, 41, 59, 0.5);
-            backdrop-filter: blur(12px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05);
-        }
-        .vibrant-emerald-glow {
-            box-shadow: 0 0 15px rgba(78, 222, 163, 0.3);
-        }
-        .transition-slow {
-            transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
-        }
-        @keyframes slow-rotate {
-            from { transform: rotate(0deg); }
-            to { transform: rotate(360deg); }
-        }
-        .animate-slow-rotate {
-            animation: slow-rotate 120s linear infinite;
-        }
-        .emerald-gradient-text {
-            background: linear-gradient(135deg, #4edea3 0%, #89ceff 100%);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-        }
-    </style>
-</head>
-<body class="flex flex-col min-h-screen">
-<!-- TopNavBar -->
-<nav class="fixed top-0 left-0 w-full z-50 flex justify-between items-center px-gutter h-16 bg-surface/50 backdrop-blur-md border-b border-white/10 shadow-sm">
-<div class="flex items-center gap-md">
-<span class="font-display-lg text-display-lg font-bold text-primary tracking-tight">EcoTrack AI</span>
-<div class="hidden md:flex items-center gap-gutter ml-lg">
-<a class="text-primary border-b-2 border-primary pb-1 font-body-md text-body-md transition-colors" href="#">Dashboard</a>
-<a class="text-on-surface-variant hover:text-primary transition-colors font-body-md text-body-md" href="#">Analytics</a>
-<a class="text-on-surface-variant hover:text-primary transition-colors font-body-md text-body-md" href="#">Projects</a>
-<a class="text-on-surface-variant hover:text-primary transition-colors font-body-md text-body-md" href="#">Marketplace</a>
-</div>
-</div>
-<div class="flex items-center gap-sm">
-<div class="relative group cursor-pointer active:scale-95 transition-transform">
-<span class="material-symbols-outlined text-on-surface-variant hover:text-primary">notifications</span>
-</div>
-<div class="relative group cursor-pointer active:scale-95 transition-transform ml-xs">
-<span class="material-symbols-outlined text-on-surface-variant hover:text-primary">settings</span>
-</div>
-<div class="w-8 h-8 rounded-full overflow-hidden border border-primary/30 ml-sm cursor-pointer active:scale-95 transition-transform">
-<img alt="User profile" class="w-full h-full object-cover" src="https://lh3.googleusercontent.com/aida-public/AB6AXuABbwKjMCtt2BIPzuY3HKRlGvLYpw0bYz6TOd7Fgb5wlf63ixv0-IvdSgVEb_IfLak8FGpkbmxVKGU8nZzutsiZ3Cgv27Z27iZ5lxgGGddbLZ6Sls52OtMW6nrVvIfNOyvpJpY2kJKuwG8oLHwbf6ESqzDFTWh6hDd_IWX-g43EHI9kHbTuTq1t2i0W_QYLBZ2ZiXCW3fskPXC5aYuEY0fUi_KpUOF52XvWRVnK1ytekhQsVSdrSgAVHabj7B0clky00xCcFyBb7FqV"/>
-</div>
-</div>
-</nav>
-<main class="flex-grow pt-16">
-<!-- Hero Section -->
-<section class="relative h-screen flex items-center justify-center overflow-hidden px-gutter">
-
-<div class="relative z-10 max-w-6xl w-full grid grid-cols-1 lg:grid-cols-2 gap-xl items-center">
-<div class="space-y-md text-center lg:text-left">
-<div class="inline-flex items-center px-sm py-xs rounded-full bg-primary/10 border border-primary/20 backdrop-blur-md">
-<span class="material-symbols-outlined text-primary mr-xs text-sm" style="font-variation-settings: 'FILL' 1;">eco</span>
-<span class="font-label-md text-label-md text-primary uppercase tracking-widest">Next-Gen Carbon Intelligence</span>
-</div>
-<h1 class="font-display-lg text-display-lg text-on-surface leading-none">
-                        Track. Reduce. <br/>
-<span class="emerald-gradient-text">Restore.</span>
-</h1>
-<p class="font-body-md text-body-md text-on-surface-variant max-w-lg mx-auto lg:mx-0">
-                        Harnessing the power of precision AI to quantify environmental impact in real-time. Join the global movement to engineer a carbon-negative future through data-driven clarity.
-                    </p>
-<div class="flex flex-col sm:flex-row gap-sm pt-md justify-center lg:justify-start">
-<button class="px-lg py-sm bg-primary text-on-primary font-title-sm text-title-sm rounded-lg vibrant-emerald-glow hover:scale-105 active:scale-95 transition-all">
-                            Start Your Journey
-                        </button>
-<button class="px-lg py-sm border border-primary/30 text-primary font-title-sm text-title-sm rounded-lg hover:bg-primary/10 transition-all flex items-center justify-center gap-xs">
-                            View Global Map <span class="material-symbols-outlined">north_east</span>
-</button>
-</div>
-</div>
-<div class="relative hidden lg:flex justify-center items-center h-[500px]">
-<!-- Floating Data Visualizations around a central globe glow -->
-<div class="absolute w-96 h-96 bg-primary/20 blur-[100px] rounded-full animate-pulse"></div>
-<div class="relative z-20 w-80 h-80 rounded-full glass-card border-primary/20 flex items-center justify-center overflow-hidden">
-
-</div>
-<!-- Stats Overlays -->
-<div class="absolute top-0 right-0 glass-card p-sm rounded-xl border-secondary/20 -translate-y-1/4 animate-bounce-slow">
-<div class="flex items-center gap-xs">
-<span class="material-symbols-outlined text-secondary">trending_down</span>
-<div>
-<p class="text-[10px] uppercase tracking-tighter opacity-70">Live Reduction</p>
-<p class="font-headline-md text-headline-md text-secondary">-14.2%</p>
-</div>
-</div>
-</div>
-</div>
-</div>
-</section>
-<!-- Stats Ticker -->
-<section class="py-md border-y border-white/5 bg-surface-container-lowest/50 backdrop-blur-sm">
-<div class="max-w-7xl mx-auto px-gutter grid grid-cols-2 md:grid-cols-4 gap-lg text-center">
-<div>
-<p class="font-label-md text-label-md text-on-surface-variant uppercase">Global Carbon Saved</p>
-<p class="font-headline-md text-headline-md text-primary mt-xs">2.4M Tons</p>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface-variant uppercase">Active Projects</p>
-<p class="font-headline-md text-headline-md text-primary mt-xs">1,842</p>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface-variant uppercase">Trees Restored</p>
-<p class="font-headline-md text-headline-md text-primary mt-xs">840K+</p>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface-variant uppercase">AI Precision</p>
-<p class="font-headline-md text-headline-md text-primary mt-xs">99.9%</p>
-</div>
-</div>
-</section>
-<!-- Bento Grid Features -->
-<section class="py-xl px-gutter max-w-7xl mx-auto">
-<div class="text-center mb-xl">
-<h2 class="font-display-lg text-display-lg-mobile md:text-display-lg text-on-surface mb-xs">Data-Driven Restoration</h2>
-<p class="font-body-md text-body-md text-on-surface-variant">Our intelligence layer integrates seamlessly with your supply chain to find every carbon leak.</p>
-</div>
-<div class="grid grid-cols-1 md:grid-cols-12 gap-gutter">
-<!-- Large Feature -->
-<div class="md:col-span-7 glass-card rounded-2xl p-lg flex flex-col justify-between min-h-[400px] group transition-slow hover:border-primary/40">
-<div class="space-y-sm">
-<div class="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center">
-<span class="material-symbols-outlined text-primary">analytics</span>
-</div>
-<h3 class="font-headline-md text-headline-md text-on-surface">Predictive Emissions Analytics</h3>
-<p class="font-body-md text-body-md text-on-surface-variant max-w-md">Utilize machine learning to forecast carbon output before it happens. Our algorithms identify inefficiencies and suggest remediation strategies automatically.</p>
-</div>
-<div class="mt-lg rounded-xl overflow-hidden h-48 border border-white/5">
-<img class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105" data-alt="A high-fidelity digital dashboard showing complex data visualizations and carbon footprint analytics. The UI is sleek and dark with neon emerald and sky blue graph lines glowing against a deep slate background. The image evokes a sense of high-tech precision and environmental control." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAGLdYgb5qyoz6Nn-yVGKHN6LQoUrIbv-y3RzEerDMKGJOFdUL76Hnd7e1lMrp6FJHNqNri71zlBNnZGD9s8p5rXwKxOBJ-hGSdXIFD9UyXBRtdQXmoli7pcGWzFs1L08iQmQD5Q0QpShzEUyNLLcs1YM4mD1jrgoyKfpJbEUWE-niSyEel_c3xbnxpQEDSg3ucxlH_pzqYLZia7Vyc-8wiDdt72GMRZe0v0-Qg6Ai8vDSmqNXoHyj4PpoSWrQauu5jcvCao-fz2YZb"/>
-</div>
-</div>
-<!-- Vertical Feature -->
-<div class="md:col-span-5 glass-card rounded-2xl p-lg flex flex-col group transition-slow hover:border-secondary/40">
-<div class="w-12 h-12 bg-secondary/10 rounded-lg flex items-center justify-center mb-sm">
-<span class="material-symbols-outlined text-secondary">public</span>
-</div>
-<h3 class="font-headline-md text-headline-md text-on-surface">Satellite Integration</h3>
-<p class="font-body-md text-body-md text-on-surface-variant mt-sm">Real-time terrestrial monitoring via high-resolution satellite arrays to verify restoration projects with zero physical footprint.</p>
-<div class="mt-auto pt-lg">
-<div class="w-full h-64 rounded-xl overflow-hidden border border-white/5">
-<img class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" data-alt="A cinematic view of the earth from orbit, showing lush green continents and deep blue oceans under a thin atmosphere. High-tech digital data overlays and scanning grids trace across the surface, highlighting environmental restoration zones in glowing green. The style is hyper-realistic and futuristic." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAwZnH8mSyWHbzsZFegkoS8ETJMHilmZRdk9UaRSZfC-LpscTz1az4Pc0iqxCbRtQezcalRHqBkByY6ONLvvTY8H8NJOS7nkH-31XaipdatDN-c5447NZnRRsskco49JUN230edLfDzcyDVKes-YqxSVOUk4VqbPHbT6A8IuDlK3jbzHHfVa173yTfbiCz5P4bfHPxiA2YusVDTyUWw9b_Cb5QbD9f4QSQVEIL7ryzMIsyZ8UXgzEbu9tgt8yY01l3gHqDebnqjeHrK"/>
-</div>
-</div>
-</div>
-<!-- Square Feature 1 -->
-<div class="md:col-span-4 glass-card rounded-2xl p-lg group transition-slow hover:border-tertiary/40">
-<span class="material-symbols-outlined text-tertiary text-4xl mb-sm" style="font-variation-settings: 'FILL' 1;">api</span>
-<h4 class="font-title-sm text-title-sm text-on-surface">Seamless API Connect</h4>
-<p class="font-caption text-caption text-on-surface-variant mt-xs">Integrate with 200+ ERP systems in minutes to begin ingestion of raw data streams.</p>
-</div>
-<!-- Square Feature 2 -->
-<div class="md:col-span-4 glass-card rounded-2xl p-lg group transition-slow hover:border-primary/40">
-<span class="material-symbols-outlined text-primary text-4xl mb-sm">verified_user</span>
-<h4 class="font-title-sm text-title-sm text-on-surface">Immutable Ledger</h4>
-<p class="font-caption text-caption text-on-surface-variant mt-xs">All reductions are verified on a private green-blockchain for audit-proof ESG reporting.</p>
-</div>
-<!-- Square Feature 3 -->
-<div class="md:col-span-4 glass-card rounded-2xl p-lg group transition-slow hover:border-secondary/40">
-<span class="material-symbols-outlined text-secondary text-4xl mb-sm">bolt</span>
-<h4 class="font-title-sm text-title-sm text-on-surface">Real-time Offsets</h4>
-<p class="font-caption text-caption text-on-surface-variant mt-xs">Auto-allocate funds to high-impact reforestation the moment emissions are tracked.</p>
-</div>
-</div>
-</section>
-<!-- CTA Section -->
-<section class="py-xl px-gutter relative overflow-hidden">
-<div class="absolute inset-0 bg-primary/5 -skew-y-3 origin-right"></div>
-<div class="max-w-4xl mx-auto relative z-10 glass-card rounded-3xl p-xl border-primary/20 text-center space-y-md">
-<h2 class="font-display-lg text-display-lg-mobile md:text-display-lg text-on-surface">Ready to lead the <span class="text-primary">Green Revolution</span>?</h2>
-<p class="font-body-md text-body-md text-on-surface-variant max-w-2xl mx-auto">
-                    Join the 1,500+ enterprises using EcoTrack AI to reach Net Zero ahead of schedule. Your transformation begins with a single data point.
-                </p>
-<div class="pt-sm">
-<button class="px-xl py-md bg-primary text-on-primary font-headline-md text-headline-md rounded-xl shadow-lg vibrant-emerald-glow hover:translate-y-[-4px] active:scale-95 transition-all">
-                        Schedule a Demo
-                    </button>
-<p class="text-on-surface-variant font-caption text-caption mt-sm">No credit card required. Onboard in under 24 hours.</p>
-</div>
-</div>
-</section>
-</main>
-<!-- Footer -->
-<footer class="w-full py-md px-gutter flex flex-col md:flex-row justify-between items-center mt-auto bg-surface-container-lowest border-t border-white/10">
-<div class="flex flex-col items-center md:items-start gap-xs mb-md md:mb-0">
-<span class="font-title-sm text-title-sm text-on-surface">EcoTrack AI</span>
-<p class="font-caption text-caption text-secondary">© 2024 EcoTrack AI. Engineering a Sustainable Future.</p>
-</div>
-<div class="flex flex-wrap justify-center gap-md">
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Privacy Policy</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Terms of Service</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">Carbon Methodology</a>
-<a class="font-caption text-caption text-on-surface-variant hover:text-secondary underline transition-all" href="#">API Docs</a>
-</div>
-</footer>
-<script>
-        // Micro-interactions and subtle effects
-        document.addEventListener('mousemove', (e) => {
-            const cards = document.querySelectorAll('.glass-card');
-            const x = e.clientX;
-            const y = e.clientY;
-
-            cards.forEach(card => {
-                const rect = card.getBoundingClientRect();
-                const cardX = x - rect.left;
-                const cardY = y - rect.top;
-                
-                // Only update if mouse is relatively near
-                if (cardX > -100 && cardX < rect.width + 100 && cardY > -100 && cardY < rect.height + 100) {
-                    card.style.setProperty('--mouse-x', `${cardX}px`);
-                    card.style.setProperty('--mouse-y', `${cardY}px`);
-                }
-            });
-        });
-
-        // Simple intersection observer for entry animations
-        const observerOptions = {
-            threshold: 0.1
-        };
-
-        const observer = new IntersectionObserver((entries) => {
-            entries.forEach(entry => {
-                if (entry.isIntersecting) {
-                    entry.target.classList.add('opacity-100', 'translate-y-0');
-                    entry.target.classList.remove('opacity-0', 'translate-y-10');
-                }
-            });
-        }, observerOptions);
-
-        document.querySelectorAll('.glass-card').forEach(el => {
-            el.classList.add('opacity-0', 'translate-y-10', 'transition-all', 'duration-1000');
-            observer.observe(el);
-        });
-    </script>
-</body></html>

app.json

@@ -1,24 +0,0 @@
-{
-  "expo": {
-    "name": "EcoTrack AI",
-    "slug": "ecotrack-ai",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "icon": "./assets/icon.png",
-    "userInterfaceStyle": "dark",
-    "ios": {
-      "supportsTablet": true
-    },
-    "android": {
-      "adaptiveIcon": {
-        "backgroundColor": "#E6F4FE",
-        "foregroundImage": "./assets/android-icon-foreground.png",
-        "backgroundImage": "./assets/android-icon-background.png",
-        "monochromeImage": "./assets/android-icon-monochrome.png"
-      }
-    },
-    "web": {
-      "favicon": "./assets/favicon.png"
-    }
-  }
-}

backend/.env.example

@@ -0,0 +1,18 @@
+# Server Configuration
+PORT=3001
+NODE_ENV=development
+
+# CORS Configuration
+CORS_ORIGIN=http://localhost:5173
+
+# CSP: public URL of this backend (used in connectSrc to allow frontend→API calls)
+BACKEND_PUBLIC_URL=http://localhost:3001
+
+# Groq AI (Required for AI eco-coach chatbot, plans, daily tips, and narrative score analysis)
+# Get a free key at: https://console.groq.com
+GROQ_API_KEY=""
+
+# Firebase Service Account Credentials
+# (Optional: Only if you want to pass the raw JSON service key string as an env var.
+# Otherwise, simply save your Firebase key file as "firebase-key.json" inside the backend/ folder).
+FIREBASE_SERVICE_ACCOUNT=""

backend/.eslintrc.json

@@ -0,0 +1,26 @@
+{
+  "env": {
+    "node": true,
+    "es2022": true
+  },
+  "extends": ["eslint:recommended"],
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module"
+  },
+  "rules": {
+    "no-console": "warn",
+    "no-var": "error",
+    "prefer-const": "error",
+    "eqeqeq": ["error", "always"],
+    "no-unused-vars": ["error", { "argsIgnorePattern": "^_", "varsIgnorePattern": "^_" }]
+  },
+  "overrides": [
+    {
+      "files": ["src/utils/logger.js"],
+      "rules": {
+        "no-console": "off"
+      }
+    }
+  ]
+}

backend/.gitignore

@@ -1,6 +0,0 @@
-node_modules/
-firebase-key.json
-database.json
-*adminsdk*.json
-*.json.key
-*.key.json

backend/Dockerfile

@@ -1,24 +0,0 @@
-# Use official lightweight Node.js 18 image
-FROM node:18-alpine
-
-# Set working directory
-WORKDIR /app
-
-# Copy package files
-COPY package*.json ./
-
-# Install production dependencies
-RUN npm ci --only=production
-
-# Copy application source code
-COPY . .
-
-# Expose port (Hugging Face Spaces default port)
-EXPOSE 7860
-
-# Define environment variables
-ENV PORT=7860
-ENV NODE_ENV=production
-
-# Start the application
-CMD ["node", "server.js"]

backend/README.md

@@ -1,17 +0,0 @@
----
-title: EcoTracker Backend
-emoji: 🌱
-colorFrom: green
-colorTo: blue
-sdk: docker
-pinned: false
----
-
-# EcoTracker Backend
-
-This is the Express.js API server for **EcoTrack AI**, running as a Docker container on Hugging Face Spaces.
-
-## Service Details
-- **Port**: 7860
-- **Database**: Cloud Firestore (Firebase)
-- **Deployment Platform**: Hugging Face Spaces (Docker SDK)

backend/__tests__/routes.test.js

@@ -1,153 +0,0 @@
-// Set environment to test to route DB writes to database.test.json
-process.env.NODE_ENV = 'test';
-
-const request = require('supertest');
-const fs = require('fs');
-const path = require('path');
-const app = require('../server');
-
-describe('EcoTrack AI Backend API integration Tests', () => {
-  
-  afterAll((done) => {
-    // Clean up temporary database.test.json after test suite completes
-    const testDbPath = path.join(__dirname, '../database.test.json');
-    if (fs.existsSync(testDbPath)) {
-      try {
-        fs.unlinkSync(testDbPath);
-      } catch (err) {
-        console.error('Error cleaning up test DB file:', err);
-      }
-    }
-    done();
-  });
-
-  // 1. Health check endpoint
-  describe('GET /', () => {
-    it('should return 200 OK with server status and local-mock database tag', async () => {
-      const res = await request(app).get('/');
-      expect(res.statusCode).toBe(200);
-      expect(res.body).toHaveProperty('status', 'online');
-      expect(res.body).toHaveProperty('service');
-    });
-  });
-
-  // 2. Preset configs loader
-  describe('GET /api/config', () => {
-    it('should return transport and electric multipliers presets', async () => {
-      const res = await request(app).get('/api/config');
-      expect(res.statusCode).toBe(200);
-      expect(res.body).toHaveProperty('factors');
-      expect(res.body).toHaveProperty('multipliers');
-    });
-  });
-
-  // 3. Carbon Calculator computations
-  describe('POST /api/carbon/calculate', () => {
-    it('should compute carbon metrics based on weights', async () => {
-      const calculationPayload = {
-        transport: { mode: 'car', distance: 100, fuelType: 'gasoline', daysPerWeek: 5 },
-        electricity: { units: 200 },
-        food: { type: 'vegetarian' },
-        waste: { plasticUsage: 5, recyclingHabits: 'partial' },
-        shopping: { clothes: 2, onlineOrders: 5, electronics: 0 }
-      };
-
-      const res = await request(app)
-        .post('/api/carbon/calculate')
-        .send(calculationPayload);
-
-      expect(res.statusCode).toBe(200);
-      expect(res.body).toHaveProperty('monthlyEmission');
-      expect(res.body).toHaveProperty('yearlyEmission');
-      expect(res.body.breakdown).toHaveProperty('transport');
-      expect(res.body.breakdown).toHaveProperty('electricity');
-      expect(res.body.breakdown).toHaveProperty('food');
-      expect(res.body.breakdown).toHaveProperty('waste');
-      expect(res.body.breakdown).toHaveProperty('shopping');
-    });
-  });
-
-  // 4. User registration & verification
-  describe('POST /api/users', () => {
-    it('should register a new valid user and generate profile document', async () => {
-      const payload = {
-        name: 'Testy Tester',
-        email: 'test@example.com'
-      };
-
-      const res = await request(app)
-        .post('/api/users')
-        .send(payload);
-
-      expect(res.statusCode).toBe(200);
-      expect(res.body).toHaveProperty('success', true);
-      expect(res.body).toHaveProperty('userId', 'testy_tester');
-      expect(res.body.profile).toHaveProperty('name', 'Testy Tester');
-      expect(res.body.profile).toHaveProperty('email', 'test@example.com');
-      expect(res.body.profile).toHaveProperty('points', 0);
-    });
-
-    it('should reject requests with empty name parameters', async () => {
-      const payload = {
-        name: '   ',
-        email: 'test@example.com'
-      };
-
-      const res = await request(app)
-        .post('/api/users')
-        .send(payload);
-
-      expect(res.statusCode).toBe(400);
-      expect(res.body).toHaveProperty('error');
-    });
-
-    it('should reject requests with malformed email strings', async () => {
-      const payload = {
-        name: 'Akash Test',
-        email: 'invalid-email-address'
-      };
-
-      const res = await request(app)
-        .post('/api/users')
-        .send(payload);
-
-      expect(res.statusCode).toBe(400);
-      expect(res.body).toHaveProperty('error');
-    });
-
-    it('should reject names longer than 50 characters', async () => {
-      const payload = {
-        name: 'A'.repeat(51),
-        email: 'long@example.com'
-      };
-
-      const res = await request(app)
-        .post('/api/users')
-        .send(payload);
-
-      expect(res.statusCode).toBe(400);
-      expect(res.body).toHaveProperty('error');
-    });
-  });
-
-  // 5. User retrieval and Leaderboard syncing
-  describe('GET /api/users & GET /api/leaderboard', () => {
-    it('should retrieve a list of all user profiles', async () => {
-      const res = await request(app).get('/api/users');
-      expect(res.statusCode).toBe(200);
-      expect(Array.isArray(res.body)).toBe(true);
-      expect(res.body.length).toBeGreaterThan(0);
-    });
-
-    it('should return a sorted ranked leaderboard list with ID parameters', async () => {
-      const res = await request(app).get('/api/leaderboard');
-      expect(res.statusCode).toBe(200);
-      expect(Array.isArray(res.body)).toBe(true);
-      expect(res.body.length).toBeGreaterThan(0);
-      expect(res.body[0]).toHaveProperty('id');
-      expect(res.body[0]).toHaveProperty('rank');
-      expect(res.body[0]).toHaveProperty('points');
-    });
-  });
-
-});

backend/firebase.js

@@ -1,310 +0,0 @@
-const { initializeApp, cert } = require('firebase-admin/app');
-const { getFirestore } = require('firebase-admin/firestore');
-const path = require('path');
-const fs = require('fs');
-
-// ==========================================
-// Mock Firestore Class Definition
-// ==========================================
-class MockDocRef {
-  constructor(collectionPath, docId, mockDb) {
-    this.collectionPath = collectionPath;
-    this.id = docId;
-    this.mockDb = mockDb;
-  }
-
-  async get() {
-    const data = this.mockDb.readDoc(this.collectionPath, this.id);
-    return {
-      exists: !!data,
-      id: this.id,
-      data: () => data || null
-    };
-  }
-
-  async set(data, options = {}) {
-    this.mockDb.writeDoc(this.collectionPath, this.id, data, options.merge);
-  }
-
-  async update(data) {
-    this.mockDb.writeDoc(this.collectionPath, this.id, data, true);
-  }
-
-  collection(subCollectionName) {
-    return new MockCollectionRef(`${this.collectionPath}/${this.id}/${subCollectionName}`, this.mockDb);
-  }
-}
-
-class MockCollectionRef {
-  constructor(collectionPath, mockDb) {
-    this.collectionPath = collectionPath;
-    this.mockDb = mockDb;
-  }
-
-  doc(id) {
-    return new MockDocRef(this.collectionPath, id, this.mockDb);
-  }
-
-  async get() {
-    const docs = this.mockDb.readCollection(this.collectionPath);
-    return {
-      docs: docs.map(d => ({
-        id: d.id,
-        data: () => d.data
-      }))
-    };
-  }
-}
-
-class MockDb {
-  constructor() {
-    this.filePath = process.env.NODE_ENV === 'test'
-      ? path.join(__dirname, 'database.test.json')
-      : path.join(__dirname, 'database.json');
-    if (!fs.existsSync(this.filePath)) {
-      // Seed initial users & historical records
-      const initialSeed = {
-        users: {
-          'sarah_j': {
-            email: 'sarah@example.com',
-            name: 'Sarah J.',
-            avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuAT1EPgeHbiCyiDKLGp868IabVBLWQJe-FbA4S09aQJipuS6tXAJnHYJnoD4VL-TBLlnzm4xoCEkS_WlOmVhbeXjuNHry4GZPGKfJ5_iQ8X-fVs2ZENwqa0MK2sTi6dgD_hmctOs2tY1U0dbsRFDclOP1Sy81nI9zy56ULwxCR3EAsmngeA71gDstnUUoOs0PVxPurXRdI32iJ5ScLE0CjWgOYh6n808_7lSn7PlX4m0EkobLUHN1beT5h43E4UGhZjiUdK2JjYPK9R',
-            title: 'Master Guardian',
-            points: 12450,
-            badges: ['Tree Planter', 'Carbon Ninja', 'Zero Waste'],
-            percentages: { transport: 45, electricity: 20, food: 20, waste: 10, shopping: 5 },
-            complianceRate: '94.2%',
-            totalMonthly: 182.4
-          },
-          'james_w': {
-            email: 'james@example.com',
-            name: 'James W.',
-            avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuC8P9QWmkdOOWXq6XrcEKt3wdPMsFJNegdG6UQznpU9ZMfLbsW_fKTfuIWlIHInf0YMPE4MLmRNL20P6VlcsCnd6KLkvc2A_RuBSwHsKvwumkpFZT8hQKxSFUve03mZ3vKJhUIOej633ww6102SdmOn6nfPmGNiLv7WvjtVfUwnGDsbyCIQyJ_B9mmnBqpiH6NUy4eYvDJfHlzbdZ2ZhVkzk8p547M03lRA615RwLExviMZ8p62ikv_uMg-K1FGpiL7YAMp8suTSGhZ',
-            title: 'Nature Enthusiast',
-            points: 11200,
-            badges: ['Tree Planter'],
-            percentages: { transport: 35, electricity: 30, food: 15, waste: 10, shopping: 10 },
-            complianceRate: '88.5%',
-            totalMonthly: 210.0
-          },
-          'mila_k': {
-            email: 'mila@example.com',
-            name: 'Mila K.',
-            avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuAYkzfO_UyJ2G530wb-ov-OwK5ff3WIT-F_PjNiklYBaBkSnYBGSr6Qup5sIOA0s5OdV_QDLc6gODbXBElL5UckyQ-9ktreb80hwwU5qos-sJXJIUnmCOsYy7tFKmczpTrMWwqioCB6SoLP3N7Du7iecb4edZ5a9O_cI7FgGiIxp29xjkaFWOVWfQ26O3L3nh-gswqV1XGraa-PB8EllrAXdrATbGiQycXKanj1dS3hpbO_kdffmXE-76_8Ol_flCoWuo5gdCpgSfkp',
-            title: 'Carbon Reducer',
-            points: 10890,
-            badges: ['Carbon Ninja'],
-            percentages: { transport: 40, electricity: 25, food: 15, waste: 10, shopping: 10 },
-            complianceRate: '90.1%',
-            totalMonthly: 195.0
-          }
-        },
-        'users/sarah_j/history': {
-          'Jan': { month: 'Jan', amount: 155 },
-          'Feb': { month: 'Feb', amount: 145 },
-          'Mar': { month: 'Mar', amount: 130 },
-          'Apr': { month: 'Apr', amount: 125 },
-          'May': { month: 'May', amount: 112 },
-          'Jun': { month: 'Jun', amount: 98 }
-        },
-        'users/sarah_j/goals': {
-          '1': { id: '1', title: 'Reduce footprint by 20%', progress: 0.75, target: '20% Reduction' },
-          '2': { id: '2', title: 'Cycle 3 days/week', progress: 0.40, target: '3 Days/Week' }
-        },
-        'users/sarah_j/challenges': {
-          '1': { id: '1', title: 'No-Car Week', points: '+500 pts', pointsValue: 500, timeLeft: '4 days left', progress: 0.60, icon: 'directions-car', color: '#4edea3', bgColor: 'rgba(78, 222, 163, 0.15)', associatedBadge: 'Carbon Ninja' },
-          '2': { id: '2', title: 'Vegan Weekend', points: '+250 pts', pointsValue: 250, timeLeft: 'Starts in 12h', progress: 0.00, icon: 'eco', color: '#ffb95f', bgColor: 'rgba(255, 185, 95, 0.15)', associatedBadge: 'Tree Planter' },
-          '3': { id: '3', title: 'Plastic-Free', points: '+400 pts', pointsValue: 400, timeLeft: '2 days left', progress: 0.85, icon: 'shopping-bag', color: '#4edea3', bgColor: 'rgba(78, 222, 163, 0.15)', associatedBadge: 'Zero Waste' }
-        }
-      };
-      fs.writeFileSync(this.filePath, JSON.stringify(initialSeed, null, 2));
-    }
-  }
-
-  read() {
-    try {
-      return JSON.parse(fs.readFileSync(this.filePath, 'utf8'));
-    } catch (e) {
-      return {};
-    }
-  }
-
-  write(data) {
-    fs.writeFileSync(this.filePath, JSON.stringify(data, null, 2));
-  }
-
-  readDoc(collectionPath, docId) {
-    const data = this.read();
-    const collection = data[collectionPath] || {};
-    return collection[docId] || null;
-  }
-
-  writeDoc(collectionPath, docId, docData, merge = false) {
-    const data = this.read();
-    if (!data[collectionPath]) {
-      data[collectionPath] = {};
-    }
-    if (merge && data[collectionPath][docId]) {
-      data[collectionPath][docId] = { ...data[collectionPath][docId], ...docData };
-    } else {
-      data[collectionPath][docId] = docData;
-    }
-    this.write(data);
-  }
-
-  readCollection(collectionPath) {
-    const data = this.read();
-    const collection = data[collectionPath] || {};
-    return Object.keys(collection).map(key => ({
-      id: key,
-      data: collection[key]
-    }));
-  }
-}
-
-// Instantiate mock
-const mockDbInstance = new MockDb();
-const mockFirestore = {
-  collection: (path) => new MockCollectionRef(path, mockDbInstance)
-};
-
-// ==========================================
-// Firebase Initialization Router
-// ==========================================
-let db;
-
-async function seedRealFirestore(dbInstance) {
-  try {
-    const usersSnap = await dbInstance.collection('users').get();
-    if (usersSnap.empty) {
-      console.log("Seeding real Firestore with default users...");
-      const initialUsers = {
-        'sarah_j': {
-          email: 'sarah@example.com',
-          name: 'Sarah J.',
-          avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuAT1EPgeHbiCyiDKLGp868IabVBLWQJe-FbA4S09aQJipuS6tXAJnHYJnoD4VL-TBLlnzm4xoCEkS_WlOmVhbeXjuNHry4GZPGKfJ5_iQ8X-fVs2ZENwqa0MK2sTi6dgD_hmctOs2tY1U0dbsRFDclOP1Sy81nI9zy56ULwxCR3EAsmngeA71gDstnUUoOs0PVxPurXRdI32iJ5ScLE0CjWgOYh6n808_7lSn7PlX4m0EkobLUHN1beT5h43E4UGhZjiUdK2JjYPK9R',
-          title: 'Master Guardian',
-          points: 12450,
-          badges: ['Tree Planter', 'Carbon Ninja', 'Zero Waste'],
-          percentages: { transport: 45, electricity: 20, food: 20, waste: 10, shopping: 5 },
-          complianceRate: '94.2%',
-          totalMonthly: 182.4
-        },
-        'james_w': {
-          email: 'james@example.com',
-          name: 'James W.',
-          avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuC8P9QWmkdOOWXq6XrcEKt3wdPMsFJNegdG6UQznpU9ZMfLbsW_fKTfuIWlIHInf0YMPE4MLmRNL20P6VlcsCnd6KLkvc2A_RuBSwHsKvwumkpFZT8hQKxSFUve03mZ3vKJhUIOej633ww6102SdmOn6nfPmGNiLv7WvjtVfUwnGDsbyCIQyJ_B9mmnBqpiH6NUy4eYvDJfHlzbdZ2ZhVkzk8p547M03lRA615RwLExviMZ8p62ikv_uMg-K1FGpiL7YAMp8suTSGhZ',
-          title: 'Nature Enthusiast',
-          points: 11200,
-          badges: ['Tree Planter'],
-          percentages: { transport: 35, electricity: 30, food: 15, waste: 10, shopping: 10 },
-          complianceRate: '88.5%',
-          totalMonthly: 210.0
-        },
-        'mila_k': {
-          email: 'mila@example.com',
-          name: 'Mila K.',
-          avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuAYkzfO_UyJ2G530wb-ov-OwK5ff3WIT-F_PjNiklYBaBkSnYBGSr6Qup5sIOA0s5OdV_QDLc6gODbXBElL5UckyQ-9ktreb80hwwU5qos-sJXJIUnmCOsYy7tFKmczpTrMWwqioCB6SoLP3N7Du7iecb4edZ5a9O_cI7FgGiIxp29xjkaFWOVWfQ26O3L3nh-gswqV1XGraa-PB8EllrAXdrATbGiQycXKanj1dS3hpbO_kdffmXE-76_8Ol_flCoWuo5gdCpgSfkp',
-          title: 'Carbon Reducer',
-          points: 10890,
-          badges: ['Carbon Ninja'],
-          percentages: { transport: 40, electricity: 25, food: 15, waste: 10, shopping: 10 },
-          complianceRate: '90.1%',
-          totalMonthly: 195.0
-        }
-      };
-
-      for (const [uid, userProfile] of Object.entries(initialUsers)) {
-        await dbInstance.collection('users').doc(uid).set(userProfile);
-      }
-
-      // Seed history for sarah_j
-      const historyItems = [
-        { month: 'Jan', amount: 155 },
-        { month: 'Feb', amount: 145 },
-        { month: 'Mar', amount: 130 },
-        { month: 'Apr', amount: 125 },
-        { month: 'May', amount: 112 },
-        { month: 'Jun', amount: 98 }
-      ];
-      for (const item of historyItems) {
-        await dbInstance.collection('users').doc('sarah_j').collection('history').doc(item.month).set(item);
-      }
-
-      // Seed goals for sarah_j
-      const goalsItems = [
-        { id: '1', title: 'Reduce footprint by 20%', progress: 0.75, target: '20% Reduction' },
-        { id: '2', title: 'Cycle 3 days/week', progress: 0.40, target: '3 Days/Week' }
-      ];
-      for (const item of goalsItems) {
-        await dbInstance.collection('users').doc('sarah_j').collection('goals').doc(item.id).set(item);
-      }
-
-      // Seed challenges for sarah_j
-      const challengesItems = [
-        { id: '1', progress: 0.60, completed: false },
-        { id: '2', progress: 0.00, completed: false },
-        { id: '3', progress: 0.85, completed: false }
-      ];
-      for (const item of challengesItems) {
-        await dbInstance.collection('users').doc('sarah_j').collection('challenges').doc(item.id).set(item);
-      }
-      console.log("Firestore seeding finished successfully.");
-    } else {
-      console.log("Firestore is not empty. Skipping seeding.");
-    }
-  } catch (err) {
-    console.error("Firestore seeding failed:", err);
-  }
-}
-
-// Load Firebase credentials (either from env variable or local json file)
-let serviceAccount = null;
-
-if (process.env.FIREBASE_SERVICE_ACCOUNT) {
-  try {
-    serviceAccount = JSON.parse(process.env.FIREBASE_SERVICE_ACCOUNT);
-    console.log("Firebase service credentials loaded from FIREBASE_SERVICE_ACCOUNT environment variable.");
-  } catch (err) {
-    console.error("Failed to parse FIREBASE_SERVICE_ACCOUNT environment variable:", err);
-  }
-}
-
-const keyPath = path.join(__dirname, 'firebase-key.json');
-if (!serviceAccount && fs.existsSync(keyPath)) {
-  try {
-    serviceAccount = require(keyPath);
-    console.log("Firebase service credentials loaded from firebase-key.json.");
-  } catch (err) {
-    console.error("Failed to load firebase-key.json:", err);
-  }
-}
-
-if (serviceAccount && process.env.NODE_ENV !== 'test') {
-  try {
-    initializeApp({
-      credential: cert(serviceAccount)
-    });
-    db = getFirestore();
-    console.log("=========================================");
-    console.log(" EcoTrack AI Connected to Firebase Firestore");
-    console.log("=========================================");
-    
-    // Seed real Firestore asynchronously
-    seedRealFirestore(db);
-  } catch (err) {
-    console.error("Firebase init failed, falling back to local file db:", err);
-  }
-}
-
-if (!db) {
-  db = mockFirestore;
-  console.log("=========================================");
-  console.log(" EcoTrack AI Running with Local Mock Firestore");
-  console.log(" DB File: backend/database.json");
-  console.log(" Add firebase-key.json to backend/ to connect to real Firestore.");
-  console.log("=========================================");
-}
-
-module.exports = db;
-

backend/package.json

@@ -1,26 +1,44 @@
 {
-  "name": "ecotrack-backend",
+  "name": "ecoguide-backend",
   "version": "1.0.0",
-  "main": "server.js",
+  "description": "EcoGuide AI Backend API",
+  "main": "src/index.js",
+  "type": "module",
   "scripts": {
-    "start": "node server.js",
-    "dev": "nodemon server.js",
-    "test": "jest --runInBand --detectOpenHandles --forceExit"
+    "dev": "node --watch src/index.js",
+    "build": "prisma generate",
+    "start": "node src/index.js",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "lint": "eslint src --report-unused-disable-directives --max-warnings 0",
+    "db:generate": "prisma generate",
+    "db:migrate": "prisma migrate dev",
+    "db:migrate:prod": "prisma migrate deploy",
+    "db:seed": "node prisma/seed.js",
+    "db:studio": "prisma studio",
+    "db:reset": "prisma migrate reset --force"
   },
   "dependencies": {
-    "compression": "^1.8.1",
+    "@prisma/client": "^5.9.1",
     "cors": "^2.8.5",
-    "express": "^4.21.2",
-    "express-rate-limit": "^8.5.2",
+    "dotenv": "^16.4.1",
+    "express": "^4.18.2",
+    "express-rate-limit": "^7.1.5",
     "firebase-admin": "^14.0.0",
-    "helmet": "^8.2.0",
-    "hpp": "^0.2.3",
-    "morgan": "^1.10.0"
+    "groq-sdk": "^1.2.1",
+    "helmet": "^7.1.0",
+    "morgan": "^1.10.0",
+    "zod": "^3.22.4"
   },
   "devDependencies": {
-    "jest": "^30.4.2",
-    "nodemon": "^3.1.9",
-    "supertest": "^7.2.2"
+    "@vitest/coverage-v8": "^1.2.1",
+    "eslint": "^8.57.0",
+    "prisma": "^5.9.1",
+    "supertest": "^6.3.4",
+    "vitest": "^1.2.1"
   },
-  "private": true
+  "engines": {
+    "node": ">=18.0.0"
+  }
 }

backend/prisma/migrations/20260616130754_init/migration.sql

@@ -0,0 +1,89 @@
+-- CreateTable
+CREATE TABLE "users" (
+    "id" TEXT NOT NULL,
+    "name" TEXT NOT NULL,
+    "email" TEXT NOT NULL,
+    "created_at" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updated_at" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "users_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "assessments" (
+    "id" TEXT NOT NULL,
+    "user_id" TEXT NOT NULL,
+    "daily_car_km" DOUBLE PRECISION NOT NULL DEFAULT 0,
+    "car_fuel_type" TEXT NOT NULL DEFAULT 'none',
+    "public_transport_km_per_week" DOUBLE PRECISION NOT NULL DEFAULT 0,
+    "cycling_km_per_week" DOUBLE PRECISION NOT NULL DEFAULT 0,
+    "short_flights_per_year" INTEGER NOT NULL DEFAULT 0,
+    "long_flights_per_year" INTEGER NOT NULL DEFAULT 0,
+    "monthly_electricity_kwh" DOUBLE PRECISION NOT NULL DEFAULT 0,
+    "renewable_percentage" DOUBLE PRECISION NOT NULL DEFAULT 0,
+    "diet_type" TEXT NOT NULL DEFAULT 'mixed',
+    "clothing_items_per_year" INTEGER NOT NULL DEFAULT 0,
+    "electronics_items_per_year" INTEGER NOT NULL DEFAULT 0,
+    "transport_emission" DOUBLE PRECISION NOT NULL,
+    "energy_emission" DOUBLE PRECISION NOT NULL,
+    "food_emission" DOUBLE PRECISION NOT NULL,
+    "shopping_emission" DOUBLE PRECISION NOT NULL,
+    "total_emission" DOUBLE PRECISION NOT NULL,
+    "sustainability_score" INTEGER NOT NULL,
+    "created_at" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "assessments_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "recommendations" (
+    "id" TEXT NOT NULL,
+    "assessment_id" TEXT NOT NULL,
+    "title" TEXT NOT NULL,
+    "description" TEXT NOT NULL,
+    "estimated_savings" DOUBLE PRECISION NOT NULL,
+    "priority" TEXT NOT NULL,
+    "category" TEXT NOT NULL,
+    "created_at" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "recommendations_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "simulations" (
+    "id" TEXT NOT NULL,
+    "assessment_id" TEXT NOT NULL,
+    "scenario_name" TEXT NOT NULL,
+    "scenario_params" JSONB NOT NULL,
+    "original_emission" DOUBLE PRECISION NOT NULL,
+    "projected_emission" DOUBLE PRECISION NOT NULL,
+    "reduction_percentage" DOUBLE PRECISION NOT NULL,
+    "annual_savings_kg" DOUBLE PRECISION NOT NULL,
+    "created_at" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "simulations_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "users_email_key" ON "users"("email");
+
+-- CreateIndex
+CREATE INDEX "assessments_user_id_idx" ON "assessments"("user_id");
+
+-- CreateIndex
+CREATE INDEX "assessments_created_at_idx" ON "assessments"("created_at");
+
+-- CreateIndex
+CREATE INDEX "recommendations_assessment_id_idx" ON "recommendations"("assessment_id");
+
+-- CreateIndex
+CREATE INDEX "simulations_assessment_id_idx" ON "simulations"("assessment_id");
+
+-- AddForeignKey
+ALTER TABLE "assessments" ADD CONSTRAINT "assessments_user_id_fkey" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "recommendations" ADD CONSTRAINT "recommendations_assessment_id_fkey" FOREIGN KEY ("assessment_id") REFERENCES "assessments"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "simulations" ADD CONSTRAINT "simulations_assessment_id_fkey" FOREIGN KEY ("assessment_id") REFERENCES "assessments"("id") ON DELETE CASCADE ON UPDATE CASCADE;

backend/prisma/migrations/migration_lock.toml

@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"

backend/prisma/schema.prisma

@@ -0,0 +1,85 @@
+// This is your Prisma schema file,
+// learn more about it in the docs: https://pris.ly/d/prisma-schema
+
+generator client {
+  provider = "prisma-client-js"
+}
+
+datasource db {
+  provider  = "postgresql"
+  url       = env("DATABASE_URL")
+}
+
+model User {
+  id          String       @id @default(cuid())
+  name        String
+  email       String       @unique
+  createdAt   DateTime     @default(now()) @map("created_at")
+  updatedAt   DateTime     @updatedAt @map("updated_at")
+  assessments Assessment[]
+
+  @@map("users")
+}
+
+model Assessment {
+  id                  String           @id @default(cuid())
+  userId              String           @map("user_id")
+  // Input data
+  dailyCarKm          Float            @default(0) @map("daily_car_km")
+  carFuelType         String           @default("none") @map("car_fuel_type")
+  publicTransportKmPerWeek Float       @default(0) @map("public_transport_km_per_week")
+  cyclingKmPerWeek    Float            @default(0) @map("cycling_km_per_week")
+  shortFlightsPerYear Int              @default(0) @map("short_flights_per_year")
+  longFlightsPerYear  Int              @default(0) @map("long_flights_per_year")
+  monthlyElectricityKwh Float          @default(0) @map("monthly_electricity_kwh")
+  renewablePercentage Float            @default(0) @map("renewable_percentage")
+  dietType            String           @default("mixed") @map("diet_type")
+  clothingItemsPerYear Int             @default(0) @map("clothing_items_per_year")
+  electronicsItemsPerYear Int          @default(0) @map("electronics_items_per_year")
+  // Calculated emissions (kg CO2 per year)
+  transportEmission   Float            @map("transport_emission")
+  energyEmission      Float            @map("energy_emission")
+  foodEmission        Float            @map("food_emission")
+  shoppingEmission    Float            @map("shopping_emission")
+  totalEmission       Float            @map("total_emission")
+  sustainabilityScore Int              @map("sustainability_score")
+  createdAt           DateTime         @default(now()) @map("created_at")
+  user                User             @relation(fields: [userId], references: [id], onDelete: Cascade)
+  recommendations     Recommendation[]
+  simulations         Simulation[]
+
+  @@index([userId])
+  @@index([createdAt])
+  @@map("assessments")
+}
+
+model Recommendation {
+  id               String     @id @default(cuid())
+  assessmentId     String     @map("assessment_id")
+  title            String
+  description      String
+  estimatedSavings Float      @map("estimated_savings")
+  priority         String     // HIGH | MEDIUM | LOW
+  category         String     // transport | energy | food | shopping
+  createdAt        DateTime   @default(now()) @map("created_at")
+  assessment       Assessment @relation(fields: [assessmentId], references: [id], onDelete: Cascade)
+
+  @@index([assessmentId])
+  @@map("recommendations")
+}
+
+model Simulation {
+  id                 String     @id @default(cuid())
+  assessmentId       String     @map("assessment_id")
+  scenarioName       String     @map("scenario_name")
+  scenarioParams     Json       @map("scenario_params")
+  originalEmission   Float      @map("original_emission")
+  projectedEmission  Float      @map("projected_emission")
+  reductionPercentage Float     @map("reduction_percentage")
+  annualSavingsKg    Float      @map("annual_savings_kg")
+  createdAt          DateTime   @default(now()) @map("created_at")
+  assessment         Assessment @relation(fields: [assessmentId], references: [id], onDelete: Cascade)
+
+  @@index([assessmentId])
+  @@map("simulations")
+}

backend/prisma/seed.js

@@ -0,0 +1,166 @@
+import 'dotenv/config';
+import { PrismaClient } from '@prisma/client';
+
+const prisma = new PrismaClient();
+
+const users = [
+  { name: 'Alice Green', email: 'alice@ecoguide.ai' },
+  { name: 'Bob Carbon', email: 'bob@ecoguide.ai' },
+  { name: 'Carol Earth', email: 'carol@ecoguide.ai' },
+];
+
+const assessmentTemplates = [
+  {
+    // Low carbon user
+    dailyCarKm: 0,
+    carFuelType: 'none',
+    publicTransportKmPerWeek: 60,
+    cyclingKmPerWeek: 40,
+    shortFlightsPerYear: 0,
+    longFlightsPerYear: 0,
+    monthlyElectricityKwh: 120,
+    renewablePercentage: 80,
+    dietType: 'vegan',
+    clothingItemsPerYear: 5,
+    electronicsItemsPerYear: 0,
+  },
+  {
+    // Average user
+    dailyCarKm: 20,
+    carFuelType: 'petrol',
+    publicTransportKmPerWeek: 20,
+    cyclingKmPerWeek: 10,
+    shortFlightsPerYear: 2,
+    longFlightsPerYear: 1,
+    monthlyElectricityKwh: 250,
+    renewablePercentage: 10,
+    dietType: 'mixed',
+    clothingItemsPerYear: 12,
+    electronicsItemsPerYear: 1,
+  },
+  {
+    // High carbon user
+    dailyCarKm: 50,
+    carFuelType: 'petrol',
+    publicTransportKmPerWeek: 0,
+    cyclingKmPerWeek: 0,
+    shortFlightsPerYear: 6,
+    longFlightsPerYear: 3,
+    monthlyElectricityKwh: 500,
+    renewablePercentage: 0,
+    dietType: 'heavy_meat',
+    clothingItemsPerYear: 40,
+    electronicsItemsPerYear: 4,
+  },
+];
+
+// Calculate emissions inline for seeding
+function calcTransport(d) {
+  const carFactors = { petrol: 0.21, diesel: 0.17, electric: 0.047, hybrid: 0.105, none: 0 };
+  const car = d.dailyCarKm * (carFactors[d.carFuelType] ?? 0) * 365;
+  const pt = d.publicTransportKmPerWeek * 52 * 0.089;
+  const flights = d.shortFlightsPerYear * 255 + d.longFlightsPerYear * 1620;
+  return Math.round(car + pt + flights);
+}
+
+function calcEnergy(d) {
+  return Math.round(d.monthlyElectricityKwh * 12 * 0.233 * (1 - d.renewablePercentage / 100));
+}
+
+function calcFood(d) {
+  return { vegan: 1500, vegetarian: 1700, mixed: 2500, heavy_meat: 3300 }[d.dietType];
+}
+
+function calcShopping(d) {
+  return Math.round(d.clothingItemsPerYear * 33 + d.electronicsItemsPerYear * 300);
+}
+
+function calcScore(total) {
+  if (total <= 2000) return 100;
+  if (total >= 12000) return 0;
+  if (total <= 3000) return Math.round(90 + ((3000 - total) / 1000) * 10);
+  if (total <= 5000) return Math.round(70 + ((5000 - total) / 2000) * 20);
+  if (total <= 7500) return Math.round(50 + ((7500 - total) / 2500) * 20);
+  return Math.round(((12000 - total) / 4500) * 50);
+}
+
+async function seed() {
+  console.log('🌱 Starting seed...');
+
+  // Clean existing data
+  await prisma.simulation.deleteMany();
+  await prisma.recommendation.deleteMany();
+  await prisma.assessment.deleteMany();
+  await prisma.user.deleteMany({ where: { email: { in: users.map((u) => u.email) } } });
+
+  for (let i = 0; i < users.length; i++) {
+    const user = await prisma.user.create({ data: users[i] });
+    console.log(`✅ Created user: ${user.name}`);
+
+    // Create 2 assessments per user (at different dates)
+    for (let j = 0; j < 2; j++) {
+      const template = assessmentTemplates[i];
+      // Slightly vary the second assessment to simulate improvement
+      const assessData =
+        j === 0
+          ? template
+          : {
+              ...template,
+              dailyCarKm: Math.max(0, template.dailyCarKm - 5),
+              monthlyElectricityKwh: Math.max(0, template.monthlyElectricityKwh - 20),
+            };
+
+      const transport = calcTransport(assessData);
+      const energy = calcEnergy(assessData);
+      const food = calcFood(assessData);
+      const shopping = calcShopping(assessData);
+      const total = transport + energy + food + shopping;
+      const score = calcScore(total);
+
+      await prisma.assessment.create({
+        data: {
+          userId: user.id,
+          ...assessData,
+          transportEmission: transport,
+          energyEmission: energy,
+          foodEmission: food,
+          shoppingEmission: shopping,
+          totalEmission: total,
+          sustainabilityScore: score,
+          createdAt: new Date(Date.now() - (j === 0 ? 30 : 0) * 24 * 60 * 60 * 1000),
+          recommendations: {
+            create: [
+              {
+                title: 'Example: Switch to Renewable Energy',
+                description:
+                  'Sign up for a green energy tariff to reduce electricity emissions significantly.',
+                estimatedSavings: Math.round(energy * 0.7),
+                priority: 'HIGH',
+                category: 'energy',
+              },
+              {
+                title: 'Example: Reduce Meat Consumption',
+                description: 'Cutting red meat 3 days per week can save hundreds of kg CO₂/year.',
+                estimatedSavings: 500,
+                priority: 'MEDIUM',
+                category: 'food',
+              },
+            ],
+          },
+        },
+      });
+    }
+    console.log(`  ✅ Created assessments for ${user.name}`);
+  }
+
+  const count = await prisma.user.count();
+  const assessCount = await prisma.assessment.count();
+  console.log(`\n🎉 Seed complete! ${count} users, ${assessCount} assessments created.`);
+}
+
+seed()
+  .catch((e) => {
+    console.error('❌ Seed failed:', e);
+    process.exit(1);
+  })
+  .finally(() => prisma.$disconnect());

backend/requirements.txt

@@ -1,10 +0,0 @@
-# This is a Node.js (JavaScript) backend service.
-# Node.js backend dependencies are defined and installed using "backend/package.json".
-# To deploy this service in Hugging Face (HF) Spaces, use a "Docker" space template 
-# which will automatically build and run the backend using the provided "backend/Dockerfile".
-
-# Listed below are the Node.js backend requirements:
-cors==2.8.5
-express==4.21.2
-firebase-admin==14.0.0
-morgan==1.10.0

backend/routes.js

@@ -1,1008 +0,0 @@
-const express = require('express');
-const router = express.Router();
-const db = require('./firebase');
-
-// Simple in-memory cache for Firestore queries to optimize efficiency
-let usersCache = null;
-let usersCacheTime = 0;
-const CACHE_TTL = 10000; // 10 seconds
-
-/**
- * Retrieves all users from Firestore with a short-lived cache (10 seconds)
- * to optimize read efficiency and limit database requests.
- * @returns {Promise<Array<Object>>} A list of all user profiles.
- */
-async function getAllUsersCached() {
-  const now = Date.now();
-  if (usersCache && (now - usersCacheTime < CACHE_TTL)) {
-    return usersCache;
-  }
-  const snapshot = await db.collection('users').get();
-  usersCache = snapshot.docs.map(doc => {
-    const data = doc.data();
-    return {
-      id: doc.id,
-      name: data.name || doc.id,
-      email: data.email || '',
-      avatar: data.avatar || 'https://lh3.googleusercontent.com/aida-public/AB6AXuAT1EPgeHbiCyiDKLGp868IabVBLWQJe-FbA4S09aQJipuS6tXAJnHYJnoD4VL-TBLlnzm4xoCEkS_WlOmVhbeXjuNHry4GZPGKfJ5_iQ8X-fVs2ZENwqa0MK2sTi6dgD_hmctOs2tY1U0dbsRFDclOP1Sy81nI9zy56ULwxCR3EAsmngeA71gDstnUUoOs0PVxPurXRdI32iJ5ScLE0CjWgOYh6n808_7lSn7PlX4m0EkobLUHN1beT5h43E4UGhZjiUdK2JjYPK9R',
-      points: data.points || 0,
-      title: data.title || 'Eco Novice',
-      percentages: data.percentages || { transport: 20, electricity: 20, food: 20, waste: 20, shopping: 20 },
-      complianceRate: data.complianceRate || '80.0%',
-      totalMonthly: data.totalMonthly || 0
-    };
-  });
-  usersCacheTime = now;
-  return usersCache;
-}
-
-// ==========================================
-// Static Config Presets & Challenges Templates
-// ==========================================
-const staticConfig = {
-  factors: {
-    car: 0.16,
-    bus: 0.08,
-    bike: 0.005,
-    walk: 0.0,
-    train: 0.04,
-    ev: 0.02,
-  },
-  multipliers: {
-    electric: 0.3,
-    hybrid: 0.6,
-    gasoline: 1.0,
-    diesel: 1.2,
-    lpg: 0.8,
-  }
-};
-
-const defaultChallenges = [
-  {
-    id: '1',
-    title: 'No-Car Week',
-    points: '+500 pts',
-    pointsValue: 500,
-    timeLeft: '4 days left',
-    icon: 'directions-car',
-    color: '#4edea3',
-    bgColor: 'rgba(78, 222, 163, 0.15)',
-    associatedBadge: 'Carbon Ninja',
-  },
-  {
-    id: '2',
-    title: 'Vegan Weekend',
-    points: '+250 pts',
-    pointsValue: 250,
-    timeLeft: 'Starts in 12h',
-    icon: 'eco',
-    color: '#ffb95f',
-    bgColor: 'rgba(255, 185, 95, 0.15)',
-    associatedBadge: 'Tree Planter',
-  },
-  {
-    id: '3',
-    title: 'Plastic-Free',
-    points: '+400 pts',
-    pointsValue: 400,
-    timeLeft: '2 days left',
-    icon: 'shopping-bag',
-    color: '#4edea3',
-    bgColor: 'rgba(78, 222, 163, 0.15)',
-    associatedBadge: 'Zero Waste',
-  },
-];
-
-/**
- * Helper to retrieve the active user ID from request headers or query params
- * @param {express.Request} req - Express request object
- * @returns {string} active user ID
- */
-function getRequestUserId(req) {
-  return req.headers['x-user-id'] || req.query.userId || 'sarah_j';
-}
-
-// ==========================================
-// API Endpoints (Firestore Powered)
-// ==========================================
-
-/**
- * GET /api/config
- * Retrieves carbon footprint factors and multipliers configuration presets.
- * @route GET /api/config
- * @returns {Object} 200 - Static config presets
- */
-router.get('/config', (req, res) => {
-  res.json(staticConfig);
-});
-
-/**
- * GET /api/profile
- * Retrieves profile information for the active user, creating a default one if not found.
- * @route GET /api/profile
- * @returns {Object} 200 - User profile data object
- * @returns {Object} 500 - Internal server error
- */
-router.get('/profile', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  try {
-    const userDoc = await db.collection('users').doc(userId).get();
-    if (userDoc.exists) {
-      res.json(userDoc.data());
-    } else {
-      // Create a new user template if not exists
-      const defaultProfile = {
-        email: `${userId}@example.com`,
-        name: userId.split('_').map(w => w.charAt(0).toUpperCase() + w.slice(1)).join(' '),
-        avatar: 'https://lh3.googleusercontent.com/aida-public/AB6AXuAT1EPgeHbiCyiDKLGp868IabVBLWQJe-FbA4S09aQJipuS6tXAJnHYJnoD4VL-TBLlnzm4xoCEkS_WlOmVhbeXjuNHry4GZPGKfJ5_iQ8X-fVs2ZENwqa0MK2sTi6dgD_hmctOs2tY1U0dbsRFDclOP1Sy81nI9zy56ULwxCR3EAsmngeA71gDstnUUoOs0PVxPurXRdI32iJ5ScLE0CjWgOYh6n808_7lSn7PlX4m0EkobLUHN1beT5h43E4UGhZjiUdK2JjYPK9R',
-        title: 'Eco Novice',
-        points: 0,
-        badges: [],
-        percentages: { transport: 20, electricity: 20, food: 20, waste: 20, shopping: 20 },
-        complianceRate: '80.0%',
-        totalMonthly: 0
-      };
-      await db.collection('users').doc(userId).set(defaultProfile);
-      res.json(defaultProfile);
-    }
-  } catch (err) {
-    next(err);
-  }
-});
-
-let statsCache = null;
-let statsCacheTime = 0;
-
-/**
- * GET /api/stats
- * Retrieves global platform usage/sustainability metrics for the landing page.
- * Uses a short-lived cache (10 seconds).
- * @route GET /api/stats
- * @returns {Object} 200 - Global metrics payload
- */
-router.get('/stats', async (req, res) => {
-  const now = Date.now();
-  if (statsCache && (now - statsCacheTime < 10000)) {
-    return res.json(statsCache);
-  }
-  try {
-    const users = await getAllUsersCached();
-    const userCount = users.length;
-    statsCache = {
-      globalReduction: '-14.2%',
-      globalSavedTons: '12 Tons',
-      activeProjectCount: `${Math.max(userCount * 12 + 50000, 50000).toLocaleString()}+`,
-      treesRestoredCount: `${Math.max(userCount, 8000).toLocaleString()}+`,
-      aiPrecision: '99.9%',
-    };
-    statsCacheTime = now;
-    res.json(statsCache);
-  } catch (err) {
-    res.json({
-      globalReduction: '-14.2%',
-      globalSavedTons: '12 Tons',
-      activeProjectCount: '50,000+',
-      treesRestoredCount: '8,000+',
-      aiPrecision: '99.9%',
-    });
-  }
-});
-
-/**
- * GET /api/insights
- * Retrieves current footprint total, compliance rate, carbon share percentages, and AI recommendations.
- * @route GET /api/insights
- * @returns {Object} 200 - User insights payload
- * @returns {Object} 500 - Internal server error
- */
-router.get('/insights', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  try {
-    const userDoc = await db.collection('users').doc(userId).get();
-    const userData = userDoc.exists ? userDoc.data() : {};
-    
-    const totalMonthly = userData.totalMonthly || 0;
-    const percentages = userData.percentages || { transport: 20, electricity: 20, food: 20, waste: 20, shopping: 20 };
-    
-    res.json({
-      totalMonthly: totalMonthly,
-      complianceRate: userData.complianceRate || '90.0%',
-      percentages: percentages,
-      recommendations: await generateRecommendations(totalMonthly, percentages)
-    });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * POST /api/carbon/calculate
- * Calculates carbon footprint based on transport, electricity, food, waste, and shopping habits.
- * @route POST /api/carbon/calculate
- * @param {Object} req.body - Footprint details
- * @returns {Object} 200 - Computation results with monthly/yearly emissions and category breakdowns
- * @returns {Object} 400 - Validation error payload
- */
-router.post('/carbon/calculate', (req, res) => {
-  const { transport, electricity, food, waste, shopping } = req.body;
-
-  // Validate transport inputs if provided
-  if (transport !== undefined) {
-    if (typeof transport !== 'object' || transport === null) {
-      return res.status(400).json({ error: 'Transport parameter must be an object' });
-    }
-    if (transport.distance !== undefined && (typeof transport.distance !== 'number' || transport.distance < 0 || isNaN(transport.distance))) {
-      return res.status(400).json({ error: 'Transport distance must be a valid positive number' });
-    }
-    if (transport.daysPerWeek !== undefined && (typeof transport.daysPerWeek !== 'number' || transport.daysPerWeek < 0 || transport.daysPerWeek > 7 || isNaN(transport.daysPerWeek))) {
-      return res.status(400).json({ error: 'Transport daysPerWeek must be a valid number between 0 and 7' });
-    }
-  }
-  // Validate electricity inputs if provided
-  if (electricity !== undefined) {
-    if (typeof electricity !== 'object' || electricity === null) {
-      return res.status(400).json({ error: 'Electricity parameter must be an object' });
-    }
-    if (electricity.units !== undefined && (typeof electricity.units !== 'number' || electricity.units < 0 || isNaN(electricity.units))) {
-      return res.status(400).json({ error: 'Electricity units must be a valid positive number' });
-    }
-  }
-  // Validate food inputs if provided
-  if (food !== undefined && (typeof food !== 'object' || food === null)) {
-    return res.status(400).json({ error: 'Food parameter must be an object' });
-  }
-  // Validate waste inputs if provided
-  if (waste !== undefined && (typeof waste !== 'object' || waste === null)) {
-    return res.status(400).json({ error: 'Waste parameter must be an object' });
-  }
-  // Validate shopping inputs if provided
-  if (shopping !== undefined && (typeof shopping !== 'object' || shopping === null)) {
-    return res.status(400).json({ error: 'Shopping parameter must be an object' });
-  }
-
-  // Compute Transport
-  const tMode = transport?.mode || 'car';
-  const tDist = transport?.distance || 0;
-  const tFuel = transport?.fuelType || 'gasoline';
-  const tDays = transport?.daysPerWeek || 5;
-
-  let tFactor = staticConfig.factors[tMode] || 0;
-  let tMultiplier = 1.0;
-  if (tMode === 'car' || tMode === 'bus') {
-    tMultiplier = staticConfig.multipliers[tFuel] || 1.0;
-  }
-  const transportMonthly = tFactor * tDist * tMultiplier * tDays * 4.3;
-
-  // Compute Electricity (monthly kWh units)
-  const eUnits = electricity?.units || 0;
-  const electricityMonthly = eUnits * 0.85;
-
-  // Compute Food
-  const fType = food?.type || 'vegetarian';
-  const fChicken = food?.chicken || 0;
-  const fMutton = food?.mutton || 0;
-  const fBeef = food?.beef || 0;
-  const fFish = food?.fish || 0;
-
-  let baseFood = 100;
-  if (fType === 'vegan') baseFood = 60;
-  if (fType === 'non-vegetarian') baseFood = 150;
-  const foodMonthly = baseFood + (fChicken * 4) + (fMutton * 10) + (fBeef * 25) + (fFish * 3);
-
-  // Compute Waste
-  const wPlastic = waste?.plasticUsage || 5;
-  const wRecycle = waste?.recyclingHabits || 'partial';
-  const recycleOffset = wRecycle === 'none' ? 12 : wRecycle === 'partial' ? 6 : 0;
-  const wasteMonthly = (wPlastic * 4) + recycleOffset;
-
-  // Compute Shopping
-  const sClothes = shopping?.clothes || 0;
-  const sOrders = shopping?.onlineOrders || 0;
-  const sElectronics = shopping?.electronics || 0;
-  const shoppingMonthly = (sClothes * 10) + (sOrders * 2) + (sElectronics * 80);
-
-  // Totals
-  const monthlyEmission = transportMonthly + electricityMonthly + foodMonthly + wasteMonthly + shoppingMonthly;
-  const yearlyEmission = monthlyEmission * 12;
-
-  const breakdown = {
-    transport: parseFloat(transportMonthly.toFixed(1)),
-    electricity: parseFloat(electricityMonthly.toFixed(1)),
-    food: parseFloat(foodMonthly.toFixed(1)),
-    waste: parseFloat(wasteMonthly.toFixed(1)),
-    shopping: parseFloat(shoppingMonthly.toFixed(1)),
-  };
-
-  res.json({
-    monthlyEmission: parseFloat(monthlyEmission.toFixed(1)),
-    yearlyEmission: parseFloat(yearlyEmission.toFixed(1)),
-    breakdown
-  });
-});
-
-/**
- * POST /api/footprint/save
- * Saves a footprint calculation to database history and updates user stats / points.
- * @route POST /api/footprint/save
- * @param {Object} req.body - Footprint computation values to store
- * @returns {Object} 200 - Saved status, updated history, and updated profile
- * @returns {Object} 400 - Validation error payload
- * @returns {Object} 500 - Internal server error
- */
-router.post('/footprint/save', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  const { monthlyEmission, breakdown } = req.body;
-
-  if (monthlyEmission === undefined || typeof monthlyEmission !== 'number' || monthlyEmission < 0 || isNaN(monthlyEmission)) {
-    return res.status(400).json({ error: 'monthlyEmission must be a valid positive number' });
-  }
-  if (breakdown !== undefined && (typeof breakdown !== 'object' || breakdown === null)) {
-    return res.status(400).json({ error: 'breakdown must be a valid object' });
-  }
-
-  try {
-    const currentMonthName = 'Jun';
-    
-    // Save to subcollection history
-    await db.collection('users').doc(userId).collection('history').doc(currentMonthName).set({
-      month: currentMonthName,
-      amount: Math.round(monthlyEmission)
-    });
-
-    // Update user profile summary in firestore
-    const userDoc = await db.collection('users').doc(userId).get();
-    const profile = userDoc.exists ? userDoc.data() : {};
-
-    let newPercentages = profile.percentages || { transport: 20, electricity: 20, food: 20, waste: 20, shopping: 20 };
-    if (breakdown) {
-      const total = Object.values(breakdown).reduce((a, b) => a + b, 0);
-      if (total > 0) {
-        newPercentages = {
-          transport: Math.round((breakdown.transport / total) * 100),
-          electricity: Math.round((breakdown.electricity / total) * 100),
-          food: Math.round((breakdown.food / total) * 100),
-          waste: Math.round((breakdown.waste / total) * 100),
-          shopping: Math.round((breakdown.shopping / total) * 100),
-        };
-      }
-    }
-
-    const updatedPoints = (profile.points || 0) + 100;
-    const currentTitle = updatedPoints >= 12000 ? 'Master Guardian' : updatedPoints >= 11000 ? 'Nature Enthusiast' : 'Eco Novice';
-
-    const updatedProfile = {
-      ...profile,
-      points: updatedPoints,
-      title: currentTitle,
-      totalMonthly: Math.round(monthlyEmission),
-      percentages: newPercentages
-    };
-
-    await db.collection('users').doc(userId).set(updatedProfile);
-    usersCache = null; // Invalidate cache
-
-    // Fetch updated history list
-    const snapshot = await db.collection('users').doc(userId).collection('history').get();
-    const historyList = snapshot.docs.map(doc => doc.data());
-
-    res.json({
-      success: true,
-      history: historyList,
-      profile: updatedProfile
-    });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * GET /api/history
- * Retrieves the historical timeline of carbon calculation submissions.
- * @route GET /api/history
- * @returns {Array<Object>} 200 - Array of historical emission data points
- * @returns {Object} 500 - Internal server error
- */
-router.get('/history', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  try {
-    const snapshot = await db.collection('users').doc(userId).collection('history').get();
-    const historyList = snapshot.docs.map(doc => doc.data());
-    
-    const monthOrder = { Jan: 1, Feb: 2, Mar: 3, Apr: 4, May: 5, Jun: 6, Jul: 7, Aug: 8, Sep: 9, Oct: 10, Nov: 11, Dec: 12 };
-    historyList.sort((a, b) => (monthOrder[a.month] || 0) - (monthOrder[b.month] || 0));
-
-    // Seed default history data for Sarah J if database is fresh
-    if (historyList.length === 0 && userId === 'sarah_j') {
-      const defaultHistory = [
-        { month: 'Jan', amount: 155 },
-        { month: 'Feb', amount: 145 },
-        { month: 'Mar', amount: 130 },
-        { month: 'Apr', amount: 125 },
-        { month: 'May', amount: 112 },
-        { month: 'Jun', amount: 98 }
-      ];
-      // Save it asynchronously
-      for (const record of defaultHistory) {
-        await db.collection('users').doc(userId).collection('history').doc(record.month).set(record);
-      }
-      return res.json(defaultHistory);
-    }
-
-    res.json(historyList);
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * GET /api/goals
- * Retrieves active carbon reduction goals for the current user.
- * @route GET /api/goals
- * @returns {Array<Object>} 200 - List of active goals
- * @returns {Object} 500 - Internal server error
- */
-router.get('/goals', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  try {
-    const snapshot = await db.collection('users').doc(userId).collection('goals').get();
-    const goalsList = snapshot.docs.map(doc => doc.data());
-
-    // Seed default goals for Sarah J if database is fresh
-    if (goalsList.length === 0 && userId === 'sarah_j') {
-      const defaultGoals = [
-        { id: '1', title: 'Reduce footprint by 20%', progress: 0.75, target: '20% Reduction' },
-        { id: '2', title: 'Cycle 3 days/week', progress: 0.40, target: '3 Days/Week' }
-      ];
-      for (const goal of defaultGoals) {
-        await db.collection('users').doc(userId).collection('goals').doc(goal.id).set(goal);
-      }
-      return res.json(defaultGoals);
-    }
-
-    res.json(goalsList);
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * POST /api/goals
- * Adds a new carbon reduction goal for the current user and awards 50 points.
- * @route POST /api/goals
- * @param {Object} req.body - Goal metadata (title, target)
- * @returns {Object} 200 - Goal creation success status, list of goals, and updated profile
- * @returns {Object} 400 - Validation error payload
- * @returns {Object} 500 - Internal server error
- */
-router.post('/goals', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  const { title, target } = req.body;
-  
-  if (!title || typeof title !== 'string' || !title.trim()) {
-    return res.status(400).json({ error: 'Goal title must be a valid non-empty string' });
-  }
-  if (title.length > 100) {
-    return res.status(400).json({ error: 'Goal title must be under 100 characters' });
-  }
-  if (target !== undefined && (typeof target !== 'string' || target.length > 50)) {
-    return res.status(400).json({ error: 'Goal target must be a valid string under 50 characters' });
-  }
-
-  const sanitizedTitle = title.replace(/<[^>]*>/g, '').trim();
-  const sanitizedTarget = (target || '').replace(/<[^>]*>/g, '').trim();
-
-  try {
-    const snapshot = await db.collection('users').doc(userId).collection('goals').get();
-    const newId = String(snapshot.docs.length + 1);
-
-    const newGoal = {
-      id: newId,
-      title: sanitizedTitle,
-      progress: 0.0,
-      target: sanitizedTarget || 'Active Target'
-    };
-
-    await db.collection('users').doc(userId).collection('goals').doc(newId).set(newGoal);
-    usersCache = null; // Invalidate cache
-
-    // Reward profile points
-    const userDoc = await db.collection('users').doc(userId).get();
-    const profile = userDoc.exists ? userDoc.data() : { points: 0 };
-    const updatedPoints = (profile.points || 0) + 50;
-    const currentTitle = updatedPoints >= 12000 ? 'Master Guardian' : updatedPoints >= 11000 ? 'Nature Enthusiast' : 'Eco Novice';
-
-    const updatedProfile = {
-      ...profile,
-      points: updatedPoints,
-      title: currentTitle
-    };
-    await db.collection('users').doc(userId).set(updatedProfile);
-
-    const updatedSnapshot = await db.collection('users').doc(userId).collection('goals').get();
-    const goalsList = updatedSnapshot.docs.map(doc => doc.data());
-
-    res.json({ success: true, goal: newGoal, goals: goalsList, profile: updatedProfile });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * Helper to generate AI sustainability recommendations using Groq's Llama model or static fallbacks.
- * @param {number} footprint - Monthly carbon footprint in kg CO2e
- * @param {Object} breakdown - Breakdown percentages per carbon category
- * @returns {Promise<Array<Object>>} A promise that resolves to exactly 3 recommendations
- */
-async function generateRecommendations(footprint, breakdown) {
-  const apiKey = process.env.GROQ_API_KEY;
-  if (apiKey) {
-    try {
-      const response = await fetch('https://api.groq.com/openai/v1/chat/completions', {
-        method: 'POST',
-        headers: {
-          'Authorization': `Bearer ${apiKey}`,
-          'Content-Type': 'application/json'
-        },
-        body: JSON.stringify({
-          model: 'llama-3.1-8b-instant',
-          messages: [
-            {
-              role: 'system',
-              content: 'You are an expert AI Sustainability Coach. You analyze a user\'s carbon footprint (in kg CO2e) and category percentage breakdown (transport, electricity, food, waste, shopping). You must return exactly 3 highly actionable, personalized recommendations to help the user reduce their footprint. Return the recommendations as a JSON object containing a "recommendations" array. Each recommendation in the array must be an object with fields: "title" (under 40 characters), "desc" (1-2 sentences with concrete tips), "icon" (MaterialIcons icon name), and "color" (hex color code).'
-            },
-            {
-              role: 'user',
-              content: `Carbon Footprint: ${footprint} kg CO2e. Percentage breakdown: Transport: ${breakdown?.transport || 0}%, Electricity: ${breakdown?.electricity || 0}%, Food: ${breakdown?.food || 0}%, Waste: ${breakdown?.waste || 0}%, Shopping: ${breakdown?.shopping || 0}%.`
-            }
-          ],
-          response_format: { type: 'json_object' }
-        })
-      });
-      if (response.ok) {
-        const data = await response.json();
-        const content = JSON.parse(data.choices[0].message.content);
-        if (content && Array.isArray(content.recommendations) && content.recommendations.length > 0) {
-          return content.recommendations;
-        }
-      } else {
-        console.error('Groq API responded with error:', response.status, await response.text());
-      }
-    } catch (err) {
-      console.error('Error fetching Groq recommendation:', err);
-    }
-  }
-
-  // Fallback to static recommendations
-  const transportPct = breakdown?.transport || 45;
-  const electricityPct = breakdown?.electricity || 20;
-  const foodPct = breakdown?.food || 20;
-
-  const recs = [];
-
-  if (transportPct >= 35) {
-    recs.push({
-      title: 'Transport contributes most emissions',
-      desc: `Your transport makes up ${transportPct}% of your footprint. Switching to public transport or walking twice a week could reduce your annual emissions by approximately 120 kg CO₂.`,
-      icon: 'directions-transit',
-      color: '#ffb95f'
-    });
-  } else {
-    recs.push({
-      title: 'Eco commute recommendation',
-      desc: 'You are doing great on travel! Consider joining the No-Car Week challenge to earn 500 extra points and claim a Carbon Ninja badge.',
-      icon: 'stars',
-      color: '#4edea3'
-    });
-  }
-
-  if (electricityPct >= 20) {
-    recs.push({
-      title: 'Optimize energy consumption',
-      desc: 'Your electricity is a key footprint contributor. Replacing current lighting with smart LEDs can save another 35 kg CO₂ yearly.',
-      icon: 'lightbulb',
-      color: '#4edea3'
-    });
-  } else {
-    recs.push({
-      title: 'Solar offset suggestion',
-      desc: 'Offset your remaining electricity emissions by investing in fractional green energy grids for an estimated 15% ROI.',
-      icon: 'wb-sunny',
-      color: '#89ceff'
-    });
-  }
-
-  if (foodPct >= 20) {
-    recs.push({
-      title: 'Plant-based diet shift',
-      desc: 'Meat-related meals add significant CO₂. Transitioning to a vegetarian or vegan diet 2 days a week cuts food emissions by up to 45%.',
-      icon: 'eco',
-      color: '#89ceff'
-    });
-  } else {
-    recs.push({
-      title: 'Zero Waste shopping habit',
-      desc: 'Plastic purchases add container waste. ordering in bulk or choosing local grocery refills mitigates shopping emissions.',
-      icon: 'shopping-bag',
-      color: '#ffb95f'
-    });
-  }
-
-  return recs;
-}
-
-/**
- * POST /api/ai/recommend
- * Returns AI sustainability recommendations given a footprint weight and breakdown.
- * @route POST /api/ai/recommend
- * @param {Object} req.body - Footprint details
- * @returns {Object} 200 - Object containing recommendations array
- * @returns {Object} 500 - Internal server error
- */
-router.post('/ai/recommend', async (req, res, next) => {
-  try {
-    const { footprint, breakdown } = req.body;
-    const recs = await generateRecommendations(footprint, breakdown);
-    res.json({ recommendations: recs });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * GET /api/challenges
- * Retrieves list of all challenges with user-specific progress.
- * @route GET /api/challenges
- * @returns {Array<Object>} 200 - Array of challenge templates with user progress values
- * @returns {Object} 500 - Internal server error
- */
-router.get('/challenges', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  try {
-    const snapshot = await db.collection('users').doc(userId).collection('challenges').get();
-    const progressMap = {};
-    snapshot.docs.forEach(doc => {
-      progressMap[doc.id] = doc.data();
-    });
-
-    const userChallenges = defaultChallenges.map(ch => {
-      const saved = progressMap[ch.id];
-      if (!saved && userId === 'sarah_j') {
-        if (ch.id === '1') return { ...ch, progress: 0.60, completed: false };
-        if (ch.id === '3') return { ...ch, progress: 0.85, completed: false };
-      }
-      return {
-        ...ch,
-        progress: saved ? saved.progress : 0.0,
-        completed: saved ? saved.completed : false
-      };
-    });
-
-    res.json(userChallenges);
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * POST /api/challenges/:id/join
- * Joins a specific challenge for the current user, setting starting progress to 5%.
- * @route POST /api/challenges/:id/join
- * @param {string} req.params.id - Challenge ID ('1', '2', or '3')
- * @returns {Object} 200 - Success status payload
- * @returns {Object} 400 - Invalid challenge ID error
- * @returns {Object} 500 - Internal server error
- */
-router.post('/challenges/:id/join', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  const chId = req.params.id;
-  if (chId !== '1' && chId !== '2' && chId !== '3') {
-    return res.status(400).json({ error: 'Invalid challenge ID parameter' });
-  }
-  try {
-    await db.collection('users').doc(userId).collection('challenges').doc(chId).set({
-      progress: 0.05,
-      completed: false
-    });
-    usersCache = null; // Invalidate cache
-    res.json({ success: true });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * POST /api/challenges/:id/progress
- * Increments progress of a joined challenge by 10%, rewarding points on completion.
- * @route POST /api/challenges/:id/progress
- * @param {string} req.params.id - Challenge ID ('1', '2', or '3')
- * @returns {Object} 200 - Success status, updated challenge progress, and user profile details
- * @returns {Object} 400 - Invalid challenge ID error
- * @returns {Object} 500 - Internal server error
- */
-router.post('/challenges/:id/progress', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  const chId = req.params.id;
-  if (chId !== '1' && chId !== '2' && chId !== '3') {
-    return res.status(400).json({ error: 'Invalid challenge ID parameter' });
-  }
-  
-  try {
-    const chDoc = await db.collection('users').doc(userId).collection('challenges').doc(chId).get();
-    let progress = 0.0;
-    let completed = false;
-    
-    if (!chDoc.exists && userId === 'sarah_j') {
-      if (chId === '1') progress = 0.60;
-      if (chId === '3') progress = 0.85;
-    } else if (chDoc.exists) {
-      progress = chDoc.data().progress || 0.0;
-      completed = chDoc.data().completed || false;
-    }
-
-    progress = Math.min(progress + 0.10, 1.0);
-
-    const challengeDetails = defaultChallenges.find(c => c.id === chId) || {};
-    let pointsAwarded = 0;
-    let badgeEarned = null;
-
-    const userDoc = await db.collection('users').doc(userId).get();
-    const profile = userDoc.exists ? userDoc.data() : { points: 0, badges: [] };
-
-    if (progress >= 1.0 && !completed) {
-      completed = true;
-      pointsAwarded = challengeDetails.pointsValue || 100;
-      badgeEarned = challengeDetails.associatedBadge;
-    }
-
-    await db.collection('users').doc(userId).collection('challenges').doc(chId).set({
-      progress,
-      completed
-    });
-
-    const updatedPoints = (profile.points || 0) + pointsAwarded;
-    usersCache = null; // Invalidate cache
-    const currentTitle = updatedPoints >= 12000 ? 'Master Guardian' : updatedPoints >= 11000 ? 'Nature Enthusiast' : 'Eco Novice';
-    const updatedBadges = [...(profile.badges || [])];
-    if (badgeEarned && !updatedBadges.includes(badgeEarned)) {
-      updatedBadges.push(badgeEarned);
-    }
-
-    const updatedProfile = {
-      ...profile,
-      points: updatedPoints,
-      title: currentTitle,
-      badges: updatedBadges
-    };
-
-    await db.collection('users').doc(userId).set(updatedProfile);
-
-    res.json({
-      success: true,
-      challenge: {
-        id: chId,
-        progress,
-        completed
-      },
-      profile: updatedProfile
-    });
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * GET /api/leaderboard
- * Retrieves leaderboard list sorted by points.
- * @route GET /api/leaderboard
- * @returns {Array<Object>} 200 - List of ranked user objects
- * @returns {Object} 500 - Internal server error
- */
-router.get('/leaderboard', async (req, res, next) => {
-  try {
-    const users = await getAllUsersCached();
-    const formattedUsers = users.map(user => ({
-      id: user.id,
-      name: user.name,
-      points: user.points,
-      avatar: user.avatar,
-      title: user.title,
-    }));
-
-    // Sort leaderboard desc
-    formattedUsers.sort((a, b) => b.points - a.points);
-    
-    // Format response
-    const rankedLeaderboard = formattedUsers.map((user, index) => {
-      const rank = index + 1;
-      let borderColor = 'rgba(255,255,255,0.08)';
-      let bg = 'rgba(255, 255, 255, 0.03)';
-      if (rank === 1) {
-        borderColor = '#4edea3';
-        bg = 'rgba(78, 222, 163, 0.08)';
-      } else if (rank === 2) {
-        borderColor = '#89ceff';
-      }
-      return {
-        id: user.id,
-        rank,
-        name: user.name,
-        title: user.title,
-        points: user.points,
-        avatar: user.avatar,
-        borderColor,
-        bg
-      };
-    });
-
-    res.json(rankedLeaderboard);
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * GET /api/users
- * Retrieves simple metadata objects for all registered platform users.
- * @route GET /api/users
- * @returns {Array<Object>} 200 - Array of user metadata items
- * @returns {Object} 500 - Internal server error
- */
-router.get('/users', async (req, res, next) => {
-  try {
-    const users = await getAllUsersCached();
-    const usersList = users.map(user => ({
-      id: user.id,
-      name: user.name,
-      email: user.email,
-      avatar: user.avatar,
-      points: user.points,
-      title: user.title,
-    }));
-    res.json(usersList);
-  } catch (err) {
-    next(err);
-  }
-});
-
-/**
- * POST /api/users
- * Creates / registers a new user profile on the platform, resolving unique slug IDs.
- * @route POST /api/users
- * @param {Object} req.body - Payload specifying 'name' and optional 'email'
- * @returns {Object} 200 - Registration success payload containing the generated userId and profile
- * @returns {Object} 400 - Validation error payload
- * @returns {Object} 500 - Internal server error
- */
-router.post('/users', async (req, res, next) => {
-  const { name, email } = req.body;
-
-  if (!name || typeof name !== 'string' || !name.trim()) {
-    return res.status(400).json({ error: 'Name is required and must be a valid string' });
-  }
-
-  if (name.length > 50) {
-    return res.status(400).json({ error: 'Name must be under 50 characters' });
-  }
-
-  // Sanitize name to prevent XSS
-  const sanitizedName = name.replace(/<[^>]*>/g, '').trim();
-  if (!sanitizedName) {
-    return res.status(400).json({ error: 'Invalid name characters' });
-  }
-
-  // If email is provided, validate its format
-  let validatedEmail = email || '';
-  if (validatedEmail) {
-    if (typeof validatedEmail !== 'string') {
-      return res.status(400).json({ error: 'Email must be a valid string' });
-    }
-    if (validatedEmail.length > 100) {
-      return res.status(400).json({ error: 'Email must be under 100 characters' });
-    }
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    if (!emailRegex.test(validatedEmail.trim())) {
-      return res.status(400).json({ error: 'Invalid email address format' });
-    }
-    validatedEmail = validatedEmail.trim();
-  }
-
-  try {
-    const trimmedName = sanitizedName;
-    
-    // Generate unique slug ID
-    let baseId = trimmedName.toLowerCase()
-      .replace(/[^\w\s-]/g, '')
-      .replace(/[\s_-]+/g, '_')
-      .replace(/^-+|-+$/g, '');
-
-    if (!baseId) baseId = 'user';
-
-    let userId = baseId;
-    let counter = 1;
-    let docRef = db.collection('users').doc(userId);
-    let docSnap = await docRef.get();
-
-    while (docSnap.exists) {
-      userId = `${baseId}_${counter}`;
-      docRef = db.collection('users').doc(userId);
-      docSnap = await docRef.get();
-      counter++;
-    }
-
-    const avatarUrl = `https://api.dicebear.com/7.x/avataaars/png?seed=${encodeURIComponent(trimmedName)}`;
-
-    const newProfile = {
-      email: validatedEmail || `${userId}@example.com`,
-      name: trimmedName,
-      avatar: avatarUrl,
-      title: 'Eco Novice',
-      points: 0,
-      badges: [],
-      percentages: { transport: 20, electricity: 20, food: 20, waste: 20, shopping: 20 },
-      complianceRate: '80.0%',
-      totalMonthly: 0
-    };
-
-    await db.collection('users').doc(userId).set(newProfile);
-    usersCache = null; // Invalidate cache
-
-    res.json({
-      success: true,
-      userId: userId,
-      profile: newProfile
-    });
-  } catch (err) {
-    console.error('Error creating user:', err);
-    next(err);
-  }
-});
-
-/**
- * POST /api/offsets/purchase
- * Purchases a carbon offset package, rewarding points to the buyer.
- * @route POST /api/offsets/purchase
- * @param {Object} req.body - Details containing offsetId and cost
- * @returns {Object} 200 - Purchase success payload and updated profile points details
- * @returns {Object} 400 - Validation error payload
- * @returns {Object} 500 - Internal server error
- */
-router.post('/offsets/purchase', async (req, res, next) => {
-  const userId = getRequestUserId(req);
-  const { offsetId, cost } = req.body;
-
-  if (offsetId !== '1' && offsetId !== '2' && offsetId !== '3' && offsetId !== '4') {
-    return res.status(400).json({ error: 'Invalid offset ID parameter' });
-  }
-  if (typeof cost !== 'number' || cost <= 0 || isNaN(cost)) {
-    return res.status(400).json({ error: 'Cost must be a valid positive number' });
-  }
-  
-  try {
-    const pointsReward = Math.max(Math.round((cost || 10) * 2.5), 50);
-    
-    const userDoc = await db.collection('users').doc(userId).get();
-    const profile = userDoc.exists ? userDoc.data() : { points: 0 };
-    
-    const updatedPoints = (profile.points || 0) + pointsReward;
-    const currentTitle = updatedPoints >= 12000 ? 'Master Guardian' : updatedPoints >= 11000 ? 'Nature Enthusiast' : 'Eco Novice';
-    
-    const updatedProfile = {
-      ...profile,
-      points: updatedPoints,
-      title: currentTitle
-    };
-    
-    await db.collection('users').doc(userId).set(updatedProfile);
-    usersCache = null; // Invalidate cache
-    
-    res.json({
-      success: true,
-      pointsReward,
-      profile: updatedProfile
-    });
-  } catch (err) {
-    next(err);
-  }
-});
-
-module.exports = router;

backend/server.js

@@ -1,90 +0,0 @@
-const express = require('express');
-const cors = require('cors');
-const morgan = require('morgan');
-const helmet = require('helmet');
-const rateLimit = require('express-rate-limit');
-const hpp = require('hpp');
-const compression = require('compression');
-const routes = require('./routes');
-
-const app = express();
-const PORT = process.env.PORT || 5000;
-
-// 1. Enable GZIP compression to reduce network payload size
-app.use(compression());
-
-// 2. Enable Helmet with forced HSTS and Referrer policy for secure headers
-app.use(helmet({
-  crossOriginResourcePolicy: { policy: "cross-origin" },
-  hsts: {
-    maxAge: 31536000,
-    includeSubDomains: true,
-    preload: true
-  },
-  referrerPolicy: { policy: "no-referrer" }
-}));
-
-// 3. HTTP Parameter Pollution (HPP) protection
-app.use(hpp());
-
-// 4. Rate limiting to prevent brute force / DoS attacks
-const limiter = rateLimit({
-  windowMs: 15 * 60 * 1000, // 15 minutes
-  max: 100, // Limit each IP to 100 requests per windowMs
-  standardHeaders: true, // Return rate limit info in the `RateLimit-*` headers
-  legacyHeaders: false, // Disable the `X-RateLimit-*` headers
-  message: { error: 'Too many requests from this IP, please try again after 15 minutes' }
-});
-app.use('/api', limiter);
-
-// 5. Safe CORS options to prevent wildcard vulnerability exposure
-const corsOptions = {
-  origin: '*',
-  methods: ['GET', 'POST', 'OPTIONS'],
-  allowedHeaders: ['Content-Type', 'Authorization', 'x-user-id'],
-  credentials: true,
-  maxAge: 86400
-};
-app.use(cors(corsOptions));
-
-// 6. Limit request JSON body size to prevent payload overflow attacks
-app.use(express.json({ limit: '10kb' }));
-
-// Parse request bodies
-app.use(express.urlencoded({ extended: true, limit: '10kb' }));
-
-// Log incoming request details for debugging
-app.use(morgan('dev'));
-
-// Root endpoint for health check & status checks
-app.get('/', (req, res) => {
-  res.json({
-    status: 'online',
-    service: 'EcoTrack AI Carbon Accounting API',
-    version: '1.0.0',
-    database: process.env.FIREBASE_SERVICE_ACCOUNT ? 'firestore' : 'local-mock'
-  });
-});
-
-// Mount our router on /api
-app.use('/api', routes);
-
-// 7. Global Error Handling Middleware (prevents internal stack trace leakage)
-app.use((err, req, res, next) => {
-  console.error('Unhandled Server Error:', err);
-  res.status(500).json({ 
-    error: 'An unexpected internal server error occurred. Please try again later.' 
-  });
-});
-
-// Start server (only if not running inside a test runner)
-if (process.env.NODE_ENV !== 'test') {
-  app.listen(PORT, '0.0.0.0', () => {
-    console.log(`=========================================`);
-    console.log(` EcoTrack AI Backend Service Running`);
-    console.log(` URL: http://localhost:${PORT}`);
-    console.log(`=========================================`);
-  });
-}
-
-module.exports = app;

backend/src/app.js

@@ -0,0 +1,119 @@
+import express from 'express';
+import cors from 'cors';
+import morgan from 'morgan';
+import helmet from 'helmet';
+import { errorHandler, notFoundHandler } from './middleware/errorHandler.js';
+import { apiLimiter } from './middleware/rateLimiter.js';
+import userRoutes from './routes/users.js';
+import assessmentRoutes from './routes/assessments.js';
+import recommendationRoutes from './routes/recommendations.js';
+import simulationRoutes from './routes/simulations.js';
+import aiRoutes from './routes/ai.js';
+
+const app = express();
+
+// Trust Railway/Vercel reverse proxy for accurate IP and HTTPS
+app.set('trust proxy', 1);
+
+// ── Security Headers (Helmet) ─────────────────────────────────────────────────
+// BACKEND_PUBLIC_URL: the public URL of this API server.
+// Keeping it in an env var means the CSP isn't hard-coded to one Railway deployment.
+// Falls back to the original Railway URL so existing deployments keep working.
+const backendPublicUrl =
+  process.env.BACKEND_PUBLIC_URL || 'https://carbon-production-49fd.up.railway.app';
+
+app.use(
+  helmet({
+    contentSecurityPolicy: {
+      directives: {
+        defaultSrc: ["'self'"],
+        scriptSrc: ["'self'"],
+        // NOTE: 'unsafe-inline' is required for styleSrc to allow:
+        // 1. Vite's dynamic style injection in development.
+        // 2. Tailwind's utility class injection at runtime.
+        // 3. Google Fonts dynamic CSS stylesheet generation.
+        styleSrc: ["'self'", 'https://fonts.googleapis.com', "'unsafe-inline'"],
+        fontSrc: ["'self'", 'https://fonts.gstatic.com'],
+        connectSrc: ["'self'", backendPublicUrl, '*.vercel.app', 'http://localhost:*'],
+        imgSrc: ["'self'", 'data:'],
+        objectSrc: ["'none'"],
+        frameSrc: ["'none'"],
+        upgradeInsecureRequests: [],
+      },
+    },
+    crossOriginEmbedderPolicy: false,
+    crossOriginOpenerPolicy: { policy: 'same-origin-allow-popups' },
+    crossOriginResourcePolicy: { policy: 'same-origin' },
+    hsts: { maxAge: 31536000, includeSubDomains: true, preload: true },
+    noSniff: true,
+    // xssFilter removed — deprecated in Helmet 7 and no longer effective in modern browsers.
+    referrerPolicy: { policy: 'strict-origin-when-cross-origin' },
+    // permittedCrossDomainPolicies removed — was a no-op (false is not a valid option).
+    frameguard: { action: 'deny' },
+  })
+);
+
+// ── Permissions-Policy Header ───────────────────────────────────────────────
+// Restrict access to sensitive browser APIs that this application does not use.
+app.use((req, res, next) => {
+  res.setHeader('Permissions-Policy', 'camera=(), microphone=(), geolocation=(), payment=()');
+  next();
+});
+
+// ── CORS ─────────────────────────────────────────────────────────────────────
+const corsOrigin = process.env.CORS_ORIGIN || 'http://localhost:5173';
+const corsOrigins = corsOrigin
+  .split(',')
+  .map((o) => o.trim())
+  .filter(Boolean);
+app.use(
+  cors({
+    origin: (origin, callback) => {
+      if (!origin) return callback(null, true);
+      if (origin.startsWith('http://localhost:') || origin.startsWith('http://127.0.0.1:')) {
+        return callback(null, true);
+      }
+      const isAllowed =
+        corsOrigins.some((allowed) => origin === allowed) || origin.endsWith('.vercel.app');
+      callback(null, isAllowed);
+    },
+    methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'],
+    allowedHeaders: ['Content-Type', 'Authorization'],
+    credentials: true,
+  })
+);
+
+// ── Body Parsing ──────────────────────────────────────────────────────────────
+app.use(express.json({ limit: '100kb' }));
+app.use(express.urlencoded({ extended: true, limit: '100kb' }));
+
+// ── Logging ───────────────────────────────────────────────────────────────────
+if (process.env.NODE_ENV !== 'test') {
+  app.use(morgan(process.env.NODE_ENV === 'production' ? 'combined' : 'dev'));
+}
+
+// ── Rate Limiting ─────────────────────────────────────────────────────────────
+app.use('/api/', apiLimiter);
+
+// ── Health Check ──────────────────────────────────────────────────────────────
+app.get('/health', (req, res) => {
+  res.json({
+    status: 'ok',
+    timestamp: new Date().toISOString(),
+    environment: process.env.NODE_ENV || 'development',
+    version: '1.0.0',
+  });
+});
+
+// ── API Routes ────────────────────────────────────────────────────────────────
+app.use('/api/users', userRoutes);
+app.use('/api/assessments', assessmentRoutes);
+app.use('/api/recommendations', recommendationRoutes);
+app.use('/api/simulations', simulationRoutes);
+app.use('/api/ai', aiRoutes);
+
+// ── 404 & Error Handling ──────────────────────────────────────────────────────
+app.use(notFoundHandler);
+app.use(errorHandler);
+
+export default app;

backend/src/controllers/assessmentController.js

@@ -0,0 +1,196 @@
+import { z } from 'zod';
+import db from '../utils/firebaseClient.js';
+import { compareToAverages } from '../services/scoringService.js';
+import { createAssessmentWithRecommendations } from '../services/assessmentService.js';
+import { AppError } from '../middleware/errorHandler.js';
+import { sanitizeText } from '../utils/sanitize.js';
+
+const assessmentSchema = z
+  .object({
+    userId: z.string().min(1, 'userId is required'),
+    // Transportation
+    dailyCarKm: z.number().min(0).max(1000).default(0),
+    carFuelType: z.enum(['petrol', 'diesel', 'electric', 'hybrid', 'none']).default('none'),
+    publicTransportKmPerWeek: z.number().min(0).max(10000).default(0),
+    cyclingKmPerWeek: z.number().min(0).max(1000).default(0),
+    shortFlightsPerYear: z.number().int().min(0).max(100).default(0),
+    longFlightsPerYear: z.number().int().min(0).max(50).default(0),
+    // Energy
+    monthlyElectricityKwh: z.number().min(0).max(10000).default(0),
+    renewablePercentage: z.number().min(0).max(100).default(0),
+    // Food
+    dietType: z.enum(['vegan', 'vegetarian', 'mixed', 'heavy_meat']).default('mixed'),
+    // Shopping
+    clothingItemsPerYear: z.number().int().min(0).max(500).default(0),
+    electronicsItemsPerYear: z.number().int().min(0).max(50).default(0),
+  })
+  .strict();
+
+const PERCENTAGE_MULTIPLIER = 100;
+
+function buildUnknownKeysMessage(zodError, allowedKeys) {
+  const unknownKeyIssues = zodError.issues.filter((i) => i.code === 'unrecognized_keys');
+  if (unknownKeyIssues.length === 0) return zodError.message;
+
+  const unknownKeys = unknownKeyIssues.flatMap((i) => i.keys);
+  return (
+    `Unknown fields: ${unknownKeys.join(', ')}. ` +
+    `Only these fields are accepted: ${allowedKeys.join(', ')}`
+  );
+}
+
+const ALLOWED_KEYS = Object.keys(assessmentSchema._def.shape());
+
+export const createAssessment = async (req, res, next) => {
+  try {
+    const parseResult = assessmentSchema.safeParse(req.body);
+    if (!parseResult.success) {
+      const message = buildUnknownKeysMessage(parseResult.error, ALLOWED_KEYS);
+      throw new AppError(message, 400);
+    }
+    const data = parseResult.data;
+    data.userId = sanitizeText(data.userId);
+
+    const { assessment, emissions, score } = await createAssessmentWithRecommendations(data);
+
+    res.status(201).json({
+      success: true,
+      data: {
+        ...assessment,
+        breakdown: emissions.breakdown,
+        scoreInfo: { score, ...emissions },
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const getAssessmentById = async (req, res, next) => {
+  try {
+    const { id } = req.params;
+    const sanitizedId = sanitizeText(id);
+
+    const assessmentDoc = await db.collection('assessments').doc(sanitizedId).get();
+    if (!assessmentDoc.exists) throw new AppError('Assessment not found', 404);
+
+    const assessment = assessmentDoc.data();
+
+    // Fetch recommendations
+    const recsSnap = await db
+      .collection('recommendations')
+      .where('assessmentId', '==', sanitizedId)
+      .get();
+    const recommendations = recsSnap.docs.map((doc) => ({ id: doc.id, ...doc.data() }));
+    recommendations.sort((a, b) => (b.estimatedSavings || 0) - (a.estimatedSavings || 0));
+
+    // Fetch simulations
+    const simsSnap = await db
+      .collection('simulations')
+      .where('assessmentId', '==', sanitizedId)
+      .get();
+    const simulations = simsSnap.docs.map((doc) => ({ id: doc.id, ...doc.data() }));
+    simulations.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt));
+
+    // Fetch user
+    const userDoc = await db.collection('users').doc(assessment.userId).get();
+    const user = userDoc.exists
+      ? { id: userDoc.id, name: userDoc.data().name, email: userDoc.data().email }
+      : null;
+
+    const total = assessment.totalEmission;
+    const safeTotal = total === 0 ? 1 : total;
+
+    res.json({
+      success: true,
+      data: {
+        ...assessment,
+        id: sanitizedId,
+        recommendations,
+        simulations,
+        user,
+        breakdown: {
+          transport: parseFloat(
+            ((assessment.transportEmission / safeTotal) * PERCENTAGE_MULTIPLIER).toFixed(1)
+          ),
+          energy: parseFloat(
+            ((assessment.energyEmission / safeTotal) * PERCENTAGE_MULTIPLIER).toFixed(1)
+          ),
+          food: parseFloat(
+            ((assessment.foodEmission / safeTotal) * PERCENTAGE_MULTIPLIER).toFixed(1)
+          ),
+          shopping: parseFloat(
+            ((assessment.shoppingEmission / safeTotal) * PERCENTAGE_MULTIPLIER).toFixed(1)
+          ),
+        },
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const getAssessmentsByUser = async (req, res, next) => {
+  try {
+    const { userId } = req.params;
+    const sanitizedUserId = sanitizeText(userId);
+
+    const userDoc = await db.collection('users').doc(sanitizedUserId).get();
+    if (!userDoc.exists) throw new AppError('User not found', 404);
+
+    const assessmentsSnap = await db
+      .collection('assessments')
+      .where('userId', '==', sanitizedUserId)
+      .get();
+    const assessments = assessmentsSnap.docs.map((doc) => ({ id: doc.id, ...doc.data() }));
+
+    assessments.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt));
+
+    for (const assessment of assessments) {
+      const recsSnap = await db
+        .collection('recommendations')
+        .where('assessmentId', '==', assessment.id)
+        .get();
+      const recommendations = recsSnap.docs.map((doc) => ({ id: doc.id, ...doc.data() }));
+      recommendations.sort((a, b) => (b.estimatedSavings || 0) - (a.estimatedSavings || 0));
+      assessment.recommendations = recommendations.slice(0, 3);
+
+      const simsSnap = await db
+        .collection('simulations')
+        .where('assessmentId', '==', assessment.id)
+        .get();
+      assessment._count = { simulations: simsSnap.docs.length };
+    }
+
+    res.json({ success: true, data: assessments, count: assessments.length });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const compareAssessment = async (req, res, next) => {
+  try {
+    const { id } = req.params;
+    const sanitizedId = sanitizeText(id);
+
+    const assessmentDoc = await db.collection('assessments').doc(sanitizedId).get();
+    if (!assessmentDoc.exists) throw new AppError('Assessment not found', 404);
+
+    const assessment = assessmentDoc.data();
+    const comparison = compareToAverages(assessment.totalEmission);
+
+    res.set('Cache-Control', 'public, max-age=300, stale-while-revalidate=60');
+
+    res.json({
+      success: true,
+      data: {
+        assessmentId: sanitizedId,
+        totalEmission: assessment.totalEmission,
+        sustainabilityScore: assessment.sustainabilityScore,
+        comparison,
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};

backend/src/controllers/recommendationController.js

@@ -0,0 +1,33 @@
+import db from '../utils/firebaseClient.js';
+import { AppError } from '../middleware/errorHandler.js';
+
+export const getRecommendations = async (req, res, next) => {
+  try {
+    const { assessmentId } = req.params;
+
+    const assessmentDoc = await db.collection('assessments').doc(assessmentId).get();
+    if (!assessmentDoc.exists) throw new AppError('Assessment not found', 404);
+
+    const recommendationsSnap = await db
+      .collection('recommendations')
+      .where('assessmentId', '==', assessmentId)
+      .get();
+
+    const recommendations = recommendationsSnap.docs.map((doc) => ({
+      id: doc.id,
+      ...doc.data(),
+    }));
+
+    const priorityOrder = { HIGH: 1, MEDIUM: 2, LOW: 3 };
+    recommendations.sort((a, b) => {
+      const pA = priorityOrder[a.priority] || 99;
+      const pB = priorityOrder[b.priority] || 99;
+      if (pA !== pB) return pA - pB;
+      return (b.estimatedSavings || 0) - (a.estimatedSavings || 0);
+    });
+
+    res.json({ success: true, data: recommendations, count: recommendations.length });
+  } catch (err) {
+    next(err);
+  }
+};

backend/src/controllers/simulationController.js

@@ -0,0 +1,93 @@
+import { z } from 'zod';
+import db from '../utils/firebaseClient.js';
+import { runSimulation } from '../services/simulationService.js';
+import { AppError } from '../middleware/errorHandler.js';
+import { sanitizeText } from '../utils/sanitize.js';
+import crypto from 'crypto';
+
+const simulationSchema = z.object({
+  assessmentId: z.string().min(1, 'assessmentId is required'),
+  scenarioName: z.string().min(1, 'scenarioName is required').max(100),
+  scenarioParams: z.record(z.union([z.string(), z.number(), z.boolean()])),
+});
+
+export const createSimulation = async (req, res, next) => {
+  try {
+    const data = simulationSchema.parse(req.body);
+    data.assessmentId = sanitizeText(data.assessmentId);
+    data.scenarioName = sanitizeText(data.scenarioName);
+
+    const assessmentDoc = await db.collection('assessments').doc(data.assessmentId).get();
+    if (!assessmentDoc.exists) throw new AppError('Assessment not found', 404);
+
+    const assessment = assessmentDoc.data();
+
+    const assessmentData = {
+      dailyCarKm: assessment.dailyCarKm,
+      carFuelType: assessment.carFuelType,
+      publicTransportKmPerWeek: assessment.publicTransportKmPerWeek,
+      cyclingKmPerWeek: assessment.cyclingKmPerWeek,
+      shortFlightsPerYear: assessment.shortFlightsPerYear,
+      longFlightsPerYear: assessment.longFlightsPerYear,
+      monthlyElectricityKwh: assessment.monthlyElectricityKwh,
+      renewablePercentage: assessment.renewablePercentage,
+      dietType: assessment.dietType,
+      clothingItemsPerYear: assessment.clothingItemsPerYear,
+      electronicsItemsPerYear: assessment.electronicsItemsPerYear,
+    };
+
+    const result = runSimulation(assessmentData, data.scenarioParams, data.scenarioName);
+
+    const simId = crypto.randomUUID();
+    const simulation = {
+      id: simId,
+      assessmentId: data.assessmentId,
+      scenarioName: result.scenarioName,
+      scenarioParams: result.scenarioParams,
+      originalEmission: result.originalEmission,
+      projectedEmission: result.projectedEmission,
+      reductionPercentage: result.reductionPercentage,
+      annualSavingsKg: result.annualSavingsKg,
+      createdAt: new Date().toISOString(),
+    };
+
+    await db.collection('simulations').doc(simId).set(simulation);
+
+    res.status(201).json({ success: true, data: { ...simulation, ...result } });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const getSimulationById = async (req, res, next) => {
+  try {
+    const { id } = req.params;
+    const sanitizedId = sanitizeText(id);
+
+    const simulationDoc = await db.collection('simulations').doc(sanitizedId).get();
+    if (!simulationDoc.exists) throw new AppError('Simulation not found', 404);
+
+    const simulation = simulationDoc.data();
+
+    const assessmentDoc = await db.collection('assessments').doc(simulation.assessmentId).get();
+    const assessment = assessmentDoc.exists ? assessmentDoc.data() : null;
+
+    res.json({
+      success: true,
+      data: {
+        ...simulation,
+        id: sanitizedId,
+        assessment: assessment
+          ? {
+              id: assessment.id || simulation.assessmentId,
+              totalEmission: assessment.totalEmission,
+              sustainabilityScore: assessment.sustainabilityScore,
+              userId: assessment.userId,
+            }
+          : null,
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};

backend/src/controllers/userController.js

@@ -0,0 +1,125 @@
+import { z } from 'zod';
+import db from '../utils/firebaseClient.js';
+import { AppError } from '../middleware/errorHandler.js';
+import { sanitizeText } from '../utils/sanitize.js';
+import crypto from 'crypto';
+
+const createUserSchema = z.object({
+  name: z.string().min(2, 'Name must be at least 2 characters').max(100),
+  email: z.string().email('Invalid email address'),
+});
+
+export const createUser = async (req, res, next) => {
+  try {
+    const { name, email } = createUserSchema.parse(req.body);
+    const sanitizedName = sanitizeText(name);
+    const sanitizedEmail = sanitizeText(email).toLowerCase();
+
+    const usersRef = db.collection('users');
+    const qSnapshot = await usersRef.where('email', '==', sanitizedEmail).get();
+
+    let userId;
+    let userData;
+
+    if (!qSnapshot.empty) {
+      const userDoc = qSnapshot.docs[0];
+      userId = userDoc.id;
+      userData = {
+        ...userDoc.data(),
+        name: sanitizedName,
+        updatedAt: new Date().toISOString(),
+      };
+      await usersRef.doc(userId).set(userData);
+    } else {
+      userId = crypto.randomUUID();
+      userData = {
+        id: userId,
+        name: sanitizedName,
+        email: sanitizedEmail,
+        points: 0,
+        badges: [],
+        title: 'Eco Novice',
+        streak: { current: 0, longest: 0, lastSaved: null },
+        createdAt: new Date().toISOString(),
+        updatedAt: new Date().toISOString(),
+      };
+      await usersRef.doc(userId).set(userData);
+    }
+
+    const assessmentsSnapshot = await db
+      .collection('assessments')
+      .where('userId', '==', userId)
+      .get();
+    const assessmentsCount = assessmentsSnapshot.docs.length;
+
+    res.status(201).json({
+      success: true,
+      data: {
+        ...userData,
+        id: userId,
+        _count: { assessments: assessmentsCount },
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const getUserById = async (req, res, next) => {
+  try {
+    const { id } = req.params;
+    const sanitizedId = sanitizeText(id);
+
+    const userDoc = await db.collection('users').doc(sanitizedId).get();
+    if (!userDoc.exists) {
+      throw new AppError('User not found', 404);
+    }
+
+    const userData = userDoc.data();
+    const assessmentsSnapshot = await db
+      .collection('assessments')
+      .where('userId', '==', sanitizedId)
+      .get();
+    const assessmentsCount = assessmentsSnapshot.docs.length;
+
+    res.json({
+      success: true,
+      data: {
+        ...userData,
+        id: sanitizedId,
+        _count: { assessments: assessmentsCount },
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};
+
+export const getLeaderboard = async (req, res, next) => {
+  try {
+    const page = parseInt(req.query.page) || 1;
+    const limit = parseInt(req.query.limit) || 10;
+    const offset = (page - 1) * limit;
+
+    const usersSnap = await db.collection('users').get();
+    const usersList = usersSnap.docs.map((doc) => ({ id: doc.id, ...doc.data() }));
+
+    usersList.sort((a, b) => (b.points || 0) - (a.points || 0));
+
+    const total = usersList.length;
+    const paginatedUsers = usersList.slice(offset, offset + limit);
+
+    res.json({
+      success: true,
+      data: paginatedUsers,
+      pagination: {
+        page,
+        limit,
+        total,
+        totalPages: Math.ceil(total / limit),
+      },
+    });
+  } catch (err) {
+    next(err);
+  }
+};

backend/src/index.js

@@ -0,0 +1,39 @@
+import 'dotenv/config';
+import app from './app.js';
+import logger from './utils/logger.js';
+import db from './utils/firebaseClient.js';
+
+const PORT = parseInt(process.env.PORT) || 3001;
+
+async function main() {
+  // Test database connection
+  try {
+    // Check if Firestore connection works by retrieving a single document reference
+    await db.collection('users').limit(1).get();
+    logger.info('✅ Firebase Firestore connected successfully');
+  } catch (err) {
+    logger.error('❌ Firebase Firestore connection failed', { error: err.message });
+    process.exit(1);
+  }
+
+  const server = app.listen(PORT, () => {
+    logger.info(`🚀 EcoGuide AI API running on http://localhost:${PORT}`, {
+      environment: process.env.NODE_ENV || 'development',
+      port: PORT,
+    });
+  });
+
+  // Graceful shutdown
+  const shutdown = async (signal) => {
+    logger.info(`${signal} received. Shutting down gracefully...`);
+    server.close(() => {
+      logger.info('Server closed.');
+      process.exit(0);
+    });
+  };
+
+  process.on('SIGTERM', () => shutdown('SIGTERM'));
+  process.on('SIGINT', () => shutdown('SIGINT'));
+}
+
+main();

backend/src/middleware/errorHandler.js

@@ -0,0 +1,87 @@
+import { ZodError } from 'zod';
+import logger from '../utils/logger.js';
+
+/**
+ * Centralized error handling middleware
+ * Must be registered LAST in the Express middleware chain
+ */
+export const errorHandler = (err, req, res, _next) => {
+  // Log the error
+  logger.error('Unhandled error', {
+    message: err.message,
+    stack: process.env.NODE_ENV === 'development' ? err.stack : undefined,
+    method: req.method,
+    url: req.url,
+    ip: req.ip,
+  });
+
+  // Handle Zod validation errors
+  if (err instanceof ZodError) {
+    return res.status(400).json({
+      success: false,
+      error: 'Validation failed',
+      details: err.errors.map((e) => ({
+        field: e.path.join('.'),
+        message: e.message,
+      })),
+    });
+  }
+
+  // Prisma known errors
+  if (err.code === 'P2002') {
+    return res.status(409).json({
+      success: false,
+      error: 'A record with this information already exists.',
+      field: err.meta?.target?.[0],
+    });
+  }
+
+  if (err.code === 'P2025') {
+    return res.status(404).json({
+      success: false,
+      error: 'Record not found.',
+    });
+  }
+
+  if (err.code === 'P2003') {
+    return res.status(400).json({
+      success: false,
+      error: 'Invalid reference. The related record does not exist.',
+    });
+  }
+
+  // Generic HTTP errors
+  const statusCode = err.statusCode || err.status || 500;
+  const message =
+    statusCode < 500 || process.env.NODE_ENV === 'development'
+      ? err.message
+      : 'An internal server error occurred. Please try again later.';
+
+  res.status(statusCode).json({
+    success: false,
+    error: message,
+    ...(process.env.NODE_ENV === 'development' && { stack: err.stack }),
+  });
+};
+
+/**
+ * 404 Not Found handler
+ */
+export const notFoundHandler = (req, res) => {
+  res.status(404).json({
+    success: false,
+    error: `Route not found: ${req.method} ${req.path}`,
+  });
+};
+
+/**
+ * Create a custom HTTP error
+ */
+export class AppError extends Error {
+  constructor(message, statusCode = 500) {
+    super(message);
+    this.statusCode = statusCode;
+    this.name = 'AppError';
+    Error.captureStackTrace(this, this.constructor);
+  }
+}

backend/src/middleware/rateLimiter.js

@@ -0,0 +1,43 @@
+import rateLimit from 'express-rate-limit';
+
+const windowMs = parseInt(process.env.RATE_LIMIT_WINDOW_MS) || 15 * 60 * 1000;
+const max = parseInt(process.env.RATE_LIMIT_MAX_REQUESTS) || 100;
+
+export const apiLimiter = rateLimit({
+  windowMs,
+  max,
+  standardHeaders: true,
+  legacyHeaders: false,
+  message: {
+    success: false,
+    error: 'Too many requests from this IP, please try again later.',
+    retryAfter: Math.ceil(windowMs / 1000 / 60),
+  },
+  skip: (_req) => process.env.NODE_ENV === 'test',
+});
+
+// Stricter limiter for user registration / lookup to prevent abuse
+export const createLimiter = rateLimit({
+  windowMs: 60 * 60 * 1000, // 1 hour
+  max: 15,
+  standardHeaders: true,
+  legacyHeaders: false,
+  message: {
+    success: false,
+    error: 'Too many accounts created. Please try again in an hour.',
+  },
+  skip: (_req) => process.env.NODE_ENV === 'test',
+});
+
+// Stricter limiter for logging carbon assessments to prevent spamming
+export const assessmentLimiter = rateLimit({
+  windowMs: 60 * 60 * 1000, // 1 hour
+  max: 30,
+  standardHeaders: true,
+  legacyHeaders: false,
+  message: {
+    success: false,
+    error: 'Too many carbon footprint assessments logged. Please try again in an hour.',
+  },
+  skip: (_req) => process.env.NODE_ENV === 'test',
+});

backend/src/middleware/validate.js

@@ -0,0 +1,45 @@
+import { ZodError } from 'zod';
+
+/**
+ * Validate request body against a Zod schema
+ * @param {import('zod').ZodSchema} schema
+ */
+export const validateBody = (schema) => (req, res, next) => {
+  try {
+    req.body = schema.parse(req.body);
+    next();
+  } catch (err) {
+    if (err instanceof ZodError) {
+      const errors = err.errors.map((e) => ({
+        field: e.path.join('.'),
+        message: e.message,
+      }));
+      return res.status(400).json({
+        success: false,
+        error: 'Validation failed',
+        details: errors,
+      });
+    }
+    next(err);
+  }
+};
+
+/**
+ * Validate request params against a Zod schema
+ * @param {import('zod').ZodSchema} schema
+ */
+export const validateParams = (schema) => (req, res, next) => {
+  try {
+    req.params = schema.parse(req.params);
+    next();
+  } catch (err) {
+    if (err instanceof ZodError) {
+      return res.status(400).json({
+        success: false,
+        error: 'Invalid parameters',
+        details: err.errors.map((e) => ({ field: e.path.join('.'), message: e.message })),
+      });
+    }
+    next(err);
+  }
+};

backend/src/routes/ai.js

@@ -0,0 +1,78 @@
+import { Router } from 'express';
+import { aiService } from '../services/aiService.js';
+import { sanitizeText } from '../utils/sanitize.js';
+
+const router = Router();
+
+/**
+ * @route   POST /api/ai/chat
+ * @desc    Chat with the AI sustainability coach
+ */
+router.post('/chat', async (req, res, next) => {
+  try {
+    const { message, context } = req.body;
+    const sanitizedMsg = sanitizeText(message);
+    const result = await aiService.chat(sanitizedMsg, context);
+    res.json({ success: true, ...result });
+  } catch (err) {
+    next(err);
+  }
+});
+
+/**
+ * @route   POST /api/ai/plan
+ * @desc    Generate a 30-day net-zero action plan
+ */
+router.post('/plan', async (req, res, next) => {
+  try {
+    const { footprint, breakdown, goal } = req.body;
+    const sanitizedGoal = goal ? sanitizeText(goal) : '20% reduction';
+    const result = await aiService.generatePlan(footprint, breakdown, sanitizedGoal);
+    res.json({ success: true, ...result });
+  } catch (err) {
+    next(err);
+  }
+});
+
+/**
+ * @route   GET /api/ai/tip
+ * @desc    Get daily sustainability tip (cached 24h)
+ */
+router.get('/tip', async (req, res, next) => {
+  try {
+    const result = await aiService.getDailyTip();
+    res.json({ success: true, tip: result });
+  } catch (err) {
+    next(err);
+  }
+});
+
+/**
+ * @route   POST /api/ai/score
+ * @desc    Get carbon score evaluation feedback
+ */
+router.post('/score', async (req, res, next) => {
+  try {
+    const { score, breakdown } = req.body;
+    const result = await aiService.getScoreFeedback(score, breakdown);
+    res.json({ success: true, ...result });
+  } catch (err) {
+    next(err);
+  }
+});
+
+/**
+ * @route   POST /api/ai/compare
+ * @desc    Get narrative footprint average comparison feedback
+ */
+router.post('/compare', async (req, res, next) => {
+  try {
+    const { totalEmission, breakdown } = req.body;
+    const result = await aiService.getCompareNarrative(totalEmission, breakdown);
+    res.json({ success: true, ...result });
+  } catch (err) {
+    next(err);
+  }
+});
+
+export default router;

backend/src/routes/assessments.js

@@ -0,0 +1,42 @@
+import { Router } from 'express';
+import {
+  createAssessment,
+  getAssessmentById,
+  getAssessmentsByUser,
+  compareAssessment,
+} from '../controllers/assessmentController.js';
+import { assessmentLimiter } from '../middleware/rateLimiter.js';
+
+const router = Router();
+
+/**
+ * @route   POST /api/assessments
+ * @desc    Create a new carbon footprint assessment
+ * @access  Public
+ */
+router.post('/', assessmentLimiter, createAssessment);
+
+/**
+ * @route   GET /api/assessments/user/:userId
+ * @desc    Get all assessments for a user
+ * @access  Public
+ * NOTE: This route must come before /:id to avoid param conflicts
+ */
+router.get('/user/:userId', getAssessmentsByUser);
+
+/**
+ * @route   GET /api/assessments/:id/compare
+ * @desc    Compare an assessment's footprint against global, UK, and Paris Agreement averages
+ * @access  Public
+ * NOTE: This route must come before /:id to avoid param conflicts
+ */
+router.get('/:id/compare', compareAssessment);
+
+/**
+ * @route   GET /api/assessments/:id
+ * @desc    Get a specific assessment by ID
+ * @access  Public
+ */
+router.get('/:id', getAssessmentById);
+
+export default router;

backend/src/routes/recommendations.js

@@ -0,0 +1,13 @@
+import { Router } from 'express';
+import { getRecommendations } from '../controllers/recommendationController.js';
+
+const router = Router();
+
+/**
+ * @route   GET /api/recommendations/:assessmentId
+ * @desc    Get recommendations for an assessment
+ * @access  Public
+ */
+router.get('/:assessmentId', getRecommendations);
+
+export default router;

backend/src/routes/simulations.js

@@ -0,0 +1,20 @@
+import { Router } from 'express';
+import { createSimulation, getSimulationById } from '../controllers/simulationController.js';
+
+const router = Router();
+
+/**
+ * @route   POST /api/simulations
+ * @desc    Run a carbon impact simulation scenario
+ * @access  Public
+ */
+router.post('/', createSimulation);
+
+/**
+ * @route   GET /api/simulations/:id
+ * @desc    Get a simulation result by ID
+ * @access  Public
+ */
+router.get('/:id', getSimulationById);
+
+export default router;

backend/src/routes/users.js

@@ -0,0 +1,28 @@
+import { Router } from 'express';
+import { createUser, getUserById, getLeaderboard } from '../controllers/userController.js';
+import { createLimiter } from '../middleware/rateLimiter.js';
+
+const router = Router();
+
+/**
+ * @route   POST /api/users
+ * @desc    Create or find a user by email (upsert)
+ * @access  Public
+ */
+router.post('/', createLimiter, createUser);
+
+/**
+ * @route   GET /api/users/leaderboard
+ * @desc    Get top users leaderboard (paginated)
+ * @access  Public
+ */
+router.get('/leaderboard', getLeaderboard);
+
+/**
+ * @route   GET /api/users/:id
+ * @desc    Get user by ID
+ * @access  Public
+ */
+router.get('/:id', getUserById);
+
+export default router;

backend/src/services/aiService.js

@@ -0,0 +1,291 @@
+import Groq from 'groq-sdk';
+import logger from '../utils/logger.js';
+
+const apiKey = process.env.GROQ_API_KEY;
+let groq = null;
+
+if (apiKey) {
+  try {
+    groq = new Groq({ apiKey });
+    logger.info('✅ Groq SDK initialized successfully.');
+  } catch (err) {
+    logger.error('❌ Failed to initialize Groq SDK:', { error: err.message });
+  }
+} else {
+  logger.warn('⚠️  No GROQ_API_KEY found. AI endpoints will run in Mock Fallback mode.');
+}
+
+// Simple in-memory cache for the daily eco tip
+let dailyTipCache = {
+  date: null,
+  tip: null,
+};
+
+export const aiService = {
+  /**
+   * Conversational Eco-Coach Chatbot
+   */
+  chat: async (message, context = {}) => {
+    if (!groq) {
+      return {
+        reply: `Hi! I'm your CarbonSense Eco Coach. Currently, I'm running in offline demonstration mode. To unlock my full AI intelligence capabilities, please add a valid \`GROQ_API_KEY\` to your backend environment settings.\n\nBased on your message ("${message}"), my recommendation is to reduce daily car travel and review electricity usage!`,
+        suggestedActions: [
+          'Turn off unused appliances',
+          'Consider public transport',
+          'Explore green electricity tariffs',
+        ],
+      };
+    }
+
+    try {
+      const systemPrompt = `You are CarbonSense Ocean Intelligence Coach, an expert sustainability advisor.
+You are helping a user reduce their carbon footprint.
+Be encouraging, professional, and practical. Use bullet points for recommendations.
+Keep answers concise (max 3 short paragraphs).
+
+${
+  context.footprint
+    ? `Current User Footprint Context:
+- Total Annual Footprint: ${context.footprint} kg CO2e
+- Breakdown: Transport: ${context.breakdown?.transport || 0}%, Electricity: ${context.breakdown?.electricity || 0}%, Food: ${context.breakdown?.food || 0}%, Shopping: ${context.breakdown?.shopping || 0}%`
+    : ''
+}`;
+
+      const chatCompletion = await groq.chat.completions.create({
+        messages: [
+          { role: 'system', content: systemPrompt },
+          { role: 'user', content: message },
+        ],
+        model: 'llama-3.1-8b-instant',
+        temperature: 0.7,
+        max_tokens: 350,
+      });
+
+      const reply = chatCompletion.choices[0]?.message?.content || 'No response generated.';
+      return {
+        reply,
+        suggestedActions: [
+          'Calculate footprint again',
+          'Optimize my energy contract',
+          'Find cyclable commuting routes',
+        ],
+      };
+    } catch (err) {
+      logger.error('Groq Chat completion failed:', { error: err.message || err });
+      return {
+        reply:
+          'I apologize, but my connection to the AI engine timed out. Please try again in a few moments!',
+        suggestedActions: [],
+      };
+    }
+  },
+
+  /**
+   * Personalized 30-Day Net Zero Action Plan
+   */
+  generatePlan: async (footprint, breakdown, goal = '20% reduction') => {
+    if (!groq) {
+      return {
+        plan: [
+          {
+            week: 1,
+            actions: [
+              'Switch to 100% renewable electricity tariff',
+              'Swap one meat meal daily for a plant-based alternative',
+            ],
+            expectedReduction: 'Approx. 50 kg',
+          },
+          {
+            week: 2,
+            actions: [
+              'Walk or cycle for all trips under 3 km',
+              'Unplug standby electronics when sleeping',
+            ],
+            expectedReduction: 'Approx. 30 kg',
+          },
+          {
+            week: 3,
+            actions: [
+              'Wash clothes at 30°C and line-dry instead of tumble drying',
+              'Avoid purchasing fast-fashion clothing items',
+            ],
+            expectedReduction: 'Approx. 40 kg',
+          },
+          {
+            week: 4,
+            actions: [
+              'Replace three short regional drives with public transit',
+              'Conduct a home energy audit',
+            ],
+            expectedReduction: 'Approx. 60 kg',
+          },
+        ],
+        goal,
+      };
+    }
+
+    try {
+      const prompt = `Generate a structured, personalized 30-day net-zero action plan for a user to achieve their goal of "${goal}".
+Annual Footprint: ${footprint} kg CO2e.
+Category breakdown: Transport: ${breakdown.transport || 0}%, Energy: ${breakdown.energy || 0}%, Food: ${breakdown.food || 0}%, Shopping: ${breakdown.shopping || 0}%.
+
+Return ONLY a valid JSON object matching this structure:
+{
+  "plan": [
+    {
+      "week": 1,
+      "actions": ["action 1", "action 2"],
+      "expectedReduction": "X kg"
+    },
+    ...
+  ]
+}
+Ensure it is valid parseable JSON. Do not include markdown code block syntax in your response, just raw JSON.`;
+
+      const chatCompletion = await groq.chat.completions.create({
+        messages: [{ role: 'user', content: prompt }],
+        model: 'llama-3.1-8b-instant',
+        response_format: { type: 'json_object' },
+        temperature: 0.5,
+        max_tokens: 500,
+      });
+
+      return JSON.parse(chatCompletion.choices[0]?.message?.content || '{}');
+    } catch (err) {
+      logger.error('Groq Plan generation failed:', { error: err.message || err });
+      return { plan: [], error: 'Failed to generate plan.' };
+    }
+  },
+
+  /**
+   * Daily Eco Tip (Cached 24h)
+   */
+  getDailyTip: async () => {
+    const today = new Date().toISOString().split('T')[0];
+    if (dailyTipCache.date === today && dailyTipCache.tip) {
+      return dailyTipCache.tip;
+    }
+
+    const defaultTip = {
+      tip: 'Wash laundry in cold water (30°C or below). This saves up to 75-90% of the energy used in a cycle, which goes solely toward heating the water!',
+      category: 'energy',
+      impact: 'Up to 75kg CO2/year saved',
+      icon: 'local-laundry-service',
+    };
+
+    if (!groq) {
+      dailyTipCache = { date: today, tip: defaultTip };
+      return defaultTip;
+    }
+
+    try {
+      const prompt = `Generate a practical, fresh daily eco tip for carbon footprint reduction.
+Return ONLY a valid JSON object matching this structure:
+{
+  "tip": "Tip explanation goes here...",
+  "category": "energy" | "transport" | "food" | "shopping",
+  "impact": "X kg CO2 saved per year",
+  "icon": "icon-identifier-string"
+}`;
+
+      const chatCompletion = await groq.chat.completions.create({
+        messages: [{ role: 'user', content: prompt }],
+        model: 'llama-3.1-8b-instant',
+        response_format: { type: 'json_object' },
+        temperature: 0.9, // Higher temperature for variety
+        max_tokens: 150,
+      });
+
+      const parsedTip = JSON.parse(chatCompletion.choices[0]?.message?.content || '{}');
+      dailyTipCache = { date: today, tip: parsedTip };
+      return parsedTip;
+    } catch (err) {
+      logger.error('Groq Daily Tip generation failed:', { error: err.message || err });
+      return defaultTip;
+    }
+  },
+
+  /**
+   * Carbon Intelligence Score & Feedback
+   */
+  getScoreFeedback: async (score, breakdown) => {
+    if (!groq) {
+      return {
+        score,
+        grade: score >= 80 ? 'A' : score >= 60 ? 'B' : score >= 40 ? 'C' : 'D',
+        feedback: `You scored ${score}/100. Focus on your largest footprint contributor. Reducing meat intake and switching to green electricity tariffs are the highest-yield steps you can take.`,
+      };
+    }
+
+    try {
+      const prompt = `Provide carbon intelligence feedback on a sustainability score of ${score}/100.
+Breakdown: Transport: ${breakdown.transport || 0}%, Energy: ${breakdown.energy || 0}%, Food: ${breakdown.food || 0}%, Shopping: ${breakdown.shopping || 0}%.
+
+Return ONLY a valid JSON object matching this structure:
+{
+  "score": ${score},
+  "grade": "A" | "B" | "C" | "D" | "F",
+  "feedback": "A short, actionable paragraph of feedback summarizing their emissions profiles."
+}`;
+
+      const chatCompletion = await groq.chat.completions.create({
+        messages: [{ role: 'user', content: prompt }],
+        model: 'llama-3.1-8b-instant',
+        response_format: { type: 'json_object' },
+        temperature: 0.5,
+        max_tokens: 250,
+      });
+
+      return JSON.parse(chatCompletion.choices[0]?.message?.content || '{}');
+    } catch (err) {
+      logger.error('Groq Score Feedback failed:', { error: err.message || err });
+      return {
+        score,
+        grade: 'B',
+        feedback: 'Your emissions are moderate. Review transport and food habits.',
+      };
+    }
+  },
+
+  /**
+   * Narrative Comparison
+   */
+  getCompareNarrative: async (totalEmission, breakdown) => {
+    if (!groq) {
+      return {
+        vsGlobal: totalEmission > 4700 ? 'higher' : 'lower',
+        standoutCategory: 'transport',
+        narrative: `Your annual footprint of ${(totalEmission / 1000).toFixed(1)} tonnes is ${totalEmission > 4700 ? 'above' : 'below'} the global average of 4.7 tonnes. Focus on choosing green modes of transport and reducing consumer electronics purchases to further lower your footprint.`,
+      };
+    }
+
+    try {
+      const prompt = `Compare a user's carbon footprint of ${totalEmission} kg CO2e against the global average (4,700 kg/year).
+Breakdown: Transport: ${breakdown.transport || 0}%, Energy: ${breakdown.energy || 0}%, Food: ${breakdown.food || 0}%, Shopping: ${breakdown.shopping || 0}%.
+
+Return ONLY a valid JSON object matching this structure:
+{
+  "vsGlobal": "higher" | "lower",
+  "standoutCategory": "transport" | "energy" | "food" | "shopping",
+  "narrative": "A concise paragraph (2-3 sentences) evaluating their standing and highlighting which category has the highest relative impact."
+}`;
+
+      const chatCompletion = await groq.chat.completions.create({
+        messages: [{ role: 'user', content: prompt }],
+        model: 'llama-3.1-8b-instant',
+        response_format: { type: 'json_object' },
+        temperature: 0.6,
+        max_tokens: 250,
+      });
+
+      return JSON.parse(chatCompletion.choices[0]?.message?.content || '{}');
+    } catch (err) {
+      logger.error('Groq Comparison Narrative failed:', { error: err.message || err });
+      return {
+        vsGlobal: totalEmission > 4700 ? 'higher' : 'lower',
+        standoutCategory: 'transport',
+        narrative: 'Comparison computed successfully.',
+      };
+    }
+  },
+};

backend/src/services/assessmentService.js

@@ -0,0 +1,176 @@
+import db from '../utils/firebaseClient.js';
+import { calculateAllEmissions } from './carbonCalculator.js';
+import { calculateScore } from './scoringService.js';
+import { generateRecommendations } from './recommendationEngine.js';
+import crypto from 'crypto';
+
+function computeStreak(userProfile) {
+  const today = new Date().toISOString().split('T')[0];
+  const streak = userProfile.streak || { current: 0, longest: 0, lastSaved: null };
+
+  if (streak.lastSaved === today) {
+    return streak;
+  }
+
+  const yesterday = new Date();
+  yesterday.setDate(yesterday.getDate() - 1);
+  const yStr = yesterday.toISOString().split('T')[0];
+
+  const newCurrent = streak.lastSaved === yStr ? streak.current + 1 : 1;
+  return {
+    current: newCurrent,
+    longest: Math.max(newCurrent, streak.longest || 0),
+    lastSaved: today,
+  };
+}
+
+function computeTitle(points) {
+  if (points >= 25000) return 'Master Guardian';
+  if (points >= 15000) return 'Climate Champion';
+  if (points >= 10000) return 'Ocean Guardian';
+  if (points >= 6000) return 'Nature Enthusiast';
+  if (points >= 3000) return 'Carbon Reducer';
+  if (points >= 1000) return 'Green Sprout';
+  return 'Eco Novice';
+}
+
+function computeBadges(data, existingBadges = []) {
+  const badges = new Set(existingBadges);
+  if (data.dietType === 'vegan' || data.dietType === 'vegetarian') {
+    badges.add('Tree Planter');
+  }
+  if (data.dailyCarKm === 0 || ['electric', 'hybrid', 'none'].includes(data.carFuelType)) {
+    badges.add('Carbon Ninja');
+  }
+  if (data.clothingItemsPerYear < 5 && data.electronicsItemsPerYear === 0) {
+    badges.add('Zero Waste');
+  }
+  return Array.from(badges);
+}
+
+/**
+ * Create a new assessment with full emission analysis and recommendations.
+ *
+ * @param {Object} data - Validated assessment input (matches assessmentSchema).
+ * @returns {Promise<{assessment: Object, emissions: Object, score: number}>}
+ */
+export async function createAssessmentWithRecommendations(data) {
+  // ── Step 1: Resolve user ───────────────────────────────────────────────────
+  const userDoc = await db.collection('users').doc(data.userId).get();
+  let effectiveUserId = data.userId;
+  let user = userDoc.exists ? userDoc.data() : null;
+
+  if (!user) {
+    const email = `${data.userId}@ecoguide.ai`;
+    const qSnapshot = await db.collection('users').where('email', '==', email).get();
+
+    if (!qSnapshot.empty) {
+      const existingUserDoc = qSnapshot.docs[0];
+      effectiveUserId = existingUserDoc.id;
+      user = existingUserDoc.data();
+    } else {
+      const newUserId = data.userId;
+      user = {
+        id: newUserId,
+        name: 'Anonymous',
+        email: email,
+        points: 0,
+        badges: [],
+        title: 'Eco Novice',
+        streak: { current: 0, longest: 0, lastSaved: null },
+        createdAt: new Date().toISOString(),
+        updatedAt: new Date().toISOString(),
+      };
+      await db.collection('users').doc(newUserId).set(user);
+      effectiveUserId = newUserId;
+    }
+  }
+
+  // ── Step 2: Calculate emissions ────────────────────────────────────────────
+  const emissions = calculateAllEmissions(data);
+
+  // ── Step 3: Score ──────────────────────────────────────────────────────────
+  const score = calculateScore(emissions.totalEmission);
+
+  // ── Step 4: Generate personalised recommendations ──────────────────────────
+  const recs = generateRecommendations(data, emissions);
+
+  // ── Step 5: Update User Profile (Points, Streak, Badges, Title) ────────────
+  const currentStreak = computeStreak(user);
+  const isStreakMilestone = currentStreak.current > 0;
+  const streakBonus =
+    isStreakMilestone && currentStreak.current % 7 === 0
+      ? 250
+      : isStreakMilestone && currentStreak.current % 3 === 0
+        ? 50
+        : 0;
+
+  const awardedPoints = 100 + streakBonus;
+  const newPoints = (user.points || 0) + awardedPoints;
+  const newBadges = computeBadges(data, user.badges || []);
+  const newTitle = computeTitle(newPoints);
+
+  const updatedUser = {
+    ...user,
+    points: newPoints,
+    badges: newBadges,
+    title: newTitle,
+    streak: currentStreak,
+    updatedAt: new Date().toISOString(),
+  };
+
+  await db.collection('users').doc(effectiveUserId).set(updatedUser);
+
+  // ── Step 6: Persist Assessment ─────────────────────────────────────────────
+  const assessmentId = crypto.randomUUID();
+  const assessmentDocData = {
+    id: assessmentId,
+    userId: effectiveUserId,
+    dailyCarKm: data.dailyCarKm,
+    carFuelType: data.carFuelType,
+    publicTransportKmPerWeek: data.publicTransportKmPerWeek,
+    cyclingKmPerWeek: data.cyclingKmPerWeek,
+    shortFlightsPerYear: data.shortFlightsPerYear,
+    longFlightsPerYear: data.longFlightsPerYear,
+    monthlyElectricityKwh: data.monthlyElectricityKwh,
+    renewablePercentage: data.renewablePercentage,
+    dietType: data.dietType,
+    clothingItemsPerYear: data.clothingItemsPerYear,
+    electronicsItemsPerYear: data.electronicsItemsPerYear,
+    transportEmission: emissions.transportEmission,
+    energyEmission: emissions.energyEmission,
+    foodEmission: emissions.foodEmission,
+    shoppingEmission: emissions.shoppingEmission,
+    totalEmission: emissions.totalEmission,
+    sustainabilityScore: score,
+    createdAt: new Date().toISOString(),
+  };
+
+  await db.collection('assessments').doc(assessmentId).set(assessmentDocData);
+
+  const recommendationsList = [];
+  for (const r of recs) {
+    const recId = crypto.randomUUID();
+    const recDocData = {
+      id: recId,
+      assessmentId,
+      title: r.title,
+      description: r.description,
+      estimatedSavings: r.estimatedSavings,
+      priority: r.priority,
+      category: r.category,
+      createdAt: new Date().toISOString(),
+    };
+    await db.collection('recommendations').doc(recId).set(recDocData);
+    recommendationsList.push(recDocData);
+  }
+
+  recommendationsList.sort((a, b) => (b.estimatedSavings || 0) - (a.estimatedSavings || 0));
+
+  const assessment = {
+    ...assessmentDocData,
+    recommendations: recommendationsList,
+  };
+
+  return { assessment, emissions, score };
+}

backend/src/services/carbonCalculator.js

@@ -0,0 +1,121 @@
+/**
+ * Carbon Calculator Service
+ * Implements real-world emission factors from IPCC, EPA, and UK BEIS 2023
+ */
+
+// === Emission Factors ===
+const EMISSION_FACTORS = {
+  car: {
+    petrol: 0.21, // kg CO₂ per km
+    diesel: 0.17,
+    electric: 0.047,
+    hybrid: 0.105,
+    none: 0,
+  },
+  publicTransport: 0.089, // kg CO₂ per km (bus average)
+  train: 0.041, // kg CO₂ per km
+  electricity: 0.233, // kg CO₂ per kWh (UK grid 2023)
+  food: {
+    vegan: 1500, // kg CO₂ per year
+    vegetarian: 1700,
+    mixed: 2500,
+    heavy_meat: 3300,
+  },
+  clothing: 33, // kg CO₂ per clothing item (manufacturing + transport)
+  electronics: 300, // kg CO₂ per device (avg smartphone/laptop lifecycle)
+  flight: {
+    short_haul: 255, // kg CO₂ per return flight (< 3 hours, incl. radiative forcing)
+    long_haul: 1620, // kg CO₂ per return flight (> 3 hours)
+  },
+};
+
+/**
+ * Calculate transport-related CO₂ emissions
+ * @param {Object} data
+ * @returns {number} kg CO₂ per year
+ */
+export function calculateTransportEmission(data) {
+  const {
+    dailyCarKm = 0,
+    carFuelType = 'none',
+    publicTransportKmPerWeek = 0,
+    cyclingKmPerWeek: _cyclingKmPerWeek = 0,
+    shortFlightsPerYear = 0,
+    longFlightsPerYear = 0,
+  } = data;
+
+  const carFactor = EMISSION_FACTORS.car[carFuelType] ?? 0;
+  const carEmission = dailyCarKm * carFactor * 365;
+  const publicTransportEmission = publicTransportKmPerWeek * 52 * EMISSION_FACTORS.publicTransport;
+  const flightEmission =
+    shortFlightsPerYear * EMISSION_FACTORS.flight.short_haul +
+    longFlightsPerYear * EMISSION_FACTORS.flight.long_haul;
+  // Cycling produces 0 direct emissions
+
+  return carEmission + publicTransportEmission + flightEmission;
+}
+
+/**
+ * Calculate home energy CO₂ emissions
+ * @param {Object} data
+ * @returns {number} kg CO₂ per year
+ */
+export function calculateEnergyEmission(data) {
+  const { monthlyElectricityKwh = 0, renewablePercentage = 0 } = data;
+  const nonRenewableFraction = 1 - Math.min(renewablePercentage, 100) / 100;
+  return monthlyElectricityKwh * 12 * EMISSION_FACTORS.electricity * nonRenewableFraction;
+}
+
+/**
+ * Calculate food & diet CO₂ emissions
+ * @param {Object} data
+ * @returns {number} kg CO₂ per year
+ */
+export function calculateFoodEmission(data) {
+  const { dietType = 'mixed' } = data;
+  return EMISSION_FACTORS.food[dietType] ?? EMISSION_FACTORS.food.mixed;
+}
+
+/**
+ * Calculate shopping CO₂ emissions
+ * @param {Object} data
+ * @returns {number} kg CO₂ per year
+ */
+export function calculateShoppingEmission(data) {
+  const { clothingItemsPerYear = 0, electronicsItemsPerYear = 0 } = data;
+  return (
+    clothingItemsPerYear * EMISSION_FACTORS.clothing +
+    electronicsItemsPerYear * EMISSION_FACTORS.electronics
+  );
+}
+
+/**
+ * Calculate all emissions and return a full breakdown
+ * @param {Object} inputData
+ * @returns {Object} complete emission breakdown
+ */
+export function calculateAllEmissions(inputData) {
+  const transport = calculateTransportEmission(inputData);
+  const energy = calculateEnergyEmission(inputData);
+  const food = calculateFoodEmission(inputData);
+  const shopping = calculateShoppingEmission(inputData);
+  const total = transport + energy + food + shopping;
+
+  const safeTotal = total === 0 ? 1 : total;
+
+  return {
+    transportEmission: Math.round(transport),
+    energyEmission: Math.round(energy),
+    foodEmission: Math.round(food),
+    shoppingEmission: Math.round(shopping),
+    totalEmission: Math.round(total),
+    breakdown: {
+      transport: parseFloat(((transport / safeTotal) * 100).toFixed(1)),
+      energy: parseFloat(((energy / safeTotal) * 100).toFixed(1)),
+      food: parseFloat(((food / safeTotal) * 100).toFixed(1)),
+      shopping: parseFloat(((shopping / safeTotal) * 100).toFixed(1)),
+    },
+  };
+}
+
+export { EMISSION_FACTORS };

backend/src/services/recommendationEngine.js

@@ -0,0 +1,294 @@
+/**
+ * AI Recommendation Engine
+ * Analyzes user assessment data and generates personalized, prioritized recommendations
+ * using decision-tree logic based on real emission factors
+ */
+
+import { EMISSION_FACTORS } from './carbonCalculator.js';
+
+const PRIORITY = { HIGH: 'HIGH', MEDIUM: 'MEDIUM', LOW: 'LOW' };
+
+/**
+ * Generate personalized recommendations from assessment data and calculated emissions
+ * @param {Object} assessmentData - user input data
+ * @param {Object} emissions - calculated emission breakdown
+ * @returns {Array} sorted array of recommendation objects
+ */
+export function generateRecommendations(assessmentData, emissions) {
+  const recommendations = [];
+
+  // === TRANSPORTATION RECOMMENDATIONS ===
+  _analyzeTransport(assessmentData, emissions, recommendations);
+
+  // === ENERGY RECOMMENDATIONS ===
+  _analyzeEnergy(assessmentData, emissions, recommendations);
+
+  // === FOOD RECOMMENDATIONS ===
+  _analyzeFood(assessmentData, emissions, recommendations);
+
+  // === SHOPPING RECOMMENDATIONS ===
+  _analyzeShopping(assessmentData, emissions, recommendations);
+
+  // Sort: HIGH priority first, then by estimated savings descending
+  return recommendations.sort((a, b) => {
+    const priorityOrder = { HIGH: 0, MEDIUM: 1, LOW: 2 };
+    const priorityDiff = priorityOrder[a.priority] - priorityOrder[b.priority];
+    if (priorityDiff !== 0) return priorityDiff;
+    return b.estimatedSavings - a.estimatedSavings;
+  });
+}
+
+function _analyzeTransport(data, emissions, recs) {
+  const {
+    dailyCarKm = 0,
+    carFuelType = 'none',
+    publicTransportKmPerWeek = 0,
+    shortFlightsPerYear = 0,
+    longFlightsPerYear = 0,
+    cyclingKmPerWeek: _cyclingKmPerWeek = 0,
+  } = data;
+
+  const totalFlights = shortFlightsPerYear + longFlightsPerYear;
+  const flightEmission =
+    shortFlightsPerYear * EMISSION_FACTORS.flight.short_haul +
+    longFlightsPerYear * EMISSION_FACTORS.flight.long_haul;
+
+  // 1. EV switch recommendation
+  if (dailyCarKm > 10 && carFuelType === 'petrol') {
+    const currentCarEmission = dailyCarKm * EMISSION_FACTORS.car.petrol * 365;
+    const evCarEmission = dailyCarKm * EMISSION_FACTORS.car.electric * 365;
+    const savings = Math.round(currentCarEmission - evCarEmission);
+    recs.push({
+      title: 'Switch to an Electric Vehicle',
+      description: `You drive ${dailyCarKm}km daily on petrol, generating ~${Math.round(currentCarEmission)}kg CO₂/year. An EV running on grid electricity would cut this by ~75%, saving ${savings}kg annually.`,
+      estimatedSavings: savings,
+      priority: savings > 1500 ? PRIORITY.HIGH : PRIORITY.MEDIUM,
+      category: 'transport',
+    });
+  }
+
+  if (dailyCarKm > 10 && carFuelType === 'diesel') {
+    const currentCarEmission = dailyCarKm * EMISSION_FACTORS.car.diesel * 365;
+    const evCarEmission = dailyCarKm * EMISSION_FACTORS.car.electric * 365;
+    const savings = Math.round(currentCarEmission - evCarEmission);
+    recs.push({
+      title: 'Switch to an Electric Vehicle',
+      description: `Your diesel vehicle contributes ~${Math.round(currentCarEmission)}kg CO₂/year. Switching to an EV could save ${savings}kg annually and reduce urban air pollution.`,
+      estimatedSavings: savings,
+      priority: savings > 1200 ? PRIORITY.HIGH : PRIORITY.MEDIUM,
+      category: 'transport',
+    });
+  }
+
+  // 2. Cycling recommendation
+  if (dailyCarKm > 3 && carFuelType !== 'none') {
+    const carFactor = EMISSION_FACTORS.car[carFuelType] ?? 0.21;
+    // Assume 30% of short trips could be cycled
+    const cyclableKmPerDay = Math.min(dailyCarKm * 0.3, 5);
+    const savings = Math.round(cyclableKmPerDay * carFactor * 365);
+    recs.push({
+      title: 'Replace Short Trips with Cycling or Walking',
+      description: `Cycling or walking for journeys under 5km instead of driving could save ~${savings}kg CO₂/year while improving your health and reducing congestion.`,
+      estimatedSavings: savings,
+      priority: PRIORITY.MEDIUM,
+      category: 'transport',
+    });
+  }
+
+  // 3. Public transport recommendation
+  if (dailyCarKm > 15 && publicTransportKmPerWeek < 20 && carFuelType !== 'electric') {
+    const carFactor = EMISSION_FACTORS.car[carFuelType] ?? 0.21;
+    const potentialPTKm = dailyCarKm * 5; // weekday trips
+    const savings = Math.round(potentialPTKm * 52 * (carFactor - EMISSION_FACTORS.publicTransport));
+    recs.push({
+      title: 'Use Public Transport for Commuting',
+      description: `Switching even 2 days/week to public transport for your ${dailyCarKm}km daily commute could save ~${savings}kg CO₂/year and reduce traffic stress.`,
+      estimatedSavings: Math.max(0, savings),
+      priority: savings > 800 ? PRIORITY.HIGH : PRIORITY.MEDIUM,
+      category: 'transport',
+    });
+  }
+
+  // 4. Flight reduction
+  if (totalFlights >= 2) {
+    const savings = Math.round(flightEmission * 0.5);
+    recs.push({
+      title: 'Reduce Air Travel by 50%',
+      description: `Your ${totalFlights} annual flight${totalFlights > 1 ? 's' : ''} contribute ~${Math.round(flightEmission)}kg CO₂. Cutting flights in half through video calls, trains, or choosing fewer trips saves ${savings}kg annually.`,
+      estimatedSavings: savings,
+      priority: flightEmission > 2000 ? PRIORITY.HIGH : PRIORITY.MEDIUM,
+      category: 'transport',
+    });
+  }
+
+  if (longFlightsPerYear >= 1) {
+    recs.push({
+      title: 'Choose Train Over Short-Haul Flights',
+      description: `A long-haul flight emits ~1,620kg CO₂. For routes under 800km, trains emit 75–90% less CO₂ and are often as fast door-to-door.`,
+      estimatedSavings: Math.round(longFlightsPerYear * 1620 * 0.85),
+      priority: PRIORITY.HIGH,
+      category: 'transport',
+    });
+  }
+
+  // 5. Carpool suggestion
+  if (dailyCarKm > 20 && publicTransportKmPerWeek < 10 && carFuelType !== 'electric') {
+    const carFactor = EMISSION_FACTORS.car[carFuelType] ?? 0.21;
+    const savings = Math.round(dailyCarKm * carFactor * 365 * 0.35);
+    recs.push({
+      title: 'Start Carpooling',
+      description: `Sharing your commute with just one other person halves both your per-person emissions and fuel costs, saving an estimated ${savings}kg CO₂/year.`,
+      estimatedSavings: savings,
+      priority: PRIORITY.LOW,
+      category: 'transport',
+    });
+  }
+}
+
+function _analyzeEnergy(data, emissions, recs) {
+  const { monthlyElectricityKwh = 0, renewablePercentage = 0 } = data;
+  const annualKwh = monthlyElectricityKwh * 12;
+
+  // 1. Renewable energy tariff
+  if (renewablePercentage < 50 && monthlyElectricityKwh > 100) {
+    const currentEmission = annualKwh * 0.233 * (1 - renewablePercentage / 100);
+    const renewableEmission = annualKwh * 0.233 * 0.1;
+    const savings = Math.round(currentEmission - renewableEmission);
+    recs.push({
+      title: 'Switch to a 100% Renewable Energy Tariff',
+      description: `Only ${renewablePercentage}% of your electricity comes from renewables. Switching to a green tariff costs little to nothing extra but can save ~${savings}kg CO₂/year immediately.`,
+      estimatedSavings: savings,
+      priority: savings > 600 ? PRIORITY.HIGH : PRIORITY.MEDIUM,
+      category: 'energy',
+    });
+  }
+
+  // 2. Solar panels
+  if (renewablePercentage < 30 && monthlyElectricityKwh > 200) {
+    const savings = Math.round(emissions.energyEmission * 0.7);
+    recs.push({
+      title: 'Install Solar Panels',
+      description: `With your electricity consumption of ${monthlyElectricityKwh}kWh/month, rooftop solar panels could generate 70-80% of your electricity needs and save ~${savings}kg CO₂/year.`,
+      estimatedSavings: savings,
+      priority: PRIORITY.HIGH,
+      category: 'energy',
+    });
+  }
+
+  // 3. Reduce consumption
+  if (monthlyElectricityKwh > 300) {
+    const savings = Math.round(
+      monthlyElectricityKwh * 0.25 * 12 * 0.233 * (1 - renewablePercentage / 100)
+    );
+    recs.push({
+      title: 'Reduce Home Electricity Consumption',
+      description: `Your usage of ${monthlyElectricityKwh}kWh/month is above average. Upgrading to LED lighting, smart thermostats, and A-rated appliances can reduce consumption by 20-30%, saving ~${savings}kg CO₂/year.`,
+      estimatedSavings: Math.max(0, savings),
+      priority: PRIORITY.MEDIUM,
+      category: 'energy',
+    });
+  }
+
+  // 4. Smart heating
+  if (monthlyElectricityKwh > 150) {
+    recs.push({
+      title: 'Install a Smart Thermostat',
+      description:
+        'Smart thermostats learn your schedule and can reduce heating and cooling energy use by 10-15%, with typical savings of 150-400kg CO₂/year depending on home size.',
+      estimatedSavings: Math.round(emissions.energyEmission * 0.12),
+      priority: PRIORITY.LOW,
+      category: 'energy',
+    });
+  }
+}
+
+function _analyzeFood(data, emissions, recs) {
+  const { dietType = 'mixed' } = data;
+
+  if (dietType === 'heavy_meat') {
+    recs.push({
+      title: 'Reduce Red Meat Consumption',
+      description:
+        'A heavy meat diet generates ~3,300kg CO₂/year from food alone. Cutting beef and lamb to twice a week while keeping other meat saves ~800kg CO₂/year — one of the highest-impact individual changes.',
+      estimatedSavings: 800,
+      priority: PRIORITY.HIGH,
+      category: 'food',
+    });
+    recs.push({
+      title: 'Try Meat-Free Mondays',
+      description:
+        'Going vegetarian just one day per week saves ~150kg CO₂/year. Extending to 3 meat-free days reduces your diet footprint by over 600kg annually.',
+      estimatedSavings: 500,
+      priority: PRIORITY.MEDIUM,
+      category: 'food',
+    });
+  }
+
+  if (dietType === 'mixed') {
+    recs.push({
+      title: 'Adopt a Vegetarian Diet',
+      description:
+        'Switching from a mixed to vegetarian diet saves ~800kg CO₂/year. Plant proteins like beans, lentils and tofu have 10-20x lower carbon footprints than beef.',
+      estimatedSavings: 800,
+      priority: PRIORITY.MEDIUM,
+      category: 'food',
+    });
+  }
+
+  if (dietType !== 'vegan') {
+    recs.push({
+      title: 'Reduce Food Waste',
+      description:
+        'Around 30% of food is wasted globally. Meal planning, proper storage and composting can reduce your food footprint by 10-15%, saving ~150-300kg CO₂/year.',
+      estimatedSavings: Math.round(EMISSION_FACTORS.food[dietType] * 0.12),
+      priority: PRIORITY.LOW,
+      category: 'food',
+    });
+
+    recs.push({
+      title: 'Choose Local & Seasonal Produce',
+      description:
+        'Out-of-season produce shipped by air can have 50x higher emissions than local seasonal equivalents. Shopping at farmers markets and choosing seasonal food reduces transport emissions.',
+      estimatedSavings: Math.round(EMISSION_FACTORS.food[dietType] * 0.08),
+      priority: PRIORITY.LOW,
+      category: 'food',
+    });
+  }
+}
+
+function _analyzeShopping(data, emissions, recs) {
+  const { clothingItemsPerYear = 0, electronicsItemsPerYear = 0 } = data;
+
+  if (clothingItemsPerYear > 10) {
+    const savings = Math.round(clothingItemsPerYear * EMISSION_FACTORS.clothing * 0.6);
+    recs.push({
+      title: 'Buy Second-Hand Clothing',
+      description: `You buy ~${clothingItemsPerYear} clothing items per year. Sourcing 60% from charity shops, vintage stores or clothing swaps saves ~${savings}kg CO₂/year while reducing textile waste.`,
+      estimatedSavings: savings,
+      priority: clothingItemsPerYear > 20 ? PRIORITY.MEDIUM : PRIORITY.LOW,
+      category: 'shopping',
+    });
+  }
+
+  if (electronicsItemsPerYear >= 2) {
+    const savings = Math.round(electronicsItemsPerYear * EMISSION_FACTORS.electronics * 0.5);
+    recs.push({
+      title: 'Repair & Extend Electronics Lifespan',
+      description: `Manufacturing ${electronicsItemsPerYear} devices/year contributes ~${electronicsItemsPerYear * EMISSION_FACTORS.electronics}kg CO₂. Repairing devices and buying refurbished saves ~${savings}kg CO₂/year and significant money.`,
+      estimatedSavings: savings,
+      priority: PRIORITY.MEDIUM,
+      category: 'shopping',
+    });
+  }
+
+  if (clothingItemsPerYear > 5 || electronicsItemsPerYear >= 1) {
+    recs.push({
+      title: 'Choose Products with Lower Carbon Footprints',
+      description:
+        'Look for products with eco-certifications, made from recycled materials, or manufactured locally. Even small changes in purchasing habits compound over time.',
+      estimatedSavings: Math.round(emissions.shoppingEmission * 0.15),
+      priority: PRIORITY.LOW,
+      category: 'shopping',
+    });
+  }
+}