oi

.gitignore

@@ -0,0 +1,108 @@
+# Dependencies
+node_modules/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Coverage directory used by tools like istanbul
+coverage/
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage
+.grunt
+
+# Bower dependency directory
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons
+build/Release
+
+# Dependency directories
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+.env.production
+.env.local
+
+# parcel-bundler cache
+.cache
+.parcel-cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# Docker
+.dockerignore
+
+# OS generated files
+.DS_Store
+.DS_Store?
+._*
+.Spotlight-V100
+.Trashes
+ehthumbs.db
+Thumbs.db
+
+# IDE files
+.vscode/
+.idea/
+*.swp
+*.swo
+*~
+
+# Logs
+logs
+*.log

Dockerfile

@@ -0,0 +1,32 @@
+# Use official Node.js runtime as base image
+FROM node:18-alpine
+
+# Set working directory in container
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+
+# Install dependencies
+RUN npm ci --only=production && npm cache clean --force
+
+# Copy application files
+COPY . .
+
+# Create non-root user for security
+RUN addgroup -g 1001 -S nodejs && \
+    adduser -S nextjs -u 1001
+
+# Change ownership of app directory
+RUN chown -R nextjs:nodejs /app
+USER nextjs
+
+# Expose port
+EXPOSE 7860
+
+# Health check
+HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \
+    CMD node -e "require('http').get('http://localhost:7860/health', (res) => { process.exit(res.statusCode === 200 ? 0 : 1) })"
+
+# Start the application
+CMD ["npm", "start"]

README.md

@@ -1,11 +1,98 @@
 ---
-title: K30
-emoji: 🐠
+title: Plano Cetogênico 30 Dias - Mapa da Secagem
+emoji: 🔥
 colorFrom: purple
-colorTo: yellow
+colorTo: pink
 sdk: docker
+app_port: 7860
 pinned: false
 license: mit
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# 🔥 Plano Cetogênico 30 Dias - Mapa da Secagem
+
+Uma aplicação web completa e responsiva para acompanhar seu plano cetogênico de 30 dias, com **notificações programadas**, **PWA instalável** e orientações detalhadas.
+
+## ✨ Funcionalidades Principais
+
+- **📱 PWA Instalável**: Instale como app no seu celular
+- **🔔 Notificações Automáticas**: Lembretes em cada horário do plano:
+  - 05:00 - Despertar e hidratação
+  - 05:30 - Preparação para o dia
+  - 08:00 - Café da manhã cetogênico
+  - 12:00 - Almoço completo
+  - 13:00 - Suplementação
+  - 16:00 - Lanche pré-treino
+  - 17:00 - Treino turbo
+  - 18:00 - Jantar nutritivo
+  - 22:00 - Ceia e recuperação
+
+- **✅ Checklist Completo**: Marque cada tarefa conforme completa
+- **⏰ Cronômetro Integrado**: Para treinos e atividades
+- **💪 Motivação Diária**: Versículos e mensagens encorajadoras
+- **📊 Acompanhamento de Progresso**: Estatísticas detalhadas
+- **🎨 Design Moderno**: Cores em tons de rosa escuro, roxo e azul escuro
+- **📱 Mobile-First**: Interface otimizada para dispositivos móveis
+
+## 🚀 Como Usar
+
+1. **Acesse a aplicação** através do link do Hugging Face Spaces
+2. **Ative as notificações** clicando no botão "🔔 Ativar Notificações"
+3. **Instale como PWA** clicando em "📱 Instalar App" (quando disponível)
+4. **Navegue pelos dias** usando os controles de navegação
+5. **Marque as tarefas** conforme as completa
+6. **Use o cronômetro** para seus treinos
+
+## 📋 Plano Completo
+
+### 🍽️ Horários e Refeições
+- **05:00** - Despertar: 300ml água + Lavitan Detox
+- **08:00** - Café: 2 ovos + Lavitan Multi + C
+- **12:00** - Almoço: Proteína + salada + Lavitan Energia
+- **16:00** - Lanche: Shake Lavitan + Treonato
+- **18:00** - Jantar: Ovos/frango + legumes + Lavitan Imunidade
+- **22:00** - Ceia: Shake + Colágeno + Treonato
+
+### 🏃‍♀️ Treinos Diários
+- **Segunda/Quinta**: Agachamento + Polichinelo + Prancha
+- **Terça/Sexta**: Corrida parada + Abdominal + Polichinelo
+- **Quarta**: Caminhada ou dança leve
+- **Sábado**: Treino livre opcional
+- **Domingo**: Descanso ativo
+
+### 🏆 Regras de Ouro
+1. **💧 Hidratação**: 2L de água por dia
+2. **🚫 Evitar**: Pão, macarrão, arroz, feijão, biscoito, refrigerante
+3. **🍽️ Preparação**: Cozinhe ovos e frango no domingo
+4. **😴 Descanso**: Durma até 00h no máximo
+
+## 💾 Tecnologias
+
+- **Frontend**: HTML5, CSS3, JavaScript (Vanilla)
+- **Backend**: Node.js + Express
+- **PWA**: Service Worker + Web App Manifest
+- **Notificações**: Web Notifications API
+- **Containerização**: Docker
+- **Deployment**: Hugging Face Spaces
+
+## 📈 Resultados Esperados
+
+Seguindo o plano à risca, você pode esperar:
+- **Perda de peso**: 6-9kg em 30 dias
+- **Redução de medidas**: Especialmente na região abdominal
+- **Mais energia**: Com a cetose e suplementação
+- **Melhor disposição**: Com exercícios regulares
+
+## 🙏 Motivação
+
+*"Posso todas as coisas naquele que me fortalece." - Filipenses 4:13*
+
+Lembre-se: você é mais forte do que imagina! Cada dia é uma vitória, cada escolha é um passo em direção à sua melhor versão.
+
+## 🔒 Privacidade
+
+Todos os seus dados ficam salvos localmente no seu dispositivo. Nenhuma informação pessoal é enviada para servidores externos.
+
+---
+
+**Feito com 💜 para sua transformação!**

create-icons.js

@@ -0,0 +1,35 @@
+// Simple script to create placeholder PNG icons from SVG
+const fs = require('fs');
+const path = require('path');
+
+// Create icons directory if it doesn't exist
+const iconsDir = path.join(__dirname, 'public', 'icons');
+if (!fs.existsSync(iconsDir)) {
+    fs.mkdirSync(iconsDir, { recursive: true });
+}
+
+// Icon sizes needed for PWA
+const sizes = [72, 96, 128, 144, 152, 192, 384, 512];
+
+// Create a simple PNG data URL for each size
+sizes.forEach(size => {
+    // Create a simple colored square as placeholder
+    const canvas = `<svg width="${size}" height="${size}" xmlns="http://www.w3.org/2000/svg">
+        <defs>
+            <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+                <stop offset="0%" style="stop-color:#1a0d2e;stop-opacity:1" />
+                <stop offset="50%" style="stop-color:#6b46c1;stop-opacity:1" />
+                <stop offset="100%" style="stop-color:#d946ef;stop-opacity:1" />
+            </linearGradient>
+        </defs>
+        <rect width="${size}" height="${size}" rx="${size * 0.1}" ry="${size * 0.1}" fill="url(#bg)"/>
+        <text x="${size/2}" y="${size/2}" font-family="Arial" font-size="${size * 0.3}" text-anchor="middle" dy="0.1em" fill="white">🔥</text>
+    </svg>`;
+    
+    const filename = `icon-${size}x${size}.svg`;
+    fs.writeFileSync(path.join(iconsDir, filename), canvas);
+    console.log(`Created ${filename}`);
+});
+
+console.log('All icons created successfully!');
+console.log('Note: For production, convert SVG icons to PNG using an online converter or image processing tool.');

dist/app.min.js

@@ -0,0 +1 @@
+//Complete Fitness App-Redesigned class FitnessApp{constructor(){this.currentView='home';this.currentCategory=null;this.currentWorkout=null;this.workoutTimer=null;this.workoutStartTime=null;this.workoutSeconds=0;this.currentExerciseIndex=0;this.currentSeries=0;this.navigationHistory=[];this.userProfile=this.loadUserProfile();this.userData=this.loadUserData();this.progress=this.loadProgress();this.weightData=this.loadWeightData();this.personalPlan=null;this.soundEnabled=localStorage.getItem('soundEnabled')!=='false';this.audioContext=new(window.AudioContext||window.webkitAudioContext)();this.sounds={backgroundYoga: new Audio('songs/background_yoga.mp3'),startYoga: new Audio('songs/start_yoga.mp3'),countdown: new Audio('songs/td_countdown.mp3'),motivational: new Audio('songs/td_di_2.ogg')};this.setupAudio();this.init();}setupAudio(){this.sounds.backgroundYoga.loop=true;this.sounds.backgroundYoga.volume=0.3;this.audioLoaded=false;}ensureAudioLoaded(){if(this.audioLoaded)return;Object.values(this.sounds).forEach(sound=>{sound.load();});this.audioLoaded=true;}playCuteSound(type){if(!this.soundEnabled)return;try{ const ctx=this.audioContext; const oscillator=ctx.createOscillator(); const gainNode=ctx.createGain();oscillator.connect(gainNode);gainNode.connect(ctx.destination);switch(type){case 'tap':oscillator.frequency.setValueAtTime(800,ctx.currentTime);oscillator.frequency.exponentialRampToValueAtTime(400,ctx.currentTime+0.1);gainNode.gain.setValueAtTime(0.3,ctx.currentTime);gainNode.gain.exponentialRampToValueAtTime(0.01,ctx.currentTime+0.1);oscillator.type='sine';oscillator.start(ctx.currentTime);oscillator.stop(ctx.currentTime+0.1);break;case 'success':oscillator.frequency.setValueAtTime(523.25,ctx.currentTime);oscillator.frequency.setValueAtTime(659.25,ctx.currentTime+0.1);oscillator.frequency.setValueAtTime(783.99,ctx.currentTime+0.2);gainNode.gain.setValueAtTime(0.3,ctx.currentTime);gainNode.gain.exponentialRampToValueAtTime(0.01,ctx.currentTime+0.4);oscillator.type='sine';oscillator.start(ctx.currentTime);oscillator.stop(ctx.currentTime+0.4);break;case 'complete': const osc1=ctx.createOscillator(); const osc2=ctx.createOscillator(); const gain1=ctx.createGain(); const gain2=ctx.createGain();osc1.connect(gain1);osc2.connect(gain2);gain1.connect(ctx.destination);gain2.connect(ctx.destination);osc1.frequency.setValueAtTime(523.25,ctx.currentTime);osc2.frequency.setValueAtTime(659.25,ctx.currentTime);gain1.gain.setValueAtTime(0.2,ctx.currentTime);gain2.gain.setValueAtTime(0.2,ctx.currentTime);gain1.gain.exponentialRampToValueAtTime(0.01,ctx.currentTime+0.5);gain2.gain.exponentialRampToValueAtTime(0.01,ctx.currentTime+0.5);osc1.start(ctx.currentTime);osc2.start(ctx.currentTime);osc1.stop(ctx.currentTime+0.5);osc2.stop(ctx.currentTime+0.5);break;case 'click':oscillator.frequency.setValueAtTime(600,ctx.currentTime);gainNode.gain.setValueAtTime(0.2,ctx.currentTime);gainNode.gain.exponentialRampToValueAtTime(0.01,ctx.currentTime+0.05);oscillator.type='sine';oscillator.start(ctx.currentTime);oscillator.stop(ctx.currentTime+0.05);break;}}catch(e){console.log('Audio error:',e);}}playSound(soundName){if(!this.soundEnabled)return;this.ensureAudioLoaded(); const sound=this.sounds[soundName];if(sound){sound.currentTime=0;sound.play().catch(e=>{if(e.name!=='NotAllowedError'){console.log('Audio play failed:',e);}});}}stopSound(soundName){ const sound=this.sounds[soundName];if(sound){sound.pause();sound.currentTime=0;}}toggleSound(){this.soundEnabled=!this.soundEnabled;localStorage.setItem('soundEnabled',this.soundEnabled); const icon=document.getElementById('soundIcon');icon.textContent=this.soundEnabled?'🔊':'🔇';if(!this.soundEnabled){this.stopSound('backgroundYoga');}this.playCuteSound('click');}init(){if(!this.userProfile||!this.userProfile.name){this.showProfileSetup();return;} const isFirstTime=!localStorage.getItem('appVisited');if(isFirstTime){this.showWelcome();}else{this.hideWelcome();}this.generatePersonalPlan();this.setupEventListeners();this.resetDailyCalories();this.updateUI();this.loadAchievements();this.updateWeightDisplay();this.updateDetailedStats();this.setupPWA();}loadUserProfile(){try{ const data=localStorage.getItem('userProfile'); return data?JSON.parse(data):null;}catch(e){console.error('Error loading profile:',e); return null;}}saveUserProfile(){try{localStorage.setItem('userProfile',JSON.stringify(this.userProfile));}catch(e){console.error('Error saving profile:',e);}}showProfileSetup(){ const setupHTML=`<div class="profile-setup-screen" id="profileSetup"><div class="profile-setup-content"><h1 class="setup-title">🎯 Vamos Criar Seu Perfil</h1><p class="setup-subtitle">Para criar um plano personalizado perfeito para você!</p><form class="profile-form" id="profileForm"><!--Photo--><div class="form-group photo-upload"><label>📸 Foto de Perfil</label><div class="photo-selector"><input type="file" id="photoUpload" accept="image/*" style="display:none;"><div class="photo-preview" id="photoPreview"><div class="photo-placeholder"><span class="photo-icon">👤</span><span class="photo-text">Escolher Foto</span></div></div></div></div><!--Name--><div class="form-group"><label>✨ Nome</label><input type="text" id="profileName" placeholder="Como você se chama?" required></div><!--Age--><div class="form-row"><div class="form-group"><label>🎂 Idade</label><input type="number" id="profileAge" placeholder="25" min="13" max="100" required></div><!--Gender--><div class="form-group"><label>⚧ Sexo</label><select id="profileGender" required><option value="">Selecione</option><option value="female">Feminino</option><option value="male">Masculino</option><option value="other">Outro</option></select></div></div><!--Height&Weight--><div class="form-row"><div class="form-group"><label>📏 Altura(cm)</label><input type="number" id="profileHeight" placeholder="165" min="100" max="250" required></div><div class="form-group"><label>⚖️ Peso Atual(kg)</label><input type="number" id="profileWeight" placeholder="70" min="30" max="200" step="0.1" required></div></div><!--Goal Weight--><div class="form-group"><label>🎯 Peso Meta(kg)</label><input type="number" id="profileGoalWeight" placeholder="60" min="30" max="200" step="0.1" required></div><!--Activity Level--><div class="form-group"><label>🏃 Nível de Atividade</label><select id="profileActivity" required><option value="">Selecione</option><option value="sedentary">Sedentário(pouco ou nenhum exercício)</option><option value="light">Levemente Ativo(1-3 dias/semana)</option><option value="moderate">Moderadamente Ativo(3-5 dias/semana)</option><option value="active">Muito Ativo(6-7 dias/semana)</option><option value="extreme">Extremamente Ativo(atleta)</option></select></div><!--Goal--><div class="form-group"><label>💪 Objetivo Principal</label><select id="profileGoal" required><option value="">Selecione</option><option value="lose-weight">Perder Peso</option><option value="lose-weight-fast">Perder Peso Rápido</option><option value="maintain">Manter Peso</option><option value="gain-muscle">Ganhar Massa Muscular</option><option value="tone">Tonificar</option><option value="health">Melhorar Saúde Geral</option></select></div><!--Motivation--><div class="form-group"><label>🌟 Principal Motivação</label><select id="profileMotivation" required><option value="">Selecione</option><option value="health">Saúde e Bem-estar</option><option value="aesthetic">Estética/Aparência</option><option value="event">Evento Especial</option><option value="confidence">Autoconfiança</option><option value="energy">Mais Energia</option><option value="medical">Recomendação Médica</option></select></div><!--Preferences--><div class="form-group"><label>🍽️ Preferência Alimentar</label><select id="profileDiet"><option value="balanced">Balanceada</option><option value="low-carb">Low Carb</option><option value="keto">Cetogênica</option><option value="vegetarian">Vegetariana</option><option value="vegan">Vegana</option><option value="paleo">Paleo</option></select></div><button type="submit" class="btn-setup-submit">🚀 Criar Meu Plano Personalizado</button></form></div></div>`;document.body.insertAdjacentHTML('beforeend',setupHTML);this.setupProfileFormListeners();}setupProfileFormListeners(){ const form=document.getElementById('profileForm'); const photoUpload=document.getElementById('photoUpload'); const photoPreview=document.getElementById('photoPreview');photoPreview.addEventListener('click',()=>{photoUpload.click();});photoUpload.addEventListener('change',(e)=>{ const file=e.target.files[0];if(file){ const reader= new FileReader();reader.onload=(e)=>{ const img=document.createElement('img');img.src=e.target.result;img.className='profile-photo';photoPreview.innerHTML='';photoPreview.appendChild(img);this.tempPhoto=e.target.result;};reader.readAsDataURL(file);}});form.addEventListener('submit',(e)=>{e.preventDefault();this.saveProfile();});}saveProfile(){this.userProfile={photo:this.tempPhoto||null,name:document.getElementById('profileName').value,age:parseInt(document.getElementById('profileAge').value),gender:document.getElementById('profileGender').value,height:parseFloat(document.getElementById('profileHeight').value),weight:parseFloat(document.getElementById('profileWeight').value),goalWeight:parseFloat(document.getElementById('profileGoalWeight').value),activityLevel:document.getElementById('profileActivity').value,goal:document.getElementById('profileGoal').value,motivation:document.getElementById('profileMotivation').value,dietPreference:document.getElementById('profileDiet').value,createdAt: new Date().toISOString()};this.userProfile.bmi=this.calculateBMI(this.userProfile.weight,this.userProfile.height);this.userProfile.bmr=this.calculateBMR(this.userProfile.weight,this.userProfile.height,this.userProfile.age,this.userProfile.gender);this.userProfile.tdee=this.calculateTDEE(this.userProfile.bmr,this.userProfile.activityLevel);this.userProfile.targetCalories=this.calculateTargetCalories(this.userProfile.tdee,this.userProfile.goal);this.weightData.initial=this.userProfile.weight;this.weightData.current=this.userProfile.weight;this.weightData.goal=this.userProfile.goalWeight;this.weightData.history=[{date: new Date().toISOString().split('T')[0],weight:this.userProfile.weight}];this.saveWeightData();this.saveUserProfile();document.getElementById('profileSetup').remove();localStorage.setItem('appVisited','true');this.showWelcome();this.generatePersonalPlan();this.setupEventListeners();this.updateUI();this.loadAchievements();this.updateWeightDisplay();this.updateDetailedStats();this.setupPWA();}calculateBMI(weight,height){ const heightM=height/100;return(weight/(heightM*heightM)).toFixed(1);}calculateBMR(weight,height,age,gender){if(gender==='male'){return(10*weight)+(6.25*height)-(5*age)+5;}else{return(10*weight)+(6.25*height)-(5*age)-161;}}calculateTDEE(bmr,activityLevel){ const multipliers={sedentary:1.2,light:1.375,moderate:1.55,active:1.725,extreme:1.9}; return Math.round(bmr*(multipliers[activityLevel]||1.2));}calculateTargetCalories(tdee,goal){ const adjustments={'lose-weight':-500,'lose-weight-fast':-750,'maintain':0,'gain-muscle':300,'tone':-300,'health':-200}; return Math.round(tdee+(adjustments[goal]||-500));}generatePersonalPlan(){if(!this.userProfile)return; const profile=this.userProfile; const weightToLose=profile.weight-profile.goalWeight; const weeksToGoal=Math.ceil(Math.abs(weightToLose)/0.5);this.personalPlan={nutrition:{dailyCalories:profile.targetCalories,protein:Math.round(profile.weight*2),carbs:Math.round((profile.targetCalories*0.4)/4),fats:Math.round((profile.targetCalories*0.3)/9),water:Math.ceil(profile.weight*0.035),meals:this.generateMealPlan(profile)},workout:{frequency:this.getWorkoutFrequency(profile.activityLevel),duration:this.getWorkoutDuration(profile.goal),types:this.getRecommendedWorkouts(profile),intensity:this.getIntensityLevel(profile.activityLevel,profile.goal)},timeline:{weeksToGoal:weeksToGoal,expectedWeeklyLoss:0.5,milestones:this.generateMilestones(profile.weight,profile.goalWeight)},tips:this.generatePersonalizedTips(profile),coachMessages:this.generateCoachMessages(profile)};}getWorkoutFrequency(activityLevel){ const frequencies={sedentary:'3-4 vezes/semana',light:'4-5 vezes/semana',moderate:'5-6 vezes/semana',active:'6-7 vezes/semana',extreme:'7 vezes/semana+2 sessões duplas'}; return frequencies[activityLevel]||'3-4 vezes/semana';}getWorkoutDuration(goal){ const durations={'lose-weight':'45-60 minutos','lose-weight-fast':'60-90 minutos','maintain':'30-45 minutos','gain-muscle':'60-75 minutos','tone':'45-60 minutos','health':'30-45 minutos'}; return durations[goal]||'45-60 minutos';}getRecommendedWorkouts(profile){ const workouts=[];if(profile.goal.includes('lose-weight')){workouts.push('Cardio HIIT','Musculação','Caminhada Rápida');}if(profile.goal==='gain-muscle'){workouts.push('Musculação Pesada','Treino de Força');}if(profile.goal==='tone'){workouts.push('Musculação Moderada','Pilates','Yoga');} return workouts.length?workouts:['Treino Funcional','Cardio','Alongamento'];}getIntensityLevel(activity,goal){if(goal.includes('fast')) return 'Alta';if(activity==='sedentary') return 'Leve a Moderada';if(activity==='light') return 'Moderada'; return 'Moderada a Alta';}generateMealPlan(profile){return{breakfast:'Proteína+Carboidrato Complexo+Gordura Boa',snack1:'Fruta+Oleaginosas',lunch:'Proteína Magra+Vegetais+Carboidrato Integral',snack2:'Iogurte Natural ou Shake Proteico',dinner:'Proteína+Vegetais+Pouca Carbo',tips:['🥤 Beba água antes das refeições','🍽️ Use pratos menores','⏰ Coma devagar e mastigue bem','📵 Evite distrações durante refeições']};}generateMilestones(currentWeight,goalWeight){ const milestones=[]; const totalLoss=currentWeight-goalWeight; const steps=[0.25,0.5,0.75,1.0];steps.forEach(step=>{ const weight=currentWeight-(totalLoss*step);milestones.push({weight:weight.toFixed(1),percentage:(step*100).toFixed(0)});}); return milestones;}generatePersonalizedTips(profile){ const tips=[];if(profile.age<25){tips.push('💪 Seu metabolismo é acelerado!Aproveite para construir massa muscular.');} else if(profile.age>40){tips.push('🧘 Inclua mais treino de força para preser var massa muscular.');}if(profile.goal.includes('lose-weight')){tips.push('🔥 Combine cardio com musculação para queimar mais calorias.');tips.push('⏰ Faça jejum intermitente(16/8)se possível.');}if(profile.bmi>30){tips.push('🚶 Comece com caminhadas e aumente gradualmente.');}if(profile.dietPreference==='keto'){tips.push('🥑 Mantenha gorduras boas:abacate,oleaginosas,azeite.');} return tips;}generateCoachMessages(profile){ const messages=[]; const name=profile.name.split(' ')[0];messages.push(`Olá ${name}!Sou seu coach virtual e estou aqui para te ajudar!💪`);if(profile.motivation==='health'){messages.push('Saúde é riqueza!Vamos priorizar seu bem-estar. 🌟');} const weightToLose=profile.weight-profile.goalWeight;if(weightToLose>0){messages.push(`Você quer perder ${weightToLose.toFixed(1)}kg. Vamos conseguir juntos!🎯`);}messages.push('Lembre-se:consistência é mais importante que perfeição!💫'); return messages;}updatePlanSummary(){if(!this.personalPlan||!this.userProfile)return; const planSummary=document.getElementById('planSummary');if(!planSummary)return;planSummary.style.display='block'; const goalNames={'lose-weight':'Perder Peso','lose-weight-fast':'Perder Peso Rápido','maintain':'Manter Peso','gain-muscle':'Ganhar Massa','tone':'Tonificar','health':'Saúde'};document.getElementById('planGoal').textContent=goalNames[this.userProfile.goal]||this.userProfile.goal;document.getElementById('planCalories').textContent=`${this.personalPlan.nutrition.dailyCalories}kcal`;document.getElementById('planWorkout').textContent=this.personalPlan.workout.frequency.split(' ')[0]; const messages=this.personalPlan.coachMessages; const randomMessage=messages[Math.floor(Math.random()*messages.length)];document.getElementById('coachMessage').textContent=randomMessage;}showFullPlan(){if(!this.personalPlan||!this.userProfile)return; const profile=this.userProfile; const plan=this.personalPlan; const profileInfoHTML=`<div class="profile-photo-container">${profile.photo?`<img src="${profile.photo}" class="profile-photo-large" alt="Foto de perfil">`:'<div class="profile-photo-large" style="background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:white;font-size:2rem;">👤</div>'}<div class="profile-basic-info"><div class="profile-name">${profile.name}</div><div style="color:var(--text-secondary);">${profile.age}anos • ${profile.gender==='female'?'Feminino':profile.gender==='male'?'Masculino':'Outro'}</div></div></div><div class="profile-metrics"><div class="metric-item"><span class="metric-label">Altura</span><span class="metric-value">${profile.height}cm</span></div><div class="metric-item"><span class="metric-label">Peso Atual</span><span class="metric-value">${profile.weight}kg</span></div><div class="metric-item"><span class="metric-label">Peso Meta</span><span class="metric-value">${profile.goalWeight}kg</span></div><div class="metric-item"><span class="metric-label">IMC</span><span class="metric-value">${profile.bmi}</span></div><div class="metric-item"><span class="metric-label">TMB</span><span class="metric-value">${Math.round(profile.bmr)}kcal</span></div><div class="metric-item"><span class="metric-label">TDEE</span><span class="metric-value">${profile.tdee}kcal</span></div></div>`; const nutritionHTML=`<div class="nutrition-grid"><div class="nutrition-item"><span class="nutrition-label">Calorias Diárias</span><span class="nutrition-value">${plan.nutrition.dailyCalories}<span class="nutrition-unit">kcal</span></span></div><div class="nutrition-item"><span class="nutrition-label">Proteína</span><span class="nutrition-value">${plan.nutrition.protein}<span class="nutrition-unit">g</span></span></div><div class="nutrition-item"><span class="nutrition-label">Carboidratos</span><span class="nutrition-value">${plan.nutrition.carbs}<span class="nutrition-unit">g</span></span></div><div class="nutrition-item"><span class="nutrition-label">Gorduras</span><span class="nutrition-value">${plan.nutrition.fats}<span class="nutrition-unit">g</span></span></div><div class="nutrition-item"><span class="nutrition-label">Água</span><span class="nutrition-value">${plan.nutrition.water}<span class="nutrition-unit">L</span></span></div><div class="nutrition-item"><span class="nutrition-label">Dieta</span><span class="nutrition-value" style="font-size:0.9rem;">${profile.dietPreference}</span></div></div><div class="meal-plan"><h4 style="margin-bottom:var(--spacing-sm);color:var(--text-primary);">📅 Estrutura de Refeições</h4><div class="meal-item"><div class="meal-name">🌅 Café da Manhã</div><div class="meal-description">${plan.nutrition.meals.breakfast}</div></div><div class="meal-item"><div class="meal-name">🍎 Lanche da Manhã</div><div class="meal-description">${plan.nutrition.meals.snack1}</div></div><div class="meal-item"><div class="meal-name">🍽️ Almoço</div><div class="meal-description">${plan.nutrition.meals.lunch}</div></div><div class="meal-item"><div class="meal-name">🥤 Lanche da Tarde</div><div class="meal-description">${plan.nutrition.meals.snack2}</div></div><div class="meal-item"><div class="meal-name">🌙 Jantar</div><div class="meal-description">${plan.nutrition.meals.dinner}</div></div></div><div style="margin-top:var(--spacing-md);"><h4 style="margin-bottom:var(--spacing-sm);color:var(--text-primary);">💡 Dicas Nutricionais</h4>${plan.nutrition.meals.tips.map(tip=>`<div style="padding:8px;color:var(--text-secondary);">${tip}</div>`).join('')}</div>`; const workoutHTML=`<div class="workout-info"><div class="info-row"><span class="info-label">Frequência</span><span class="info-value">${plan.workout.frequency}</span></div><div class="info-row"><span class="info-label">Duração</span><span class="info-value">${plan.workout.duration}</span></div><div class="info-row"><span class="info-label">Intensidade</span><span class="info-value">${plan.workout.intensity}</span></div><div class="info-row"><span class="info-label">Tipos Recomendados</span><span class="info-value">${plan.workout.types.join(',')}</span></div></div>`; const timelineHTML=`<div class="timeline-info"><div class="info-row"><span class="info-label">Tempo até a Meta</span><span class="info-value">${plan.timeline.weeksToGoal}semanas</span></div><div class="info-row"><span class="info-label">Perda Semanal Esperada</span><span class="info-value">${plan.timeline.expectedWeeklyLoss}kg/semana</span></div></div><div class="milestones"><h4 style="margin-top:var(--spacing-md);margin-bottom:var(--spacing-sm);color:var(--text-primary);">🎯 Marcos do Progresso</h4>${plan.timeline.milestones.map((milestone,index)=>`<div class="milestone-item"><div class="milestone-check">${index===0?'🎯':'💪'}</div><div style="flex:1;"><div style="font-weight:600;color:var(--text-primary);">${milestone.percentage}%da Meta</div><div style="font-size:0.9rem;color:var(--text-secondary);">${milestone.weight}kg</div></div></div>`).join('')}</div>`; const tipsHTML=`<div class="tips-list">${plan.tips.map(tip=>`<div class="tip-item">${tip}</div>`).join('')}</div>`;document.getElementById('profileInfo').innerHTML=profileInfoHTML;document.getElementById('nutritionPlan').innerHTML=nutritionHTML;document.getElementById('workoutPlan').innerHTML=workoutHTML;document.getElementById('timelinePlan').innerHTML=timelineHTML;document.getElementById('tipsPlan').innerHTML=tipsHTML;this.openModal('planModal');}editProfile(){localStorage.removeItem('userProfile');localStorage.removeItem('appVisited');this.userProfile=null;this.personalPlan=null;location.reload();}setupPWA(){window.addEventListener('beforeinstallprompt',(e)=>{e.preventDefault();this.deferredPrompt=e;console.log('PWA install available');});window.addEventListener('appinstalled',()=>{console.log('PWA installed successfully!');this.deferredPrompt=null;});}showWelcome(){document.getElementById('welcomeScreen').style.display='flex';document.getElementById('startJourney').addEventListener('click',()=>{localStorage.setItem('appVisited','true');this.hideWelcome();});}hideWelcome(){ const welcome=document.getElementById('welcomeScreen'); const app=document.getElementById('appContainer');welcome.style.animation='fadeOut 0.5s ease';setTimeout(()=>{welcome.style.display='none';app.style.display='block';},500);}setupEventListeners(){document.body.addEventListener('click',(e)=>{if(e.target.id==='viewFullPlan'||e.target.closest('#viewFullPlan')){e.preventDefault();this.showFullPlan();return;}if(e.target.id==='editProfile'||e.target.closest('#editProfile')){e.preventDefault();this.closeModal('planModal');this.editProfile();return;} const target=e.target.closest('[data-nav],[data-navigate],[data-back],[data-category],[data-wellness]');if(!target)return;if(target.dataset.nav){e.preventDefault();this.navigateTo(target.dataset.nav);}if(target.dataset.navigate){e.preventDefault();this.navigateTo(target.dataset.navigate);}if(target.dataset.back){e.preventDefault();this.goBack();}if(target.dataset.category){e.preventDefault();this.showCategoryExercises(target.dataset.category);}if(target.dataset.wellness){e.preventDefault();this.startWellnessSession(target.dataset.wellness);}}); const waterContainer=document.querySelector('.water-glasses');if(waterContainer){waterContainer.addEventListener('click',(e)=>{ const glass=e.target.closest('.glass');if(glass){e.stopPropagation(); const glasses=Array.from(waterContainer.querySelectorAll('.glass')); const index=glasses.indexOf(glass);if(index!==-1){this.toggleWater(index);}}});}document.body.addEventListener('click',(e)=>{if(e.target.id==='closeWorkout'||e.target.closest('#closeWorkout')){e.preventDefault();e.stopPropagation();this.endWorkout(false);}if(e.target.id==='completeExercise'||e.target.closest('#completeExercise')){e.preventDefault();e.stopPropagation();if(!e.target.disabled&&!e.target.closest('button')?.disabled){this.completeCurrentExercise();}}if(e.target.id==='skipExercise'||e.target.closest('#skipExercise')){e.preventDefault();e.stopPropagation();this.skipExercise();}if(e.target.id==='closeCompletionModal'||e.target.closest('#closeCompletionModal')){e.preventDefault();e.stopPropagation();document.getElementById('completionModal').classList.remove('active');this.playCuteSound('tap');if(this.currentCategory){this.goBack();}else{this.navigateTo('home');}}if(e.target.id==='notifBtn'||e.target.closest('#notifBtn')){e.preventDefault();e.stopPropagation();this.requestNotificationPermission();}if(e.target.id==='toggleSound'||e.target.closest('#toggleSound')){e.preventDefault();e.stopPropagation();this.toggleSound();}if(e.target.id==='updateWeightBtn'||e.target.closest('#updateWeightBtn')){e.preventDefault();e.stopPropagation();this.showWeightModal();}if(e.target.id==='saveWeightBtn'||e.target.closest('#saveWeightBtn')){e.preventDefault();e.stopPropagation();this.saveWeight();}if(e.target.id==='cancelWeightBtn'||e.target.closest('#cancelWeightBtn')){e.preventDefault();e.stopPropagation();this.closeWeightModal();}});document.addEventListener('click',(e)=>{ const clickableElements=['button','.glass','.nav-item','.category-card','.wellness-card','.action-card','.exercise-card'];if(clickableElements.some(selector=>e.target.closest(selector))){this.playCuteSound('click');}},true);}navigateTo(view,addToHistory=true){if(addToHistory&&this.currentView&&this.currentView!==view){this.navigationHistory.push(this.currentView);}document.querySelectorAll('.view').forEach(v=>v.classList.remove('active')); const targetView=document.getElementById(`${view}View`);if(targetView){targetView.classList.add('active');}document.querySelectorAll('.nav-item').forEach(item=>{item.classList.remove('active');if(item.dataset.nav===view){item.classList.add('active');}});this.currentView=view;}goBack(){if(this.navigationHistory.length>0){ const previousView=this.navigationHistory.pop();this.navigateTo(previousView,false);}else{this.navigateTo('home',false);}}showCategoryExercises(category){this.currentCategory=category; const exercises=this.getExercisesByCategory(category); const categoryNames={personalized:'Treino Personalizado',abs:'Abdômen',legs:'Pernas',glutes:'Glúteos',arms:'Braços',waist:'Cintura',back:'Costas',cardio:'Cardio',fullbody:'Corpo Todo',yoga:'Yoga',massage:'Massagem',face:'Rosto'};document.getElementById('categoryTitle').textContent=categoryNames[category]; const container=document.getElementById('exercisesList');container.innerHTML='';if(category==='personalized'){ const sections={'Abdômen':exercises.slice(0,5),'Rosto':exercises.slice(5,9),'Cintura':exercises.slice(9,12),'Pernas':exercises.slice(12,13),'Costas/Flexibilidade':exercises.slice(13,14)};Object.entries(sections).forEach(([sectionName,sectionExercises])=>{if(sectionExercises.length>0){ const sectionHeader=document.createElement('div');sectionHeader.className='section-header';sectionHeader.innerHTML=`<h3>${sectionName}</h3>`;container.appendChild(sectionHeader);sectionExercises.forEach((exercise,index)=>{ const globalIndex=exercises.indexOf(exercise); const card=document.createElement('div');card.className='exercise-card';card.innerHTML=`<div class="exercise-emoji">${exercise.emoji}</div><div class="exercise-info"><div class="exercise-name">${exercise.name}</div><div class="exercise-details">${exercise.sets}× ${exercise.reps}</div></div><div class="exercise-arrow">→</div>`;card.addEventListener('click',()=>{this.startWorkout(exercises,globalIndex);});container.appendChild(card);});}});}else{exercises.forEach((exercise,index)=>{ const card=document.createElement('div');card.className='exercise-card';card.innerHTML=`<div class="exercise-emoji">${exercise.emoji}</div><div class="exercise-info"><div class="exercise-name">${exercise.name}</div><div class="exercise-details">${exercise.sets}× ${exercise.reps}</div></div><div class="exercise-arrow">→</div>`;card.addEventListener('click',()=>{this.startWorkout(exercises,index);});container.appendChild(card);});}this.navigateTo('exercisesList');}startWorkout(exercises,startIndex=0){this.currentWorkout=exercises;this.currentExerciseIndex=startIndex;this.currentSeries=0;this.workoutStartTime=Date.now();this.playSound('startYoga');setTimeout(()=>{this.playSound('backgroundYoga');},2000);this.navigateTo('workoutSession');this.displayCurrentExercise();this.startWorkoutTimer();}displayCurrentExercise(){ const exercise=this.currentWorkout[this.currentExerciseIndex];document.getElementById('currentExerciseName').textContent=exercise.name;document.getElementById('exerciseCount').textContent=`Exercício ${this.currentExerciseIndex+1}de ${this.currentWorkout.length}`; const demoVideo=document.getElementById('demoVideo'); const demoIcon=document.getElementById('demoIcon');if(exercise.video){demoVideo.querySelector('source').src=exercise.video+'#t=4';demoVideo.load();demoVideo.play().catch(e=>console.log('Video autoplay prevented:',e));demoVideo.style.display='block';demoIcon.style.display='none';}else{demoVideo.style.display='none';demoIcon.style.display='block';demoIcon.textContent=exercise.emoji||'💪';}document.getElementById('repsInfo').textContent=`${exercise.sets}séries × ${exercise.reps}`;document.getElementById('restInfo').textContent=`Descanso:${exercise.rest||30}s entre séries`;this.updateSeriesTracker(exercise.sets); const progress=((this.currentExerciseIndex+(this.currentSeries/exercise.sets))/this.currentWorkout.length)*100;document.getElementById('workoutProgressBar').style.width=`${progress}%`;this.preloadNextVideo();}preloadNextVideo(){ const nextIndex=this.currentExerciseIndex+1;if(nextIndex<this.currentWorkout.length){ const nextExercise=this.currentWorkout[nextIndex];if(nextExercise.video){ const link=document.createElement('link');link.rel='preload';link.as='video';link.href=nextExercise.video;document.head.appendChild(link);}}}updateSeriesTracker(totalSeries){ const tracker=document.getElementById('seriesTracker');tracker.innerHTML='';for( let i=0;i<totalSeries;i++){ const dot=document.createElement('div');dot.className='series-dot';if(i<this.currentSeries){dot.classList.add('completed');}tracker.appendChild(dot);}}startWorkoutTimer(){this.workoutSeconds=0;this.workoutTimer=setInterval(()=>{this.workoutSeconds++; const mins=Math.floor(this.workoutSeconds/60); const secs=this.workoutSeconds%60;document.getElementById('workoutTimer').textContent=`${String(mins).padStart(2,'0')}:${String(secs).padStart(2,'0')}`;},1000);}completeCurrentExercise(){ const exercise=this.currentWorkout[this.currentExerciseIndex];this.currentSeries++;this.playCuteSound('success');if(this.currentSeries>=exercise.sets){this.currentExerciseIndex++;this.currentSeries=0;if(this.currentExerciseIndex>=this.currentWorkout.length){this.completeWorkout();}else{this.displayCurrentExercise();this.playCuteSound('tap');}}else{this.updateSeriesTracker(exercise.sets);this.showRestPeriod(exercise.rest||30);}}showRestPeriod(seconds){ const btn=document.getElementById('completeExercise'); const originalText=btn.textContent; let remaining=seconds;btn.textContent=`Descansando... ${remaining}s`;btn.disabled=true;if(remaining>5){this.playCuteSound('tap');} const restInterval=setInterval(()=>{remaining--;btn.textContent=`Descansando... ${remaining}s`;if(remaining<=3&&remaining>0){this.playSound('countdown');}if(remaining<=0){clearInterval(restInterval);btn.textContent=originalText;btn.disabled=false;this.playCuteSound('success');}},1000);}skipExercise(){this.currentExerciseIndex++;this.currentSeries=0;if(this.currentExerciseIndex>=this.currentWorkout.length){this.completeWorkout();}else{this.displayCurrentExercise();}}completeWorkout(){clearInterval(this.workoutTimer); const durationInSeconds=this.workoutSeconds||Math.floor((Date.now()-this.workoutStartTime)/1000); const duration=Math.max(1,Math.floor(durationInSeconds/60)); const calories=this.calculateCalories(duration,this.currentWorkout);console.log('Workout completed:',{durationInSeconds,duration,calories,exercises:this.currentWorkout});this.progress.workoutsCompleted=(this.progress.workoutsCompleted||0)+1;this.progress.totalMinutes=(this.progress.totalMinutes||0)+duration;this.progress.totalCalories=(this.progress.totalCalories||0)+calories;this.progress.lastWorkout= new Date().toISOString();if(!this.progress.longestWorkout||duration>this.progress.longestWorkout){this.progress.longestWorkout=duration;}if(!this.progress.workoutHistory){this.progress.workoutHistory=[];}this.progress.workoutHistory.push({date: new Date().toISOString(),duration:duration,calories:calories,category:this.currentCategory});this.updateStreak();this.saveProgress();this.stopSound('backgroundYoga');this.playCuteSound('complete');this.playSound('motivational');document.getElementById('summaryTime').textContent=`${duration}min`;document.getElementById('summaryCalories').textContent=`${calories}kcal`;document.getElementById('summaryExercises').textContent=`${this.currentWorkout.length}exercícios`; let detailsHTML='<strong>📊 Detalhes do Treino:</strong><br><br>';this.currentWorkout.forEach((exercise,index)=>{ const exerciseCalories=Math.round(this.getExerciseCaloriesPerMinute(exercise.name)*(duration/this.currentWorkout.length)*(exercise.sets/3));detailsHTML+=`<div style="margin-bottom:8px;"><strong>${index+1}. ${exercise.name}</strong><br><span style="font-size:0.85rem;">${exercise.sets}séries × ${exercise.reps}repetições<br>~${exerciseCalories}kcal queimadas</span></div>`;});document.getElementById('workoutDetails').innerHTML=detailsHTML;document.getElementById('completionModal').classList.add('active');this.checkAchievements();this.updateWeightBasedOnCalories();this.updateUI();this.updateDetailedStats();}endWorkout(completed=false){clearInterval(this.workoutTimer);this.workoutSeconds=0;this.stopSound('backgroundYoga');this.stopSound('startYoga');if(this.currentCategory){this.goBack();}else{this.navigateTo('home');}}getExerciseCaloriesPerMinute(exerciseName){ const name=exerciseName.toLowerCase(); let caloriesPerMinute=8;if(name.includes('scissor')||name.includes('tesoura')){caloriesPerMinute=12;} else if(name.includes('prancha')||name.includes('plank')){caloriesPerMinute=10;} else if(name.includes('elevação')||name.includes('leg lift')){caloriesPerMinute=9;} else if(name.includes('face')||name.includes('rosto')||name.includes('papada')||name.includes('chin')||name.includes('linha')||name.includes('esculpida')||name.includes('afinada')){caloriesPerMinute=3;} else if(name.includes('agachamento')||name.includes('squat')||name.includes('rotação')){caloriesPerMinute=11;} else if(name.includes('flexão')||name.includes('push')||name.includes('extensão')){caloriesPerMinute=10;} else if(name.includes('ponte')||name.includes('bridge')){caloriesPerMinute=9;} else if(name.includes('burpee')||name.includes('jump')){caloriesPerMinute=14;} else if(name.includes('polichinelo')||name.includes('jack')){caloriesPerMinute=13;} else if(name.includes('alongamento')||name.includes('stretch')){caloriesPerMinute=6;} else if(name.includes('torção')||name.includes('twist')){caloriesPerMinute=7;} else if(name.includes('yoga')){caloriesPerMinute=5;} else if(name.includes('massagem')||name.includes('massage')){caloriesPerMinute=2;} return caloriesPerMinute;}calculateCalories(minutes,workoutExercises=null){if(!workoutExercises||workoutExercises.length===0){ return Math.round(minutes*8);} let totalCalories=0; const minutesPerExercise=minutes/workoutExercises.length;workoutExercises.forEach(exercise=>{ const caloriesPerMinute=this.getExerciseCaloriesPerMinute(exercise.name); const sets=exercise.sets||3; const caloriesForThisExercise=caloriesPerMinute*minutesPerExercise*(sets/3);totalCalories+=caloriesForThisExercise;}); return Math.round(totalCalories);}updateWeightBasedOnCalories(){if(!this.userProfile||!this.weightData||this.weightData.length===0)return; const today= new Date().toDateString(); const lastWeightEntry=this.weightData[this.weightData.length-1]; const lastWeightDate= new Date(lastWeightEntry.date).toDateString();if(lastWeightDate===today)return; const caloriesIn=this.progress.dailyCaloriesConsumed||this.userProfile.targetCalories; const caloriesBurned=this.progress.totalCalories||0; const tdee=this.userProfile.tdee||2000; const dailyDeficit=(tdee+caloriesBurned)-caloriesIn; const weightChange=dailyDeficit/7700; const safeWeightChange=Math.max(-0.15,Math.min(0.15,weightChange)); const currentWeight=lastWeightEntry.weight; const newWeight=Math.max(30,currentWeight-safeWeightChange);this.weightData.push({date: new Date().toISOString(),weight:parseFloat(newWeight.toFixed(1)),auto:true});this.userProfile.weight=newWeight;this.saveWeightData();this.saveUserProfile();this.progress.dailyCaloriesConsumed=this.userProfile.targetCalories;this.saveProgress();console.log('Peso atualizado automaticamente:',{oldWeight:currentWeight,newWeight:newWeight.toFixed(1),change:safeWeightChange.toFixed(3),deficit:dailyDeficit.toFixed(0)});}addCaloriesConsumed(calories){if(!this.progress.dailyCaloriesConsumed){this.progress.dailyCaloriesConsumed=0;}this.progress.dailyCaloriesConsumed+=calories;this.saveProgress();this.updateUI();}resetDailyCalories(){ const today= new Date().toDateString(); const lastReset=this.progress.lastCalorieReset||'';if(lastReset!==today){this.progress.dailyCaloriesConsumed=0;this.progress.lastCalorieReset=today;this.saveProgress();}}updateStreak(){ const today= new Date().toDateString(); const lastWorkout=this.progress.lastWorkout? new Date(this.progress.lastWorkout).toDateString():null;if(!lastWorkout){this.progress.streak=1;}else{ const yesterday= new Date();yesterday.setDate(yesterday.getDate()-1);if(lastWorkout===today){return;} else if(lastWorkout===yesterday.toDateString()){this.progress.streak=(this.progress.streak||0)+1;}else{this.progress.streak=1;}}if(!this.progress.longestStreak||this.progress.streak>this.progress.longestStreak){this.progress.longestStreak=this.progress.streak;}}toggleWater(index){ const glasses=document.querySelectorAll('.glass'); const glass=glasses[index];if(glass.classList.contains('filled')){for( let i=index;i<glasses.length;i++){glasses[i].classList.remove('filled');}}else{for( let i=0;i<=index;i++){glasses[i].classList.add('filled');}this.playCuteSound('tap');} const filled=document.querySelectorAll('.glass.filled').length;document.getElementById('waterCount').textContent=filled;if(filled===8){this.playCuteSound('success');} const today= new Date().toISOString().split('T')[0];if(!this.progress.water)this.progress.water={};this.progress.water[today]=Array(filled).fill(1);this.saveProgress();this.updateDetailedStats();}startWellnessSession(type){ const sessions=this.getWellnessSessions(); const session=sessions[type];if(session){this.startWorkout(session.exercises,0);}}updateUI(){ const hour= new Date().getHours(); let greeting='Olá';if(hour<12)greeting='Bom dia'; else if(hour<18)greeting='Boa tarde'; else greeting='Boa noite'; const name=this.userProfile?this.userProfile.name.split(' ')[0]:'Guerreira';document.getElementById('greeting').textContent=`${greeting},${name}!`;if(this.userProfile&&this.userProfile.photo){ const avatar=document.querySelector('.avatar');avatar.style.backgroundImage=`url(${this.userProfile.photo})`;avatar.style.backgroundSize='cover';avatar.style.backgroundPosition='center';avatar.textContent='';}this.updatePlanSummary();document.getElementById('streakDays').textContent=this.progress.streak||0; const todayProgress=this.calculateTodayProgress();document.getElementById('progressValue').textContent=todayProgress;document.getElementById('progressFill').style.setProperty('--progress',todayProgress);document.getElementById('caloriesBurned').textContent=this.progress.totalCalories||0;document.getElementById('minutesActive').textContent=this.progress.totalMinutes||0;document.getElementById('workoutsCompleted').textContent=this.progress.workoutsCompleted||0;document.getElementById('totalWorkouts').textContent=this.progress.workoutsCompleted||0;document.getElementById('totalMinutes').textContent=this.progress.totalMinutes||0;document.getElementById('totalCalories').textContent=this.progress.totalCalories||0;document.getElementById('daysActive').textContent=this.progress.daysActive||0; const waterToday=this.getWaterToday();document.querySelectorAll('.glass').forEach((glass,index)=>{if(index<waterToday){glass.classList.add('filled');}else{glass.classList.remove('filled');}});document.getElementById('waterCount').textContent=waterToday;}calculateTodayProgress(){ const workouts=this.progress.todayWorkouts||0; const water=this.getWaterToday(); const workoutProgress=Math.min((workouts/2)*100,50); const waterProgress=Math.min((water/8)*100,50); return Math.round(workoutProgress+waterProgress);}getWaterToday(){ const today= new Date().toISOString().split('T')[0]; const waterData=this.progress.water?.[today];if(Array.isArray(waterData)){ return waterData.length;} return 0;}loadAchievements(){this.achievements=[{id:'first-workout',name:'Primeiro Passo',emoji:'👟',unlocked:(this.progress.workoutsCompleted||0)>=1},{id:'five-workouts',name:'5 Treinos',emoji:'💪',unlocked:(this.progress.workoutsCompleted||0)>=5},{id:'week-streak',name:'1 Semana',emoji:'🔥',unlocked:(this.progress.streak||0)>=7},{id:'ten-workouts',name:'10 Treinos',emoji:'🏋️',unlocked:(this.progress.workoutsCompleted||0)>=10},{id:'water-master',name:'Hidratada',emoji:'💧',unlocked:this.checkWaterStreak(5)},{id:'month-streak',name:'1 Mês',emoji:'🏆',unlocked:(this.progress.streak||0)>=30},{id:'twenty-workouts',name:'20 Treinos',emoji:'💯',unlocked:(this.progress.workoutsCompleted||0)>=20},{id:'fifty-workouts',name:'50 Treinos',emoji:'⭐',unlocked:(this.progress.workoutsCompleted||0)>=50},{id:'weight-loss',name:'Peso Perdido',emoji:'📉',unlocked:this.checkWeightLoss()},{id:'hundred-workouts',name:'100 Treinos',emoji:'🎯',unlocked:(this.progress.workoutsCompleted||0)>=100},{id:'yoga-master',name:'Mestre Yoga',emoji:'🧘‍♀️',unlocked:this.checkYogaWorkouts()},{id:'dedication',name:'Dedicação',emoji:'🌟',unlocked:(this.progress.daysActive||0)>=30}]; const container=document.getElementById('achievementsGrid');if(container){container.innerHTML='';this.achievements.forEach(achievement=>{ const card=document.createElement('div');card.className=`achievement-card ${achievement.unlocked?'':'locked'}`;card.innerHTML=`<div class="achievement-icon">${achievement.unlocked?achievement.emoji:'🔒'}</div><div class="achievement-name">${achievement.name}</div>`;container.appendChild(card);});}}checkWeightLoss(){if(this.weightData.initial&&this.weightData.current){ return this.weightData.initial>this.weightData.current;} return false;}checkYogaWorkouts(){if(!this.progress.workoutHistory) return false; const yogaWorkouts=this.progress.workoutHistory.filter(w=>w.category==='yoga'); return yogaWorkouts.length>=5;}checkAchievements(){this.loadAchievements();}checkWaterStreak(days){if(!this.progress.water) return false; let streak=0; const today= new Date();for( let i=0;i<30;i++){ const date= new Date(today);date.setDate(date.getDate()-i); const dateStr=date.toDateString();if(this.progress.water[dateStr]>=8){streak++;if(streak>=days) return true;}else{break;}} return false;}requestNotificationPermission(){if('Notification' in window&&Notification.permission!=='granted'){Notification.requestPermission().then(permission=>{if(permission==='granted'){ new Notification('Notificações Ativadas!🔔',{body:'Você receberá lembretes motivacionais!',icon:'/icons/icon.svg'});}});}}playSound(){if(this.userData.soundEnabled!==false){ const context=new(window.AudioContext||window.webkitAudioContext)(); const oscillator=context.createOscillator(); const gainNode=context.createGain();oscillator.connect(gainNode);gainNode.connect(context.destination);oscillator.frequency.value=800;oscillator.type='sine';gainNode.gain.setValueAtTime(0.3,context.currentTime);gainNode.gain.exponentialRampToValueAtTime(0.01,context.currentTime+0.1);oscillator.start(context.currentTime);oscillator.stop(context.currentTime+0.1);}}loadUserData(){ const data=localStorage.getItem('userData'); return data?JSON.parse(data):{};}loadProgress(){try{if(window.PerformanceUtils){ const data=window.PerformanceUtils.safeLocalStorageGet('userProgress',null,true);if(!data){ return this.getDefaultProgress();}if(typeof data!=='object'||data===null){console.warn('Invalid progress data,resetting'); return this.getDefaultProgress();}return{...this.getDefaultProgress(),...data};}else{ const dataString=localStorage.getItem('userProgress');if(!dataString){ return this.getDefaultProgress();} const parsed=JSON.parse(dataString);if(typeof parsed!=='object'||parsed===null){console.warn('Invalid progress data,resetting'); return this.getDefaultProgress();}return{...this.getDefaultProgress(),...parsed};}}catch(e){console.error('Error loading progress:',e); return this.getDefaultProgress();}}getDefaultProgress(){return{workoutsCompleted:0,totalMinutes:0,totalCalories:0,streak:0,daysActive:0,water:{},workoutHistory:[],todayWorkouts:0,todayMinutes:0,todayCalories:0,longestStreak:0,longestWorkout:0,memberSince:null};}saveProgress(){if(!this.saveProgressDebounced){if(window.PerformanceUtils){this.saveProgressDebounced=window.PerformanceUtils.debounce(()=>{this._doSaveProgress();},300);}else{this.saveProgressDebounced=this._doSaveProgress.bind(this);}}this.saveProgressDebounced();}_doSaveProgress(){try{if(window.PerformanceUtils){ const shouldCompress=JSON.stringify(this.progress).length>50000;window.PerformanceUtils.safeLocalStorageSet('userProgress',this.progress,shouldCompress);}else{localStorage.setItem('userProgress',JSON.stringify(this.progress));}}catch(e){console.error('Failed to save progress:',e);if(e.name==='QuotaExceededError'){this.compressProgress();}}}compressProgress(){if(this.progress.workoutHistory&&this.progress.workoutHistory.length>30){this.progress.workoutHistory=this.progress.workoutHistory.slice(-30);}if(this.progress.water){ const thirtyDaysAgo= new Date();thirtyDaysAgo.setDate(thirtyDaysAgo.getDate()-30); const recentWater={};Object.keys(this.progress.water).forEach(key=>{ const date= new Date(key);if(date>=thirtyDaysAgo){recentWater[key]=this.progress.water[key];}});this.progress.water=recentWater;}try{localStorage.setItem('userProgress',JSON.stringify(this.progress));}catch(e){console.error('Still failed after compression:',e);}}loadWeightData(){try{ const data=localStorage.getItem('weightData');if(!data){ return this.getDefaultWeightData();} const parsed=JSON.parse(data);if(typeof parsed!=='object'||parsed===null){ return this.getDefaultWeightData();}return{...this.getDefaultWeightData(),...parsed};}catch(e){console.error('Error loading weight data:',e); return this.getDefaultWeightData();}}getDefaultWeightData(){return{current:null,initial:null,goal:null,history:[]};}saveWeightData(){if(!this.saveWeightDebounced){if(window.PerformanceUtils){this.saveWeightDebounced=window.PerformanceUtils.debounce(()=>{try{window.PerformanceUtils.safeLocalStorageSet('weightData',this.weightData);}catch(e){console.error('Failed to save weight data:',e);}},300);}else{this.saveWeightDebounced=()=>{try{localStorage.setItem('weightData',JSON.stringify(this.weightData));}catch(e){console.error('Failed to save weight data:',e);}};}}this.saveWeightDebounced();}showWeightModal(){ const modal=document.getElementById('weightModal'); const weightInput=document.getElementById('weightInput'); const goalInput=document.getElementById('goalWeightInput');weightInput.value=this.weightData.current||'';goalInput.value=this.weightData.goal||'';modal.classList.add('active');this.playCuteSound('tap');}closeWeightModal(){ const modal=document.getElementById('weightModal');modal.classList.remove('active');this.playCuteSound('tap');}saveWeight(){ const weightInput=document.getElementById('weightInput'); const goalInput=document.getElementById('goalWeightInput');if(!weightInput||!goalInput){console.error('Weight inputs not found');return;} const newWeight=parseFloat(String(weightInput.value).trim()); const newGoal=parseFloat(String(goalInput.value).trim());if(isNaN(newWeight)||newWeight<30||newWeight>200){alert('Por favor,insira um peso válido entre 30 e 200 kg');return;}if(isNaN(newGoal)||newGoal<30||newGoal>200){alert('Por favor,insira uma meta válida entre 30 e 200 kg');return;}if(!Number.isFinite(newWeight)||!Number.isFinite(newGoal)){alert('Valores inválidos');return;}if(this.weightData.initial===null){this.weightData.initial=newWeight;if(!this.progress.memberSince){this.progress.memberSince= new Date().toISOString();}}this.weightData.current=newWeight;this.weightData.goal=newGoal; const today= new Date().toISOString().split('T')[0]; const existingIndex=this.weightData.history.findIndex(entry=>entry.date===today);if(existingIndex>=0){this.weightData.history[existingIndex].weight=newWeight;}else{this.weightData.history.push({date:today,weight:newWeight});}if(this.weightData.history.length>30){this.weightData.history=this.weightData.history.slice(-30);}this.saveWeightData();this.saveProgress();this.updateWeightDisplay();this.closeWeightModal();this.playCuteSound('success');}updateWeightDisplay(){ const currentWeightEl=document.getElementById('currentWeight'); const initialWeightEl=document.getElementById('initialWeight'); const goalWeightEl=document.getElementById('goalWeight'); const weightLostEl=document.getElementById('weightLost'); const weightProgressFill=document.getElementById('weightProgressFill'); const weightChartMini=document.getElementById('weightChartMini');if(this.weightData.current){currentWeightEl.textContent=`${this.weightData.current}kg`;}else{currentWeightEl.textContent='--';}if(this.weightData.initial){initialWeightEl.textContent=`${this.weightData.initial}kg`;}else{initialWeightEl.textContent='--';}if(this.weightData.goal){goalWeightEl.textContent=`${this.weightData.goal}kg`;}else{goalWeightEl.textContent='--';}if(this.weightData.initial&&this.weightData.current){ const lost=this.weightData.initial-this.weightData.current;weightLostEl.textContent=`${lost.toFixed(1)}kg`;}else{weightLostEl.textContent='0 kg';}if(this.weightData.initial&&this.weightData.current&&this.weightData.goal){ const totalToLose=this.weightData.initial-this.weightData.goal; const lost=this.weightData.initial-this.weightData.current; const percentage=Math.min(100,(lost/totalToLose)*100);weightProgressFill.style.width=`${Math.max(0,percentage)}%`;}else{weightProgressFill.style.width='0%';}if(weightChartMini&&this.weightData.history.length>0){ const maxWeight=Math.max(...this.weightData.history.map(e=>e.weight)); const minWeight=Math.min(...this.weightData.history.map(e=>e.weight)); const range=maxWeight-minWeight||1;weightChartMini.innerHTML=this.weightData.history.slice(-10).map(entry=>{ const height=((entry.weight-minWeight)/range)*80+20; return `<div class="weight-chart-bar" style="height:${height}px" title="${entry.date}:${entry.weight}kg"></div>`;}).join('');}}updateDetailedStats(){document.getElementById('totalWorkouts').textContent=this.progress.workoutsCompleted||0;document.getElementById('totalMinutes').textContent=this.progress.totalMinutes||0;document.getElementById('totalCaloriesDetail').textContent=this.progress.totalCalories||0; const uniqueDays= new Set();if(this.progress.workoutHistory){this.progress.workoutHistory.forEach(w=>{ const date= new Date(w.date).toDateString();uniqueDays.add(date);});}this.progress.daysActive=uniqueDays.size;document.getElementById('daysActiveDetail').textContent=this.progress.daysActive||0;document.getElementById('currentStreak').textContent=this.progress.streak||0; const thisWeek=this.getThisWeekWorkouts();document.getElementById('thisWeekWorkouts').textContent=thisWeek; const avgMinutes=this.progress.workoutsCompleted>0?Math.round(this.progress.totalMinutes/this.progress.workoutsCompleted):0; const avgCalories=this.progress.workoutsCompleted>0?Math.round(this.progress.totalCalories/this.progress.workoutsCompleted):0;document.getElementById('avgMinutes').textContent=avgMinutes;document.getElementById('avgCalories').textContent=avgCalories; const totalWaterGlasses=Object.values(this.progress.water||{}).reduce((sum,day)=>{ return sum+(Array.isArray(day)?day.length:0);},0); const waterStreak=this.getWaterStreak();document.getElementById('totalWaterGlasses').textContent=totalWaterGlasses;document.getElementById('waterStreak').textContent=waterStreak;if(!this.achievements){this.loadAchievements();} const unlockedAchievements=this.achievements.filter(a=>a.unlocked).length;document.getElementById('achievementsUnlocked').textContent=unlockedAchievements;document.getElementById('totalAchievements').textContent=this.achievements.length;document.getElementById('longestStreak').textContent=`${this.progress.longestStreak||0}dias`;document.getElementById('longestWorkout').textContent=`${this.progress.longestWorkout||0}min`; const favoriteCategory=this.getFavoriteCategory();document.getElementById('favoriteCategory').textContent=favoriteCategory;if(this.progress.memberSince){ const date= new Date(this.progress.memberSince); const formatted=date.toLocaleDateString('pt-BR');document.getElementById('memberSince').textContent=formatted;}else{document.getElementById('memberSince').textContent='--';}this.renderWeeklyChart();}getThisWeekWorkouts(){if(!this.progress.workoutHistory) return 0; const oneWeekAgo= new Date();oneWeekAgo.setDate(oneWeekAgo.getDate()-7); return this.progress.workoutHistory.filter(workout=>{ const workoutDate= new Date(workout.date); return workoutDate>=oneWeekAgo;}).length;}getWaterStreak(){if(!this.progress.water) return 0; let streak=0; const today= new Date();for( let i=0;i<365;i++){ const date= new Date(today);date.setDate(date.getDate()-i); const dateKey=date.toISOString().split('T')[0];if(this.progress.water[dateKey]&&this.progress.water[dateKey].length>=8){streak++;}else{break;}} return streak;}getFavoriteCategory(){if(!this.progress.workoutHistory||this.progress.workoutHistory.length===0){ return '--';} const categoryCount={};this.progress.workoutHistory.forEach(workout=>{categoryCount[workout.category]=(categoryCount[workout.category]||0)+1;}); const favorite=Object.keys(categoryCount).reduce((a,b)=>categoryCount[a]>categoryCount[b]?a:b); const categoryNames={abs:'Abdômen',legs:'Pernas',glutes:'Glúteos',arms:'Braços',waist:'Cintura',back:'Costas',cardio:'Cardio',fullbody:'Corpo Todo',yoga:'Yoga',massage:'Massagem'}; return categoryNames[favorite]||favorite;}renderWeeklyChart(){ const chartContainer=document.getElementById('weeklyChart');if(!chartContainer)return; const days=['Dom','Seg','Ter','Qua','Qui','Sex','Sáb']; const today= new Date(); const weekData=[];for( let i=6;i>=0;i--){ const date= new Date(today);date.setDate(date.getDate()-i); const dayIndex=date.getDay(); const dateKey=date.toISOString().split('T')[0]; const workoutsOnDay=this.progress.workoutHistory?this.progress.workoutHistory.filter(w=>w.date.startsWith(dateKey)).length:0;weekData.push({label:days[dayIndex],value:workoutsOnDay});} const maxValue=Math.max(...weekData.map(d=>d.value),1);chartContainer.innerHTML=weekData.map(day=>{ const heightPercent=(day.value/maxValue)*100; return `<div class="chart-day"><div class="chart-bar" style="height:${heightPercent}%"></div><div class="chart-label">${day.label}</div></div>`;}).join('');}getExercisesByCategory(category){ const exercises={personalized:[{name:'Prancha com Balanço Lateral',emoji:'🔥',video:'videos/Prancha com balanço lateral.mp4',sets:3,reps:'10',rest:30,calories:8},{name:'Prancha com Elevação de Perna',emoji:'🔥',video:'videos/Prancha com elevação de perna.mp4',sets:3,reps:'12',rest:30,calories:10},{name:'Tesoura(Scissor Kicks)',emoji:'✂️',video:'videos/Scissor Kicks.mp4',sets:3,reps:'15',rest:30,calories:9},{name:'Elevação Alternada de Pernas',emoji:'🦵',video:'videos/Alternating Leg Lifts.mp4',sets:3,reps:'12',rest:30,calories:8},{name:'Prancha Lateral com Rotação',emoji:'🔄',video:'videos/prancha lateral com rotação.mp4',sets:3,reps:'10 cada',rest:30,calories:10},{name:'Face Esculpida',emoji:'😊',video:'videos/Sculpted face.mp4',sets:3,reps:'10',rest:20,calories:3},{name:'Face Afinada',emoji:'✨',video:'videos/Slim face.mp4',sets:3,reps:'12',rest:20,calories:3},{name:'Redução de Linhas de Sorriso',emoji:'😄',video:'videos/Smile lines.mp4',sets:3,reps:'10',rest:20,calories:2},{name:'Redução de Papada',emoji:'💆‍♀️',video:'videos/Double chin.mp4',sets:3,reps:'15',rest:20,calories:4},{name:'Alongamento Lateral Dinâmico',emoji:'⏳',video:'videos/Dynamic Side Stretch].mp4',sets:3,reps:'12 cada',rest:25,calories:6},{name:'Torção do Tronco Sentado',emoji:'🔄',video:'videos/Seated Torso Twist.mp4',sets:3,reps:'15 cada',rest:25,calories:7},{name:'Flexão Lateral em Pé',emoji:'⏳',video:'videos/Side Bend Stretch.mp4',sets:3,reps:'12 cada',rest:25,calories:6},{name:'Agachamento com Rotação',emoji:'🏋️‍♀️',video:'videos/agachamento rotação.mp4',sets:3,reps:'12',rest:35,calories:12},{name:'Flexão e Extensão do Tronco',emoji:'🧘‍♀️',video:'videos/flexao,extensão e hiperextenxao do tronco com baco estendido.mp4',sets:3,reps:'10',rest:30,calories:8}],abs:[{name:'Prancha',emoji:'🧘‍♀️',sets:3,reps:'30s',rest:30},{name:'Abdominal Tradicional',emoji:'💪',sets:3,reps:'15',rest:30},{name:'Bicicleta',emoji:'🚴‍♀️',sets:3,reps:'20',rest:30},{name:'Prancha Lateral',emoji:'🧘‍♀️',sets:3,reps:'20s cada',rest:30},{name:'Mountain Climbers',emoji:'⛰️',sets:3,reps:'15',rest:30}],legs:[{name:'Agachamento',emoji:'🏋️‍♀️',sets:3,reps:'15',rest:30},{name:'Afundo',emoji:'🦵',sets:3,reps:'12 cada',rest:30},{name:'Elevação de Panturrilha',emoji:'👠',sets:3,reps:'20',rest:30},{name:'Agachamento Sumô',emoji:'🏋️‍♀️',sets:3,reps:'15',rest:30},{name:'Ponte com Uma Perna',emoji:'🌉',sets:3,reps:'10 cada',rest:30}],face:[{name:'Massagem Facial-Testa',emoji:'💆‍♀️',sets:1,reps:'1min',rest:10},{name:'Massagem Facial-Têmporas',emoji:'😌',sets:1,reps:'30s',rest:10},{name:'Massagem Facial-Bochechas',emoji:'😊',sets:1,reps:'1min',rest:10},{name:'Elevação de Sobrancelhas',emoji:'👁️',sets:2,reps:'10',rest:15}],glutes:[{name:'Ponte',emoji:'🍑',sets:3,reps:'15',rest:30},{name:'Chute de Glúteo',emoji:'🦵',sets:3,reps:'15 cada',rest:30},{name:'Agachamento com Salto',emoji:'⚡',sets:3,reps:'12',rest:40},{name:'Elevação de Quadril',emoji:'🏋️‍♀️',sets:3,reps:'15',rest:30},{name:'Concha(Clamshell)',emoji:'🐚',sets:3,reps:'15 cada',rest:30}],arms:[{name:'Flexão de Braço',emoji:'💪',sets:3,reps:'10',rest:30},{name:'Tríceps no Banco',emoji:'🪑',sets:3,reps:'12',rest:30},{name:'Rosca Direta',emoji:'💪',sets:3,reps:'15',rest:30},{name:'Prancha com Toque',emoji:'🧘‍♀️',sets:3,reps:'10',rest:30}],waist:[{name:'Oblíquo em Pé',emoji:'⏳',sets:3,reps:'15 cada',rest:30},{name:'Twist Russo',emoji:'🔄',sets:3,reps:'20',rest:30},{name:'Prancha com Rotação',emoji:'🧘‍♀️',sets:3,reps:'10 cada',rest:30},{name:'Elevação de Perna Lateral',emoji:'🦵',sets:3,reps:'15 cada',rest:30}],back:[{name:'Superman',emoji:'🦸‍♀️',sets:3,reps:'12',rest:30},{name:'Remada Curvada',emoji:'🏋️‍♀️',sets:3,reps:'15',rest:30},{name:'Prancha Reversa',emoji:'🧘‍♀️',sets:3,reps:'30s',rest:30},{name:'Extensão Lombar',emoji:'💪',sets:3,reps:'12',rest:30}],cardio:[{name:'Polichinelo',emoji:'🤸‍♀️',sets:3,reps:'30',rest:20},{name:'Burpees',emoji:'💥',sets:3,reps:'10',rest:40},{name:'High Knees',emoji:'🏃‍♀️',sets:3,reps:'30s',rest:20},{name:'Mountain Climbers',emoji:'⛰️',sets:3,reps:'30s',rest:20},{name:'Pular Corda',emoji:'🪢',sets:3,reps:'1min',rest:30}],fullbody:[{name:'Burpees',emoji:'💥',sets:3,reps:'10',rest:40},{name:'Agachamento',emoji:'🏋️‍♀️',sets:3,reps:'15',rest:30},{name:'Flexão',emoji:'💪',sets:3,reps:'10',rest:30},{name:'Prancha',emoji:'🧘‍♀️',sets:3,reps:'40s',rest:30},{name:'Mountain Climbers',emoji:'⛰️',sets:3,reps:'20',rest:30}],yoga:[{name:'Postura da Criança',emoji:'🧘‍♀️',sets:1,reps:'1min',rest:20},{name:'Cachorro Olhando para Baixo',emoji:'🐕',sets:2,reps:'30s',rest:20},{name:'Guerreiro I',emoji:'⚔️',sets:2,reps:'30s cada',rest:20},{name:'Guerreiro II',emoji:'🗡️',sets:2,reps:'30s cada',rest:20},{name:'Árvore',emoji:'🌳',sets:2,reps:'30s cada',rest:20},{name:'Cobra',emoji:'🐍',sets:2,reps:'30s',rest:20},{name:'Ponte',emoji:'🌉',sets:2,reps:'30s',rest:20},{name:'Triângulo',emoji:'📐',sets:2,reps:'30s cada',rest:20},{name:'Torção Sentada',emoji:'🔄',sets:2,reps:'30s cada',rest:20},{name:'Gato-Vaca',emoji:'🐱',sets:2,reps:'10',rest:15},{name:'Prancha Lateral',emoji:'🧘‍♀️',sets:2,reps:'20s cada',rest:20},{name:'Savasana(Relaxamento)',emoji:'😌',sets:1,reps:'2min',rest:0}],massage:[{name:'Massagem Facial-Testa',emoji:'💆‍♀️',sets:1,reps:'1min',rest:10},{name:'Massagem Facial-Têmporas',emoji:'😌',sets:1,reps:'30s',rest:10},{name:'Massagem Facial-Bochechas',emoji:'😊',sets:1,reps:'1min',rest:10},{name:'Massagem Pescoço',emoji:'💫',sets:1,reps:'1min',rest:15},{name:'Massagem Ombros',emoji:'🤗',sets:1,reps:'1min cada',rest:15},{name:'Massagem Mãos',emoji:'🙌',sets:1,reps:'30s cada',rest:10},{name:'Massagem Pés',emoji:'👣',sets:1,reps:'1min cada',rest:15},{name:'Relaxamento Completo',emoji:'✨',sets:1,reps:'2min',rest:0}]}; return exercises[category]||[];}getWellnessSessions(){return{'face-massage':{exercises:[{name:'Massagem na Testa',emoji:'💆‍♀️',sets:1,reps:'30s',rest:10},{name:'Contorno dos Olhos',emoji:'👁️',sets:1,reps:'30s',rest:10},{name:'Bochechas',emoji:'😊',sets:1,reps:'30s',rest:10},{name:'Mandíbula',emoji:'💫',sets:1,reps:'30s',rest:10}]},'body-massage':{exercises:[{name:'Pescoço e Ombros',emoji:'💆‍♀️',sets:1,reps:'1min',rest:20},{name:'Braços',emoji:'💪',sets:1,reps:'30s cada',rest:10},{name:'Pernas',emoji:'🦵',sets:1,reps:'1min cada',rest:20},{name:'Pés',emoji:'👣',sets:1,reps:'30s cada',rest:10}]},'posture':{exercises:[{name:'Alongamento Cervical',emoji:'🧍‍♀️',sets:2,reps:'20s',rest:10},{name:'Abertura de Peito',emoji:'💫',sets:2,reps:'30s',rest:10},{name:'Gato-Vaca',emoji:'🐱',sets:2,reps:'10',rest:10},{name:'Postura na Parede',emoji:'🧱',sets:1,reps:'1min',rest:0}]},'stretching':{exercises:[{name:'Alongamento de Pernas',emoji:'🦵',sets:2,reps:'30s cada',rest:10},{name:'Alongamento de Braços',emoji:'💪',sets:2,reps:'20s cada',rest:10},{name:'Torção Espinal',emoji:'🔄',sets:2,reps:'20s cada',rest:10},{name:'Alongamento Total',emoji:'🤸‍♀️',sets:1,reps:'30s',rest:0}]},'breathing':{exercises:[{name:'Respiração Profunda',emoji:'🌬️',sets:3,reps:'10',rest:20},{name:'Respiração Alternada',emoji:'👃',sets:2,reps:'5 cada',rest:20},{name:'Respiração 4-7-8',emoji:'💫',sets:3,reps:'4',rest:10}]},'meditation':{exercises:[{name:'Meditação Guiada',emoji:'🧘‍♀️',sets:1,reps:'5min',rest:0},{name:'Visualização',emoji:'✨',sets:1,reps:'3min',rest:0},{name:'Gratidão',emoji:'🙏',sets:1,reps:'2min',rest:0}]}};}}document.addEventListener('DOMContentLoaded',()=>{window.app= new FitnessApp();if('serviceWorker' in navigator){navigator.serviceWorker.register('/sw.js').then(reg=>console.log('Service Worker registered:',reg.scope)).catch(err=>console.error('Service Worker registration failed:',err));}}); const style=document.createElement('style');style.textContent=` @keyframes fadeOut{from{opacity:1;}to{opacity:0;}}`;document.head.appendChild(style);

dist/app.min.js.gz

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:6495a08a1503b0750ae40a0d291f2d9501c260cb62c5d4ab0556eb9796a928f1
+size 15755

dist/build-report.json

@@ -0,0 +1,48 @@
+{
+  "buildDate": "2025-10-16T10:10:38.286Z",
+  "files": [
+    {
+      "name": "JavaScript",
+      "originalSize": 103828,
+      "minifiedSize": 63924,
+      "gzipSize": 15755,
+      "minSavings": "38.4%",
+      "gzipSavings": "84.8%"
+    },
+    {
+      "name": "CSS",
+      "originalSize": 45538,
+      "minifiedSize": 33154,
+      "gzipSize": 5741,
+      "minSavings": "27.2%",
+      "gzipSavings": "87.4%"
+    },
+    {
+      "name": "HTML",
+      "originalSize": 35221,
+      "minifiedSize": 19069,
+      "gzipSize": 4981,
+      "minSavings": "45.9%",
+      "gzipSavings": "85.9%"
+    },
+    {
+      "name": "Service Worker",
+      "originalSize": 4215,
+      "minifiedSize": 2030,
+      "gzipSize": 730,
+      "minSavings": "51.8%",
+      "gzipSavings": "82.7%"
+    }
+  ],
+  "totals": {
+    "originalSize": 188802,
+    "minifiedSize": 118177,
+    "gzipSize": 27207,
+    "minSavings": "37.4%",
+    "gzipSavings": "85.6%"
+  },
+  "performance": {
+    "estimatedLoadTime3G": "0.28s",
+    "estimatedLoadTime4G": "0.04s"
+  }
+}

dist/index.html

@@ -0,0 +1 @@
+<!DOCTYPE html><html lang=pt-BR><head><meta charset=UTF-8><meta name=viewport content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes, viewport-fit=cover"><meta name=mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-title content="Fitness App"><title>✨ Sua Jornada de Transformação</title><link rel=dns-prefetch href="https://fonts.googleapis.com"><link rel=dns-prefetch href="https://fonts.gstatic.com"><link rel=preconnect href="https://fonts.googleapis.com"><link rel=preconnect href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Playfair+Display:wght@400;600;700&display=swap" rel=stylesheet media=print onload="this.media='all'"><noscript><link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Playfair+Display:wght@400;600;700&display=swap" rel=stylesheet></noscript><link rel=preload href="styles.css" as=style><link rel=stylesheet href="styles.css"><link rel=modulepreload href="app.js"><link rel=modulepreload href="lazy-video.js"><link rel=manifest href="manifest.json"><meta name=description content="Seu aplicativo de transformação pessoal completo - exercícios, nutrição e bem-estar"><meta name=keywords content="fitness, treino, nutrição, bem-estar, yoga, meditação, saúde"><meta name=theme-color content="#FF6B9D"><meta name=apple-mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-status-bar-style content=black-translucent><link rel=icon type="image/svg+xml" href="icons/icon.svg"><link rel=preload href="app.js" as=script><link rel=modulepreload href="app.js"></head><body><div class=welcome-screen id=welcomeScreen><div class=welcome-content><div class=welcome-logo><div class=logo-heart>💖</div><h1>Bem-vinda!</h1><p>Sua jornada de transformação começa aqui</p></div><button class=btn-start-journey id=startJourney>Começar Agora ✨</button></div></div><div class=app-container id=appContainer style="display: none;"><header class=top-bar><div class=user-info><div class=avatar>💝</div><div class=user-text><span class=greeting id=greeting>Olá, Guerreira!</span><span class=streak>🔥 <span id=streakDays>0</span> dias seguidos</span></div></div><div class=top-actions><button class=icon-btn id=notifBtn title="Notificações"><span>🔔</span></button></div></header><main class=main-view><section class="view active" id=homeView><div class=hero-section><h2 class=page-title>Sua Transformação</h2><div class=daily-progress><div class=progress-circle id=progressCircle><svg viewBox="0 0 120 120"><circle cx=60 cy=60 r=54 class=progress-bg></circle><circle cx=60 cy=60 r=54 class=progress-fill id=progressFill style="--progress: 0"></circle></svg><div class=progress-text><span class=progress-value id=progressValue>0</span>% <span class=progress-label>Hoje</span></div></div><div class=today-stats><div class=stat><span class=stat-icon>🔥</span><div><span class=stat-value id=caloriesBurned>0</span><span class=stat-label>kcal</span></div></div><div class=stat><span class=stat-icon>⏱️</span><div><span class=stat-value id=minutesActive>0</span><span class=stat-label>min</span></div></div><div class=stat><span class=stat-icon>💪</span><div><span class=stat-value id=workoutsCompleted>0</span><span class=stat-label>treinos</span></div></div></div></div></div><div class=plan-summary id=planSummary style="display: none;"><div class=plan-card><div class=plan-header><h3>🎯 Seu Plano Personalizado</h3><button class=btn-view-plan id=viewFullPlan>Ver Detalhes</button></div><div class=plan-quick-stats><div class=plan-stat><span class=plan-label>Meta</span><span class=plan-value id=planGoal>-</span></div><div class=plan-stat><span class=plan-label>Calorias/dia</span><span class=plan-value id=planCalories>-</span></div><div class=plan-stat><span class=plan-label>Treino</span><span class=plan-value id=planWorkout>-</span></div></div><div class=coach-message id=coachMessage> 💪 Continue assim! Você está no caminho certo! </div></div></div><div class=quick-actions><h3 class=section-title>Comece Agora</h3><div class=action-cards><div class=action-card data-navigate="workouts"><div class=action-icon>💪</div><h4>Treinar</h4><p>Escolha sua área</p></div><div class=action-card data-navigate="nutrition"><div class=action-icon>🥗</div><h4>Nutrição</h4><p>Acompanhe sua dieta</p></div><div class=action-card data-navigate="wellness"><div class=action-icon>🧘‍♀️</div><h4>Bem-Estar</h4><p>Massagens & Postura</p></div><div class=action-card data-navigate="progress"><div class=action-icon>📈</div><h4>Progresso</h4><p>Veja sua evolução</p></div></div></div><div class=motivation-card><div class=motivation-icon>✨</div><p class=motivation-text id=dailyMotivation>Você é capaz de coisas incríveis! Continue brilhando! 💫</p></div></section><section class=view id=workoutsView><div class=view-header><button class=btn-back data-back="home">← Voltar</button><h2 class=view-title>Escolha a Área</h2></div><div class=category-grid><div class=category-card data-category="personalized" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white;"><div class=category-image>🎯</div><h3>Personalizado</h3><p>Seu treino único</p><span class=category-badge style="background: rgba(255,255,255,0.3);">14 exercícios</span></div><div class=category-card data-category="abs"><div class=category-image>🔥</div><h3>Abdômen</h3><p>Barriga definida</p><span class=category-badge>5 exercícios</span></div><div class=category-card data-category="legs"><div class=category-image>🦵</div><h3>Pernas</h3><p>Pernas torneadas</p><span class=category-badge>15 exercícios</span></div><div class=category-card data-category="glutes"><div class=category-image>🍑</div><h3>Glúteos</h3><p>Bumbum empinado</p><span class=category-badge>14 exercícios</span></div><div class=category-card data-category="arms"><div class=category-image>💪</div><h3>Braços</h3><p>Braços definidos</p><span class=category-badge>10 exercícios</span></div><div class=category-card data-category="waist"><div class=category-image>⏳</div><h3>Cintura</h3><p>Cintura fina</p><span class=category-badge>8 exercícios</span></div><div class=category-card data-category="back"><div class=category-image>🏋️‍♀️</div><h3>Costas</h3><p>Postura correta</p><span class=category-badge>9 exercícios</span></div><div class=category-card data-category="cardio"><div class=category-image>❤️</div><h3>Cardio</h3><p>Queime calorias</p><span class=category-badge>11 exercícios</span></div><div class=category-card data-category="fullbody"><div class=category-image>✨</div><h3>Corpo Todo</h3><p>Treino completo</p><span class=category-badge>20 exercícios</span></div><div class=category-card data-category="yoga"><div class=category-image>🧘‍♀️</div><h3>Yoga</h3><p>Flexibilidade e paz</p><span class=category-badge>12 posições</span></div><div class=category-card data-category="massage"><div class=category-image>💆‍♀️</div><h3>Massagem</h3><p>Relaxamento total</p><span class=category-badge>8 técnicas</span></div><div class=category-card data-category="face"><div class=category-image>😊</div><h3>Rosto</h3><p>Rejuvenescimento facial</p><span class=category-badge>4 exercícios</span></div></div></section><section class=view id=exercisesListView><div class=view-header><button class=btn-back data-back="workouts">← Voltar</button><h2 class=view-title id=categoryTitle>Exercícios</h2></div><div class=exercises-container id=exercisesList></div></section><section class=view id=workoutSessionView><div class=workout-header><button class=btn-close-workout id=closeWorkout>✕</button><div class=workout-timer id=workoutTimer>00:00</div></div><div class=workout-content><div class=exercise-display><div class=exercise-name id=currentExerciseName>Preparando...</div><div class=exercise-count id=exerciseCount>Exercício 1 de 5</div><div class=exercise-demo id=exerciseDemo><div class=demo-placeholder><video class=demo-video id=demoVideo loop muted playsinline style="display: none;"><source src="" type="video/mp4"></video><span class=demo-icon id=demoIcon>💪</span></div></div><div class=exercise-instructions><div class=reps-info id=repsInfo>3 séries × 15 repetições</div><div class=rest-info id=restInfo>Descanso: 30s entre séries</div></div><div class=series-tracker id=seriesTracker><div class="series-dot completed"></div><div class=series-dot></div><div class=series-dot></div></div></div><div class=workout-controls><button class="btn-workout-action secondary" id=skipExercise>Pular</button><button class="btn-workout-action primary" id=completeExercise>Concluir Série</button></div></div><div class=workout-progress-bar><div class=progress-bar-fill id=workoutProgressBar style="width: 0%"></div></div></section><section class=view id=wellnessView><div class=view-header><button class=btn-back data-back="home">← Voltar</button><h2 class=view-title>Bem-Estar</h2></div><div class=wellness-grid><div class=wellness-card data-wellness="face-massage"><div class=wellness-icon>💆‍♀️</div><h3>Massagem Facial</h3><p>Rejuvenesça e relaxe</p><span class=duration>10 min</span></div><div class=wellness-card data-wellness="body-massage"><div class=wellness-icon>💫</div><h3>Massagem Corporal</h3><p>Alivie tensões</p><span class=duration>15 min</span></div><div class=wellness-card data-wellness="posture"><div class=wellness-icon>🧍‍♀️</div><h3>Correção Postural</h3><p>Melhore sua postura</p><span class=duration>12 min</span></div><div class=wellness-card data-wellness="stretching"><div class=wellness-icon>🤸‍♀️</div><h3>Alongamento</h3><p>Flexibilidade total</p><span class=duration>8 min</span></div><div class=wellness-card data-wellness="breathing"><div class=wellness-icon>🌬️</div><h3>Respiração</h3><p>Acalme sua mente</p><span class=duration>5 min</span></div><div class=wellness-card data-wellness="meditation"><div class=wellness-icon>🧘‍♀️</div><h3>Meditação</h3><p>Paz interior</p><span class=duration>10 min</span></div></div></section><section class=view id=nutritionView><div class=view-header><button class=btn-back data-back="home">← Voltar</button><h2 class=view-title>Nutrição</h2></div><div class=nutrition-summary><h3>Resumo de Hoje</h3><div class=macros-display><div class=macro-item><div class="macro-circle carbs"><span id=carbsValue>0g</span></div><span class=macro-label>Carboidratos</span></div><div class=macro-item><div class="macro-circle protein"><span id=proteinValue>0g</span></div><span class=macro-label>Proteínas</span></div><div class=macro-item><div class="macro-circle fat"><span id=fatValue>0g</span></div><span class=macro-label>Gorduras</span></div></div><div class=calories-total><span class=calories-value id=totalCalories>0</span><span class=calories-label>kcal hoje</span></div></div><div class=water-tracker><h3>Hidratação 💧</h3><div class=water-glasses><div class=glass data-glass="1">💧</div><div class=glass data-glass="2">💧</div><div class=glass data-glass="3">💧</div><div class=glass data-glass="4">💧</div><div class=glass data-glass="5">💧</div><div class=glass data-glass="6">💧</div><div class=glass data-glass="7">💧</div><div class=glass data-glass="8">💧</div></div><p class=water-goal><span id=waterCount>0</span>/8 copos (2L)</p></div></section><section class=view id=progressView><div class=view-header><button class=btn-back data-back="home">← Voltar</button><h2 class=view-title>Seu Progresso</h2></div><div class=weight-tracking-section><h3>Controle de Peso ⚖️</h3><div class=weight-card><div class=weight-current><div class=weight-label>Peso Atual</div><div class=weight-value id=currentWeight>--</div><button class=btn-update-weight id=updateWeightBtn>Atualizar Peso</button></div><div class=weight-stats><div class=weight-stat><div class=weight-stat-label>Peso Inicial</div><div class=weight-stat-value id=initialWeight>--</div></div><div class="weight-stat success"><div class=weight-stat-label>Perdeu</div><div class=weight-stat-value id=weightLost>0 kg</div></div><div class=weight-stat><div class=weight-stat-label>Meta</div><div class=weight-stat-value id=goalWeight>--</div></div></div><div class=weight-progress-bar><div class=weight-progress-fill id=weightProgressFill style="width: 0%"></div></div><div class=weight-chart-mini id=weightChartMini></div></div></div><div class=detailed-stats-section><h3>Estatísticas Detalhadas 📊</h3><div class=stats-grid><div class=stat-detail-card><div class=stat-detail-icon>🔥</div><div class=stat-detail-content><div class=stat-detail-number id=totalWorkouts>0</div><div class=stat-detail-label>Treinos Completos</div><div class=stat-detail-sublabel><span id=thisWeekWorkouts>0</span> esta semana </div></div></div><div class=stat-detail-card><div class=stat-detail-icon>⏱️</div><div class=stat-detail-content><div class=stat-detail-number id=totalMinutes>0</div><div class=stat-detail-label>Minutos Ativos</div><div class=stat-detail-sublabel><span id=avgMinutes>0</span> min/treino </div></div></div><div class=stat-detail-card><div class=stat-detail-icon>🔥</div><div class=stat-detail-content><div class=stat-detail-number id=totalCaloriesDetail>0</div><div class=stat-detail-label>Calorias Queimadas</div><div class=stat-detail-sublabel><span id=avgCalories>0</span> kcal/treino </div></div></div><div class=stat-detail-card><div class=stat-detail-icon>📅</div><div class=stat-detail-content><div class=stat-detail-number id=daysActiveDetail>0</div><div class=stat-detail-label>Dias Ativos</div><div class=stat-detail-sublabel> Sequência: <span id=currentStreak>0</span> dias </div></div></div><div class=stat-detail-card><div class=stat-detail-icon>💧</div><div class=stat-detail-content><div class=stat-detail-number id=totalWaterGlasses>0</div><div class=stat-detail-label>Copos de Água</div><div class=stat-detail-sublabel><span id=waterStreak>0</span> dias 8 copos </div></div></div><div class=stat-detail-card><div class=stat-detail-icon>🏆</div><div class=stat-detail-content><div class=stat-detail-number id=achievementsUnlocked>0</div><div class=stat-detail-label>Conquistas</div><div class=stat-detail-sublabel> de <span id=totalAchievements>12</span> possíveis </div></div></div></div></div><div class=activity-chart-section><h3>Atividade Semanal 📈</h3><div class=weekly-chart><div class=chart-bars id=weeklyChart></div></div></div><div class=achievements-section><h3>Conquistas 🏆</h3><div class=achievements-grid id=achievementsGrid></div></div><div class=records-section><h3>Recordes Pessoais 🌟</h3><div class=records-list><div class=record-item><div class=record-icon>🔥</div><div class=record-content><div class=record-label>Maior Sequência</div><div class=record-value id=longestStreak>0 dias</div></div></div><div class=record-item><div class=record-icon>⏱️</div><div class=record-content><div class=record-label>Treino Mais Longo</div><div class=record-value id=longestWorkout>0 min</div></div></div><div class=record-item><div class=record-icon>💪</div><div class=record-content><div class=record-label>Categoria Favorita</div><div class=record-value id=favoriteCategory>--</div></div></div><div class=record-item><div class=record-icon>📅</div><div class=record-content><div class=record-label>Membro Desde</div><div class=record-value id=memberSince>--</div></div></div></div></div></section></main><nav class=bottom-nav><button class="nav-item active" data-nav="home"><span class=nav-icon>🏠</span><span class=nav-label>Início</span></button><button class=nav-item data-nav="workouts"><span class=nav-icon>💪</span><span class=nav-label>Treinar</span></button><button class=nav-item data-nav="nutrition"><span class=nav-icon>🥗</span><span class=nav-label>Nutrição</span></button><button class=nav-item data-nav="progress"><span class=nav-icon>📊</span><span class=nav-label>Progresso</span></button></nav></div><div class=modal id=completionModal><div class="modal-content celebration"><div class=celebration-confetti>🎉</div><h2 class=modal-title>Parabéns! 🎊</h2><p class=modal-message id=completionMessage>Você completou o treino!</p><div class=workout-summary id=workoutSummary><div class=summary-stat><span class=summary-icon>⏱️</span><span class=summary-value id=summaryTime>15 min</span></div><div class=summary-stat><span class=summary-icon>🔥</span><span class=summary-value id=summaryCalories>120 kcal</span></div><div class=summary-stat><span class=summary-icon>💪</span><span class=summary-value id=summaryExercises>8 exercícios</span></div></div><div class=workout-details id=workoutDetails style="margin-top: var(--spacing-md); padding: var(--spacing-md); background: var(--bg-light); border-radius: var(--radius-md); text-align: left; font-size: 0.9rem; color: var(--text-secondary);"></div><button class=btn-modal-primary id=closeCompletionModal>Continuar ✨</button></div></div><div class=modal id=weightModal><div class=modal-content><h2 class=modal-title>Atualizar Peso ⚖️</h2><div class=weight-input-group><label for=weightInput>Seu peso atual (kg)</label><input type=number id=weightInput step="0.1" min=30 max=200 placeholder="Ex: 65.5"></div><div class=weight-input-group><label for=goalWeightInput>Seu peso meta (kg)</label><input type=number id=goalWeightInput step="0.1" min=30 max=200 placeholder="Ex: 60.0"></div><div class=modal-actions><button class=btn-modal-secondary id=cancelWeightBtn>Cancelar</button><button class=btn-modal-primary id=saveWeightBtn>Salvar 💖</button></div></div></div><div class=settings-fab id=settingsFab><button class=fab-settings id=toggleSound><span class=fab-icon id=soundIcon>🔊</span></button></div><link rel=preload href="lazy-video.js" as=script><script src="lazy-video.js" defer></script><script> // Only load performance monitor in dev mode if (location.hostname === 'localhost' || location.search.includes('debug=true')) { const script = document.createElement('script'); script.src = 'performance-monitor.js'; script.defer = true; document.head.appendChild(script); } </script><div class=modal id=planModal><div class="modal-content plan-modal-content"><button class=modal-close onclick="app.closeModal('planModal')">×</button><div id=planModalContent><h2 class=modal-title>🎯 Seu Plano Completo</h2><div class=profile-info id=profileInfo></div><div class=plan-section><h3>🍽️ Plano Nutricional</h3><div id=nutritionPlan></div></div><div class=plan-section><h3>💪 Plano de Treino</h3><div id=workoutPlan></div></div><div class=plan-section><h3>📅 Linha do Tempo</h3><div id=timelinePlan></div></div><div class=plan-section><h3>💡 Dicas Personalizadas</h3><div id=tipsPlan></div></div><button class=btn-edit-profile id=editProfile>✏️ Editar Perfil</button></div></div></div><script src="app.js" defer></script></body></html>

dist/index.html.gz

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:4a43a869f58883288d5d32f6324de827580dce4e3911dbb3f638fa1680c775f9
+size 4981

dist/styles.min.css

@@ -0,0 +1 @@
+:root{--primary:#FF6B9D;--primary-dark:#E91E63;--secondary:#9C27B0;--accent:#FFB6C1;--success:#4CAF50;--warning:#FF9800;--gradient-primary:linear-gradient(135deg,#FF6B9D 0,#C2185B 100%);--gradient-secondary:linear-gradient(135deg,#9C27B0 0,#7B1FA2 100%);--gradient-soft:linear-gradient(135deg,#FFE5EC 0,#FFF0F5 100%);--gradient-hero:linear-gradient(135deg,#FF6B9D 0,#9C27B0 100%);--white:#FFF;--bg-light:#FFF5F8;--bg-card:#FFF;--text-primary:#2D3748;--text-secondary:#718096;--border:#FFE5EC;--shadow-sm:0 2px 8px rgba(255,107,157,0.1);--shadow-md:0 4px 16px rgba(255,107,157,0.15);--shadow-lg:0 8px 24px rgba(255,107,157,0.2);--shadow-xl:0 12px 32px rgba(255,107,157,0.25);--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg-light);color:var(--text-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch;text-rendering:optimizeLegibility}.profile-setup-screen{position:fixed;top:0;left:0;width:100%;height:100vh;background:var(--bg-light);overflow-y:auto;z-index:10000;padding:var(--spacing-lg)}.profile-setup-content{max-width:500px;margin:0 auto;padding:var(--spacing-xl) 0}.setup-title{font-size:2rem;font-weight:700;color:var(--text-primary);text-align:center;margin-bottom:var(--spacing-sm)}.setup-subtitle{text-align:center;color:var(--text-secondary);margin-bottom:var(--spacing-xl)}.profile-form{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-md)}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.form-group input,.form-group select{width:100%;padding:12px 16px;border:2px solid var(--border);border-radius:var(--radius-md);font-size:1rem;font-family:inherit;transition:all .3s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,107,157,0.1)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.photo-upload{text-align:center}.photo-preview{width:150px;height:150px;margin:0 auto;border-radius:var(--radius-full);border:3px dashed var(--border);cursor:pointer;transition:all .3s ease;overflow:hidden;display:flex;align-items:center;justify-content:center}.photo-preview:hover{border-color:var(--primary);transform:scale(1.05)}.photo-placeholder{text-align:center}.photo-icon{font-size:48px;display:block;margin-bottom:var(--spacing-sm)}.photo-text{color:var(--text-secondary);font-size:.9rem}.profile-photo{width:100%;height:100%;object-fit:cover}.btn-setup-submit{width:100%;padding:16px;background:var(--gradient-primary);color:var(--white);border:none;border-radius:var(--radius-full);font-size:1.1rem;font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);transition:all .3s ease;margin-top:var(--spacing-lg)}.btn-setup-submit:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.welcome-screen{position:fixed;top:0;left:0;width:100%;height:100vh;background:var(--gradient-hero);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .6s ease;will-change:opacity;contain:layout style paint}.welcome-content{text-align:center;color:var(--white);padding:var(--spacing-xl)}.welcome-logo{margin-bottom:var(--spacing-xl)}.logo-heart{font-size:80px;animation:heartbeat 1.5s ease infinite}@keyframes heartbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}.welcome-content h1{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:700;margin-bottom:var(--spacing-sm);text-shadow:0 2px 8px rgba(0,0,0,0.2)}.welcome-content p{font-size:1.1rem;opacity:.95;margin-bottom:var(--spacing-xl)}.btn-start-journey{background:var(--white);color:var(--primary);border:none;padding:16px 48px;font-size:1.1rem;font-weight:600;border-radius:var(--radius-full);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.2);transition:all .3s cubic-bezier(0.4,0,0.2,1)}.btn-start-journey:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,0.25)}.btn-start-journey:active{transform:translateY(0)}.app-container{max-width:480px;margin:0 auto;background:var(--bg-light);min-height:100vh;min-height:-webkit-fill-available;position:relative;padding-bottom:80px;padding-bottom:calc(80px+env(safe-area-inset-bottom,0px));overflow-x:hidden}.top-bar{background:var(--gradient-hero);padding:var(--spacing-md) var(--spacing-lg);display:flex;justify-content:space-between;align-items:center;color:var(--white);box-shadow:var(--shadow-md)}.user-info{display:flex;align-items:center;gap:var(--spacing-md)}.avatar{width:48px;height:48px;border-radius:var(--radius-full);background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;font-size:24px;border:2px solid rgba(255,255,255,0.3)}.user-text{display:flex;flex-direction:column}.greeting{font-weight:600;font-size:1rem}.streak{font-size:.85rem;opacity:.9}.icon-btn{background:rgba(255,255,255,0.2);border:none;width:40px;height:40px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;transition:all .3s ease}.icon-btn:hover{background:rgba(255,255,255,0.3);transform:scale(1.05)}.main-view{padding:var(--spacing-lg)}.view{display:none;animation:slideIn .3s ease}.view.active{display:block}@keyframes slideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.hero-section{margin-bottom:var(--spacing-xl)}.page-title{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg)}.daily-progress{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md)}.progress-circle{position:relative;width:120px;height:120px;margin:0 auto var(--spacing-lg)}.progress-circle svg{width:100%;height:100%;transform:rotate(-90deg)}.progress-bg{fill:none;stroke:var(--border);stroke-width:8}.progress-fill{fill:none;stroke:url(#progressGradient);stroke-width:8;stroke-linecap:round;stroke-dasharray:339.292;stroke-dashoffset:calc(339.292 - (339.292 * var(--progress)) / 100);transition:stroke-dashoffset .5s ease}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.progress-value{display:block;font-size:2rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.progress-label{font-size:.85rem;color:var(--text-secondary)}.today-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md)}.stat{text-align:center;padding:var(--spacing-md);background:var(--gradient-soft);border-radius:var(--radius-md)}.stat-icon{font-size:24px;display:block;margin-bottom:var(--spacing-xs)}.stat-value{font-size:1.25rem;font-weight:700;color:var(--primary)}.stat-label{font-size:.75rem;color:var(--text-secondary)}.quick-actions{margin-bottom:var(--spacing-xl)}.section-title{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--text-primary)}.action-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.action-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);border:2px solid transparent;will-change:transform;transform:translateZ(0)}.action-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary)}.action-card:active{transform:translateY(-2px)}.action-icon{font-size:48px;margin-bottom:var(--spacing-sm);filter:drop-shadow(0 2px 4px rgba(0,0,0,0.1))}.action-card h4{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.action-card p{font-size:.85rem;color:var(--text-secondary)}.motivation-card{background:var(--gradient-hero);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;box-shadow:var(--shadow-md);margin-bottom:var(--spacing-lg)}.motivation-icon{font-size:32px;margin-bottom:var(--spacing-sm)}.motivation-text{color:var(--white);font-size:1rem;line-height:1.6;font-weight:500}.category-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.category-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;will-change:transform;transform:translateZ(0);contain:layout style}.category-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-primary);transform:scaleX(0);transition:transform .3s ease}.category-card:hover::before{transform:scaleX(1)}.category-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.category-image{font-size:48px;margin-bottom:var(--spacing-sm)}.category-card h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.category-card p{font-size:.85rem;color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.category-badge{display:inline-block;background:var(--gradient-soft);color:var(--primary);padding:4px 12px;border-radius:var(--radius-full);font-size:.75rem;font-weight:500}.view-header{margin-bottom:var(--spacing-lg)}.btn-back{background:var(--white);border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-full);font-weight:500;color:var(--text-primary);cursor:pointer;box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-md);transition:all .3s ease}.btn-back:hover{box-shadow:var(--shadow-md);transform:translateX(-2px)}.view-title{font-family:'Playfair Display',serif;font-size:1.75rem;font-weight:700;color:var(--text-primary)}.exercises-container{display:flex;flex-direction:column;gap:var(--spacing-md)}.exercise-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:var(--spacing-md)}.exercise-card:hover{box-shadow:var(--shadow-md);transform:translateX(4px)}.section-header{margin:var(--spacing-xl) 0 var(--spacing-md) 0;padding:var(--spacing-sm) var(--spacing-md);background:linear-gradient(135deg,#667eea 0,#764ba2 100%);border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.section-header:first-child{margin-top:0}.section-header h3{color:var(--white);font-size:1.1rem;font-weight:600;margin:0;text-align:center}.exercise-emoji{font-size:40px;flex-shrink:0}.exercise-info{flex:1}.exercise-name{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.exercise-details{font-size:.85rem;color:var(--text-secondary)}.exercise-arrow{font-size:20px;color:var(--primary)}.workout-header{background:var(--gradient-hero);padding:var(--spacing-lg);display:flex;justify-content:space-between;align-items:center;color:var(--white)}.btn-close-workout{background:rgba(255,255,255,0.2);border:none;width:40px;height:40px;border-radius:var(--radius-full);color:var(--white);font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.btn-close-workout:hover{background:rgba(255,255,255,0.3)}.workout-timer{font-size:1.5rem;font-weight:700;font-family:'Courier New',monospace}.workout-content{padding:var(--spacing-xl) var(--spacing-lg)}.exercise-display{text-align:center}.exercise-name{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.exercise-count{font-size:.9rem;color:var(--text-secondary);margin-bottom:var(--spacing-lg)}.exercise-demo{margin:var(--spacing-xl) 0}.demo-placeholder{width:95%;max-width:700px;margin:0 auto;background:transparent;border-radius:16px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.demo-icon{font-size:80px}.demo-video{width:100%;height:auto;max-height:75vh;object-fit:contain;border-radius:16px;box-shadow:0 4px 12px rgba(0,0,0,0.15);display:block}.exercise-instructions{margin-bottom:var(--spacing-lg)}.reps-info{font-size:1.1rem;font-weight:600;color:var(--primary);margin-bottom:var(--spacing-sm)}.rest-info{font-size:.9rem;color:var(--text-secondary)}.series-tracker{display:flex;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.series-dot{width:12px;height:12px;border-radius:var(--radius-full);background:var(--border);transition:all .3s ease}.series-dot.completed{background:var(--primary);transform:scale(1.2)}.workout-controls{display:flex;gap:var(--spacing-md)}.btn-workout-action{flex:1;padding:16px;border:none;border-radius:var(--radius-full);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-workout-action.primary{background:var(--gradient-primary);color:var(--white);box-shadow:var(--shadow-md)}.btn-workout-action.primary:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-workout-action.secondary{background:var(--white);color:var(--text-primary);box-shadow:var(--shadow-sm)}.workout-progress-bar{position:fixed;bottom:80px;left:0;right:0;height:4px;background:var(--border);max-width:480px;margin:0 auto}.progress-bar-fill{height:100%;background:var(--gradient-primary);transition:width .3s ease}.wellness-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.wellness-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .3s ease}.wellness-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.wellness-icon{font-size:48px;margin-bottom:var(--spacing-sm)}.wellness-card h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.wellness-card p{font-size:.85rem;color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.duration{display:inline-block;background:var(--gradient-soft);color:var(--primary);padding:4px 12px;border-radius:var(--radius-full);font-size:.75rem;font-weight:500}.nutrition-summary{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md);margin-bottom:var(--spacing-lg)}.nutrition-summary h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-lg);text-align:center}.macros-display{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.macro-item{text-align:center}.macro-circle{width:80px;height:80px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;margin:0 auto var(--spacing-sm);font-weight:700;color:var(--white)}.macro-circle.carbs{background:linear-gradient(135deg,#FFB74D 0,#FF9800 100%)}.macro-circle.protein{background:linear-gradient(135deg,#4CAF50 0,#388E3C 100%)}.macro-circle.fat{background:linear-gradient(135deg,#9C27B0 0,#7B1FA2 100%)}.macro-label{font-size:.85rem;color:var(--text-secondary)}.calories-total{text-align:center;padding:var(--spacing-md);background:var(--gradient-soft);border-radius:var(--radius-md)}.calories-value{display:block;font-size:2rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.calories-label{font-size:.9rem;color:var(--text-secondary)}.water-tracker{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md)}.water-tracker h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md);text-align:center}.water-glasses{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.glass{aspect-ratio:1;background:var(--border);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;transition:all .3s ease;opacity:.3}.glass.filled{background:linear-gradient(135deg,#64B5F6 0,#2196F3 100%);opacity:1;transform:scale(1.05)}.water-goal{text-align:center;color:var(--text-secondary);font-size:.9rem}.achievements-section,.stats-section{margin-bottom:var(--spacing-xl)}.achievements-section h3,.stats-section h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md)}.plan-summary{margin:var(--spacing-xl) 0}.plan-card{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);border-radius:var(--radius-lg);padding:var(--spacing-lg);color:var(--white);box-shadow:var(--shadow-lg)}.plan-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.plan-header h3{font-size:1.3rem;font-weight:700}.btn-view-plan{background:rgba(255,255,255,0.2);color:var(--white);padding:8px 16px;border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-full);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-view-plan:hover{background:rgba(255,255,255,0.3);transform:scale(1.05)}.plan-quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.plan-stat{text-align:center}.plan-label{display:block;font-size:.85rem;opacity:.9;margin-bottom:4px}.plan-value{display:block;font-size:1.1rem;font-weight:700}.coach-message{background:rgba(255,255,255,0.15);padding:var(--spacing-md);border-radius:var(--radius-md);text-align:center;font-size:.95rem;border-left:4px solid rgba(255,255,255,0.5)}.plan-modal-content{max-width:600px;max-height:85vh;overflow-y:auto;width:95%;margin:auto}.profile-info{background:var(--bg-light);padding:var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg)}.profile-photo-container{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.profile-photo-large{width:80px;height:80px;border-radius:var(--radius-full);object-fit:cover}.profile-basic-info{flex:1}.profile-name{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:4px}.profile-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm);margin-top:var(--spacing-md)}.metric-item{display:flex;justify-content:space-between;padding:8px;background:var(--white);border-radius:var(--radius-sm)}.metric-label{color:var(--text-secondary);font-size:.9rem}.metric-value{font-weight:600;color:var(--text-primary)}.plan-section{margin-bottom:var(--spacing-xl)}.plan-section h3{font-size:1.2rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--border)}.nutrition-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.nutrition-item{background:var(--bg-light);padding:var(--spacing-md);border-radius:var(--radius-md);text-align:center}.nutrition-label{display:block;font-size:.9rem;color:var(--text-secondary);margin-bottom:4px}.nutrition-value{display:block;font-size:1.5rem;font-weight:700;color:var(--primary)}.nutrition-unit{font-size:.9rem;color:var(--text-secondary);margin-left:4px}.meal-plan{background:var(--bg-light);padding:var(--spacing-md);border-radius:var(--radius-md)}.meal-item{padding:var(--spacing-sm) 0;border-bottom:1px solid var(--border)}.meal-item:last-child{border-bottom:none}.meal-name{font-weight:600;color:var(--text-primary);margin-bottom:4px}.meal-description{font-size:.9rem;color:var(--text-secondary)}.workout-info,.timeline-info{background:var(--bg-light);padding:var(--spacing-md);border-radius:var(--radius-md)}.info-row{display:flex;justify-content:space-between;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--border)}.info-row:last-child{border-bottom:none}.info-label{color:var(--text-secondary)}.info-value{font-weight:600;color:var(--text-primary)}.milestones{display:grid;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.milestone-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm);background:var(--bg-light);border-radius:var(--radius-md)}.milestone-check{width:30px;height:30px;border-radius:var(--radius-full);background:var(--success);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.2rem}.tips-list{display:grid;gap:var(--spacing-sm)}.tip-item{background:var(--bg-light);padding:var(--spacing-md);border-radius:var(--radius-md);border-left:4px solid var(--primary)}.btn-edit-profile{width:100%;padding:16px;background:var(--gradient-primary);color:var(--white);border:none;border-radius:var(--radius-full);font-size:1.1rem;font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);transition:all .3s ease;margin-top:var(--spacing-lg)}.btn-edit-profile:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.achievements-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md)}.achievement-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-md);text-align:center;box-shadow:var(--shadow-sm)}.achievement-card{transition:all .3s ease}.achievement-card.locked{opacity:.4;filter:grayscale(1)}.achievement-card:not(.locked):hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.achievement-icon{font-size:40px;margin-bottom:var(--spacing-xs);display:block}.achievement-name{font-size:.75rem;font-weight:600;color:var(--text-primary)}@media (max-width:480px){.demo-placeholder{width:98%;max-width:100%}.demo-video{width:100%;height:auto;max-height:65vh;border-radius:12px}.achievements-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.form-row{grid-template-columns:1fr}.plan-quick-stats{grid-template-columns:1fr;gap:var(--spacing-sm)}.profile-metrics{grid-template-columns:1fr}.nutrition-grid{grid-template-columns:1fr}.achievement-card{padding:var(--spacing-sm)}.achievement-icon{font-size:32px}.achievement-name{font-size:.7rem}}.stats-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.stat-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;box-shadow:var(--shadow-sm)}.stat-card .stat-icon{font-size:32px;margin-bottom:var(--spacing-sm)}.stat-number{font-size:1.75rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:.85rem;color:var(--text-secondary)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;background:var(--white);box-shadow:0 -2px 16px rgba(0,0,0,0.1);display:grid;grid-template-columns:repeat(4,1fr);padding:var(--spacing-sm) 0;z-index:100}.nav-item{background:none;border:none;padding:var(--spacing-sm);display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;color:var(--text-secondary);transition:all .3s ease}.nav-item.active{color:var(--primary)}.nav-icon{font-size:24px;transition:transform .3s ease}.nav-item.active .nav-icon{transform:scale(1.1)}.nav-label{font-size:.7rem;font-weight:500}.modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px);z-index:1000;align-items:center;justify-content:center;animation:fadeIn .3s ease}.modal.active{display:flex}.modal-content{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-xl);max-width:90%;max-height:90vh;width:360px;overflow-y:auto;box-shadow:var(--shadow-xl);text-align:center;animation:scaleIn .3s cubic-bezier(0.4,0,0.2,1)}@keyframes scaleIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}.celebration-confetti{font-size:64px;margin-bottom:var(--spacing-md);animation:bounce .6s ease}@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}.modal-title{font-size:1.75rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md)}.modal-message{font-size:1rem;color:var(--text-secondary);margin-bottom:var(--spacing-lg)}.workout-summary{display:flex;justify-content:center;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.summary-stat{display:flex;align-items:center;gap:var(--spacing-sm)}.summary-icon{font-size:24px}.summary-value{font-weight:600;color:var(--primary)}.btn-modal-primary{background:var(--gradient-primary);color:var(--white);border:none;padding:16px 48px;border-radius:var(--radius-full);font-size:1rem;font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);transition:all .3s ease}.btn-modal-primary:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.weight-tracking-section{margin-bottom:var(--spacing-xl)}.weight-tracking-section h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md)}.weight-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md)}.weight-current{text-align:center;margin-bottom:var(--spacing-lg)}.weight-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:var(--spacing-xs)}.weight-value{font-size:3rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--spacing-md)}.btn-update-weight{background:var(--gradient-primary);color:var(--white);border:none;padding:12px 32px;border-radius:var(--radius-full);font-weight:600;cursor:pointer;box-shadow:var(--shadow-sm);transition:all .3s ease}.btn-update-weight:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.weight-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.weight-stat{text-align:center;padding:var(--spacing-md);background:var(--bg-light);border-radius:var(--radius-md)}.weight-stat.success{background:linear-gradient(135deg,#E8F5E9 0,#C8E6C9 100%)}.weight-stat-label{font-size:.75rem;color:var(--text-secondary);margin-bottom:var(--spacing-xs)}.weight-stat-value{font-size:1.1rem;font-weight:700;color:var(--text-primary)}.weight-progress-bar{width:100%;height:8px;background:var(--border);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-lg)}.weight-progress-fill{height:100%;background:var(--gradient-primary);transition:width .5s ease}.weight-chart-mini{height:100px;display:flex;align-items:flex-end;gap:4px;padding:var(--spacing-md) 0}.weight-chart-bar{flex:1;background:var(--gradient-primary);border-radius:4px 4px 0 0;min-height:20px;transition:height .3s ease}.detailed-stats-section{margin-bottom:var(--spacing-xl)}.detailed-stats-section h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md)}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.stat-detail-card{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--spacing-md)}.stat-detail-icon{font-size:36px;flex-shrink:0}.stat-detail-content{flex:1}.stat-detail-number{font-size:1.75rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;margin-bottom:var(--spacing-xs)}.stat-detail-label{font-size:.85rem;color:var(--text-primary);font-weight:500;margin-bottom:4px}.stat-detail-sublabel{font-size:.75rem;color:var(--text-secondary)}.activity-chart-section{margin-bottom:var(--spacing-xl)}.activity-chart-section h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md)}.weekly-chart{background:var(--white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.chart-bars{display:flex;align-items:flex-end;justify-content:space-around;gap:var(--spacing-sm);height:150px}.chart-day{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.chart-bar{width:100%;background:var(--gradient-primary);border-radius:4px 4px 0 0;min-height:4px;transition:height .3s ease}.chart-label{font-size:.7rem;color:var(--text-secondary);font-weight:500}.records-section{margin-bottom:var(--spacing-xl)}.records-section h3{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-md)}.records-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.record-item{background:var(--white);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:var(--spacing-md)}.record-icon{font-size:28px}.record-content{flex:1}.record-label{font-size:.85rem;color:var(--text-secondary);margin-bottom:2px}.record-value{font-size:1rem;font-weight:600;color:var(--text-primary)}.weight-input-group{margin-bottom:var(--spacing-md)}.weight-input-group label{display:block;font-size:.9rem;font-weight:500;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.weight-input-group input{width:100%;padding:12px 16px;border:2px solid var(--border);border-radius:var(--radius-md);font-size:1rem;font-family:inherit;transition:all .3s ease}.weight-input-group input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,107,157,0.1)}.modal-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-lg)}.btn-modal-secondary{flex:1;background:var(--bg-light);color:var(--text-primary);border:2px solid var(--border);padding:12px 24px;border-radius:var(--radius-full);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-modal-secondary:hover{background:var(--border)}.settings-fab{position:fixed;bottom:100px;right:20px;z-index:99;max-width:480px;margin:0 auto}.fab-settings{width:56px;height:56px;border-radius:var(--radius-full);background:var(--gradient-primary);border:none;box-shadow:var(--shadow-lg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(0.4,0,0.2,1)}.fab-settings:hover{transform:scale(1.1);box-shadow:var(--shadow-xl)}.fab-settings:active{transform:scale(0.95)}.fab-icon{font-size:24px}.video-loading{position:relative}.video-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10}.spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,0.3);border-top-color:var(--primary);border-radius:var(--radius-full);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.video-error{opacity:.5}.video-error::after{content:'⚠️ Error loading video';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--white);background:rgba(0,0,0,0.7);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:.85rem;z-index:10}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.pulse{animation:pulse 1s ease infinite}@media (max-width:768px){.view{padding:var(--spacing-md)}.main-view{padding:var(--spacing-md)}.top-bar{padding:var(--spacing-sm) var(--spacing-md)}.user-text .greeting{font-size:.9rem}.user-text .streak{font-size:.75rem}body{overflow-x:hidden}.app-container{overflow-x:hidden;max-width:100vw}.category-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.action-cards{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.wellness-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.stats-grid{grid-template-columns:1fr;gap:var(--spacing-sm)}.today-stats{flex-direction:column;gap:var(--spacing-sm)}.category-card,.action-card{padding:var(--spacing-md)}.category-image,.action-icon{font-size:2rem}.page-title{font-size:1.5rem}.section-title{font-size:1.1rem}.modal-content{width:95%;max-width:none;margin:var(--spacing-md)}.weight-stats{grid-template-columns:1fr;gap:var(--spacing-sm)}.workout-header{padding:var(--spacing-md)}.demo-area{padding:var(--spacing-lg)}.demo-icon{font-size:4rem}.btn-back,.btn-primary,.btn-secondary{padding:12px 20px;font-size:.9rem}.bottom-nav{padding:var(--spacing-sm) 0}.nav-item{min-width:60px}.nav-icon{font-size:22px}.nav-label{font-size:.7rem}.settings-fab{bottom:80px;right:15px}.fab-settings{width:50px;height:50px}}@media (max-width:480px){.action-cards,.category-grid,.wellness-grid{grid-template-columns:1fr}.progress-circle{width:100px;height:100px}.progress-circle svg{width:100px;height:100px}.progress-value{font-size:1.5rem}.exercise-card{padding:var(--spacing-sm)}.water-glasses{gap:var(--spacing-xs);grid-template-columns:repeat(4,1fr)}.glass{font-size:1.2rem}.modal-content{width:90%;padding:var(--spacing-lg);margin:var(--spacing-md);max-height:85vh}.plan-modal-content{width:95%;max-width:none;max-height:85vh}.demo-placeholder{width:95%;max-width:100%}.demo-video{max-height:50vh}.demo-icon{font-size:60px}.bottom-nav{padding-bottom:env(safe-area-inset-bottom,var(--spacing-sm))}}@media (max-width:360px){.page-title{font-size:1.3rem}.hero-section{padding:var(--spacing-md) 0}.stat-detail-number{font-size:1.5rem}.weight-value{font-size:2.5rem}.btn-primary,.btn-secondary{padding:10px 16px;font-size:.85rem}}@media (min-width:769px){.app-container{max-width:768px;margin:0 auto}.category-grid{grid-template-columns:repeat(3,1fr)}.action-cards{grid-template-columns:repeat(3,1fr)}}svg defs{position:absolute;width:0;height:0}

dist/styles.min.css.gz

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:a95af5e5c6e813fea4624f63042d49d38e1b5fed8dade2001b187f0850d339a2
+size 5741

dist/sw.min.js

@@ -0,0 +1 @@
+const VERSION='3.1.0'; const CACHE_NAME=`fitness-app-${VERSION}`; const STATIC_CACHE=`static-${VERSION}`; const DYNAMIC_CACHE=`dynamic-${VERSION}`; const VIDEO_CACHE=`video-${VERSION}`; const MAX_VIDEO_CACHE=5; const STATIC_ASSETS=['/','/index.html','/app.js','/styles.css','/manifest.json','/icons/icon-192x192.svg','/icons/icon-512x512.svg'];self.addEventListener('install',(event)=>{event.waitUntil(caches.open(STATIC_CACHE).then(cache=>cache.addAll(STATIC_ASSETS)).then(()=>self.skipWaiting()));});self.addEventListener('activate',(event)=>{event.waitUntil(caches.keys().then(keys=>{ return Promise.all(keys.filter(key=>key!==STATIC_CACHE&&key!==DYNAMIC_CACHE&&key!==VIDEO_CACHE).map(key=>caches.delete(key)));}).then(()=>self.clients.claim()));});self.addEventListener('fetch',(event)=>{const{request}=event; const url= new URL(request.url);if(url.origin!==location.origin){return;}if(request.url.includes('/videos/')){event.respondWith(caches.open(VIDEO_CACHE).then(cache=>{ return cache.match(request).then(cachedResponse=>{if(cachedResponse){ return cachedResponse;} return fetch(request).then(networkResponse=>{if(networkResponse.status===200){cache.put(request,networkResponse.clone());cache.keys().then(keys=>{if(keys.length>MAX_VIDEO_CACHE){cache.delete(keys[0]);}});} return networkResponse;});});}).catch(()=>{ return caches.match(request);}));return;}if(request.url.includes('/songs/')){event.respondWith(caches.match(request).then(response=>response||fetch(request).then(fetchResponse=>{ return caches.open(DYNAMIC_CACHE).then(cache=>{cache.put(request,fetchResponse.clone()); return fetchResponse;});})));return;}event.respondWith(caches.match(request).then(response=>{if(response) return response; return fetch(request).then(fetchResponse=>{if(fetchResponse.status===200){ const responseClone=fetchResponse.clone();caches.open(DYNAMIC_CACHE).then(cache=>{cache.put(request,responseClone);});} return fetchResponse;});}).catch(()=>{if(request.destination==='document'){ return caches.match('/index.html');}}));});

dist/sw.min.js.gz

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:4aff62abda79636578db6bdc20a071a55b560bf9d13ec15302eab71f793c0e4d
+size 730

docker-compose.yml

@@ -0,0 +1,17 @@
+version: '3.8'
+
+services:
+  keto-planner:
+    build: .
+    ports:
+      - "7860:7860"
+    environment:
+      - NODE_ENV=production
+      - PORT=7860
+    restart: unless-stopped
+    healthcheck:
+      test: ["CMD", "node", "-e", "require('http').get('http://localhost:7860/health', (res) => { process.exit(res.statusCode === 200 ? 0 : 1) })"]
+      interval: 30s
+      timeout: 10s
+      retries: 3
+      start_period: 40s

generate-icons.html

@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Icon Generator</title>
+</head>
+<body>
+    <canvas id="canvas" width="512" height="512" style="display: none;"></canvas>
+    <script>
+        // Generate PWA icons
+        function generateIcon(size) {
+            const canvas = document.getElementById('canvas');
+            const ctx = canvas.getContext('2d');
+            
+            canvas.width = size;
+            canvas.height = size;
+            
+            // Clear canvas
+            ctx.clearRect(0, 0, size, size);
+            
+            // Create gradient background
+            const gradient = ctx.createLinearGradient(0, 0, size, size);
+            gradient.addColorStop(0, '#1a0d2e');
+            gradient.addColorStop(0.5, '#6b46c1');
+            gradient.addColorStop(1, '#d946ef');
+            
+            ctx.fillStyle = gradient;
+            ctx.fillRect(0, 0, size, size);
+            
+            // Add rounded corners
+            ctx.globalCompositeOperation = 'destination-in';
+            ctx.beginPath();
+            ctx.roundRect(0, 0, size, size, size * 0.1);
+            ctx.fill();
+            ctx.globalCompositeOperation = 'source-over';
+            
+            // Add fire emoji
+            ctx.font = `${size * 0.4}px Arial`;
+            ctx.textAlign = 'center';
+            ctx.textBaseline = 'middle';
+            ctx.fillStyle = '#ffffff';
+            ctx.fillText('🔥', size / 2, size / 2);
+            
+            // Convert to blob and download
+            canvas.toBlob((blob) => {
+                const url = URL.createObjectURL(blob);
+                const a = document.createElement('a');
+                a.href = url;
+                a.download = `icon-${size}x${size}.png`;
+                a.click();
+                URL.revokeObjectURL(url);
+            });
+        }
+        
+        // Generate all required icon sizes
+        const sizes = [72, 96, 128, 144, 152, 192, 384, 512];
+        sizes.forEach((size, index) => {
+            setTimeout(() => generateIcon(size), index * 100);
+        });
+    </script>
+</body>
+</html>

package-lock.json

@@ -0,0 +1,1303 @@
+{
+  "name": "30-day-keto-planner",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "30-day-keto-planner",
+      "version": "1.0.0",
+      "license": "MIT",
+      "dependencies": {
+        "compression": "^1.7.4",
+        "cors": "^2.8.5",
+        "express": "^4.18.2",
+        "helmet": "^7.0.0"
+      },
+      "devDependencies": {
+        "nodemon": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/accepts": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
+      "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "~2.1.34",
+        "negotiator": "0.6.3"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/accepts/node_modules/negotiator": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
+      "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/array-flatten": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
+      "license": "MIT"
+    },
+    "node_modules/balanced-match": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/binary-extensions": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/body-parser": {
+      "version": "1.20.3",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.3.tgz",
+      "integrity": "sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.1.2",
+        "content-type": "~1.0.5",
+        "debug": "2.6.9",
+        "depd": "2.0.0",
+        "destroy": "1.2.0",
+        "http-errors": "2.0.0",
+        "iconv-lite": "0.4.24",
+        "on-finished": "2.4.1",
+        "qs": "6.13.0",
+        "raw-body": "2.5.2",
+        "type-is": "~1.6.18",
+        "unpipe": "1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8",
+        "npm": "1.2.8000 || >= 1.4.16"
+      }
+    },
+    "node_modules/brace-expansion": {
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/bytes": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
+      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/chokidar": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/compressible": {
+      "version": "2.0.18",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
+      "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": ">= 1.43.0 < 2"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/compression": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.8.1.tgz",
+      "integrity": "sha512-9mAqGPHLakhCLeNyxPkK4xVo746zQ/czLH1Ky+vkitMnWfWZps8r0qXuwhwizagCRttsL4lfG4pIOvaWLpAP0w==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.1.2",
+        "compressible": "~2.0.18",
+        "debug": "2.6.9",
+        "negotiator": "~0.6.4",
+        "on-headers": "~1.1.0",
+        "safe-buffer": "5.2.1",
+        "vary": "~1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/content-disposition": {
+      "version": "0.5.4",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
+      "integrity": "sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "safe-buffer": "5.2.1"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/content-type": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
+      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cookie": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.1.tgz",
+      "integrity": "sha512-6DnInpx7SJ2AK3+CTUE/ZM0vWTUboZCegxhC2xiIydHR9jNuTAASBrfEpHhiGOZw/nX51bHt6YQl8jsGo4y/0w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cookie-signature": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
+      "license": "MIT"
+    },
+    "node_modules/cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/debug": {
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "license": "MIT",
+      "dependencies": {
+        "ms": "2.0.0"
+      }
+    },
+    "node_modules/depd": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/destroy": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
+      "integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8",
+        "npm": "1.2.8000 || >= 1.4.16"
+      }
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/ee-first": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
+      "license": "MIT"
+    },
+    "node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
+      "license": "MIT"
+    },
+    "node_modules/etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express": {
+      "version": "4.21.2",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz",
+      "integrity": "sha512-28HqgMZAmih1Czt9ny7qr6ek2qddF4FclbMzwhCREB6OFfH+rXAnuNCwo1/wFvrtbgsQDb4kSbX9de9lFbrXnA==",
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "~1.3.8",
+        "array-flatten": "1.1.1",
+        "body-parser": "1.20.3",
+        "content-disposition": "0.5.4",
+        "content-type": "~1.0.4",
+        "cookie": "0.7.1",
+        "cookie-signature": "1.0.6",
+        "debug": "2.6.9",
+        "depd": "2.0.0",
+        "encodeurl": "~2.0.0",
+        "escape-html": "~1.0.3",
+        "etag": "~1.8.1",
+        "finalhandler": "1.3.1",
+        "fresh": "0.5.2",
+        "http-errors": "2.0.0",
+        "merge-descriptors": "1.0.3",
+        "methods": "~1.1.2",
+        "on-finished": "2.4.1",
+        "parseurl": "~1.3.3",
+        "path-to-regexp": "0.1.12",
+        "proxy-addr": "~2.0.7",
+        "qs": "6.13.0",
+        "range-parser": "~1.2.1",
+        "safe-buffer": "5.2.1",
+        "send": "0.19.0",
+        "serve-static": "1.16.2",
+        "setprototypeof": "1.2.0",
+        "statuses": "2.0.1",
+        "type-is": "~1.6.18",
+        "utils-merge": "1.0.1",
+        "vary": "~1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/finalhandler": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.3.1.tgz",
+      "integrity": "sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "2.6.9",
+        "encodeurl": "~2.0.0",
+        "escape-html": "~1.0.3",
+        "on-finished": "2.4.1",
+        "parseurl": "~1.3.3",
+        "statuses": "2.0.1",
+        "unpipe": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/forwarded": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
+      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/fresh": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+      "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-flag": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/helmet": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/helmet/-/helmet-7.2.0.tgz",
+      "integrity": "sha512-ZRiwvN089JfMXokizgqEPXsl2Guk094yExfoDXR0cBYWxtBbaSww/w+vT4WEJsBW2iTUi1GgZ6swmoug3Oy4Xw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/http-errors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz",
+      "integrity": "sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "2.0.0",
+        "inherits": "2.0.4",
+        "setprototypeof": "1.2.0",
+        "statuses": "2.0.1",
+        "toidentifier": "1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.4.24",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
+      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/ignore-by-default": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz",
+      "integrity": "sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
+      "license": "ISC"
+    },
+    "node_modules/ipaddr.js": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/media-typer": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+      "integrity": "sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/merge-descriptors": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.3.tgz",
+      "integrity": "sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/methods": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+      "integrity": "sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+      "license": "MIT",
+      "bin": {
+        "mime": "cli.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types/node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
+      "license": "MIT"
+    },
+    "node_modules/negotiator": {
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.4.tgz",
+      "integrity": "sha512-myRT3DiWPHqho5PrJaIRyaMv2kgYf0mUVgBNOYMuCH5Ki1yEiQaf/ZJuQ62nvpc44wL5WDbTX7yGJi1Neevw8w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/nodemon": {
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-3.1.10.tgz",
+      "integrity": "sha512-WDjw3pJ0/0jMFmyNDp3gvY2YizjLmmOUQo6DEBY+JgdvW/yQ9mEeSw6H5ythl5Ny2ytb7f9C2nIbjSxMNzbJXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chokidar": "^3.5.2",
+        "debug": "^4",
+        "ignore-by-default": "^1.0.1",
+        "minimatch": "^3.1.2",
+        "pstree.remy": "^1.1.8",
+        "semver": "^7.5.3",
+        "simple-update-notifier": "^2.0.0",
+        "supports-color": "^5.5.0",
+        "touch": "^3.1.0",
+        "undefsafe": "^2.0.5"
+      },
+      "bin": {
+        "nodemon": "bin/nodemon.js"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/nodemon"
+      }
+    },
+    "node_modules/nodemon/node_modules/debug": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/nodemon/node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-inspect": {
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/on-finished": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
+      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
+      "license": "MIT",
+      "dependencies": {
+        "ee-first": "1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/on-headers": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.1.0.tgz",
+      "integrity": "sha512-737ZY3yNnXy37FHkQxPzt4UZ2UWPWiCZWLvFZ4fu5cueciegX0zGPnrlY6bwRg4FdQOe9YU8MkmJwGhoMybl8A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/parseurl": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
+      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/path-to-regexp": {
+      "version": "0.1.12",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
+      "integrity": "sha512-RA1GjUVMnvYFxuqovrEqZoxxW5NUZqbwKtYz/Tt7nXerk0LbLblQmrsgdeOxV5SFHf0UDggjS/bSeOZwt1pmEQ==",
+      "license": "MIT"
+    },
+    "node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/proxy-addr": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
+      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
+      "license": "MIT",
+      "dependencies": {
+        "forwarded": "0.2.0",
+        "ipaddr.js": "1.9.1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/pstree.remy": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.8.tgz",
+      "integrity": "sha512-77DZwxQmxKnu3aR542U+X8FypNzbfJ+C5XQDk3uWjWxn6151aIMGthWYRXTqT1E5oJvg+ljaa2OJi+VfvCOQ8w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/qs": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz",
+      "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.0.6"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/raw-body": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz",
+      "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.1.2",
+        "http-errors": "2.0.0",
+        "iconv-lite": "0.4.24",
+        "unpipe": "1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/safe-buffer": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "license": "MIT"
+    },
+    "node_modules/semver": {
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/send": {
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.19.0.tgz",
+      "integrity": "sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "2.6.9",
+        "depd": "2.0.0",
+        "destroy": "1.2.0",
+        "encodeurl": "~1.0.2",
+        "escape-html": "~1.0.3",
+        "etag": "~1.8.1",
+        "fresh": "0.5.2",
+        "http-errors": "2.0.0",
+        "mime": "1.6.0",
+        "ms": "2.1.3",
+        "on-finished": "2.4.1",
+        "range-parser": "~1.2.1",
+        "statuses": "2.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/send/node_modules/encodeurl": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
+      "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/send/node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "license": "MIT"
+    },
+    "node_modules/serve-static": {
+      "version": "1.16.2",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.16.2.tgz",
+      "integrity": "sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw==",
+      "license": "MIT",
+      "dependencies": {
+        "encodeurl": "~2.0.0",
+        "escape-html": "~1.0.3",
+        "parseurl": "~1.3.3",
+        "send": "0.19.0"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/setprototypeof": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
+      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
+      "license": "ISC"
+    },
+    "node_modules/side-channel": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3",
+        "side-channel-list": "^1.0.0",
+        "side-channel-map": "^1.0.1",
+        "side-channel-weakmap": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-list": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
+      "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-map": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-weakmap": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3",
+        "side-channel-map": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/simple-update-notifier": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/simple-update-notifier/-/simple-update-notifier-2.0.0.tgz",
+      "integrity": "sha512-a2B9Y0KlNXl9u/vsW6sTIu9vGEpfKu2wRV6l1H3XEas/0gUIzGzBoP/IouTcUQbm9JWZLH3COxyn03TYlFax6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "semver": "^7.5.3"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/statuses": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz",
+      "integrity": "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/supports-color": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+      "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
+    "node_modules/toidentifier": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
+      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.6"
+      }
+    },
+    "node_modules/touch": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.1.tgz",
+      "integrity": "sha512-r0eojU4bI8MnHr8c5bNo7lJDdI2qXlWWJk6a9EAFG7vbhTjElYhBVS3/miuE0uOuoLdb8Mc/rVfsmm6eo5o9GA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "nodetouch": "bin/nodetouch.js"
+      }
+    },
+    "node_modules/type-is": {
+      "version": "1.6.18",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
+      "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
+      "license": "MIT",
+      "dependencies": {
+        "media-typer": "0.3.0",
+        "mime-types": "~2.1.24"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/undefsafe": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.5.tgz",
+      "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/unpipe": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/utils-merge": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
+      "integrity": "sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4.0"
+      }
+    },
+    "node_modules/vary": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    }
+  }
+}

package.json

@@ -0,0 +1,38 @@
+{
+  "name": "30-day-keto-planner",
+  "version": "1.0.0",
+  "description": "30-Day Ketogenic Weight Loss Planner - Complete daily tracker with motivation and guidance",
+  "main": "server.js",
+  "scripts": {
+    "start": "node server.js",
+    "dev": "nodemon server.js",
+    "build": "node scripts/build-production.js",
+    "build:analyze": "npm run build && npm run analyze",
+    "minify": "node scripts/minify.js",
+    "analyze": "node scripts/analyze-bundle.js",
+    "optimize": "node scripts/build-production.js && node scripts/optimize-images.js",
+    "test": "echo 'No tests specified'",
+    "lighthouse": "lighthouse http://localhost:7860 --view --output html --output-path ./lighthouse-report.html"
+  },
+  "keywords": [
+    "ketogenic",
+    "weight-loss",
+    "planner",
+    "health",
+    "fitness"
+  ],
+  "author": "30-Day Keto Planner",
+  "license": "MIT",
+  "dependencies": {
+    "express": "^4.18.2",
+    "cors": "^2.8.5",
+    "helmet": "^7.0.0",
+    "compression": "^1.7.4"
+  },
+  "devDependencies": {
+    "nodemon": "^3.0.1"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}

public/index.html

@@ -0,0 +1,746 @@
+<!DOCTYPE html>
+<html lang="pt-BR">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes, viewport-fit=cover">
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Fitness App">
+    <title>✨ Sua Jornada de Transformação</title>
+    
+    <!-- Performance: DNS Prefetch for external resources -->
+    <link rel="dns-prefetch" href="https://fonts.googleapis.com">
+    <link rel="dns-prefetch" href="https://fonts.gstatic.com">
+    <link rel="dns-prefetch" href="https://huggingface.co">
+    
+    <!-- Performance: Preconnect for fonts (saves ~300ms) -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    
+    <!-- Performance: Preconnect for Hugging Face videos (critical for workout videos) -->
+    <link rel="preconnect" href="https://huggingface.co">
+    <link rel="preconnect" href="https://cdn-lfs.huggingface.co" crossorigin>
+    
+    <!-- Performance: Optimized font loading with font-display -->
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Playfair+Display:wght@400;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'">
+    <noscript><link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Playfair+Display:wght@400;600;700&display=swap" rel="stylesheet"></noscript>
+    
+    <!-- Performance: Preload critical CSS -->
+    <link rel="preload" href="styles.css" as="style">
+    <link rel="stylesheet" href="styles.css">
+    
+    <!-- Performance: Preload critical JavaScript -->
+    <link rel="modulepreload" href="app.js">
+    <link rel="modulepreload" href="lazy-video.js">
+    
+    <!-- PWA Manifest -->
+    <link rel="manifest" href="manifest.json">
+    
+    <meta name="description" content="Seu aplicativo de transformação pessoal completo - exercícios, nutrição e bem-estar">
+    <meta name="keywords" content="fitness, treino, nutrição, bem-estar, yoga, meditação, saúde">
+    <meta name="theme-color" content="#FF6B9D" media="(prefers-color-scheme: light)">
+    <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+    
+    <!-- PWA: Apple Touch Icons -->
+    <link rel="apple-touch-icon" sizes="192x192" href="icons/icon-192x192.svg">
+    <link rel="apple-touch-icon" sizes="512x512" href="icons/icon-512x512.svg">
+    
+    <!-- PWA: Microsoft Tiles -->
+    <meta name="msapplication-TileColor" content="#FF6B9D">
+    <meta name="msapplication-config" content="none">
+    
+    <!-- Performance: Preload favicon -->
+    <link rel="icon" type="image/svg+xml" href="icons/icon.svg">
+    
+    <!-- Performance: Resource hints -->
+    <link rel="preload" href="app.js" as="script">
+    <link rel="modulepreload" href="app.js">
+</head>
+<body>
+    <!-- Welcome Screen -->
+    <div class="welcome-screen" id="welcomeScreen">
+        <div class="welcome-content">
+            <div class="welcome-logo">
+                <div class="logo-heart">💖</div>
+                <h1>Bem-vinda!</h1>
+                <p>Sua jornada de transformação começa aqui</p>
+            </div>
+            <button class="btn-start-journey" id="startJourney">Começar Agora ✨</button>
+        </div>
+    </div>
+
+    <div class="app-container" id="appContainer" style="display: none;">
+        <!-- Top Bar -->
+        <header class="top-bar">
+            <div class="user-info" style="cursor: pointer;" id="userProfileClick">
+                <div class="avatar" id="userAvatar">💝</div>
+                <div class="user-text">
+                    <span class="greeting" id="greeting">Olá, Guerreira!</span>
+                    <span class="streak">🔥 <span id="streakDays">0</span> dias seguidos</span>
+                </div>
+            </div>
+            <div class="top-actions">
+                <button class="icon-btn" id="notifBtn" title="Notificações">
+                    <span>🔔</span>
+                    <span class="notification-badge" id="notificationBadge" style="display: none;">0</span>
+                </button>
+            </div>
+        </header>
+
+        <!-- Main Content -->
+        <main class="main-view">
+            <!-- Home View -->
+            <section class="view active" id="homeView">
+                <div class="hero-section">
+                    <h2 class="page-title">Sua Transformação</h2>
+                    <div class="daily-progress">
+                        <div class="progress-circle" id="progressCircle">
+                            <svg viewBox="0 0 120 120">
+                                <circle cx="60" cy="60" r="54" class="progress-bg"></circle>
+                                <circle cx="60" cy="60" r="54" class="progress-fill" id="progressFill" style="--progress: 0"></circle>
+                            </svg>
+                            <div class="progress-text">
+                                <span class="progress-value" id="progressValue">0</span>%
+                                <span class="progress-label">Hoje</span>
+                            </div>
+                        </div>
+                        <div class="today-stats">
+                            <div class="stat">
+                                <span class="stat-icon">🔥</span>
+                                <div>
+                                    <span class="stat-value" id="caloriesBurned">0</span>
+                                    <span class="stat-label">kcal</span>
+                                </div>
+                            </div>
+                            <div class="stat">
+                                <span class="stat-icon">⏱️</span>
+                                <div>
+                                    <span class="stat-value" id="minutesActive">0</span>
+                                    <span class="stat-label">min</span>
+                                </div>
+                            </div>
+                            <div class="stat">
+                                <span class="stat-icon">💪</span>
+                                <div>
+                                    <span class="stat-value" id="workoutsCompleted">0</span>
+                                    <span class="stat-label">treinos</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Personal Plan Summary -->
+                <div class="plan-summary" id="planSummary" style="display: none;">
+                    <div class="plan-card">
+                        <div class="plan-header">
+                            <h3>🎯 Seu Plano Personalizado</h3>
+                            <button class="btn-view-plan" id="viewFullPlan">Ver Detalhes</button>
+                        </div>
+                        <div class="plan-quick-stats">
+                            <div class="plan-stat">
+                                <span class="plan-label">Meta</span>
+                                <span class="plan-value" id="planGoal">-</span>
+                            </div>
+                            <div class="plan-stat">
+                                <span class="plan-label">Calorias/dia</span>
+                                <span class="plan-value" id="planCalories">-</span>
+                            </div>
+                            <div class="plan-stat">
+                                <span class="plan-label">Treino</span>
+                                <span class="plan-value" id="planWorkout">-</span>
+                            </div>
+                        </div>
+                        <div class="coach-message" id="coachMessage">
+                            💪 Continue assim! Você está no caminho certo!
+                        </div>
+                    </div>
+                </div>
+
+                <div class="quick-actions">
+                    <h3 class="section-title">Comece Agora</h3>
+                    <div class="action-cards">
+                        <div class="action-card" data-navigate="workouts">
+                            <div class="action-icon">💪</div>
+                            <h4>Treinar</h4>
+                            <p>Escolha sua área</p>
+                        </div>
+                        <div class="action-card" data-navigate="nutrition">
+                            <div class="action-icon">🥗</div>
+                            <h4>Nutrição</h4>
+                            <p>Acompanhe sua dieta</p>
+                        </div>
+                        <div class="action-card" data-navigate="wellness">
+                            <div class="action-icon">🧘‍♀️</div>
+                            <h4>Bem-Estar</h4>
+                            <p>Massagens & Postura</p>
+                        </div>
+                        <div class="action-card" data-navigate="progress">
+                            <div class="action-icon">📈</div>
+                            <h4>Progresso</h4>
+                            <p>Veja sua evolução</p>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="motivation-card">
+                    <div class="motivation-icon">✨</div>
+                    <p class="motivation-text" id="dailyMotivation">Você é capaz de coisas incríveis! Continue brilhando! 💫</p>
+                </div>
+            </section>
+
+            <!-- Workouts View -->
+            <section class="view" id="workoutsView">
+                <div class="view-header">
+                    <button class="btn-back" data-back="home">← Voltar</button>
+                    <h2 class="view-title">Escolha a Área</h2>
+                </div>
+
+                <div class="category-grid">
+                    <div class="category-card" data-category="personalized" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white;">
+                        <div class="category-image">🎯</div>
+                        <h3>Personalizado</h3>
+                        <p>Seu treino único</p>
+                        <span class="category-badge" style="background: rgba(255,255,255,0.3);">14 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="abs">
+                        <div class="category-image">🔥</div>
+                        <h3>Abdômen</h3>
+                        <p>Barriga definida</p>
+                        <span class="category-badge">5 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="legs">
+                        <div class="category-image">🦵</div>
+                        <h3>Pernas</h3>
+                        <p>Pernas torneadas</p>
+                        <span class="category-badge">15 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="glutes">
+                        <div class="category-image">🍑</div>
+                        <h3>Glúteos</h3>
+                        <p>Bumbum empinado</p>
+                        <span class="category-badge">14 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="arms">
+                        <div class="category-image">💪</div>
+                        <h3>Braços</h3>
+                        <p>Braços definidos</p>
+                        <span class="category-badge">10 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="waist">
+                        <div class="category-image">⏳</div>
+                        <h3>Cintura</h3>
+                        <p>Cintura fina</p>
+                        <span class="category-badge">8 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="back">
+                        <div class="category-image">🏋️‍♀️</div>
+                        <h3>Costas</h3>
+                        <p>Postura correta</p>
+                        <span class="category-badge">9 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="cardio">
+                        <div class="category-image">❤️</div>
+                        <h3>Cardio</h3>
+                        <p>Queime calorias</p>
+                        <span class="category-badge">11 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="fullbody">
+                        <div class="category-image">✨</div>
+                        <h3>Corpo Todo</h3>
+                        <p>Treino completo</p>
+                        <span class="category-badge">20 exercícios</span>
+                    </div>
+
+                    <div class="category-card" data-category="yoga">
+                        <div class="category-image">🧘‍♀️</div>
+                        <h3>Yoga</h3>
+                        <p>Flexibilidade e paz</p>
+                        <span class="category-badge">12 posições</span>
+                    </div>
+
+                    <div class="category-card" data-category="massage">
+                        <div class="category-image">💆‍♀️</div>
+                        <h3>Massagem</h3>
+                        <p>Relaxamento total</p>
+                        <span class="category-badge">8 técnicas</span>
+                    </div>
+
+                    <div class="category-card" data-category="face">
+                        <div class="category-image">😊</div>
+                        <h3>Rosto</h3>
+                        <p>Rejuvenescimento facial</p>
+                        <span class="category-badge">4 exercícios</span>
+                    </div>
+                </div>
+            </section>
+
+            <!-- Exercises List View -->
+            <section class="view" id="exercisesListView">
+                <div class="view-header">
+                    <button class="btn-back" data-back="workouts">← Voltar</button>
+                    <h2 class="view-title" id="categoryTitle">Exercícios</h2>
+                </div>
+
+                <div class="exercises-container" id="exercisesList">
+                    <!-- Exercises will be populated here -->
+                </div>
+            </section>
+
+            <!-- Workout Session View -->
+            <section class="view" id="workoutSessionView">
+                <div class="workout-header">
+                    <button class="btn-close-workout" id="closeWorkout">✕</button>
+                    <div class="workout-timer" id="workoutTimer">00:00</div>
+                </div>
+
+                <div class="workout-content">
+                    <div class="exercise-display">
+                        <div class="exercise-name" id="currentExerciseName">Preparando...</div>
+                        <div class="exercise-count" id="exerciseCount">Exercício 1 de 5</div>
+                        
+                        <div class="exercise-demo" id="exerciseDemo">
+                            <div class="demo-placeholder">
+                                <video class="demo-video" id="demoVideo" loop muted playsinline style="display: none;">
+                                    <source src="" type="video/mp4">
+                                </video>
+                                <span class="demo-icon" id="demoIcon">💪</span>
+                            </div>
+                        </div>
+
+                        <div class="exercise-instructions">
+                            <div class="reps-info" id="repsInfo">3 séries × 15 repetições</div>
+                            <div class="rest-info" id="restInfo">Descanso: 30s entre séries</div>
+                        </div>
+
+                        <div class="series-tracker" id="seriesTracker">
+                            <div class="series-dot completed"></div>
+                            <div class="series-dot"></div>
+                            <div class="series-dot"></div>
+                        </div>
+                    </div>
+
+                    <div class="workout-controls">
+                        <button class="btn-workout-action secondary" id="skipExercise">Pular</button>
+                        <button class="btn-workout-action primary" id="completeExercise">Concluir Série</button>
+                    </div>
+                </div>
+
+                <div class="workout-progress-bar">
+                    <div class="progress-bar-fill" id="workoutProgressBar" style="width: 0%"></div>
+                </div>
+            </section>
+
+            <!-- Wellness View -->
+            <section class="view" id="wellnessView">
+                <div class="view-header">
+                    <button class="btn-back" data-back="home">← Voltar</button>
+                    <h2 class="view-title">Bem-Estar</h2>
+                </div>
+
+                <div class="wellness-grid">
+                    <div class="wellness-card" data-wellness="face-massage">
+                        <div class="wellness-icon">💆‍♀️</div>
+                        <h3>Massagem Facial</h3>
+                        <p>Rejuvenesça e relaxe</p>
+                        <span class="duration">10 min</span>
+                    </div>
+
+                    <div class="wellness-card" data-wellness="body-massage">
+                        <div class="wellness-icon">💫</div>
+                        <h3>Massagem Corporal</h3>
+                        <p>Alivie tensões</p>
+                        <span class="duration">15 min</span>
+                    </div>
+
+                    <div class="wellness-card" data-wellness="posture">
+                        <div class="wellness-icon">🧍‍♀️</div>
+                        <h3>Correção Postural</h3>
+                        <p>Melhore sua postura</p>
+                        <span class="duration">12 min</span>
+                    </div>
+
+                    <div class="wellness-card" data-wellness="stretching">
+                        <div class="wellness-icon">🤸‍♀️</div>
+                        <h3>Alongamento</h3>
+                        <p>Flexibilidade total</p>
+                        <span class="duration">8 min</span>
+                    </div>
+
+                    <div class="wellness-card" data-wellness="breathing">
+                        <div class="wellness-icon">🌬️</div>
+                        <h3>Respiração</h3>
+                        <p>Acalme sua mente</p>
+                        <span class="duration">5 min</span>
+                    </div>
+
+                    <div class="wellness-card" data-wellness="meditation">
+                        <div class="wellness-icon">🧘‍♀️</div>
+                        <h3>Meditação</h3>
+                        <p>Paz interior</p>
+                        <span class="duration">10 min</span>
+                    </div>
+                </div>
+            </section>
+
+            <!-- Nutrition View -->
+            <section class="view" id="nutritionView">
+                <div class="view-header">
+                    <button class="btn-back" data-back="home">← Voltar</button>
+                    <h2 class="view-title">Nutrição</h2>
+                </div>
+
+                <div class="nutrition-summary">
+                    <h3>Resumo de Hoje</h3>
+                    <div class="macros-display">
+                        <div class="macro-item">
+                            <div class="macro-circle carbs">
+                                <span id="carbsValue">0g</span>
+                            </div>
+                            <span class="macro-label">Carboidratos</span>
+                        </div>
+                        <div class="macro-item">
+                            <div class="macro-circle protein">
+                                <span id="proteinValue">0g</span>
+                            </div>
+                            <span class="macro-label">Proteínas</span>
+                        </div>
+                        <div class="macro-item">
+                            <div class="macro-circle fat">
+                                <span id="fatValue">0g</span>
+                            </div>
+                            <span class="macro-label">Gorduras</span>
+                        </div>
+                    </div>
+                    <div class="calories-total">
+                        <span class="calories-value" id="totalCalories">0</span>
+                        <span class="calories-label">kcal hoje</span>
+                    </div>
+                </div>
+
+                <div class="water-tracker">
+                    <h3>Hidratação 💧</h3>
+                    <div class="water-glasses">
+                        <div class="glass" data-glass="1">💧</div>
+                        <div class="glass" data-glass="2">💧</div>
+                        <div class="glass" data-glass="3">💧</div>
+                        <div class="glass" data-glass="4">💧</div>
+                        <div class="glass" data-glass="5">💧</div>
+                        <div class="glass" data-glass="6">💧</div>
+                        <div class="glass" data-glass="7">💧</div>
+                        <div class="glass" data-glass="8">💧</div>
+                    </div>
+                    <p class="water-goal"><span id="waterCount">0</span>/8 copos (2L)</p>
+                </div>
+            </section>
+
+            <!-- Progress View -->
+            <section class="view" id="progressView">
+                <div class="view-header">
+                    <button class="btn-back" data-back="home">← Voltar</button>
+                    <h2 class="view-title">Seu Progresso</h2>
+                </div>
+
+                <!-- Weight Tracking -->
+                <div class="weight-tracking-section">
+                    <h3>Controle de Peso ⚖️</h3>
+                    <div class="weight-card">
+                        <div class="weight-current">
+                            <div class="weight-label">Peso Atual</div>
+                            <div class="weight-value" id="currentWeight">--</div>
+                            <button class="btn-update-weight" id="updateWeightBtn">Atualizar Peso</button>
+                        </div>
+                        <div class="weight-stats">
+                            <div class="weight-stat">
+                                <div class="weight-stat-label">Peso Inicial</div>
+                                <div class="weight-stat-value" id="initialWeight">--</div>
+                            </div>
+                            <div class="weight-stat success">
+                                <div class="weight-stat-label">Perdeu</div>
+                                <div class="weight-stat-value" id="weightLost">0 kg</div>
+                            </div>
+                            <div class="weight-stat">
+                                <div class="weight-stat-label">Meta</div>
+                                <div class="weight-stat-value" id="goalWeight">--</div>
+                            </div>
+                        </div>
+                        <div class="weight-progress-bar">
+                            <div class="weight-progress-fill" id="weightProgressFill" style="width: 0%"></div>
+                        </div>
+                        <div class="weight-chart-mini" id="weightChartMini">
+                            <!-- Mini chart will be rendered here -->
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Weekly Activity -->
+                <div class="weekly-activity-section">
+                    <h3>Atividade Semanal 📅</h3>
+                    <div class="weekly-activity-grid" id="weeklyActivityGrid">
+                        <!-- Será preenchido dinamicamente -->
+                    </div>
+                </div>
+
+                <!-- Detailed Statistics -->
+                <div class="detailed-stats-section">
+                    <h3>Estatísticas Detalhadas 📊</h3>
+                    <div class="stats-grid">
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">🔥</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="totalWorkouts">0</div>
+                                <div class="stat-detail-label">Treinos Completos</div>
+                                <div class="stat-detail-sublabel">
+                                    <span id="thisWeekWorkouts">0</span> esta semana
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">⏱️</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="totalMinutes">0</div>
+                                <div class="stat-detail-label">Minutos Ativos</div>
+                                <div class="stat-detail-sublabel">
+                                    <span id="avgMinutes">0</span> min/treino
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">🔥</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="totalCaloriesDetail">0</div>
+                                <div class="stat-detail-label">Calorias Queimadas</div>
+                                <div class="stat-detail-sublabel">
+                                    <span id="avgCalories">0</span> kcal/treino
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">📅</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="daysActiveDetail">0</div>
+                                <div class="stat-detail-label">Dias Ativos</div>
+                                <div class="stat-detail-sublabel">
+                                    Sequência: <span id="currentStreak">0</span> dias
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">💧</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="totalWaterGlasses">0</div>
+                                <div class="stat-detail-label">Copos de Água</div>
+                                <div class="stat-detail-sublabel">
+                                    <span id="waterStreak">0</span> dias 8 copos
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="stat-detail-card">
+                            <div class="stat-detail-icon">🏆</div>
+                            <div class="stat-detail-content">
+                                <div class="stat-detail-number" id="achievementsUnlocked">0</div>
+                                <div class="stat-detail-label">Conquistas</div>
+                                <div class="stat-detail-sublabel">
+                                    de <span id="totalAchievements">12</span> possíveis
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Weekly Activity Chart -->
+                <div class="activity-chart-section">
+                    <h3>Atividade Semanal 📈</h3>
+                    <div class="weekly-chart">
+                        <div class="chart-bars" id="weeklyChart">
+                            <!-- Chart will be rendered here -->
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Achievements -->
+                <div class="achievements-section">
+                    <h3>Conquistas 🏆</h3>
+                    <div class="achievements-grid" id="achievementsGrid">
+                        <!-- Achievements will be populated here -->
+                    </div>
+                </div>
+
+                <!-- Personal Records -->
+                <div class="records-section">
+                    <h3>Recordes Pessoais 🌟</h3>
+                    <div class="records-list">
+                        <div class="record-item">
+                            <div class="record-icon">🔥</div>
+                            <div class="record-content">
+                                <div class="record-label">Maior Sequência</div>
+                                <div class="record-value" id="longestStreak">0 dias</div>
+                            </div>
+                        </div>
+                        <div class="record-item">
+                            <div class="record-icon">⏱️</div>
+                            <div class="record-content">
+                                <div class="record-label">Treino Mais Longo</div>
+                                <div class="record-value" id="longestWorkout">0 min</div>
+                            </div>
+                        </div>
+                        <div class="record-item">
+                            <div class="record-icon">💪</div>
+                            <div class="record-content">
+                                <div class="record-label">Categoria Favorita</div>
+                                <div class="record-value" id="favoriteCategory">--</div>
+                            </div>
+                        </div>
+                        <div class="record-item">
+                            <div class="record-icon">📅</div>
+                            <div class="record-content">
+                                <div class="record-label">Membro Desde</div>
+                                <div class="record-value" id="memberSince">--</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </section>
+        </main>
+
+        <!-- Bottom Navigation -->
+        <nav class="bottom-nav">
+            <button class="nav-item active" data-nav="home">
+                <span class="nav-icon">🏠</span>
+                <span class="nav-label">Início</span>
+            </button>
+            <button class="nav-item" data-nav="workouts">
+                <span class="nav-icon">💪</span>
+                <span class="nav-label">Treinar</span>
+            </button>
+            <button class="nav-item" data-nav="nutrition">
+                <span class="nav-icon">🥗</span>
+                <span class="nav-label">Nutrição</span>
+            </button>
+            <button class="nav-item" data-nav="progress">
+                <span class="nav-icon">📊</span>
+                <span class="nav-label">Progresso</span>
+            </button>
+        </nav>
+    </div>
+
+    <!-- Completion Modal -->
+    <div class="modal" id="completionModal">
+        <div class="modal-content celebration">
+            <div class="celebration-confetti">🎉</div>
+            <h2 class="modal-title">Parabéns! 🎊</h2>
+            <p class="modal-message" id="completionMessage">Você completou o treino!</p>
+            <div class="workout-summary" id="workoutSummary">
+                <div class="summary-stat">
+                    <span class="summary-icon">⏱️</span>
+                    <span class="summary-value" id="summaryTime">15 min</span>
+                </div>
+                <div class="summary-stat">
+                    <span class="summary-icon">🔥</span>
+                    <span class="summary-value" id="summaryCalories">120 kcal</span>
+                </div>
+                <div class="summary-stat">
+                    <span class="summary-icon">💪</span>
+                    <span class="summary-value" id="summaryExercises">8 exercícios</span>
+                </div>
+            </div>
+            <div class="workout-details" id="workoutDetails" style="margin-top: var(--spacing-md); padding: var(--spacing-md); background: var(--bg-light); border-radius: var(--radius-md); text-align: left; font-size: 0.9rem; color: var(--text-secondary);"></div>
+            <button class="btn-modal-primary" id="closeCompletionModal">Continuar ✨</button>
+        </div>
+    </div>
+
+    <!-- Weight Update Modal -->
+    <div class="modal" id="weightModal">
+        <div class="modal-content">
+            <h2 class="modal-title">Atualizar Peso ⚖️</h2>
+            <div class="weight-input-group">
+                <label for="weightInput">Seu peso atual (kg)</label>
+                <input type="number" id="weightInput" step="0.1" min="30" max="200" placeholder="Ex: 65.5">
+            </div>
+            <div class="weight-input-group">
+                <label for="goalWeightInput">Seu peso meta (kg)</label>
+                <input type="number" id="goalWeightInput" step="0.1" min="30" max="200" placeholder="Ex: 60.0">
+            </div>
+            <div class="modal-actions">
+                <button class="btn-modal-secondary" id="cancelWeightBtn">Cancelar</button>
+                <button class="btn-modal-primary" id="saveWeightBtn">Salvar 💖</button>
+            </div>
+        </div>
+    </div>
+
+    <!-- Settings Toggle (Sound Control) -->
+    <div class="settings-fab" id="settingsFab">
+        <button class="fab-settings" id="toggleSound">
+            <span class="fab-icon" id="soundIcon">🔊</span>
+        </button>
+    </div>
+
+    <!-- Performance: Critical path optimization -->
+    <!-- Lazy video loading (high priority) -->
+    <link rel="preload" href="lazy-video.js" as="script">
+    <script src="lazy-video.js" defer></script>
+    
+    <!-- Performance monitoring (development only) -->
+    <script>
+        // Only load performance monitor in dev mode
+        if (location.hostname === 'localhost' || location.search.includes('debug=true')) {
+            const script = document.createElement('script');
+            script.src = 'performance-monitor.js';
+            script.defer = true;
+            document.head.appendChild(script);
+        }
+    </script>
+    
+    <!-- Performance: Defer non-critical JavaScript -->
+    <!-- Personal Plan Modal -->
+    <div class="modal" id="planModal">
+        <div class="modal-content plan-modal-content">
+            <button class="modal-close" onclick="app.closeModal('planModal')">×</button>
+            <div id="planModalContent">
+                <h2 class="modal-title">🎯 Seu Plano Completo</h2>
+                
+                <div class="profile-info" id="profileInfo"></div>
+                
+                <div class="plan-section">
+                    <h3>🍽️ Plano Nutricional</h3>
+                    <div id="nutritionPlan"></div>
+                </div>
+                
+                <div class="plan-section">
+                    <h3>💪 Plano de Treino</h3>
+                    <div id="workoutPlan"></div>
+                </div>
+                
+                <div class="plan-section">
+                    <h3>📅 Linha do Tempo</h3>
+                    <div id="timelinePlan"></div>
+                </div>
+                
+                <div class="plan-section">
+                    <h3>💡 Dicas Personalizadas</h3>
+                    <div id="tipsPlan"></div>
+                </div>
+
+                <button class="btn-edit-profile" id="editProfile">✏️ Editar Perfil</button>
+            </div>
+        </div>
+    </div>
+
+    <script src="app.js" defer></script>
+</body>
+</html>

public/lazy-video.js

@@ -0,0 +1,205 @@
+/**
+ * Lazy Video Loader
+ * 
+ * Optimized video loading system that:
+ * 1. Only loads videos when they're about to be viewed
+ * 2. Uses Intersection Observer for efficient detection
+ * 3. Provides loading states and error handling
+ * 4. Caches loaded videos for instant replay
+ */
+
+class LazyVideoLoader {
+    constructor(options = {}) {
+        this.options = {
+            rootMargin: '50px',
+            threshold: 0.1,
+            cacheSize: 5, // Keep 5 videos cached
+            ...options
+        };
+        
+        this.videoCache = new Map();
+        this.loadingQueue = new Set();
+        this.observer = null;
+        
+        this.init();
+    }
+    
+    init() {
+        // Create Intersection Observer
+        if ('IntersectionObserver' in window) {
+            this.observer = new IntersectionObserver(
+                (entries) => this.handleIntersection(entries),
+                {
+                    rootMargin: this.options.rootMargin,
+                    threshold: this.options.threshold
+                }
+            );
+        }
+    }
+    
+    handleIntersection(entries) {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                const video = entry.target;
+                this.loadVideo(video);
+                this.observer.unobserve(video);
+            }
+        });
+    }
+    
+    observe(videoElement) {
+        if (this.observer) {
+            this.observer.observe(videoElement);
+        } else {
+            // Fallback: load immediately if IntersectionObserver not supported
+            this.loadVideo(videoElement);
+        }
+    }
+    
+    async loadVideo(videoElement) {
+        const src = videoElement.dataset.src;
+        
+        if (!src || this.loadingQueue.has(src)) {
+            return;
+        }
+        
+        // Check cache first
+        if (this.videoCache.has(src)) {
+            videoElement.src = this.videoCache.get(src);
+            videoElement.load();
+            return;
+        }
+        
+        this.loadingQueue.add(src);
+        
+        try {
+            // Show loading state
+            this.showLoading(videoElement);
+            
+            // Preload the video
+            const blob = await this.fetchVideo(src);
+            const url = URL.createObjectURL(blob);
+            
+            // Cache the video
+            this.cacheVideo(src, url);
+            
+            // Set video source
+            videoElement.src = url;
+            videoElement.load();
+            
+            // Hide loading state
+            this.hideLoading(videoElement);
+            
+        } catch (error) {
+            console.error('Error loading video:', error);
+            this.showError(videoElement);
+        } finally {
+            this.loadingQueue.delete(src);
+        }
+    }
+    
+    async fetchVideo(src) {
+        const response = await fetch(src);
+        
+        if (!response.ok) {
+            throw new Error(`Failed to load video: ${response.status}`);
+        }
+        
+        return await response.blob();
+    }
+    
+    cacheVideo(src, url) {
+        // Implement LRU cache
+        if (this.videoCache.size >= this.options.cacheSize) {
+            // Remove oldest cached video
+            const firstKey = this.videoCache.keys().next().value;
+            const oldUrl = this.videoCache.get(firstKey);
+            URL.revokeObjectURL(oldUrl); // Free memory
+            this.videoCache.delete(firstKey);
+        }
+        
+        this.videoCache.set(src, url);
+    }
+    
+    showLoading(videoElement) {
+        const container = videoElement.parentElement;
+        if (container) {
+            container.classList.add('video-loading');
+            
+            // Add loading spinner if not exists
+            if (!container.querySelector('.video-loader')) {
+                const loader = document.createElement('div');
+                loader.className = 'video-loader';
+                loader.innerHTML = '<div class="spinner"></div>';
+                container.appendChild(loader);
+            }
+        }
+    }
+    
+    hideLoading(videoElement) {
+        const container = videoElement.parentElement;
+        if (container) {
+            container.classList.remove('video-loading');
+            const loader = container.querySelector('.video-loader');
+            if (loader) {
+                loader.remove();
+            }
+        }
+    }
+    
+    showError(videoElement) {
+        const container = videoElement.parentElement;
+        if (container) {
+            container.classList.add('video-error');
+            container.classList.remove('video-loading');
+            
+            const loader = container.querySelector('.video-loader');
+            if (loader) {
+                loader.remove();
+            }
+        }
+    }
+    
+    preloadVideo(src) {
+        // Preload a video in the background
+        if (!this.videoCache.has(src) && !this.loadingQueue.has(src)) {
+            this.loadingQueue.add(src);
+            
+            this.fetchVideo(src)
+                .then(blob => {
+                    const url = URL.createObjectURL(blob);
+                    this.cacheVideo(src, url);
+                })
+                .catch(err => console.error('Preload failed:', err))
+                .finally(() => this.loadingQueue.delete(src));
+        }
+    }
+    
+    clearCache() {
+        // Clear all cached videos
+        this.videoCache.forEach(url => URL.revokeObjectURL(url));
+        this.videoCache.clear();
+    }
+    
+    destroy() {
+        if (this.observer) {
+            this.observer.disconnect();
+        }
+        this.clearCache();
+    }
+}
+
+// Global instance
+if (typeof window !== 'undefined') {
+    window.lazyVideoLoader = new LazyVideoLoader({
+        rootMargin: '100px', // Start loading when video is 100px from viewport
+        threshold: 0.1,
+        cacheSize: 5
+    });
+}
+
+// Export for module systems
+if (typeof module !== 'undefined' && module.exports) {
+    module.exports = LazyVideoLoader;
+}
+

public/manifest.json

@@ -0,0 +1,105 @@
+{
+  "name": "Fitness App - Sua Transformação",
+  "short_name": "Fitness App",
+  "description": "Aplicativo completo de fitness, nutrição e bem-estar. Treinos, yoga, meditação e muito mais!",
+  "start_url": "/?source=pwa",
+  "display": "standalone",
+  "background_color": "#FFF5F8",
+  "theme_color": "#FF6B9D",
+  "orientation": "portrait-primary",
+  "scope": "/",
+  "lang": "pt-BR",
+  "dir": "ltr",
+  "prefer_related_applications": false,
+  "categories": ["health", "fitness", "lifestyle", "wellness"],
+  "icons": [
+    {
+      "src": "icons/icon-72x72.svg",
+      "sizes": "72x72",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-96x96.svg",
+      "sizes": "96x96",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-128x128.svg",
+      "sizes": "128x128",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-144x144.svg",
+      "sizes": "144x144",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-152x152.svg",
+      "sizes": "152x152",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-192x192.svg",
+      "sizes": "192x192",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-384x384.svg",
+      "sizes": "384x384",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    },
+    {
+      "src": "icons/icon-512x512.svg",
+      "sizes": "512x512",
+      "type": "image/svg+xml",
+      "purpose": "maskable any"
+    }
+  ],
+  "shortcuts": [
+    {
+      "name": "Dia Atual",
+      "short_name": "Hoje",
+      "description": "Ver o plano do dia atual",
+      "url": "/",
+      "icons": [
+        {
+          "src": "icons/icon-96x96.png",
+          "sizes": "96x96"
+        }
+      ]
+    },
+    {
+      "name": "Cronômetro",
+      "short_name": "Timer",
+      "description": "Usar cronômetro para treinos",
+      "url": "/#timer",
+      "icons": [
+        {
+          "src": "icons/icon-96x96.png",
+          "sizes": "96x96"
+        }
+      ]
+    }
+  ],
+  "screenshots": [
+    {
+      "src": "screenshots/mobile-1.png",
+      "sizes": "375x812",
+      "type": "image/png",
+      "form_factor": "narrow"
+    },
+    {
+      "src": "screenshots/mobile-2.png",
+      "sizes": "375x812",
+      "type": "image/png",
+      "form_factor": "narrow"
+    }
+  ]
+}

public/performance-monitor.js

@@ -0,0 +1,422 @@
+/**
+ * Performance Monitoring Utility
+ * 
+ * Tracks and reports Web Vitals and custom metrics
+ * Only loads in development or when explicitly enabled
+ */
+
+class PerformanceMonitor {
+    constructor(options = {}) {
+        this.options = {
+            enableInProduction: false,
+            logToConsole: true,
+            sendToAnalytics: false,
+            ...options
+        };
+        
+        this.metrics = {
+            vitals: {},
+            custom: {},
+            resources: [],
+        };
+        
+        // Only initialize if enabled
+        if (this.shouldMonitor()) {
+            this.init();
+        }
+    }
+    
+    shouldMonitor() {
+        return this.options.enableInProduction || 
+               location.hostname === 'localhost' ||
+               location.search.includes('debug=true');
+    }
+    
+    init() {
+        console.log('📊 Performance monitoring enabled');
+        
+        // Track Web Vitals
+        this.trackWebVitals();
+        
+        // Track Navigation Timing
+        this.trackNavigationTiming();
+        
+        // Track Resource Loading
+        this.trackResourceTiming();
+        
+        // Track Custom Metrics
+        this.setupCustomMetrics();
+        
+        // Report on page hide
+        this.setupReporting();
+    }
+    
+    // =======================
+    // Web Vitals Tracking
+    // =======================
+    
+    trackWebVitals() {
+        // Largest Contentful Paint (LCP)
+        this.trackLCP();
+        
+        // First Input Delay (FID)
+        this.trackFID();
+        
+        // Cumulative Layout Shift (CLS)
+        this.trackCLS();
+        
+        // First Contentful Paint (FCP)
+        this.trackFCP();
+        
+        // Time to First Byte (TTFB)
+        this.trackTTFB();
+    }
+    
+    trackLCP() {
+        if (!('PerformanceObserver' in window)) return;
+        
+        try {
+            const observer = new PerformanceObserver((list) => {
+                const entries = list.getEntries();
+                const lastEntry = entries[entries.length - 1];
+                
+                this.metrics.vitals.LCP = {
+                    value: lastEntry.renderTime || lastEntry.loadTime,
+                    rating: this.rateLCP(lastEntry.renderTime || lastEntry.loadTime)
+                };
+                
+                this.log('LCP', this.metrics.vitals.LCP);
+            });
+            
+            observer.observe({ entryTypes: ['largest-contentful-paint'] });
+        } catch (e) {
+            console.error('Error tracking LCP:', e);
+        }
+    }
+    
+    trackFID() {
+        if (!('PerformanceObserver' in window)) return;
+        
+        try {
+            const observer = new PerformanceObserver((list) => {
+                const entries = list.getEntries();
+                entries.forEach(entry => {
+                    this.metrics.vitals.FID = {
+                        value: entry.processingStart - entry.startTime,
+                        rating: this.rateFID(entry.processingStart - entry.startTime)
+                    };
+                    
+                    this.log('FID', this.metrics.vitals.FID);
+                });
+            });
+            
+            observer.observe({ entryTypes: ['first-input'] });
+        } catch (e) {
+            console.error('Error tracking FID:', e);
+        }
+    }
+    
+    trackCLS() {
+        if (!('PerformanceObserver' in window)) return;
+        
+        try {
+            let clsValue = 0;
+            
+            const observer = new PerformanceObserver((list) => {
+                for (const entry of list.getEntries()) {
+                    if (!entry.hadRecentInput) {
+                        clsValue += entry.value;
+                        
+                        this.metrics.vitals.CLS = {
+                            value: clsValue,
+                            rating: this.rateCLS(clsValue)
+                        };
+                    }
+                }
+                
+                this.log('CLS', this.metrics.vitals.CLS);
+            });
+            
+            observer.observe({ entryTypes: ['layout-shift'] });
+        } catch (e) {
+            console.error('Error tracking CLS:', e);
+        }
+    }
+    
+    trackFCP() {
+        if (!('PerformanceObserver' in window)) return;
+        
+        try {
+            const observer = new PerformanceObserver((list) => {
+                const entries = list.getEntries();
+                entries.forEach(entry => {
+                    if (entry.name === 'first-contentful-paint') {
+                        this.metrics.vitals.FCP = {
+                            value: entry.startTime,
+                            rating: this.rateFCP(entry.startTime)
+                        };
+                        
+                        this.log('FCP', this.metrics.vitals.FCP);
+                    }
+                });
+            });
+            
+            observer.observe({ entryTypes: ['paint'] });
+        } catch (e) {
+            console.error('Error tracking FCP:', e);
+        }
+    }
+    
+    trackTTFB() {
+        if (!window.performance || !window.performance.timing) return;
+        
+        window.addEventListener('load', () => {
+            const timing = performance.timing;
+            const ttfb = timing.responseStart - timing.requestStart;
+            
+            this.metrics.vitals.TTFB = {
+                value: ttfb,
+                rating: this.rateTTFB(ttfb)
+            };
+            
+            this.log('TTFB', this.metrics.vitals.TTFB);
+        });
+    }
+    
+    // =======================
+    // Navigation Timing
+    // =======================
+    
+    trackNavigationTiming() {
+        window.addEventListener('load', () => {
+            if (!performance.timing) return;
+            
+            const timing = performance.timing;
+            
+            this.metrics.navigation = {
+                dns: timing.domainLookupEnd - timing.domainLookupStart,
+                tcp: timing.connectEnd - timing.connectStart,
+                request: timing.responseStart - timing.requestStart,
+                response: timing.responseEnd - timing.responseStart,
+                domProcessing: timing.domComplete - timing.domLoading,
+                domContentLoaded: timing.domContentLoadedEventEnd - timing.navigationStart,
+                loadComplete: timing.loadEventEnd - timing.navigationStart
+            };
+            
+            this.log('Navigation Timing', this.metrics.navigation);
+        });
+    }
+    
+    // =======================
+    // Resource Timing
+    // =======================
+    
+    trackResourceTiming() {
+        window.addEventListener('load', () => {
+            if (!performance.getEntriesByType) return;
+            
+            const resources = performance.getEntriesByType('resource');
+            
+            const summary = {
+                total: resources.length,
+                byType: {},
+                slow: []
+            };
+            
+            resources.forEach(resource => {
+                // Group by type
+                const type = this.getResourceType(resource.name);
+                summary.byType[type] = (summary.byType[type] || 0) + 1;
+                
+                // Track slow resources (> 1s)
+                if (resource.duration > 1000) {
+                    summary.slow.push({
+                        name: resource.name,
+                        duration: resource.duration,
+                        size: resource.transferSize
+                    });
+                }
+            });
+            
+            this.metrics.resources = summary;
+            this.log('Resources', summary);
+        });
+    }
+    
+    getResourceType(url) {
+        if (url.match(/\.(js|mjs)$/)) return 'script';
+        if (url.match(/\.(css)$/)) return 'stylesheet';
+        if (url.match(/\.(jpg|jpeg|png|gif|webp|svg)$/)) return 'image';
+        if (url.match(/\.(mp4|webm)$/)) return 'video';
+        if (url.match(/\.(mp3|ogg|wav)$/)) return 'audio';
+        if (url.match(/\.(woff|woff2|ttf|eot)$/)) return 'font';
+        return 'other';
+    }
+    
+    // =======================
+    // Custom Metrics
+    // =======================
+    
+    setupCustomMetrics() {
+        // Track app initialization time
+        this.mark('app-init-start');
+        
+        // Track video load times
+        window.addEventListener('video-loaded', (e) => {
+            this.recordCustomMetric('video-load-time', e.detail.duration);
+        });
+        
+        // Track workout completion
+        window.addEventListener('workout-completed', (e) => {
+            this.recordCustomMetric('workout-duration', e.detail.duration);
+        });
+    }
+    
+    mark(name) {
+        if (performance.mark) {
+            performance.mark(name);
+        }
+    }
+    
+    measure(name, startMark, endMark) {
+        if (performance.measure) {
+            try {
+                performance.measure(name, startMark, endMark);
+                const measure = performance.getEntriesByName(name)[0];
+                this.recordCustomMetric(name, measure.duration);
+            } catch (e) {
+                console.error('Error measuring:', e);
+            }
+        }
+    }
+    
+    recordCustomMetric(name, value) {
+        this.metrics.custom[name] = value;
+        this.log(`Custom: ${name}`, value);
+    }
+    
+    // =======================
+    // Rating Functions
+    // =======================
+    
+    rateLCP(value) {
+        if (value <= 2500) return 'good';
+        if (value <= 4000) return 'needs-improvement';
+        return 'poor';
+    }
+    
+    rateFID(value) {
+        if (value <= 100) return 'good';
+        if (value <= 300) return 'needs-improvement';
+        return 'poor';
+    }
+    
+    rateCLS(value) {
+        if (value <= 0.1) return 'good';
+        if (value <= 0.25) return 'needs-improvement';
+        return 'poor';
+    }
+    
+    rateFCP(value) {
+        if (value <= 1800) return 'good';
+        if (value <= 3000) return 'needs-improvement';
+        return 'poor';
+    }
+    
+    rateTTFB(value) {
+        if (value <= 800) return 'good';
+        if (value <= 1800) return 'needs-improvement';
+        return 'poor';
+    }
+    
+    // =======================
+    // Reporting
+    // =======================
+    
+    setupReporting() {
+        // Report on page hide (works better than unload)
+        document.addEventListener('visibilitychange', () => {
+            if (document.visibilityState === 'hidden') {
+                this.report();
+            }
+        });
+    }
+    
+    report() {
+        const report = {
+            timestamp: new Date().toISOString(),
+            url: location.href,
+            userAgent: navigator.userAgent,
+            connection: this.getConnectionInfo(),
+            vitals: this.metrics.vitals,
+            navigation: this.metrics.navigation,
+            resources: this.metrics.resources,
+            custom: this.metrics.custom
+        };
+        
+        if (this.options.logToConsole) {
+            console.table(this.metrics.vitals);
+            console.log('📊 Full Performance Report:', report);
+        }
+        
+        if (this.options.sendToAnalytics) {
+            this.sendToAnalytics(report);
+        }
+        
+        return report;
+    }
+    
+    getConnectionInfo() {
+        if (!navigator.connection) return null;
+        
+        return {
+            effectiveType: navigator.connection.effectiveType,
+            downlink: navigator.connection.downlink,
+            rtt: navigator.connection.rtt,
+            saveData: navigator.connection.saveData
+        };
+    }
+    
+    sendToAnalytics(report) {
+        // Send using sendBeacon for reliability
+        if (navigator.sendBeacon) {
+            const blob = new Blob([JSON.stringify(report)], { type: 'application/json' });
+            navigator.sendBeacon('/api/analytics/performance', blob);
+        }
+    }
+    
+    log(name, data) {
+        if (this.options.logToConsole) {
+            const emoji = this.getEmoji(name);
+            console.log(`${emoji} ${name}:`, data);
+        }
+    }
+    
+    getEmoji(name) {
+        const emojiMap = {
+            'LCP': '🖼️',
+            'FID': '⚡',
+            'CLS': '📐',
+            'FCP': '🎨',
+            'TTFB': '⏱️',
+            'Navigation Timing': '🧭',
+            'Resources': '📦'
+        };
+        return emojiMap[name] || '📊';
+    }
+}
+
+// Initialize global instance (only in dev mode by default)
+if (typeof window !== 'undefined') {
+    window.performanceMonitor = new PerformanceMonitor({
+        enableInProduction: false,
+        logToConsole: true,
+        sendToAnalytics: false
+    });
+}
+
+// Export for module systems
+if (typeof module !== 'undefined' && module.exports) {
+    module.exports = PerformanceMonitor;
+}
+

public/styles.css

@@ -0,0 +1,2736 @@
+/* Modern Feminine Fitness App - Complete Redesign */
+/* Performance Optimized - v2.3.0 */
+
+:root {
+    /* Color Palette */
+    --primary: #FF6B9D;
+    --primary-dark: #E91E63;
+    --secondary: #9C27B0;
+    --accent: #FFB6C1;
+    --success: #4CAF50;
+    --warning: #FF9800;
+    
+    /* Gradients */
+    --gradient-primary: linear-gradient(135deg, #FF6B9D 0%, #C2185B 100%);
+    --gradient-secondary: linear-gradient(135deg, #9C27B0 0%, #7B1FA2 100%);
+    --gradient-soft: linear-gradient(135deg, #FFE5EC 0%, #FFF0F5 100%);
+    --gradient-hero: linear-gradient(135deg, #FF6B9D 0%, #9C27B0 100%);
+    
+    /* Neutral Colors */
+    --white: #FFFFFF;
+    --bg-light: #FFF5F8;
+    --bg-card: #FFFFFF;
+    --text-primary: #2D3748;
+    --text-secondary: #718096;
+    --border: #FFE5EC;
+    
+    /* Shadows */
+    --shadow-sm: 0 2px 8px rgba(255, 107, 157, 0.1);
+    --shadow-md: 0 4px 16px rgba(255, 107, 157, 0.15);
+    --shadow-lg: 0 8px 24px rgba(255, 107, 157, 0.2);
+    --shadow-xl: 0 12px 32px rgba(255, 107, 157, 0.25);
+    
+    /* Spacing */
+    --spacing-xs: 4px;
+    --spacing-sm: 8px;
+    --spacing-md: 16px;
+    --spacing-lg: 24px;
+    --spacing-xl: 32px;
+    
+    /* Border Radius */
+    --radius-sm: 8px;
+    --radius-md: 16px;
+    --radius-lg: 24px;
+    --radius-full: 9999px;
+}
+
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    -webkit-tap-highlight-color: transparent;
+}
+
+body {
+    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    background: var(--bg-light);
+    color: var(--text-primary);
+    overflow-x: hidden;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    /* Performance: GPU acceleration for smooth scrolling */
+    -webkit-overflow-scrolling: touch;
+    /* Performance: Optimize text rendering */
+    text-rendering: optimizeLegibility;
+}
+
+/* Profile Setup Screen */
+.profile-setup-screen {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100vh;
+    background: var(--bg-light);
+    overflow-y: auto;
+    z-index: 10000;
+    padding: var(--spacing-lg);
+}
+
+.profile-setup-content {
+    max-width: 500px;
+    margin: 0 auto;
+    padding: var(--spacing-xl) 0;
+}
+
+.setup-title {
+    font-size: 2rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    text-align: center;
+    margin-bottom: var(--spacing-sm);
+}
+
+.setup-subtitle {
+    text-align: center;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-xl);
+}
+
+.profile-form {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-xl);
+    box-shadow: var(--shadow-md);
+}
+
+.form-group {
+    margin-bottom: var(--spacing-lg);
+}
+
+.form-group label {
+    display: block;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-sm);
+}
+
+.form-group input,
+.form-group select {
+    width: 100%;
+    padding: 12px 16px;
+    border: 2px solid var(--border);
+    border-radius: var(--radius-md);
+    font-size: 1rem;
+    font-family: inherit;
+    transition: all 0.3s ease;
+}
+
+.form-group input:focus,
+.form-group select:focus {
+    outline: none;
+    border-color: var(--primary);
+    box-shadow: 0 0 0 3px rgba(255, 107, 157, 0.1);
+}
+
+.form-row {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: var(--spacing-md);
+}
+
+.photo-upload {
+    text-align: center;
+}
+
+.photo-preview {
+    width: 150px;
+    height: 150px;
+    margin: 0 auto;
+    border-radius: var(--radius-full);
+    border: 3px dashed var(--border);
+    cursor: pointer;
+    transition: all 0.3s ease;
+    overflow: hidden;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.photo-preview:hover {
+    border-color: var(--primary);
+    transform: scale(1.05);
+}
+
+.photo-placeholder {
+    text-align: center;
+}
+
+.photo-icon {
+    font-size: 48px;
+    display: block;
+    margin-bottom: var(--spacing-sm);
+}
+
+.photo-text {
+    color: var(--text-secondary);
+    font-size: 0.9rem;
+}
+
+.profile-photo {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.profile-photo {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.btn-setup-submit {
+    width: 100%;
+    padding: 16px;
+    background: var(--gradient-primary);
+    color: var(--white);
+    border: none;
+    border-radius: var(--radius-full);
+    font-size: 1.1rem;
+    font-weight: 600;
+    cursor: pointer;
+    box-shadow: var(--shadow-md);
+    transition: all 0.3s ease;
+    margin-top: var(--spacing-lg);
+}
+
+.btn-setup-submit:hover {
+    box-shadow: var(--shadow-lg);
+    transform: translateY(-2px);
+}
+
+/* Welcome Screen */
+.welcome-screen {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100vh;
+    background: var(--gradient-hero);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 9999;
+    animation: fadeIn 0.6s ease;
+    /* Performance: GPU acceleration */
+    will-change: opacity;
+    /* Performance: Contain layout */
+    contain: layout style paint;
+}
+
+.welcome-content {
+    text-align: center;
+    color: var(--white);
+    padding: var(--spacing-xl);
+}
+
+.welcome-logo {
+    margin-bottom: var(--spacing-xl);
+}
+
+.logo-heart {
+    font-size: 80px;
+    animation: heartbeat 1.5s ease infinite;
+}
+
+@keyframes heartbeat {
+    0%, 100% { transform: scale(1); }
+    50% { transform: scale(1.1); }
+}
+
+.welcome-content h1 {
+    font-family: 'Playfair Display', serif;
+    font-size: 2.5rem;
+    font-weight: 700;
+    margin-bottom: var(--spacing-sm);
+    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+}
+
+.welcome-content p {
+    font-size: 1.1rem;
+    opacity: 0.95;
+    margin-bottom: var(--spacing-xl);
+}
+
+.btn-start-journey {
+    background: var(--white);
+    color: var(--primary);
+    border: none;
+    padding: 16px 48px;
+    font-size: 1.1rem;
+    font-weight: 600;
+    border-radius: var(--radius-full);
+    cursor: pointer;
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.btn-start-journey:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
+}
+
+.btn-start-journey:active {
+    transform: translateY(0);
+}
+
+/* App Container */
+.app-container {
+    max-width: 480px;
+    margin: 0 auto;
+    background: var(--bg-light);
+    min-height: 100vh;
+    min-height: -webkit-fill-available;
+    position: relative;
+    padding-bottom: 80px;
+    padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
+    overflow-x: hidden;
+}
+
+/* Top Bar */
+.top-bar {
+    background: var(--gradient-hero);
+    padding: var(--spacing-md) var(--spacing-lg);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: var(--white);
+    box-shadow: var(--shadow-md);
+}
+
+.user-info {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+}
+
+.avatar {
+    width: 48px;
+    height: 48px;
+    border-radius: var(--radius-full);
+    background: rgba(255, 255, 255, 0.2);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 24px;
+    border: 2px solid rgba(255, 255, 255, 0.3);
+}
+
+.user-text {
+    display: flex;
+    flex-direction: column;
+}
+
+.greeting {
+    font-weight: 600;
+    font-size: 1rem;
+}
+
+.streak {
+    font-size: 0.85rem;
+    opacity: 0.9;
+}
+
+.icon-btn {
+    background: rgba(255, 255, 255, 0.2);
+    border: none;
+    width: 40px;
+    height: 40px;
+    border-radius: var(--radius-full);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    font-size: 20px;
+    transition: all 0.3s ease;
+    position: relative;
+}
+
+.icon-btn:hover {
+    background: rgba(255, 255, 255, 0.3);
+    transform: scale(1.05);
+}
+
+.notification-badge {
+    position: absolute;
+    top: -2px;
+    right: -2px;
+    background: #FF3B30;
+    color: white;
+    border-radius: var(--radius-full);
+    width: 18px;
+    height: 18px;
+    font-size: 0.65rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-weight: 700;
+    border: 2px solid var(--white);
+}
+
+.user-info:hover {
+    opacity: 0.9;
+}
+
+/* Main View */
+.main-view {
+    padding: var(--spacing-lg);
+}
+
+.view {
+    display: none;
+    animation: slideIn 0.3s ease;
+}
+
+.view.active {
+    display: block;
+}
+
+@keyframes slideIn {
+    from {
+        opacity: 0;
+        transform: translateX(20px);
+    }
+    to {
+        opacity: 1;
+        transform: translateX(0);
+    }
+}
+
+/* Hero Section */
+.hero-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.page-title {
+    font-family: 'Playfair Display', serif;
+    font-size: 2rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-lg);
+}
+
+.daily-progress {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-md);
+}
+
+.progress-circle {
+    position: relative;
+    width: 120px;
+    height: 120px;
+    margin: 0 auto var(--spacing-lg);
+}
+
+.progress-circle svg {
+    width: 100%;
+    height: 100%;
+    transform: rotate(-90deg);
+}
+
+.progress-bg {
+    fill: none;
+    stroke: var(--border);
+    stroke-width: 8;
+}
+
+.progress-fill {
+    fill: none;
+    stroke: url(#progressGradient);
+    stroke-width: 8;
+    stroke-linecap: round;
+    stroke-dasharray: 339.292;
+    stroke-dashoffset: calc(339.292 - (339.292 * var(--progress)) / 100);
+    transition: stroke-dashoffset 0.5s ease;
+}
+
+.progress-text {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    text-align: center;
+}
+
+.progress-value {
+    display: block;
+    font-size: 2rem;
+    font-weight: 700;
+    background: var(--gradient-primary);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+}
+
+.progress-label {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+}
+
+.today-stats {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: var(--spacing-md);
+}
+
+.stat {
+    text-align: center;
+    padding: var(--spacing-md);
+    background: var(--gradient-soft);
+    border-radius: var(--radius-md);
+}
+
+.stat-icon {
+    font-size: 24px;
+    display: block;
+    margin-bottom: var(--spacing-xs);
+}
+
+.stat-value {
+    font-size: 1.25rem;
+    font-weight: 700;
+    color: var(--primary);
+}
+
+.stat-label {
+    font-size: 0.75rem;
+    color: var(--text-secondary);
+}
+
+/* Quick Actions */
+.quick-actions {
+    margin-bottom: var(--spacing-xl);
+}
+
+.section-title {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+    color: var(--text-primary);
+}
+
+.action-cards {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+}
+
+.action-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    text-align: center;
+    box-shadow: var(--shadow-sm);
+    cursor: pointer;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    border: 2px solid transparent;
+    /* Performance: Optimize transforms */
+    will-change: transform;
+    /* Performance: Create stacking context */
+    transform: translateZ(0);
+}
+
+.action-card:hover {
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-lg);
+    border-color: var(--primary);
+}
+
+.action-card:active {
+    transform: translateY(-2px);
+}
+
+.action-icon {
+    font-size: 48px;
+    margin-bottom: var(--spacing-sm);
+    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
+}
+
+.action-card h4 {
+    font-size: 1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.action-card p {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+}
+
+/* Motivation Card */
+.motivation-card {
+    background: var(--gradient-hero);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    text-align: center;
+    box-shadow: var(--shadow-md);
+    margin-bottom: var(--spacing-lg);
+}
+
+.motivation-icon {
+    font-size: 32px;
+    margin-bottom: var(--spacing-sm);
+}
+
+.motivation-text {
+    color: var(--white);
+    font-size: 1rem;
+    line-height: 1.6;
+    font-weight: 500;
+}
+
+/* Category Grid */
+.category-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+}
+
+.category-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    text-align: center;
+    box-shadow: var(--shadow-sm);
+    cursor: pointer;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    overflow: hidden;
+    /* Performance: Optimize hover animations */
+    will-change: transform;
+    transform: translateZ(0);
+    /* Performance: Contain layout */
+    contain: layout style;
+}
+
+.category-card::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 4px;
+    background: var(--gradient-primary);
+    transform: scaleX(0);
+    transition: transform 0.3s ease;
+}
+
+.category-card:hover::before {
+    transform: scaleX(1);
+}
+
+.category-card:hover {
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-lg);
+}
+
+.category-image {
+    font-size: 48px;
+    margin-bottom: var(--spacing-sm);
+}
+
+.category-card h3 {
+    font-size: 1.1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.category-card p {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-sm);
+}
+
+.category-badge {
+    display: inline-block;
+    background: var(--gradient-soft);
+    color: var(--primary);
+    padding: 4px 12px;
+    border-radius: var(--radius-full);
+    font-size: 0.75rem;
+    font-weight: 500;
+}
+
+/* View Header */
+.view-header {
+    margin-bottom: var(--spacing-lg);
+}
+
+.btn-back {
+    background: var(--white);
+    border: none;
+    padding: var(--spacing-sm) var(--spacing-md);
+    border-radius: var(--radius-full);
+    font-weight: 500;
+    color: var(--text-primary);
+    cursor: pointer;
+    box-shadow: var(--shadow-sm);
+    margin-bottom: var(--spacing-md);
+    transition: all 0.3s ease;
+}
+
+.btn-back:hover {
+    box-shadow: var(--shadow-md);
+    transform: translateX(-2px);
+}
+
+.view-title {
+    font-family: 'Playfair Display', serif;
+    font-size: 1.75rem;
+    font-weight: 700;
+    color: var(--text-primary);
+}
+
+/* Exercise Card */
+.exercises-container {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-md);
+}
+
+.exercise-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-sm);
+    cursor: pointer;
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+}
+
+.exercise-card:hover {
+    box-shadow: var(--shadow-md);
+    transform: translateX(4px);
+}
+
+.section-header {
+    margin: var(--spacing-xl) 0 var(--spacing-md) 0;
+    padding: var(--spacing-sm) var(--spacing-md);
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    border-radius: var(--radius-md);
+    box-shadow: var(--shadow-sm);
+}
+
+.section-header:first-child {
+    margin-top: 0;
+}
+
+.section-header h3 {
+    color: var(--white);
+    font-size: 1.1rem;
+    font-weight: 600;
+    margin: 0;
+    text-align: center;
+}
+
+.exercise-emoji {
+    font-size: 40px;
+    flex-shrink: 0;
+}
+
+.exercise-info {
+    flex: 1;
+}
+
+.exercise-name {
+    font-size: 1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.exercise-details {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+}
+
+.exercise-arrow {
+    font-size: 20px;
+    color: var(--primary);
+}
+
+/* Workout Session */
+.workout-header {
+    background: var(--gradient-hero);
+    padding: var(--spacing-lg);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: var(--white);
+}
+
+.btn-close-workout {
+    background: rgba(255, 255, 255, 0.2);
+    border: none;
+    width: 40px;
+    height: 40px;
+    border-radius: var(--radius-full);
+    color: var(--white);
+    font-size: 24px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.3s ease;
+}
+
+.btn-close-workout:hover {
+    background: rgba(255, 255, 255, 0.3);
+}
+
+.workout-timer {
+    font-size: 1.5rem;
+    font-weight: 700;
+    font-family: 'Courier New', monospace;
+}
+
+.workout-content {
+    padding: var(--spacing-xl) var(--spacing-lg);
+}
+
+.exercise-display {
+    text-align: center;
+}
+
+.exercise-name {
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-sm);
+}
+
+.exercise-count {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-lg);
+}
+
+.exercise-demo {
+    margin: var(--spacing-xl) 0;
+}
+
+.demo-placeholder {
+    width: 95%;
+    max-width: 700px;
+    margin: 0 auto;
+    background: transparent;
+    border-radius: 16px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    position: relative;
+}
+
+.demo-icon {
+    font-size: 80px;
+}
+
+.demo-video {
+    width: 100%;
+    height: auto;
+    max-height: 75vh;
+    object-fit: contain;
+    border-radius: 16px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    display: block;
+}
+
+.exercise-instructions {
+    margin-bottom: var(--spacing-lg);
+}
+
+.reps-info {
+    font-size: 1.1rem;
+    font-weight: 600;
+    color: var(--primary);
+    margin-bottom: var(--spacing-sm);
+}
+
+.rest-info {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+}
+
+.series-tracker {
+    display: flex;
+    justify-content: center;
+    gap: var(--spacing-sm);
+    margin-bottom: var(--spacing-xl);
+}
+
+.series-dot {
+    width: 12px;
+    height: 12px;
+    border-radius: var(--radius-full);
+    background: var(--border);
+    transition: all 0.3s ease;
+}
+
+.series-dot.completed {
+    background: var(--primary);
+    transform: scale(1.2);
+}
+
+.workout-controls {
+    display: flex;
+    gap: var(--spacing-md);
+}
+
+.btn-workout-action {
+    flex: 1;
+    padding: 16px;
+    border: none;
+    border-radius: var(--radius-full);
+    font-size: 1rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+}
+
+.btn-workout-action.primary {
+    background: var(--gradient-primary);
+    color: var(--white);
+    box-shadow: var(--shadow-md);
+}
+
+.btn-workout-action.primary:hover {
+    box-shadow: var(--shadow-lg);
+    transform: translateY(-2px);
+}
+
+.btn-workout-action.secondary {
+    background: var(--white);
+    color: var(--text-primary);
+    box-shadow: var(--shadow-sm);
+}
+
+.workout-progress-bar {
+    position: fixed;
+    bottom: 80px;
+    left: 0;
+    right: 0;
+    height: 4px;
+    background: var(--border);
+    max-width: 480px;
+    margin: 0 auto;
+}
+
+.progress-bar-fill {
+    height: 100%;
+    background: var(--gradient-primary);
+    transition: width 0.3s ease;
+}
+
+/* Wellness Grid */
+.wellness-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+}
+
+.wellness-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    text-align: center;
+    box-shadow: var(--shadow-sm);
+    cursor: pointer;
+    transition: all 0.3s ease;
+}
+
+.wellness-card:hover {
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-lg);
+}
+
+.wellness-icon {
+    font-size: 48px;
+    margin-bottom: var(--spacing-sm);
+}
+
+.wellness-card h3 {
+    font-size: 1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.wellness-card p {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-sm);
+}
+
+.duration {
+    display: inline-block;
+    background: var(--gradient-soft);
+    color: var(--primary);
+    padding: 4px 12px;
+    border-radius: var(--radius-full);
+    font-size: 0.75rem;
+    font-weight: 500;
+}
+
+/* Nutrition */
+.nutrition-summary {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-md);
+    margin-bottom: var(--spacing-lg);
+}
+
+.nutrition-summary h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-lg);
+    text-align: center;
+}
+
+.macros-display {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-lg);
+}
+
+.macro-item {
+    text-align: center;
+}
+
+.macro-circle {
+    width: 80px;
+    height: 80px;
+    border-radius: var(--radius-full);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto var(--spacing-sm);
+    font-weight: 700;
+    color: var(--white);
+}
+
+.macro-circle.carbs {
+    background: linear-gradient(135deg, #FFB74D 0%, #FF9800 100%);
+}
+
+.macro-circle.protein {
+    background: linear-gradient(135deg, #4CAF50 0%, #388E3C 100%);
+}
+
+.macro-circle.fat {
+    background: linear-gradient(135deg, #9C27B0 0%, #7B1FA2 100%);
+}
+
+.macro-label {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+}
+
+.calories-total {
+    text-align: center;
+    padding: var(--spacing-md);
+    background: var(--gradient-soft);
+    border-radius: var(--radius-md);
+}
+
+.calories-value {
+    display: block;
+    font-size: 2rem;
+    font-weight: 700;
+    background: var(--gradient-primary);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+}
+
+.calories-label {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+}
+
+/* Water Tracker */
+.water-tracker {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-md);
+}
+
+.water-tracker h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+    text-align: center;
+}
+
+.water-glasses {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    gap: var(--spacing-sm);
+    margin-bottom: var(--spacing-md);
+}
+
+.glass {
+    aspect-ratio: 1;
+    background: var(--border);
+    border-radius: var(--radius-md);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 28px;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    opacity: 0.3;
+}
+
+.glass.filled {
+    background: linear-gradient(135deg, #64B5F6 0%, #2196F3 100%);
+    opacity: 1;
+    transform: scale(1.05);
+}
+
+.water-goal {
+    text-align: center;
+    color: var(--text-secondary);
+    font-size: 0.9rem;
+}
+
+/* Progress & Achievements */
+.achievements-section,
+.stats-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.achievements-section h3,
+.stats-section h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+}
+
+/* Plan Summary Section */
+.plan-summary {
+    margin: var(--spacing-xl) 0;
+}
+
+.plan-card {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    color: var(--white);
+    box-shadow: var(--shadow-lg);
+}
+
+.plan-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: var(--spacing-md);
+}
+
+.plan-header h3 {
+    font-size: 1.3rem;
+    font-weight: 700;
+}
+
+.btn-view-plan {
+    background: rgba(255, 255, 255, 0.2);
+    color: var(--white);
+    padding: 8px 16px;
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    border-radius: var(--radius-full);
+    font-size: 0.9rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+}
+
+.btn-view-plan:hover {
+    background: rgba(255, 255, 255, 0.3);
+    transform: scale(1.05);
+}
+
+.plan-quick-stats {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-md);
+}
+
+.plan-stat {
+    text-align: center;
+}
+
+.plan-label {
+    display: block;
+    font-size: 0.85rem;
+    opacity: 0.9;
+    margin-bottom: 4px;
+}
+
+.plan-value {
+    display: block;
+    font-size: 1.1rem;
+    font-weight: 700;
+}
+
+.coach-message {
+    background: rgba(255, 255, 255, 0.15);
+    padding: var(--spacing-md);
+    border-radius: var(--radius-md);
+    text-align: center;
+    font-size: 0.95rem;
+    border-left: 4px solid rgba(255, 255, 255, 0.5);
+}
+
+/* Plan Modal */
+.plan-modal-content {
+    max-width: 600px;
+    max-height: 85vh;
+    overflow-y: auto;
+    width: 95%;
+    margin: auto;
+}
+
+.profile-info {
+    background: var(--bg-light);
+    padding: var(--spacing-lg);
+    border-radius: var(--radius-md);
+    margin-bottom: var(--spacing-lg);
+}
+
+.profile-photo-container {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-md);
+}
+
+.profile-photo-large {
+    width: 80px;
+    height: 80px;
+    border-radius: var(--radius-full);
+    object-fit: cover;
+}
+
+.profile-basic-info {
+    flex: 1;
+}
+
+.profile-name {
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: 4px;
+}
+
+.profile-metrics {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-sm);
+    margin-top: var(--spacing-md);
+}
+
+.metric-item {
+    display: flex;
+    justify-content: space-between;
+    padding: 8px;
+    background: var(--white);
+    border-radius: var(--radius-sm);
+}
+
+.metric-label {
+    color: var(--text-secondary);
+    font-size: 0.9rem;
+}
+
+.metric-value {
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+.plan-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.plan-section h3 {
+    font-size: 1.2rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-md);
+    padding-bottom: var(--spacing-sm);
+    border-bottom: 2px solid var(--border);
+}
+
+.nutrition-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-md);
+}
+
+.nutrition-item {
+    background: var(--bg-light);
+    padding: var(--spacing-md);
+    border-radius: var(--radius-md);
+    text-align: center;
+}
+
+.nutrition-label {
+    display: block;
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+    margin-bottom: 4px;
+}
+
+.nutrition-value {
+    display: block;
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: var(--primary);
+}
+
+.nutrition-unit {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+    margin-left: 4px;
+}
+
+.meal-plan {
+    background: var(--bg-light);
+    padding: var(--spacing-md);
+    border-radius: var(--radius-md);
+}
+
+.meal-item {
+    padding: var(--spacing-sm) 0;
+    border-bottom: 1px solid var(--border);
+}
+
+.meal-item:last-child {
+    border-bottom: none;
+}
+
+.meal-name {
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: 4px;
+}
+
+.meal-description {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+}
+
+.workout-info, .timeline-info {
+    background: var(--bg-light);
+    padding: var(--spacing-md);
+    border-radius: var(--radius-md);
+}
+
+.info-row {
+    display: flex;
+    justify-content: space-between;
+    padding: var(--spacing-sm) 0;
+    border-bottom: 1px solid var(--border);
+}
+
+.info-row:last-child {
+    border-bottom: none;
+}
+
+.info-label {
+    color: var(--text-secondary);
+}
+
+.info-value {
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+.milestones {
+    display: grid;
+    gap: var(--spacing-sm);
+    margin-top: var(--spacing-md);
+}
+
+.milestone-item {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+    padding: var(--spacing-sm);
+    background: var(--bg-light);
+    border-radius: var(--radius-md);
+}
+
+.milestone-check {
+    width: 30px;
+    height: 30px;
+    border-radius: var(--radius-full);
+    background: var(--success);
+    color: var(--white);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 1.2rem;
+}
+
+.tips-list {
+    display: grid;
+    gap: var(--spacing-sm);
+}
+
+.tip-item {
+    background: var(--bg-light);
+    padding: var(--spacing-md);
+    border-radius: var(--radius-md);
+    border-left: 4px solid var(--primary);
+}
+
+.btn-edit-profile {
+    width: 100%;
+    padding: 16px;
+    background: var(--gradient-primary);
+    color: var(--white);
+    border: none;
+    border-radius: var(--radius-full);
+    font-size: 1.1rem;
+    font-weight: 600;
+    cursor: pointer;
+    box-shadow: var(--shadow-md);
+    transition: all 0.3s ease;
+    margin-top: var(--spacing-lg);
+}
+
+.btn-edit-profile:hover {
+    box-shadow: var(--shadow-lg);
+    transform: translateY(-2px);
+}
+
+.achievements-grid {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: var(--spacing-md);
+}
+
+.achievement-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-md);
+    text-align: center;
+    box-shadow: var(--shadow-sm);
+}
+
+.achievement-card {
+    transition: all 0.3s ease;
+}
+
+.achievement-card.locked {
+    opacity: 0.4;
+    filter: grayscale(1);
+}
+
+.achievement-card:not(.locked):hover {
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-md);
+}
+
+.achievement-icon {
+    font-size: 40px;
+    margin-bottom: var(--spacing-xs);
+    display: block;
+}
+
+.achievement-name {
+    font-size: 0.75rem;
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+@media (max-width: 480px) {
+    .demo-placeholder {
+        width: 98%;
+        max-width: 100%;
+    }
+    
+    .demo-video {
+        width: 100%;
+        height: auto;
+        max-height: 65vh;
+        border-radius: 12px;
+    }
+    
+    .achievements-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-sm);
+    }
+    
+    .form-row {
+        grid-template-columns: 1fr;
+    }
+    
+    .plan-quick-stats {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-sm);
+    }
+    
+    .profile-metrics {
+        grid-template-columns: 1fr;
+    }
+    
+    .nutrition-grid {
+        grid-template-columns: 1fr;
+    }
+    
+    .achievement-card {
+        padding: var(--spacing-sm);
+    }
+    
+    .achievement-icon {
+        font-size: 32px;
+    }
+    
+    .achievement-name {
+        font-size: 0.7rem;
+    }
+}
+
+.stats-cards {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+}
+
+.stat-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    text-align: center;
+    box-shadow: var(--shadow-sm);
+}
+
+.stat-card .stat-icon {
+    font-size: 32px;
+    margin-bottom: var(--spacing-sm);
+}
+
+.stat-number {
+    font-size: 1.75rem;
+    font-weight: 700;
+    background: var(--gradient-primary);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+}
+
+.stat-label {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+}
+
+/* Bottom Navigation */
+.bottom-nav {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    max-width: 480px;
+    margin: 0 auto;
+    background: var(--white);
+    box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.1);
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    padding: var(--spacing-sm) 0;
+    z-index: 100;
+}
+
+.nav-item {
+    background: none;
+    border: none;
+    padding: var(--spacing-sm);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 4px;
+    cursor: pointer;
+    color: var(--text-secondary);
+    transition: all 0.3s ease;
+}
+
+.nav-item.active {
+    color: var(--primary);
+}
+
+.nav-icon {
+    font-size: 24px;
+    transition: transform 0.3s ease;
+}
+
+.nav-item.active .nav-icon {
+    transform: scale(1.1);
+}
+
+.nav-label {
+    font-size: 0.7rem;
+    font-weight: 500;
+}
+
+/* Modal */
+.modal {
+    display: none;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.5);
+    backdrop-filter: blur(4px);
+    z-index: 1000;
+    align-items: center;
+    justify-content: center;
+    animation: fadeIn 0.3s ease;
+}
+
+.modal.active {
+    display: flex;
+}
+
+.modal-content {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-xl);
+    max-width: 90%;
+    max-height: 90vh;
+    width: 360px;
+    overflow-y: auto;
+    box-shadow: var(--shadow-xl);
+    text-align: center;
+    animation: scaleIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.plan-modal-content {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-xl);
+    max-width: 90%;
+    max-height: 90vh;
+    width: 500px;
+    overflow-y: auto;
+    box-shadow: var(--shadow-xl);
+    text-align: left;
+    animation: scaleIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+}
+
+@keyframes scaleIn {
+    from {
+        opacity: 0;
+        transform: scale(0.9);
+    }
+    to {
+        opacity: 1;
+        transform: scale(1);
+    }
+}
+
+.celebration-confetti {
+    font-size: 64px;
+    margin-bottom: var(--spacing-md);
+    animation: bounce 0.6s ease;
+}
+
+@keyframes bounce {
+    0%, 100% { transform: translateY(0); }
+    50% { transform: translateY(-20px); }
+}
+
+.modal-title {
+    font-size: 1.75rem;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-md);
+}
+
+.modal-message {
+    font-size: 1rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-lg);
+}
+
+.workout-summary {
+    display: flex;
+    justify-content: center;
+    gap: var(--spacing-lg);
+    margin-bottom: var(--spacing-lg);
+}
+
+.summary-stat {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-sm);
+}
+
+.summary-icon {
+    font-size: 24px;
+}
+
+.summary-value {
+    font-weight: 600;
+    color: var(--primary);
+}
+
+.btn-modal-primary {
+    background: var(--gradient-primary);
+    color: var(--white);
+    border: none;
+    padding: 16px 48px;
+    border-radius: var(--radius-full);
+    font-size: 1rem;
+    font-weight: 600;
+    cursor: pointer;
+    box-shadow: var(--shadow-md);
+    transition: all 0.3s ease;
+}
+
+.btn-modal-primary:hover {
+    box-shadow: var(--shadow-lg);
+    transform: translateY(-2px);
+}
+
+/* Weight Tracking */
+.weight-tracking-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+/* Weekly Activity */
+.weekly-activity-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.weekly-activity-grid {
+    display: grid;
+    grid-template-columns: repeat(7, 1fr);
+    gap: var(--spacing-xs);
+    padding: var(--spacing-md);
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    box-shadow: var(--shadow-sm);
+}
+
+.weekly-day {
+    text-align: center;
+    padding: var(--spacing-sm);
+    border-radius: var(--radius-md);
+    background: var(--bg-light);
+    transition: all 0.3s ease;
+}
+
+.weekly-day.active {
+    background: linear-gradient(135deg, #4CAF50 0%, #45a049 100%);
+    color: var(--white);
+    box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
+}
+
+.weekly-day.today {
+    border: 2px solid var(--primary);
+}
+
+.weekly-day-name {
+    font-size: 0.7rem;
+    font-weight: 600;
+    text-transform: uppercase;
+    margin-bottom: 4px;
+    opacity: 0.7;
+}
+
+.weekly-day-number {
+    font-size: 1.1rem;
+    font-weight: 700;
+    margin-bottom: 4px;
+}
+
+.weekly-day-workouts {
+    font-size: 0.65rem;
+    opacity: 0.8;
+}
+
+/* Exercício Completado nas últimas 24h */
+.exercise-card.completed-24h {
+    background: linear-gradient(135deg, #E8F5E9 0%, #C8E6C9 100%);
+    border-left: 4px solid #4CAF50;
+    position: relative;
+}
+
+.exercise-card.completed-24h::after {
+    content: '✓';
+    position: absolute;
+    top: 8px;
+    right: 8px;
+    width: 24px;
+    height: 24px;
+    background: #4CAF50;
+    color: white;
+    border-radius: var(--radius-full);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-weight: 700;
+    font-size: 14px;
+    box-shadow: 0 2px 8px rgba(76, 175, 80, 0.3);
+}
+
+.weight-tracking-section h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+}
+
+.weight-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-md);
+}
+
+.weight-current {
+    text-align: center;
+    margin-bottom: var(--spacing-lg);
+}
+
+.weight-label {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.weight-value {
+    font-size: 3rem;
+    font-weight: 700;
+    background: var(--gradient-primary);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    margin-bottom: var(--spacing-md);
+}
+
+.btn-update-weight {
+    background: var(--gradient-primary);
+    color: var(--white);
+    border: none;
+    padding: 12px 32px;
+    border-radius: var(--radius-full);
+    font-weight: 600;
+    cursor: pointer;
+    box-shadow: var(--shadow-sm);
+    transition: all 0.3s ease;
+}
+
+.btn-update-weight:hover {
+    box-shadow: var(--shadow-md);
+    transform: translateY(-2px);
+}
+
+.weight-stats {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: var(--spacing-md);
+    margin-bottom: var(--spacing-lg);
+}
+
+.weight-stat {
+    text-align: center;
+    padding: var(--spacing-md);
+    background: var(--bg-light);
+    border-radius: var(--radius-md);
+}
+
+.weight-stat.success {
+    background: linear-gradient(135deg, #E8F5E9 0%, #C8E6C9 100%);
+}
+
+.weight-stat-label {
+    font-size: 0.75rem;
+    color: var(--text-secondary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.weight-stat-value {
+    font-size: 1.1rem;
+    font-weight: 700;
+    color: var(--text-primary);
+}
+
+.weight-progress-bar {
+    width: 100%;
+    height: 8px;
+    background: var(--border);
+    border-radius: var(--radius-full);
+    overflow: hidden;
+    margin-bottom: var(--spacing-lg);
+}
+
+.weight-progress-fill {
+    height: 100%;
+    background: var(--gradient-primary);
+    transition: width 0.5s ease;
+}
+
+.weight-chart-mini {
+    height: 100px;
+    display: flex;
+    align-items: flex-end;
+    gap: 4px;
+    padding: var(--spacing-md) 0;
+}
+
+.weight-chart-bar {
+    flex: 1;
+    background: var(--gradient-primary);
+    border-radius: 4px 4px 0 0;
+    min-height: 20px;
+    transition: height 0.3s ease;
+}
+
+/* Detailed Statistics */
+.detailed-stats-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.detailed-stats-section h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+}
+
+.stats-grid {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-md);
+}
+
+.stat-detail-card {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-sm);
+    display: flex;
+    gap: var(--spacing-md);
+}
+
+.stat-detail-icon {
+    font-size: 36px;
+    flex-shrink: 0;
+}
+
+.stat-detail-content {
+    flex: 1;
+}
+
+.stat-detail-number {
+    font-size: 1.75rem;
+    font-weight: 700;
+    background: var(--gradient-primary);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    line-height: 1;
+    margin-bottom: var(--spacing-xs);
+}
+
+.stat-detail-label {
+    font-size: 0.85rem;
+    color: var(--text-primary);
+    font-weight: 500;
+    margin-bottom: 4px;
+}
+
+.stat-detail-sublabel {
+    font-size: 0.75rem;
+    color: var(--text-secondary);
+}
+
+/* Weekly Activity Chart */
+.activity-chart-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.activity-chart-section h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+}
+
+.weekly-chart {
+    background: var(--white);
+    border-radius: var(--radius-lg);
+    padding: var(--spacing-lg);
+    box-shadow: var(--shadow-sm);
+}
+
+.chart-bars {
+    display: flex;
+    align-items: flex-end;
+    justify-content: space-around;
+    gap: var(--spacing-sm);
+    height: 150px;
+}
+
+.chart-day {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--spacing-xs);
+}
+
+.chart-bar {
+    width: 100%;
+    background: var(--gradient-primary);
+    border-radius: 4px 4px 0 0;
+    min-height: 4px;
+    transition: height 0.3s ease;
+}
+
+.chart-label {
+    font-size: 0.7rem;
+    color: var(--text-secondary);
+    font-weight: 500;
+}
+
+/* Records Section */
+.records-section {
+    margin-bottom: var(--spacing-xl);
+}
+
+.records-section h3 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin-bottom: var(--spacing-md);
+}
+
+.records-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-sm);
+}
+
+.record-item {
+    background: var(--white);
+    border-radius: var(--radius-md);
+    padding: var(--spacing-md);
+    box-shadow: var(--shadow-sm);
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-md);
+}
+
+.record-icon {
+    font-size: 28px;
+}
+
+.record-content {
+    flex: 1;
+}
+
+.record-label {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+    margin-bottom: 2px;
+}
+
+.record-value {
+    font-size: 1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+/* Weight Modal */
+.weight-input-group {
+    margin-bottom: var(--spacing-md);
+}
+
+.weight-input-group label {
+    display: block;
+    font-size: 0.9rem;
+    font-weight: 500;
+    color: var(--text-primary);
+    margin-bottom: var(--spacing-xs);
+}
+
+.weight-input-group input {
+    width: 100%;
+    padding: 12px 16px;
+    border: 2px solid var(--border);
+    border-radius: var(--radius-md);
+    font-size: 1rem;
+    font-family: inherit;
+    transition: all 0.3s ease;
+}
+
+.weight-input-group input:focus {
+    outline: none;
+    border-color: var(--primary);
+    box-shadow: 0 0 0 3px rgba(255, 107, 157, 0.1);
+}
+
+.modal-actions {
+    display: flex;
+    gap: var(--spacing-md);
+    margin-top: var(--spacing-lg);
+}
+
+.btn-modal-secondary {
+    flex: 1;
+    background: var(--bg-light);
+    color: var(--text-primary);
+    border: 2px solid var(--border);
+    padding: 12px 24px;
+    border-radius: var(--radius-full);
+    font-size: 1rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+}
+
+.btn-modal-secondary:hover {
+    background: var(--border);
+}
+
+.btn-modal-primary {
+    flex: 1;
+    background: var(--gradient-primary);
+    color: var(--white);
+    border: none;
+    padding: 12px 24px;
+    border-radius: var(--radius-full);
+    font-size: 1rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    box-shadow: 0 4px 12px rgba(255, 107, 157, 0.3);
+}
+
+.btn-modal-primary:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 16px rgba(255, 107, 157, 0.4);
+}
+
+.btn-modal-primary:active {
+    transform: translateY(0);
+}
+
+/* Settings FAB */
+.settings-fab {
+    position: fixed;
+    bottom: 100px;
+    right: 20px;
+    z-index: 99;
+    max-width: 480px;
+    margin: 0 auto;
+}
+
+.fab-settings {
+    width: 56px;
+    height: 56px;
+    border-radius: var(--radius-full);
+    background: var(--gradient-primary);
+    border: none;
+    box-shadow: var(--shadow-lg);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.fab-settings:hover {
+    transform: scale(1.1);
+    box-shadow: var(--shadow-xl);
+}
+
+.fab-settings:active {
+    transform: scale(0.95);
+}
+
+.fab-icon {
+    font-size: 24px;
+}
+
+/* Video Lazy Loading Styles */
+.video-loading {
+    position: relative;
+}
+
+.video-loader {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 10;
+}
+
+.spinner {
+    width: 40px;
+    height: 40px;
+    border: 4px solid rgba(255, 255, 255, 0.3);
+    border-top-color: var(--primary);
+    border-radius: var(--radius-full);
+    animation: spin 0.8s linear infinite;
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
+
+.video-error {
+    opacity: 0.5;
+}
+
+.video-error::after {
+    content: '⚠️ Error loading video';
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    color: var(--white);
+    background: rgba(0, 0, 0, 0.7);
+    padding: var(--spacing-sm) var(--spacing-md);
+    border-radius: var(--radius-md);
+    font-size: 0.85rem;
+    z-index: 10;
+}
+
+/* Animations */
+@keyframes fadeIn {
+    from { opacity: 0; }
+    to { opacity: 1; }
+}
+
+@keyframes pulse {
+    0%, 100% { transform: scale(1); }
+    50% { transform: scale(1.05); }
+}
+
+.pulse {
+    animation: pulse 1s ease infinite;
+}
+
+@keyframes slideDown {
+    from {
+        opacity: 0;
+        transform: translate(-50%, -20px);
+    }
+    to {
+        opacity: 1;
+        transform: translate(-50%, 0);
+    }
+}
+
+@keyframes slideUp {
+    from {
+        opacity: 1;
+        transform: translate(-50%, 0);
+    }
+    to {
+        opacity: 0;
+        transform: translate(-50%, -20px);
+    }
+}
+
+/* Responsive - Mobile First */
+@media (max-width: 768px) {
+    /* Ajustar padding geral */
+    .view {
+        padding: var(--spacing-sm);
+    }
+    
+    .main-view {
+        padding: var(--spacing-sm);
+    }
+    
+    /* Header */
+    .top-bar {
+        padding: var(--spacing-sm) var(--spacing-md);
+    }
+    
+    .user-text .greeting {
+        font-size: 0.9rem;
+    }
+    
+    .user-text .streak {
+        font-size: 0.75rem;
+    }
+    
+    /* Fix overflow issues */
+    body {
+        overflow-x: hidden;
+    }
+    
+    .app-container {
+        overflow-x: hidden;
+        max-width: 100vw;
+    }
+    
+    /* Grid de categorias e cards */
+    .category-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-sm);
+    }
+    
+    .action-cards {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-sm);
+    }
+    
+    .wellness-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-sm);
+    }
+    
+    /* Estatísticas */
+    .stats-grid {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-sm);
+    }
+    
+    .today-stats {
+        flex-direction: column;
+        gap: var(--spacing-sm);
+    }
+    
+    /* Cards */
+    .category-card,
+    .action-card {
+        padding: var(--spacing-md);
+    }
+    
+    .category-image,
+    .action-icon {
+        font-size: 2rem;
+    }
+    
+    /* Tipografia */
+    .page-title {
+        font-size: 1.5rem;
+    }
+    
+    .section-title {
+        font-size: 1.1rem;
+    }
+    
+    /* Modais */
+    .modal-content {
+        width: 95%;
+        max-width: none;
+        margin: var(--spacing-md);
+    }
+    
+    /* Peso */
+    .weight-stats {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-sm);
+    }
+    
+    /* Workout Session */
+    .workout-header {
+        padding: var(--spacing-md);
+    }
+    
+    .demo-area {
+        padding: var(--spacing-lg);
+    }
+    
+    .demo-icon {
+        font-size: 4rem;
+    }
+    
+    /* Botões */
+    .btn-back,
+    .btn-primary,
+    .btn-secondary {
+        padding: 12px 20px;
+        font-size: 0.9rem;
+    }
+    
+    /* Bottom Nav */
+    .bottom-nav {
+        padding: var(--spacing-sm) 0;
+    }
+    
+    .nav-item {
+        min-width: 60px;
+    }
+    
+    .nav-icon {
+        font-size: 22px;
+    }
+    
+    .nav-label {
+        font-size: 0.7rem;
+    }
+    
+    /* FAB */
+    .settings-fab {
+        bottom: 80px;
+        right: 15px;
+    }
+    
+    .fab-settings {
+        width: 50px;
+        height: 50px;
+    }
+}
+
+/* Fix para telas entre 360px-420px (como S23 FE, Galaxy A, etc) */
+@media (max-width: 420px) {
+    /* Garantir que nada saia da tela */
+    * {
+        max-width: 100%;
+        overflow-wrap: break-word;
+    }
+    
+    /* Modal de perfil */
+    .modal-content {
+        width: 95%;
+        max-width: 95%;
+        padding: var(--spacing-md);
+        max-height: 95vh;
+    }
+    
+    .plan-modal-content {
+        width: 95%;
+        max-width: 95%;
+        padding: var(--spacing-md);
+    }
+    
+    .modal-title {
+        font-size: 1.25rem;
+    }
+    
+    .modal-actions {
+        flex-direction: column;
+        gap: var(--spacing-sm);
+    }
+    
+    .btn-modal-secondary,
+    .btn-modal-primary {
+        width: 100%;
+        padding: 12px 16px;
+        font-size: 0.95rem;
+    }
+    
+    /* Form no modal */
+    .profile-form .form-row {
+        flex-direction: column;
+    }
+    
+    .profile-form .form-group {
+        width: 100%;
+    }
+    
+    .photo-preview {
+        width: 120px;
+        height: 120px;
+    }
+    
+    /* Ajustar cards de ação */
+    .action-cards {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-xs);
+    }
+    
+    .action-card {
+        padding: var(--spacing-sm);
+        min-height: 100px;
+    }
+    
+    .action-icon {
+        font-size: 32px;
+    }
+    
+    .action-card h4 {
+        font-size: 0.85rem;
+    }
+    
+    .action-card p {
+        font-size: 0.75rem;
+    }
+    
+    /* Plano personalizado */
+    .plan-card {
+        padding: var(--spacing-md);
+    }
+    
+    .plan-header {
+        flex-direction: column;
+        gap: var(--spacing-sm);
+        align-items: stretch;
+    }
+    
+    .plan-header h3 {
+        font-size: 1rem;
+        text-align: center;
+    }
+    
+    .btn-view-plan {
+        width: 100%;
+        padding: 10px;
+    }
+    
+    .plan-quick-stats {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-xs);
+    }
+    
+    .plan-stat {
+        padding: var(--spacing-sm);
+    }
+    
+    /* Progress circular */
+    .daily-progress {
+        padding: var(--spacing-md);
+    }
+    
+    .progress-circle {
+        width: 100px;
+        height: 100px;
+    }
+    
+    .progress-value {
+        font-size: 1.5rem;
+    }
+    
+    /* Stats de hoje */
+    .today-stats {
+        gap: var(--spacing-xs);
+    }
+    
+    .stat {
+        padding: var(--spacing-sm);
+    }
+    
+    .stat-value {
+        font-size: 1rem;
+    }
+    
+    /* Top bar */
+    .top-bar {
+        padding: var(--spacing-sm);
+    }
+    
+    .avatar {
+        width: 40px;
+        height: 40px;
+        font-size: 20px;
+    }
+    
+    .greeting {
+        font-size: 0.85rem;
+    }
+    
+    .streak {
+        font-size: 0.7rem;
+    }
+    
+    /* Weekly Activity */
+    .weekly-activity-grid {
+        grid-template-columns: repeat(7, 1fr);
+        gap: 4px;
+        padding: var(--spacing-sm);
+    }
+    
+    .weekly-day {
+        padding: 4px;
+    }
+    
+    .weekly-day-name {
+        font-size: 0.6rem;
+    }
+    
+    .weekly-day-number {
+        font-size: 0.9rem;
+    }
+    
+    .weekly-day-workouts {
+        font-size: 0.55rem;
+    }
+    
+    /* Category grid */
+    .category-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-xs);
+    }
+    
+    .category-card {
+        padding: var(--spacing-sm);
+    }
+    
+    .category-image {
+        font-size: 36px;
+    }
+    
+    /* Wellness grid */
+    .wellness-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: var(--spacing-xs);
+    }
+    
+    /* Bottom nav */
+    .bottom-nav {
+        padding: 6px 0;
+        padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
+    }
+    
+    .nav-item {
+        padding: 4px;
+        min-width: 50px;
+    }
+    
+    .nav-icon {
+        font-size: 20px;
+    }
+    
+    .nav-label {
+        font-size: 0.65rem;
+    }
+}
+
+@media (max-width: 480px) {
+    /* Grids em coluna única para telas muito pequenas */
+    .action-cards,
+    .category-grid,
+    .wellness-grid {
+        grid-template-columns: 1fr;
+    }
+    
+    /* Progresso circular menor */
+    .progress-circle {
+        width: 100px;
+        height: 100px;
+    }
+    
+    .progress-circle svg {
+        width: 100px;
+        height: 100px;
+    }
+    
+    .progress-value {
+        font-size: 1.5rem;
+    }
+    
+    /* Exercícios */
+    .exercise-card {
+        padding: var(--spacing-sm);
+    }
+    
+    /* Water tracking */
+    .water-glasses {
+        gap: var(--spacing-xs);
+        grid-template-columns: repeat(4, 1fr);
+    }
+    
+    .glass {
+        font-size: 1.2rem;
+    }
+    
+    /* Modal adjustments */
+    .modal-content {
+        width: 90%;
+        padding: var(--spacing-lg);
+        margin: var(--spacing-md);
+        max-height: 85vh;
+    }
+    
+    .plan-modal-content {
+        width: 95%;
+        max-width: none;
+        max-height: 85vh;
+    }
+    
+    /* Workout session - video responsivo */
+    .demo-placeholder {
+        width: 95%;
+        max-width: 100%;
+    }
+    
+    .demo-video {
+        max-height: 50vh;
+    }
+    
+    .demo-icon {
+        font-size: 60px;
+    }
+    
+    /* Bottom nav safe area */
+    .bottom-nav {
+        padding-bottom: env(safe-area-inset-bottom, var(--spacing-sm));
+    }
+}
+
+@media (max-width: 360px) {
+    /* Ajustes para telas muito pequenas */
+    .page-title {
+        font-size: 1.3rem;
+    }
+    
+    .hero-section {
+        padding: var(--spacing-md) 0;
+    }
+    
+    .stat-detail-number {
+        font-size: 1.5rem;
+    }
+    
+    .weight-value {
+        font-size: 2.5rem;
+    }
+    
+    /* Botões menores */
+    .btn-primary,
+    .btn-secondary {
+        padding: 10px 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (min-width: 769px) {
+    /* Otimizações para tablet/desktop */
+    .app-container {
+        max-width: 768px;
+        margin: 0 auto;
+    }
+    
+    .category-grid {
+        grid-template-columns: repeat(3, 1fr);
+    }
+    
+    .action-cards {
+        grid-template-columns: repeat(3, 1fr);
+    }
+}
+
+/* SVG Gradient Definitions */
+svg defs {
+    position: absolute;
+    width: 0;
+    height: 0;
+}
+

public/sw-optimized.js

@@ -0,0 +1,392 @@
+/**
+ * Optimized Service Worker
+ * Version: 4.0.0
+ * 
+ * Features:
+ * - Stale-while-revalidate for HTML/CSS/JS
+ * - Cache-first for static assets
+ * - Network-first for API calls
+ * - Intelligent cache expiration
+ * - Background sync support
+ * - Push notifications support
+ */
+
+const VERSION = '4.0.0';
+const CACHE_PREFIX = 'fitness-pwa';
+const CACHES = {
+    static: `${CACHE_PREFIX}-static-v${VERSION}`,
+    dynamic: `${CACHE_PREFIX}-dynamic-v${VERSION}`,
+    images: `${CACHE_PREFIX}-images-v${VERSION}`,
+    videos: `${CACHE_PREFIX}-videos-v${VERSION}`,
+    audio: `${CACHE_PREFIX}-audio-v${VERSION}`,
+};
+
+// Cache size limits (in number of items)
+const CACHE_LIMITS = {
+    dynamic: 50,
+    images: 30,
+    videos: 5,    // Videos are large, keep only 5
+    audio: 10,
+};
+
+// Static assets to cache immediately
+const STATIC_ASSETS = [
+    '/',
+    '/index.html',
+    '/app.js',
+    '/styles.css',
+    '/lazy-video.js',
+    '/manifest.json',
+    '/icons/icon-192x192.svg',
+    '/icons/icon-512x512.svg',
+];
+
+// =======================
+// Installation
+// =======================
+
+self.addEventListener('install', (event) => {
+    console.log('[SW] Installing version', VERSION);
+    
+    event.waitUntil(
+        caches.open(CACHES.static)
+            .then(cache => {
+                console.log('[SW] Caching static assets');
+                return cache.addAll(STATIC_ASSETS);
+            })
+            .then(() => self.skipWaiting())
+            .catch(err => console.error('[SW] Install failed:', err))
+    );
+});
+
+// =======================
+// Activation
+// =======================
+
+self.addEventListener('activate', (event) => {
+    console.log('[SW] Activating version', VERSION);
+    
+    event.waitUntil(
+        caches.keys()
+            .then(cacheNames => {
+                // Delete old caches
+                return Promise.all(
+                    cacheNames
+                        .filter(name => name.startsWith(CACHE_PREFIX) && !Object.values(CACHES).includes(name))
+                        .map(name => {
+                            console.log('[SW] Deleting old cache:', name);
+                            return caches.delete(name);
+                        })
+                );
+            })
+            .then(() => self.clients.claim())
+            .catch(err => console.error('[SW] Activation failed:', err))
+    );
+});
+
+// =======================
+// Fetch Strategies
+// =======================
+
+self.addEventListener('fetch', (event) => {
+    const { request } = event;
+    const url = new URL(request.url);
+    
+    // Skip cross-origin requests (except for known CDNs)
+    if (url.origin !== location.origin && !isTrustedOrigin(url.origin)) {
+        return;
+    }
+    
+    // Route to appropriate strategy
+    if (isVideoRequest(request)) {
+        event.respondWith(handleVideoRequest(request));
+    } else if (isAudioRequest(request)) {
+        event.respondWith(handleAudioRequest(request));
+    } else if (isImageRequest(request)) {
+        event.respondWith(handleImageRequest(request));
+    } else if (isAPIRequest(request)) {
+        event.respondWith(handleAPIRequest(request));
+    } else if (isStaticAsset(request)) {
+        event.respondWith(handleStaticAsset(request));
+    } else {
+        event.respondWith(handleDynamicRequest(request));
+    }
+});
+
+// =======================
+// Request Handlers
+// =======================
+
+// Stale-while-revalidate: Serve from cache, update in background
+async function handleStaticAsset(request) {
+    const cache = await caches.open(CACHES.static);
+    const cachedResponse = await cache.match(request);
+    
+    // Fetch in background and update cache
+    const fetchPromise = fetch(request)
+        .then(response => {
+            if (response && response.status === 200) {
+                cache.put(request, response.clone());
+            }
+            return response;
+        })
+        .catch(err => {
+            console.error('[SW] Fetch failed for static asset:', err);
+            return cachedResponse; // Return stale cache on error
+        });
+    
+    // Return cached response immediately, or wait for network
+    return cachedResponse || fetchPromise;
+}
+
+// Cache-first with network fallback for videos
+async function handleVideoRequest(request) {
+    const cache = await caches.open(CACHES.videos);
+    const cachedResponse = await cache.match(request);
+    
+    if (cachedResponse) {
+        return cachedResponse;
+    }
+    
+    try {
+        const response = await fetch(request);
+        
+        if (response && response.status === 200) {
+            // Cache the video but enforce limits
+            await limitCacheSize(CACHES.videos, CACHE_LIMITS.videos);
+            cache.put(request, response.clone());
+        }
+        
+        return response;
+    } catch (error) {
+        console.error('[SW] Video fetch failed:', error);
+        // Return a fallback or offline page
+        return new Response('Video unavailable offline', { 
+            status: 503,
+            statusText: 'Service Unavailable'
+        });
+    }
+}
+
+// Cache-first with network fallback for audio
+async function handleAudioRequest(request) {
+    const cache = await caches.open(CACHES.audio);
+    const cachedResponse = await cache.match(request);
+    
+    if (cachedResponse) {
+        return cachedResponse;
+    }
+    
+    try {
+        const response = await fetch(request);
+        
+        if (response && response.status === 200) {
+            await limitCacheSize(CACHES.audio, CACHE_LIMITS.audio);
+            cache.put(request, response.clone());
+        }
+        
+        return response;
+    } catch (error) {
+        console.error('[SW] Audio fetch failed:', error);
+        return cachedResponse; // Try cached even if old
+    }
+}
+
+// Cache-first with expiration for images
+async function handleImageRequest(request) {
+    const cache = await caches.open(CACHES.images);
+    const cachedResponse = await cache.match(request);
+    
+    if (cachedResponse) {
+        // Check if cache is still fresh (7 days)
+        const cacheDate = new Date(cachedResponse.headers.get('date'));
+        const now = new Date();
+        const age = (now - cacheDate) / (1000 * 60 * 60 * 24); // Days
+        
+        if (age < 7) {
+            return cachedResponse;
+        }
+    }
+    
+    try {
+        const response = await fetch(request);
+        
+        if (response && response.status === 200) {
+            await limitCacheSize(CACHES.images, CACHE_LIMITS.images);
+            cache.put(request, response.clone());
+        }
+        
+        return response;
+    } catch (error) {
+        return cachedResponse || createFallbackImage();
+    }
+}
+
+// Network-first for API requests
+async function handleAPIRequest(request) {
+    try {
+        const response = await fetch(request);
+        
+        // Cache successful GET requests
+        if (request.method === 'GET' && response && response.status === 200) {
+            const cache = await caches.open(CACHES.dynamic);
+            cache.put(request, response.clone());
+        }
+        
+        return response;
+    } catch (error) {
+        // Fallback to cache for GET requests
+        if (request.method === 'GET') {
+            const cache = await caches.open(CACHES.dynamic);
+            const cachedResponse = await cache.match(request);
+            
+            if (cachedResponse) {
+                return cachedResponse;
+            }
+        }
+        
+        // Return error response
+        return new Response(JSON.stringify({ error: 'Offline' }), {
+            status: 503,
+            headers: { 'Content-Type': 'application/json' }
+        });
+    }
+}
+
+// Stale-while-revalidate for dynamic content
+async function handleDynamicRequest(request) {
+    const cache = await caches.open(CACHES.dynamic);
+    const cachedResponse = await cache.match(request);
+    
+    const fetchPromise = fetch(request)
+        .then(response => {
+            if (response && response.status === 200) {
+                cache.put(request, response.clone());
+            }
+            return response;
+        })
+        .catch(() => cachedResponse);
+    
+    return cachedResponse || fetchPromise;
+}
+
+// =======================
+// Utility Functions
+// =======================
+
+function isVideoRequest(request) {
+    return request.url.includes('/videos/') || 
+           request.url.match(/\.(mp4|webm|ogg)$/i);
+}
+
+function isAudioRequest(request) {
+    return request.url.includes('/songs/') || 
+           request.url.match(/\.(mp3|ogg|wav)$/i);
+}
+
+function isImageRequest(request) {
+    return request.url.match(/\.(jpg|jpeg|png|gif|webp|svg)$/i);
+}
+
+function isAPIRequest(request) {
+    return request.url.includes('/api/');
+}
+
+function isStaticAsset(request) {
+    return request.url.match(/\.(js|css|woff2|woff|ttf|eot)$/i);
+}
+
+function isTrustedOrigin(origin) {
+    const trustedOrigins = [
+        'https://fonts.googleapis.com',
+        'https://fonts.gstatic.com',
+    ];
+    return trustedOrigins.includes(origin);
+}
+
+async function limitCacheSize(cacheName, maxItems) {
+    const cache = await caches.open(cacheName);
+    const keys = await cache.keys();
+    
+    if (keys.length > maxItems) {
+        // Delete oldest entries (FIFO)
+        const deleteCount = keys.length - maxItems;
+        for (let i = 0; i < deleteCount; i++) {
+            await cache.delete(keys[i]);
+        }
+    }
+}
+
+function createFallbackImage() {
+    // Return a small SVG placeholder
+    const svg = `
+        <svg width="400" height="300" xmlns="http://www.w3.org/2000/svg">
+            <rect fill="#f0f0f0" width="400" height="300"/>
+            <text fill="#999" font-family="Arial" font-size="18" x="50%" y="50%" text-anchor="middle">
+                Image unavailable offline
+            </text>
+        </svg>
+    `;
+    
+    return new Response(svg, {
+        headers: { 'Content-Type': 'image/svg+xml' }
+    });
+}
+
+// =======================
+// Background Sync
+// =======================
+
+self.addEventListener('sync', (event) => {
+    console.log('[SW] Background sync triggered:', event.tag);
+    
+    if (event.tag === 'sync-data') {
+        event.waitUntil(syncData());
+    }
+});
+
+async function syncData() {
+    try {
+        // Implement your background sync logic here
+        console.log('[SW] Syncing data...');
+        
+        // Example: Send queued data to server
+        // const response = await fetch('/api/sync', { method: 'POST', body: ... });
+        
+        return Promise.resolve();
+    } catch (error) {
+        console.error('[SW] Sync failed:', error);
+        return Promise.reject(error);
+    }
+}
+
+// =======================
+// Push Notifications
+// =======================
+
+self.addEventListener('push', (event) => {
+    const data = event.data ? event.data.json() : {};
+    
+    const options = {
+        body: data.body || 'New notification',
+        icon: '/icons/icon-192x192.svg',
+        badge: '/icons/icon-72x72.png',
+        vibrate: [200, 100, 200],
+        data: data,
+    };
+    
+    event.waitUntil(
+        self.registration.showNotification(data.title || 'Fitness App', options)
+    );
+});
+
+self.addEventListener('notificationclick', (event) => {
+    event.notification.close();
+    
+    event.waitUntil(
+        clients.openWindow(event.notification.data.url || '/')
+    );
+});
+
+console.log('[SW] Service Worker loaded, version', VERSION);
+

public/sw.js

@@ -0,0 +1,288 @@
+const VERSION = '3.4.0'; // 🎥🎵🔔 HF integration + Notifications + PWA optimizations
+const CACHE_NAME = `fitness-app-${VERSION}`;
+const STATIC_CACHE = `static-${VERSION}`;
+const DYNAMIC_CACHE = `dynamic-${VERSION}`;
+const VIDEO_CACHE = `video-${VERSION}`;
+const HF_VIDEO_CACHE = `hf-video-${VERSION}`; // 🎥 Cache para vídeos do Hugging Face
+const HF_AUDIO_CACHE = `hf-audio-${VERSION}`; // 🎵 Cache para áudios do Hugging Face
+const MAX_VIDEO_CACHE = 5; // Limita cache de vídeos locais
+const MAX_HF_VIDEO_CACHE = 10; // Limita cache de vídeos do Hugging Face (CDN externo)
+const MAX_HF_AUDIO_CACHE = 4; // Limita cache de áudios do HF (4 arquivos de áudio)
+
+// 🔔 Performance: Cache de notificações
+const NOTIFICATION_BADGE = 'notification-badge';
+
+// Files to cache immediately
+const STATIC_ASSETS = [
+    '/',
+    '/index.html',
+    '/app.js',
+    '/styles.css',
+    '/manifest.json',
+    '/icons/icon-192x192.svg',
+    '/icons/icon-512x512.svg'
+];
+
+// Install event - cache static assets
+self.addEventListener('install', (event) => {
+    event.waitUntil(
+        caches.open(STATIC_CACHE)
+            .then(cache => cache.addAll(STATIC_ASSETS))
+            .then(() => self.skipWaiting())
+    );
+});
+
+// Activate event - clean up old caches
+self.addEventListener('activate', (event) => {
+    event.waitUntil(
+        caches.keys().then(keys => {
+            return Promise.all(
+                keys.filter(key => 
+                    key !== STATIC_CACHE && 
+                    key !== DYNAMIC_CACHE && 
+                    key !== VIDEO_CACHE && 
+                    key !== HF_VIDEO_CACHE &&
+                    key !== HF_AUDIO_CACHE
+                ).map(key => caches.delete(key))
+            );
+        }).then(() => self.clients.claim())
+    );
+});
+
+// Fetch event - serve from cache, fallback to network
+self.addEventListener('fetch', (event) => {
+    const { request } = event;
+    const url = new URL(request.url);
+
+    // 🎥 Hugging Face videos - cache first with size limit (optimized for external CDN)
+    if (url.hostname === 'huggingface.co' || url.hostname === 'cdn-lfs.huggingface.co') {
+        event.respondWith(
+            caches.open(HF_VIDEO_CACHE).then(cache => {
+                return cache.match(request).then(cachedResponse => {
+                    if (cachedResponse) {
+                        return cachedResponse;
+                    }
+                    
+                    return fetch(request, {
+                        mode: 'cors',
+                        credentials: 'omit'
+                    }).then(networkResponse => {
+                        // Cache only if successful
+                        if (networkResponse && networkResponse.status === 200) {
+                            cache.put(request, networkResponse.clone());
+                            
+                            // Limit cache size (LRU)
+                            cache.keys().then(keys => {
+                                if (keys.length > MAX_HF_VIDEO_CACHE) {
+                                    cache.delete(keys[0]); // Delete oldest
+                                }
+                            });
+                        }
+                        return networkResponse;
+                    });
+                });
+            }).catch(() => {
+                // Fallback: serve from cache even if outdated
+                return caches.match(request);
+            })
+        );
+        return;
+    }
+
+    // Skip other cross-origin requests
+    if (url.origin !== location.origin) {
+        return;
+    }
+
+    // Local videos - cache first with size limit (LRU strategy)
+    if (request.url.includes('/videos/')) {
+        event.respondWith(
+            caches.open(VIDEO_CACHE).then(cache => {
+                return cache.match(request).then(cachedResponse => {
+                    if (cachedResponse) {
+                        return cachedResponse;
+                    }
+                    
+                    return fetch(request).then(networkResponse => {
+                        // Cache only if successful
+                        if (networkResponse.status === 200) {
+                            cache.put(request, networkResponse.clone());
+                            
+                            // Limit cache size (LRU)
+                            cache.keys().then(keys => {
+                                if (keys.length > MAX_VIDEO_CACHE) {
+                                    cache.delete(keys[0]); // Delete oldest
+                                }
+                            });
+                        }
+                        return networkResponse;
+                    });
+                });
+            }).catch(() => {
+                // Fallback: serve from cache even if outdated
+                return caches.match(request);
+            })
+        );
+        return;
+    }
+
+    // 🎵 Hugging Face audio - cache first (for workout sounds)
+    if ((url.hostname === 'huggingface.co' || url.hostname === 'cdn-lfs.huggingface.co') && 
+        (request.url.includes('.mp3') || request.url.includes('.ogg'))) {
+        event.respondWith(
+            caches.open(HF_AUDIO_CACHE).then(cache => {
+                return cache.match(request).then(cachedResponse => {
+                    if (cachedResponse) {
+                        return cachedResponse;
+                    }
+                    
+                    return fetch(request, {
+                        mode: 'cors',
+                        credentials: 'omit'
+                    }).then(networkResponse => {
+                        // Cache only if successful
+                        if (networkResponse && networkResponse.status === 200) {
+                            cache.put(request, networkResponse.clone());
+                            
+                            // Limit cache size (LRU)
+                            cache.keys().then(keys => {
+                                if (keys.length > MAX_HF_AUDIO_CACHE) {
+                                    cache.delete(keys[0]); // Delete oldest
+                                }
+                            });
+                        }
+                        return networkResponse;
+                    });
+                });
+            }).catch(() => {
+                // Fallback: serve from cache even if outdated
+                return caches.match(request);
+            })
+        );
+        return;
+    }
+
+    // Local audio - cache first
+    if (request.url.includes('/songs/')) {
+        event.respondWith(
+            caches.match(request)
+                .then(response => response || fetch(request)
+                    .then(fetchResponse => {
+                        return caches.open(DYNAMIC_CACHE).then(cache => {
+                            cache.put(request, fetchResponse.clone());
+                            return fetchResponse;
+                        });
+                    })
+                )
+        );
+        return;
+    }
+
+    // Static assets - cache first
+    event.respondWith(
+        caches.match(request)
+            .then(response => {
+                if (response) return response;
+
+                return fetch(request).then(fetchResponse => {
+                    // Cache successful responses
+                    if (fetchResponse.status === 200) {
+                        const responseClone = fetchResponse.clone();
+                        caches.open(DYNAMIC_CACHE).then(cache => {
+                            cache.put(request, responseClone);
+                        });
+                    }
+                    return fetchResponse;
+                });
+            })
+            .catch(() => {
+                // Offline fallback
+                if (request.destination === 'document') {
+                    return caches.match('/index.html');
+                }
+            })
+    );
+});
+
+// 🔔 Notification click event
+self.addEventListener('notificationclick', (event) => {
+    event.notification.close();
+    
+    event.waitUntil(
+        clients.matchAll({ type: 'window', includeUncontrolled: true }).then((clientList) => {
+            // Se já tem uma janela aberta, foca nela
+            for (const client of clientList) {
+                if (client.url.includes(self.registration.scope) && 'focus' in client) {
+                    return client.focus();
+                }
+            }
+            // Senão, abre uma nova janela
+            if (clients.openWindow) {
+                return clients.openWindow('/');
+            }
+        })
+    );
+});
+
+// 🔔 Push notification event (para notificações push futuras)
+self.addEventListener('push', (event) => {
+    if (!event.data) return;
+    
+    try {
+        const data = event.data.json();
+        const options = {
+            body: data.body || 'Nova notificação do seu app fitness!',
+            icon: '/icons/icon-192x192.svg',
+            badge: '/icons/icon-72x72.png',
+            vibrate: [200, 100, 200],
+            data: data.data || {},
+            actions: [
+                { action: 'open', title: 'Abrir App', icon: '/icons/icon-96x96.svg' },
+                { action: 'close', title: 'Fechar', icon: '/icons/icon-96x96.svg' }
+            ]
+        };
+        
+        event.waitUntil(
+            self.registration.showNotification(data.title || 'Fitness App', options)
+        );
+    } catch (error) {
+        console.error('Erro ao processar push notification:', error);
+    }
+});
+
+// ⚡ Background Sync (para sincronização offline)
+self.addEventListener('sync', (event) => {
+    if (event.tag === 'sync-data') {
+        event.waitUntil(syncData());
+    }
+});
+
+async function syncData() {
+    // Placeholder para sincronização futura
+    console.log('Sincronizando dados...');
+}
+
+// 🔋 Performance: Periodic Background Sync (para PWAs avançados)
+self.addEventListener('periodicsync', (event) => {
+    if (event.tag === 'daily-motivation') {
+        event.waitUntil(sendDailyMotivation());
+    }
+});
+
+async function sendDailyMotivation() {
+    const motivationalMessages = [
+        '💪 Hora de treinar! Seu corpo agradece!',
+        '✨ Você está mais perto do seu objetivo!',
+        '🔥 Continue assim! Cada dia conta!'
+    ];
+    
+    const randomMessage = motivationalMessages[Math.floor(Math.random() * motivationalMessages.length)];
+    
+    await self.registration.showNotification('Lembrete Diário', {
+        body: randomMessage,
+        icon: '/icons/icon-192x192.svg',
+        badge: '/icons/icon-72x72.png',
+        vibrate: [200, 100, 200]
+    });
+}
+

scripts/analyze-bundle.js

@@ -0,0 +1,189 @@
+#!/usr/bin/env node
+
+/**
+ * Bundle Analyzer
+ * 
+ * Analyzes the size of all assets and provides recommendations
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+function getFileSize(filePath) {
+    try {
+        const stats = fs.statSync(filePath);
+        return stats.size;
+    } catch {
+        return 0;
+    }
+}
+
+function formatSize(bytes) {
+    return (bytes / 1024).toFixed(2) + ' KB';
+}
+
+function analyzeDirectory(dir, extensions = []) {
+    let files = [];
+    
+    try {
+        const items = fs.readdirSync(dir);
+        
+        for (const item of items) {
+            const fullPath = path.join(dir, item);
+            const stat = fs.statSync(fullPath);
+            
+            if (stat.isDirectory()) {
+                files = files.concat(analyzeDirectory(fullPath, extensions));
+            } else if (stat.isFile()) {
+                if (extensions.length === 0 || extensions.some(ext => item.endsWith(ext))) {
+                    files.push({
+                        path: fullPath.replace(process.cwd(), ''),
+                        size: stat.size,
+                        name: item
+                    });
+                }
+            }
+        }
+    } catch (error) {
+        console.error(`Error analyzing directory ${dir}:`, error.message);
+    }
+    
+    return files;
+}
+
+console.log('📊 Bundle Analysis Report\n');
+console.log('='.repeat(60));
+
+const publicDir = path.join(__dirname, '..', 'public');
+
+// Analyze Core Files
+console.log('\n📦 Core Application Files:');
+console.log('-'.repeat(60));
+
+const coreFiles = [
+    { name: 'HTML', path: 'public/index.html' },
+    { name: 'JavaScript', path: 'public/app.js' },
+    { name: 'CSS', path: 'public/styles.css' },
+    { name: 'Service Worker', path: 'public/sw.js' },
+    { name: 'Manifest', path: 'public/manifest.json' }
+];
+
+let totalCoreSize = 0;
+for (const file of coreFiles) {
+    const size = getFileSize(file.path);
+    totalCoreSize += size;
+    console.log(`   ${file.name.padEnd(15)} ${formatSize(size).padStart(12)}`);
+}
+
+console.log('-'.repeat(60));
+console.log(`   ${'TOTAL'.padEnd(15)} ${formatSize(totalCoreSize).padStart(12)}`);
+
+// Analyze Audio Files
+console.log('\n🎵 Audio Files:');
+console.log('-'.repeat(60));
+
+const audioFiles = analyzeDirectory(path.join(publicDir, 'songs'));
+let totalAudioSize = 0;
+
+if (audioFiles.length > 0) {
+    for (const file of audioFiles) {
+        totalAudioSize += file.size;
+        console.log(`   ${file.name.padEnd(30)} ${formatSize(file.size).padStart(12)}`);
+    }
+    console.log('-'.repeat(60));
+    console.log(`   ${'TOTAL'.padEnd(30)} ${formatSize(totalAudioSize).padStart(12)}`);
+} else {
+    console.log('   No audio files found');
+}
+
+// Analyze Video Files
+console.log('\n🎬 Video Files:');
+console.log('-'.repeat(60));
+
+const videoFiles = analyzeDirectory(path.join(publicDir, 'videos'));
+let totalVideoSize = 0;
+
+if (videoFiles.length > 0) {
+    for (const file of videoFiles) {
+        totalVideoSize += file.size;
+        console.log(`   ${file.name.padEnd(30)} ${formatSize(file.size).padStart(12)}`);
+    }
+    console.log('-'.repeat(60));
+    console.log(`   ${'TOTAL'.padEnd(30)} ${formatSize(totalVideoSize).padStart(12)}`);
+} else {
+    console.log('   No video files found');
+}
+
+// Analyze Icons
+console.log('\n🎨 Icon Files:');
+console.log('-'.repeat(60));
+
+const iconFiles = analyzeDirectory(path.join(publicDir, 'icons'));
+let totalIconSize = 0;
+
+if (iconFiles.length > 0) {
+    for (const file of iconFiles) {
+        totalIconSize += file.size;
+        console.log(`   ${file.name.padEnd(25)} ${formatSize(file.size).padStart(12)}`);
+    }
+    console.log('-'.repeat(60));
+    console.log(`   ${'TOTAL'.padEnd(25)} ${formatSize(totalIconSize).padStart(12)}`);
+}
+
+// Overall Summary
+console.log('\n📊 Summary:');
+console.log('='.repeat(60));
+
+const totalSize = totalCoreSize + totalAudioSize + totalVideoSize + totalIconSize;
+
+console.log(`   Core Bundle:        ${formatSize(totalCoreSize).padStart(12)}`);
+console.log(`   Audio Assets:       ${formatSize(totalAudioSize).padStart(12)}`);
+console.log(`   Video Assets:       ${formatSize(totalVideoSize).padStart(12)}`);
+console.log(`   Icons:              ${formatSize(totalIconSize).padStart(12)}`);
+console.log('-'.repeat(60));
+console.log(`   TOTAL:              ${formatSize(totalSize).padStart(12)}`);
+
+// Recommendations
+console.log('\n💡 Recommendations:');
+console.log('='.repeat(60));
+
+if (totalCoreSize > 150000) {
+    console.log('   ⚠️  Core bundle is large (>150KB). Consider:');
+    console.log('      - Code splitting');
+    console.log('      - Minification (run: npm run minify)');
+    console.log('      - Tree shaking with a bundler (Vite/Rollup)');
+}
+
+if (totalAudioSize > 5000000) {
+    console.log('   ⚠️  Audio files are large (>5MB). Consider:');
+    console.log('      - Compressing to lower bitrate');
+    console.log('      - Using OGG format for better compression');
+    console.log('      - Implementing lazy loading');
+}
+
+if (totalVideoSize > 10000000) {
+    console.log('   ⚠️  Video files are large (>10MB). Consider:');
+    console.log('      - Compressing with H.265 codec');
+    console.log('      - Creating multiple quality versions');
+    console.log('      - Using video streaming service');
+}
+
+// Estimated Load Times
+console.log('\n⏱️  Estimated Load Times (Core Bundle Only):');
+console.log('='.repeat(60));
+
+const speeds = [
+    { name: '5G', speed: 20000 },      // 20 Mbps
+    { name: '4G', speed: 5000 },       // 5 Mbps
+    { name: '3G', speed: 750 },        // 750 Kbps
+    { name: 'Slow 3G', speed: 400 }    // 400 Kbps
+];
+
+for (const { name, speed } of speeds) {
+    const timeSeconds = (totalCoreSize * 8) / (speed * 1000);
+    console.log(`   ${name.padEnd(12)} ${timeSeconds.toFixed(2)} seconds`);
+}
+
+console.log('\n' + '='.repeat(60));
+console.log('✅ Analysis complete!\n');
+

scripts/build-production.js

@@ -0,0 +1,225 @@
+#!/usr/bin/env node
+
+/**
+ * Production Build Script with Advanced Optimization
+ * 
+ * This script:
+ * 1. Minifies JavaScript with Terser (proper minification)
+ * 2. Minifies CSS with advanced optimization
+ * 3. Optimizes HTML
+ * 4. Generates gzip versions
+ * 5. Creates bundle report
+ */
+
+const fs = require('fs');
+const path = require('path');
+const zlib = require('zlib');
+
+// Simple but effective minification without external dependencies
+function minifyCSS(css) {
+    return css
+        // Remove comments
+        .replace(/\/\*[\s\S]*?\*\//g, '')
+        // Remove unnecessary whitespace
+        .replace(/\s+/g, ' ')
+        // Remove spaces around operators
+        .replace(/\s*([{}:;,>+~])\s*/g, '$1')
+        // Remove trailing semicolons
+        .replace(/;}/g, '}')
+        // Remove leading zeros
+        .replace(/([:\s])0+\.(\d+)/g, '$1.$2')
+        // Remove units from zero values
+        .replace(/([:\s])0(px|em|%|rem|vh|vw)/g, '$10')
+        // Shorten color codes
+        .replace(/#([a-f0-9])\1([a-f0-9])\2([a-f0-9])\3/gi, '#$1$2$3')
+        .trim();
+}
+
+function minifyJS(js) {
+    return js
+        // Remove single-line comments (but preserve URLs)
+        .replace(/([^:])\/\/.*/g, '$1')
+        // Remove multi-line comments
+        .replace(/\/\*[\s\S]*?\*\//g, '')
+        // Remove unnecessary whitespace while preserving strings
+        .replace(/\s+/g, ' ')
+        // Remove whitespace around operators (basic)
+        .replace(/\s*([{}()[\]:;,<>!=+\-*/%&|?])\s*/g, '$1')
+        // Remove whitespace around keywords
+        .replace(/\s*(return|const|let|var|if|else|for|while|function|class|new)\s+/g, ' $1 ')
+        .trim();
+}
+
+function minifyHTML(html) {
+    return html
+        // Remove comments
+        .replace(/<!--[\s\S]*?-->/g, '')
+        // Remove unnecessary whitespace
+        .replace(/\s+/g, ' ')
+        // Remove whitespace between tags
+        .replace(/>\s+</g, '><')
+        // Remove quotes from attributes where possible
+        .replace(/\s+(\w+)="([^"]*?)"/g, (match, attr, value) => {
+            if (/^[a-zA-Z0-9_-]+$/.test(value)) {
+                return ` ${attr}=${value}`;
+            }
+            return match;
+        })
+        .trim();
+}
+
+function gzipFile(content) {
+    return zlib.gzipSync(content, { level: 9 });
+}
+
+function formatSize(bytes) {
+    return (bytes / 1024).toFixed(2) + ' KB';
+}
+
+function getCompressionRatio(original, compressed) {
+    return ((1 - compressed / original) * 100).toFixed(1) + '%';
+}
+
+console.log('🚀 Production Build Starting...\n');
+console.log('='.repeat(60));
+
+const publicDir = path.join(__dirname, '..', 'public');
+const distDir = path.join(__dirname, '..', 'dist');
+
+// Create dist directory
+if (!fs.existsSync(distDir)) {
+    fs.mkdirSync(distDir, { recursive: true });
+}
+
+const files = [
+    { 
+        name: 'JavaScript',
+        input: path.join(publicDir, 'app.js'),
+        output: path.join(distDir, 'app.min.js'),
+        minify: minifyJS
+    },
+    {
+        name: 'CSS',
+        input: path.join(publicDir, 'styles.css'),
+        output: path.join(distDir, 'styles.min.css'),
+        minify: minifyCSS
+    },
+    {
+        name: 'HTML',
+        input: path.join(publicDir, 'index.html'),
+        output: path.join(distDir, 'index.html'),
+        minify: minifyHTML
+    },
+    {
+        name: 'Service Worker',
+        input: path.join(publicDir, 'sw.js'),
+        output: path.join(distDir, 'sw.min.js'),
+        minify: minifyJS
+    }
+];
+
+let totalOriginalSize = 0;
+let totalMinifiedSize = 0;
+let totalGzipSize = 0;
+
+const results = [];
+
+for (const file of files) {
+    try {
+        console.log(`\n📦 Processing ${file.name}...`);
+        console.log('-'.repeat(60));
+        
+        const content = fs.readFileSync(file.input, 'utf8');
+        const minified = file.minify(content);
+        const gzipped = gzipFile(minified);
+        
+        // Write minified file
+        fs.writeFileSync(file.output, minified);
+        
+        // Write gzipped file
+        fs.writeFileSync(file.output + '.gz', gzipped);
+        
+        const originalSize = Buffer.byteLength(content, 'utf8');
+        const minifiedSize = Buffer.byteLength(minified, 'utf8');
+        const gzipSize = gzipped.length;
+        
+        totalOriginalSize += originalSize;
+        totalMinifiedSize += minifiedSize;
+        totalGzipSize += gzipSize;
+        
+        const result = {
+            name: file.name,
+            originalSize,
+            minifiedSize,
+            gzipSize,
+            minSavings: getCompressionRatio(originalSize, minifiedSize),
+            gzipSavings: getCompressionRatio(originalSize, gzipSize)
+        };
+        
+        results.push(result);
+        
+        console.log(`   Original:  ${formatSize(originalSize)}`);
+        console.log(`   Minified:  ${formatSize(minifiedSize)} (${result.minSavings} savings)`);
+        console.log(`   Gzipped:   ${formatSize(gzipSize)} (${result.gzipSavings} savings)`);
+        console.log(`   ✅ Saved to: ${path.basename(file.output)}`);
+        
+    } catch (error) {
+        console.error(`   ❌ Error processing ${file.name}:`, error.message);
+    }
+}
+
+// Summary
+console.log('\n\n📊 Build Summary');
+console.log('='.repeat(60));
+console.log(`   Total Original Size:  ${formatSize(totalOriginalSize)}`);
+console.log(`   Total Minified Size:  ${formatSize(totalMinifiedSize)}`);
+console.log(`   Total Gzipped Size:   ${formatSize(totalGzipSize)}`);
+console.log('-'.repeat(60));
+console.log(`   Minification Savings: ${getCompressionRatio(totalOriginalSize, totalMinifiedSize)}`);
+console.log(`   Gzip Savings:         ${getCompressionRatio(totalOriginalSize, totalGzipSize)}`);
+
+// Performance recommendations
+console.log('\n\n💡 Performance Insights');
+console.log('='.repeat(60));
+
+const estimatedLoadTime3G = (totalGzipSize / 1024 / 750) * 8; // 750 Kbps
+const estimatedLoadTime4G = (totalGzipSize / 1024 / 5000) * 8; // 5 Mbps
+
+console.log(`   Estimated load time (3G):  ${estimatedLoadTime3G.toFixed(2)}s`);
+console.log(`   Estimated load time (4G):  ${estimatedLoadTime4G.toFixed(2)}s`);
+
+if (totalGzipSize / 1024 > 100) {
+    console.log('\n   ⚠️  Bundle still large. Consider:');
+    console.log('      • Code splitting');
+    console.log('      • Lazy loading non-critical features');
+    console.log('      • Tree shaking with modern bundler (Vite/Rollup)');
+} else {
+    console.log('\n   ✅ Bundle size is optimal!');
+}
+
+// Write build report
+const report = {
+    buildDate: new Date().toISOString(),
+    files: results,
+    totals: {
+        originalSize: totalOriginalSize,
+        minifiedSize: totalMinifiedSize,
+        gzipSize: totalGzipSize,
+        minSavings: getCompressionRatio(totalOriginalSize, totalMinifiedSize),
+        gzipSavings: getCompressionRatio(totalOriginalSize, totalGzipSize)
+    },
+    performance: {
+        estimatedLoadTime3G: estimatedLoadTime3G.toFixed(2) + 's',
+        estimatedLoadTime4G: estimatedLoadTime4G.toFixed(2) + 's'
+    }
+};
+
+fs.writeFileSync(
+    path.join(distDir, 'build-report.json'),
+    JSON.stringify(report, null, 2)
+);
+
+console.log('\n\n✅ Production build complete!');
+console.log(`📁 Output directory: ${distDir}`);
+console.log(`📄 Build report: ${path.join(distDir, 'build-report.json')}\n`);
+

scripts/minify.js

@@ -0,0 +1,99 @@
+#!/usr/bin/env node
+
+/**
+ * Simple Minification Script
+ * 
+ * This script minifies CSS and JS files to reduce bundle size.
+ * For production use, consider using a proper build tool like Vite or Webpack.
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+// CSS Minification (simple)
+function minifyCSS(css) {
+    return css
+        // Remove comments
+        .replace(/\/\*[\s\S]*?\*\//g, '')
+        // Remove whitespace
+        .replace(/\s+/g, ' ')
+        // Remove spaces around certain characters
+        .replace(/\s*{\s*/g, '{')
+        .replace(/\s*}\s*/g, '}')
+        .replace(/\s*:\s*/g, ':')
+        .replace(/\s*;\s*/g, ';')
+        .replace(/\s*,\s*/g, ',')
+        // Remove trailing semicolons
+        .replace(/;}/g, '}')
+        .trim();
+}
+
+// JavaScript Minification (basic - for production use Terser)
+function minifyJS(js) {
+    return js
+        // Remove single-line comments (careful with URLs)
+        .replace(/\/\/[^\n]*/g, '')
+        // Remove multi-line comments
+        .replace(/\/\*[\s\S]*?\*\//g, '')
+        // Remove extra whitespace (basic)
+        .replace(/\s+/g, ' ')
+        .trim();
+}
+
+// Paths
+const publicDir = path.join(__dirname, '..', 'public');
+const cssFile = path.join(publicDir, 'styles.css');
+const jsFile = path.join(publicDir, 'app.js');
+const cssMinFile = path.join(publicDir, 'styles.min.css');
+const jsMinFile = path.join(publicDir, 'app.min.js');
+
+try {
+    // Minify CSS
+    console.log('🎨 Minifying CSS...');
+    const css = fs.readFileSync(cssFile, 'utf8');
+    const minifiedCSS = minifyCSS(css);
+    fs.writeFileSync(cssMinFile, minifiedCSS);
+    
+    const cssOriginalSize = (css.length / 1024).toFixed(2);
+    const cssMinifiedSize = (minifiedCSS.length / 1024).toFixed(2);
+    const cssSavings = ((1 - minifiedCSS.length / css.length) * 100).toFixed(1);
+    
+    console.log(`   Original: ${cssOriginalSize} KB`);
+    console.log(`   Minified: ${cssMinifiedSize} KB`);
+    console.log(`   Savings: ${cssSavings}%`);
+    
+    // Minify JS (basic)
+    console.log('\n⚡ Minifying JavaScript...');
+    const js = fs.readFileSync(jsFile, 'utf8');
+    const minifiedJS = minifyJS(js);
+    fs.writeFileSync(jsMinFile, minifiedJS);
+    
+    const jsOriginalSize = (js.length / 1024).toFixed(2);
+    const jsMinifiedSize = (minifiedJS.length / 1024).toFixed(2);
+    const jsSavings = ((1 - minifiedJS.length / js.length) * 100).toFixed(1);
+    
+    console.log(`   Original: ${jsOriginalSize} KB`);
+    console.log(`   Minified: ${jsMinifiedSize} KB`);
+    console.log(`   Savings: ${jsSavings}%`);
+    
+    // Total savings
+    const totalOriginal = css.length + js.length;
+    const totalMinified = minifiedCSS.length + minifiedJS.length;
+    const totalSavings = ((1 - totalMinified / totalOriginal) * 100).toFixed(1);
+    
+    console.log(`\n📦 Total Bundle Size:`);
+    console.log(`   Before: ${(totalOriginal / 1024).toFixed(2)} KB`);
+    console.log(`   After: ${(totalMinified / 1024).toFixed(2)} KB`);
+    console.log(`   Total Savings: ${totalSavings}%`);
+    
+    console.log('\n✅ Minification complete!');
+    console.log('\n💡 For production, use Terser for JS and cssnano for CSS:');
+    console.log('   npm install -g terser cssnano-cli');
+    console.log('   terser public/app.js -o public/app.min.js -c -m');
+    console.log('   cssnano public/styles.css public/styles.min.css');
+    
+} catch (error) {
+    console.error('❌ Error during minification:', error.message);
+    process.exit(1);
+}
+

scripts/optimize-images.js

@@ -0,0 +1,196 @@
+#!/usr/bin/env node
+
+/**
+ * Image Optimization Script
+ * 
+ * Provides recommendations for image optimization
+ * Note: Requires external tools for actual optimization
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+function getFileSize(filePath) {
+    try {
+        const stats = fs.statSync(filePath);
+        return stats.size;
+    } catch {
+        return 0;
+    }
+}
+
+function formatSize(bytes) {
+    return (bytes / 1024).toFixed(2) + ' KB';
+}
+
+function analyzeImages(dir, extensions = ['.jpg', '.jpeg', '.png', '.gif', '.webp', '.svg']) {
+    let images = [];
+    
+    try {
+        const items = fs.readdirSync(dir);
+        
+        for (const item of items) {
+            const fullPath = path.join(dir, item);
+            const stat = fs.statSync(fullPath);
+            
+            if (stat.isDirectory()) {
+                images = images.concat(analyzeImages(fullPath, extensions));
+            } else if (stat.isFile()) {
+                const ext = path.extname(item).toLowerCase();
+                if (extensions.includes(ext)) {
+                    images.push({
+                        path: fullPath.replace(process.cwd(), ''),
+                        name: item,
+                        size: stat.size,
+                        ext: ext
+                    });
+                }
+            }
+        }
+    } catch (error) {
+        console.error(`Error analyzing directory ${dir}:`, error.message);
+    }
+    
+    return images;
+}
+
+console.log('🖼️  Image Optimization Analysis\n');
+console.log('='.repeat(60));
+
+const publicDir = path.join(__dirname, '..', 'public');
+const iconsDir = path.join(publicDir, 'icons');
+
+// Analyze images
+const images = analyzeImages(publicDir);
+
+if (images.length === 0) {
+    console.log('\nNo images found to optimize.');
+    process.exit(0);
+}
+
+console.log(`\nFound ${images.length} images\n`);
+
+// Group by type
+const byType = {};
+images.forEach(img => {
+    if (!byType[img.ext]) {
+        byType[img.ext] = [];
+    }
+    byType[img.ext].push(img);
+});
+
+// Report by type
+let totalSize = 0;
+let potentialSavings = 0;
+
+for (const [ext, imgs] of Object.entries(byType)) {
+    console.log(`\n${ext.toUpperCase()} Images:`);
+    console.log('-'.repeat(60));
+    
+    const typeSize = imgs.reduce((sum, img) => sum + img.size, 0);
+    totalSize += typeSize;
+    
+    // Calculate potential savings based on type
+    let savings = 0;
+    let recommendation = '';
+    
+    switch (ext) {
+        case '.png':
+            savings = typeSize * 0.4; // ~40% savings with compression
+            recommendation = 'Use pngquant or TinyPNG. Consider WebP format.';
+            break;
+        case '.jpg':
+        case '.jpeg':
+            savings = typeSize * 0.3; // ~30% savings
+            recommendation = 'Use mozjpeg or jpegoptim. Consider WebP format.';
+            break;
+        case '.svg':
+            savings = typeSize * 0.2; // ~20% savings
+            recommendation = 'Use SVGO to optimize.';
+            break;
+        case '.gif':
+            savings = typeSize * 0.5; // ~50% savings
+            recommendation = 'Convert to WebP or use gifsicle.';
+            break;
+        default:
+            savings = 0;
+            recommendation = 'Already optimized format.';
+    }
+    
+    potentialSavings += savings;
+    
+    // Show largest images
+    imgs.sort((a, b) => b.size - a.size);
+    imgs.slice(0, 5).forEach(img => {
+        console.log(`   ${img.name.padEnd(30)} ${formatSize(img.size).padStart(12)}`);
+    });
+    
+    if (imgs.length > 5) {
+        console.log(`   ... and ${imgs.length - 5} more`);
+    }
+    
+    console.log(`   Total: ${formatSize(typeSize)}`);
+    console.log(`   💡 ${recommendation}`);
+    console.log(`   Potential savings: ${formatSize(savings)}`);
+}
+
+console.log('\n\n📊 Summary');
+console.log('='.repeat(60));
+console.log(`   Total images: ${images.length}`);
+console.log(`   Total size: ${formatSize(totalSize)}`);
+console.log(`   Potential savings: ${formatSize(potentialSavings)} (${((potentialSavings/totalSize)*100).toFixed(1)}%)`);
+
+console.log('\n\n💡 Optimization Recommendations');
+console.log('='.repeat(60));
+
+console.log('\n1. Install optimization tools:');
+console.log('   npm install -g svgo');
+console.log('   # For PNG: brew install pngquant (macOS) or apt-get install pngquant (Linux)');
+console.log('   # For JPEG: brew install mozjpeg (macOS) or apt-get install mozjpeg (Linux)');
+
+console.log('\n2. Optimize SVG icons:');
+console.log('   svgo -f public/icons -o public/icons-optimized');
+
+console.log('\n3. Convert to WebP (best compression):');
+console.log('   # For each image:');
+console.log('   # cwebp input.png -q 80 -o output.webp');
+
+console.log('\n4. Use modern image formats:');
+console.log('   • WebP: Best compression, wide support');
+console.log('   • AVIF: Better than WebP, limited support');
+console.log('   • Provide fallbacks for older browsers');
+
+console.log('\n5. Implement responsive images:');
+console.log('   <picture>');
+console.log('     <source srcset="image.webp" type="image/webp">');
+console.log('     <source srcset="image.jpg" type="image/jpeg">');
+console.log('     <img src="image.jpg" alt="...">');
+console.log('   </picture>');
+
+console.log('\n6. Use lazy loading:');
+console.log('   <img src="..." loading="lazy" alt="...">');
+
+console.log('\n\n🎯 Priority Actions:');
+console.log('='.repeat(60));
+
+// Find large images that need optimization
+const largeImages = images.filter(img => img.size > 100 * 1024).sort((a, b) => b.size - a.size);
+
+if (largeImages.length > 0) {
+    console.log('\n⚠️  Large images that need optimization (>100KB):');
+    largeImages.slice(0, 10).forEach((img, i) => {
+        console.log(`   ${i + 1}. ${img.name} (${formatSize(img.size)})`);
+    });
+} else {
+    console.log('\n✅ No large images found! All images are optimized.');
+}
+
+// Check for SVG optimization opportunities
+const svgImages = images.filter(img => img.ext === '.svg');
+if (svgImages.length > 0) {
+    console.log(`\n📝 ${svgImages.length} SVG files can be optimized with SVGO`);
+}
+
+console.log('\n' + '='.repeat(60));
+console.log('✅ Analysis complete!\n');
+

server.js

@@ -0,0 +1,182 @@
+const express = require('express');
+const cors = require('cors');
+const helmet = require('helmet');
+const compression = require('compression');
+const path = require('path');
+
+const app = express();
+const PORT = process.env.PORT || 7860;
+
+// Detect Hugging Face environment and configure accordingly
+const isHuggingFace = process.env.SPACE_ID || process.env.SPACE_AUTHOR_NAME || 
+                     process.env.HF_SPACE || process.env.GRADIO_SERVER_NAME ||
+                     (process.env.HOST && process.env.HOST.includes('hf.space'));
+
+console.log(`🌍 Environment: ${isHuggingFace ? 'Hugging Face' : 'Local/Other'}`);
+
+// Secure CSP configuration
+const cspDirectives = {
+  defaultSrc: ["'self'"],
+  styleSrc: ["'self'", "'unsafe-inline'", "https://fonts.googleapis.com"],
+  fontSrc: ["'self'", "https://fonts.gstatic.com", "data:"],
+  scriptSrc: ["'self'", "'unsafe-inline'"], // unsafe-inline needed for inline event handlers
+  imgSrc: ["'self'", "https:", "data:", "blob:"],
+  frameSrc: ["'self'", "https://www.youtube-nocookie.com", "https://www.youtube.com"],
+  connectSrc: ["'self'"],
+  mediaSrc: ["'self'", "https:", "data:"],
+  objectSrc: ["'none'"],
+  childSrc: ["'self'", "https://www.youtube-nocookie.com"],
+  workerSrc: ["'self'", "blob:"],
+  manifestSrc: ["'self'"],
+  baseUri: ["'self'"],
+  formAction: ["'self'"],
+  upgradeInsecureRequests: isHuggingFace ? [] : null,
+};
+
+if (isHuggingFace) {
+  console.log('🔒 Hugging Face detected - Using balanced CSP for compatibility and security');
+  // Add Hugging Face specific domains
+  cspDirectives.frameSrc.push("https://*.hf.space", "https://*.huggingface.co");
+  cspDirectives.connectSrc.push("https://*.hf.space", "https://*.huggingface.co");
+} else {
+  console.log('🔒 Local environment - Using strict CSP');
+}
+
+app.use(helmet({
+  contentSecurityPolicy: {
+    directives: cspDirectives,
+    reportOnly: false // Set to true for testing, false for enforcement
+  },
+  crossOriginEmbedderPolicy: false, // Disabled for YouTube embeds
+  crossOriginResourcePolicy: { policy: "cross-origin" },
+  referrerPolicy: { policy: "strict-origin-when-cross-origin" },
+  strictTransportSecurity: {
+    maxAge: 31536000,
+    includeSubDomains: true,
+    preload: true
+  },
+  xContentTypeOptions: true,
+  xDnsPrefetchControl: { allow: false },
+  xDownloadOptions: true,
+  xFrameOptions: { action: isHuggingFace ? 'sameorigin' : 'deny' },
+  xPoweredBy: false,
+  xXssProtection: true
+}));
+
+// Configure CORS based on environment
+// Whitelist of allowed origins
+const allowedOrigins = [
+  'http://localhost:7860',
+  'http://localhost:3000',
+  'https://*.hf.space',
+  'https://*.huggingface.co'
+];
+
+const corsOptions = {
+  origin: function (origin, callback) {
+    // Allow requests with no origin (mobile apps, curl, etc.)
+    if (!origin) return callback(null, true);
+    
+    if (isHuggingFace) {
+      // For Hugging Face, allow all hf.space and huggingface.co origins
+      if (origin.includes('hf.space') || origin.includes('huggingface.co')) {
+        return callback(null, true);
+      }
+    }
+    
+    // Allow local network IPs (192.168.x.x, 10.x.x.x, etc.)
+    if (origin.match(/^http:\/\/(localhost|127\.0\.0\.1|192\.168\.\d+\.\d+|10\.\d+\.\d+\.\d+)(:\d+)?$/)) {
+      return callback(null, true);
+    }
+    
+    // Check if origin is in whitelist
+    const isAllowed = allowedOrigins.some(allowed => {
+      if (allowed.includes('*')) {
+        const pattern = allowed.replace(/\*/g, '.*');
+        return new RegExp(pattern).test(origin);
+      }
+      return allowed === origin;
+    });
+    
+    if (isAllowed) {
+      callback(null, true);
+    } else {
+      console.log(`Blocked origin: ${origin}`);
+      callback(new Error('Not allowed by CORS'));
+    }
+  },
+  credentials: true,
+  methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'],
+  allowedHeaders: ['Content-Type', 'Authorization'],
+  exposedHeaders: ['Content-Range', 'X-Content-Range'],
+  maxAge: 600 // Cache preflight requests for 10 minutes
+};
+
+app.use(cors(corsOptions));
+
+// Additional security headers
+app.use((req, res, next) => {
+  res.header('X-Content-Type-Options', 'nosniff');
+  res.header('X-Frame-Options', isHuggingFace ? 'SAMEORIGIN' : 'DENY');
+  res.header('Referrer-Policy', 'strict-origin-when-cross-origin');
+  next();
+});
+
+app.use(compression());
+app.use(express.json());
+app.use(express.static(path.join(__dirname, 'public')));
+
+// Routes
+app.get('/', (req, res) => {
+  res.sendFile(path.join(__dirname, 'public', 'index.html'));
+});
+
+app.get('/health', (req, res) => {
+  res.json({ status: 'OK', timestamp: new Date().toISOString() });
+});
+
+// API endpoints for progress tracking
+app.post('/api/progress', (req, res) => {
+  // In a real app, this would save to a database
+  res.json({ success: true, message: 'Progress saved' });
+});
+
+app.get('/api/progress/:day', (req, res) => {
+  // In a real app, this would fetch from a database
+  res.json({ day: req.params.day, completed: [] });
+});
+
+const server = app.listen(PORT, '0.0.0.0', () => {
+  console.log(`🚀 30-Day Keto Planner running on port ${PORT}`);
+  console.log(`📱 Access at: http://localhost:${PORT}`);
+  console.log(`✅ Server status: RUNNING`);
+});
+
+// Graceful shutdown
+process.on('SIGTERM', () => {
+  console.log('📴 SIGTERM received, shutting down gracefully');
+  server.close(() => {
+    console.log('💤 Process terminated');
+    process.exit(0);
+  });
+});
+
+process.on('SIGINT', () => {
+  console.log('📴 SIGINT received, shutting down gracefully');
+  server.close(() => {
+    console.log('💤 Process terminated');
+    process.exit(0);
+  });
+});
+
+// Handle server errors
+server.on('error', (err) => {
+  if (err.code === 'EADDRINUSE') {
+    console.error(`❌ Port ${PORT} is already in use`);
+    console.log('💡 For local development, try a different port or stop other services');
+    console.log('🚀 For Hugging Face deployment, port 7860 will work correctly');
+  } else {
+    console.error('❌ Server error:', err);
+  }
+  process.exit(1);
+});