-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbeacon-kodeWeave.json
More file actions
31 lines (31 loc) · 379 KB
/
beacon-kodeWeave.json
File metadata and controls
31 lines (31 loc) · 379 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
{
"name": "Beacon",
"version": "1.0.7",
"title": "Beacon: Emergency Tools, Training & Strategy",
"description": "Beacon combines emergency survival tools with skill-building and resource management. Quickly access life-saving features like an SOS signal, compass, pedometer, Morse code translator, and signal mirror, while also tracking your survival training, managing resources, and completing essential checklists. Whether you're in an emergency or sharpening your survival knowledge, Beacon keeps you prepared.",
"author": "Michael Schwartz",
"url": "https://michaelsboost.com/Beacon",
"meta": "<script src=\"https://cdn.jsdelivr.net/npm/alpinejs@3.14.1/dist/cdn.min.js\" defer></script>",
"libraries": [
"https://michaelsboost.com/TailwindCSSMod/tailwind-mod.min.js",
"https://cdn.jsdelivr.net/npm/marked/marked.min.js",
"https://cdn.jsdelivr.net/npm/jspdf@2.5.1/dist/jspdf.umd.min.js"
],
"html_pre_processor": "html",
"css_pre_processor": "css",
"javascript_pre_processor": "javascript",
"html": "<div class=\"bg-gray-900 text-gray-100 font-sans min-h-screen\">\n <div class=\"min-h-screen bg-gradient-to-br from-gray-900 to-gray-800\" x-data=\"app\">\n <!-- Header -->\n <header class=\"bg-gray-800/50 backdrop-blur-sm border-b border-gray-700/50 sticky top-0 z-10\">\n <div class=\"container mx-auto px-4 py-4\">\n <div class=\"flex flex-col md:flex-row justify-between items-center\">\n <div class=\"flex items-center space-x-4 mb-4 md:mb-0\">\n <div class=\"w-12 h-12 rounded-xl bg-gradient-to-br from-blue-500 to-blue-700 flex items-center justify-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6 text-white\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 11c0 3.517-1.009 6.799-2.753 9.571m-3.44-2.04l.054-.09A13.916 13.916 0 008 11a4 4 0 118 0c0 1.017-.07 2.019-.203 3m-2.118 6.844A21.88 21.88 0 0015.171 17m3.839 1.132c.645-2.266.99-4.659.99-7.132A8 8 0 008 4.07M3 15.364c.64-1.319 1-2.8 1-4.364 0-1.457.39-2.823 1.07-4\" />\n </svg>\n </div>\n <div>\n <h1 class=\"text-2xl font-bold bg-gradient-to-r from-blue-400 to-green-400 bg-clip-text text-transparent\" x-text=\"appData.appName\">Beacon</h1>\n <p class=\"text-gray-400 text-sm\" x-text=\"appData.appDescription\">Your survival preparedness companion</p>\n </div>\n </div>\n \n <div class=\"flex items-center space-x-4\">\n <div class=\"hidden md:flex items-center space-x-2 bg-gray-800/70 rounded-lg px-3 py-2\">\n <div class=\"status-indicator status-active\"></div>\n <span class=\"text-sm\">Ready</span>\n </div>\n\n <!-- Donate Heart Icon -->\n <a href=\"https://michaelsboost.com/donate/\" target=\"_blank\" \n class=\"bg-gradient-to-br from-pink-500 to-red-600 hover:from-pink-600 hover:to-red-700 rounded-lg p-2 transition-all duration-300 transform hover:scale-110 hover:shadow-lg group\"\n aria-label=\"Donate to support Beacon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z\"/>\n </svg>\n </a>\n\n <!-- Github -->\n <a href=\"https://github.com/michaelsboost/Beacon\" target=\"_blank\" class=\"bg-gray-800/70 hover:bg-gray-700/70 rounded-lg p-2 transition-colors\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z\"/>\n </svg>\n </a>\n </div>\n </div>\n </div>\n </header>\n\n <!-- Main Content -->\n <main class=\"container mx-auto px-4 py-6\">\n <!-- Tabs Navigation -->\n <div class=\"flex overflow-x-auto mb-8 pb-2 hide-scrollbar\">\n <div class=\"flex space-x-2 mx-auto bg-gray-800/50 rounded-xl p-1\">\n <button \n @click=\"setActiveTab('training')\" \n :class=\"{ 'tab-active': activeTab === 'training' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Training Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253\" />\n </svg>\n <span>Training</span>\n </button>\n <button \n @click=\"setActiveTab('scenarios')\" \n :class=\"{ 'tab-active': activeTab === 'scenarios' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Scenarios Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\" />\n </svg>\n <span>Scenarios</span>\n </button>\n <button \n @click=\"setActiveTab('checklist')\" \n :class=\"{ 'tab-active': activeTab === 'checklist' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Checklist Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\" />\n </svg>\n <span>Checklist</span>\n </button>\n <button \n @click=\"setActiveTab('tools')\" \n :class=\"{ 'tab-active': activeTab === 'tools' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Tools Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z\" />\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\" />\n </svg>\n <span>Tools</span>\n </button>\n <button \n @click=\"setActiveTab('library')\" \n :class=\"{ 'tab-active': activeTab === 'library' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Guides Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253\" />\n </svg>\n <span>Guides</span>\n </button>\n <button \n @click=\"setActiveTab('plan')\" \n :class=\"{ 'tab-active': activeTab === 'plan' }\" \n class=\"px-4 py-2 rounded-lg font-medium transition-all flex items-center space-x-2\"\n aria-label=\"Plan Tab\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n </svg>\n <span>Plan</span>\n </button>\n </div>\n </div>\n\n <!-- Training Tab -->\n <div x-show=\"activeTab === 'training'\" x-data=\"training\" class=\"space-y-6\">\n <!-- Overall Progress -->\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Overall Progress</h2>\n <p class=\"text-gray-400 text-sm\">Track your survival skill development</p>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-6 mb-6\">\n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Skill Level</span>\n <span class=\"font-bold text-white\" x-text=\"overallSkillLevel\">Beginner</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" :style=\"`width: ${globalProgress}%`\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0%</span>\n <span class=\"text-xs text-gray-400\" x-text=\"`${globalProgress}%`\">45%</span>\n <span class=\"text-xs text-gray-400\">100%</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Skills Learned</span>\n <span class=\"font-bold text-white\">5/12</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 42%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0</span>\n <span class=\"text-xs text-gray-400\">5</span>\n <span class=\"text-xs text-gray-400\">12</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Challenges Completed</span>\n <span class=\"font-bold text-white\">8/24</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 33%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0</span>\n <span class=\"text-xs text-gray-400\">8</span>\n <span class=\"text-xs text-gray-400\">24</span>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Skills Grid -->\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n <template x-for=\"skill in skills\" :key=\"skill.name\">\n <div class=\"card p-6\">\n <div class=\"flex items-start justify-between mb-4\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"skill-icon\" x-text=\"skill.icon\">🔥</div>\n <div>\n <h3 class=\"font-semibold text-lg\" x-text=\"skill.name\">Fire Making</h3>\n <div class=\"flex items-center mt-1\">\n <span class=\"text-sm text-gray-400\">Level:</span>\n <span class=\"ml-1 font-medium text-white\" x-text=\"skill.level\">Intermediate</span>\n </div>\n </div>\n </div>\n <button \n @click=\"toggleSkill(skill)\" \n class=\"text-gray-400 hover:text-white transition-colors\"\n :aria-expanded=\"skill.expanded\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </button>\n </div>\n \n <div class=\"mb-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-sm text-gray-400\">Progress</span>\n <span class=\"text-sm text-gray-400\" x-text=\"`${getSkillProgress(skill)}%`\">65%</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" :style=\"`width: ${getSkillProgress(skill)}%`\"></div>\n </div>\n </div>\n \n <div x-show=\"skill.expanded\" class=\"mt-4 pt-4 border-t border-gray-700/50\">\n <p class=\"text-gray-400 mb-4\" x-text=\"skill.challenge ? skill.challenge.text : 'No challenge available'\">\n Create a sustainable fire using only natural materials in under 10 minutes.\n </p>\n \n <div class=\"flex space-x-3\">\n <button \n @click=\"startChallenge(skill)\" \n class=\"btn-primary flex-1\"\n aria-label=\"Start Challenge\"\n >\n Start Challenge\n </button>\n </div>\n \n <div x-show=\"skill.challengeActive\" class=\"mt-4 p-4 bg-gray-800/50 rounded-lg\">\n <div class=\"flex justify-between items-center mb-3\">\n <span class=\"text-gray-400\">Time Remaining:</span>\n <span class=\"font-medium text-white\" x-text=\"skill.timeRemaining\">08:32</span>\n </div>\n \n <div class=\"flex space-x-2\">\n <button \n @click=\"completeChallenge(skill, true)\" \n class=\"btn-secondary flex-1\"\n aria-label=\"Complete Challenge\"\n >\n Completed\n </button>\n <button \n @click=\"completeChallenge(skill, false)\" \n class=\"btn-danger flex-1\"\n aria-label=\"Fail Challenge\"\n >\n Failed\n </button>\n </div>\n </div>\n </div>\n </div>\n </template>\n </div>\n </div>\n\n <!-- Scenarios Tab -->\n <div x-show=\"activeTab === 'scenarios'\" x-data=\"scenarioSimulator\" class=\"space-y-6\">\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Survival Scenarios</h2>\n <p class=\"text-gray-400 text-sm\">Test your skills in simulated emergency situations</p>\n </div>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n <template x-for=\"scenario in scenarios\" :key=\"scenario.title\">\n <div class=\"card p-6\">\n <div class=\"flex justify-between items-start mb-4\">\n <h3 class=\"font-semibold text-lg\" x-text=\"scenario.title\">Wilderness Survival</h3>\n <span class=\"px-2 py-1 bg-yellow-500/20 text-yellow-400 text-xs rounded-full\" x-text=\"scenario.difficulty\">Medium</span>\n </div>\n \n <p class=\"text-gray-400 mb-4\" x-text=\"scenario.description\">\n You're lost in the wilderness with limited supplies. Find shelter, water, and signal for rescue.\n </p>\n \n <div class=\"flex justify-between text-sm mb-4\">\n <div>\n <span class=\"text-gray-400\">Time:</span>\n <span class=\"ml-1 font-medium text-white\" x-text=\"scenario.timeRemaining\">45 min</span>\n </div>\n <div>\n <span class=\"text-gray-400\">Challenges:</span>\n <span class=\"ml-1 font-medium text-white\" x-text=\"scenario.challenges.length\">5</span>\n </div>\n </div>\n \n <button \n @click=\"toggleScenario(scenario)\" \n class=\"w-full btn-primary mb-4\"\n :aria-expanded=\"scenario.expanded\"\n >\n <span x-text=\"scenario.expanded ? 'Hide Details' : 'View Scenario'\">View Scenario</span>\n </button>\n \n <div x-show=\"scenario.expanded\" class=\"pt-4 border-t border-gray-700/50\">\n <div class=\"mb-4\">\n <span class=\"text-gray-400 text-sm\">Current Challenge:</span>\n <p class=\"font-medium text-white mt-1\" x-text=\"scenario.challenges[scenario.challengeIndex]\">\n Find a suitable location for shelter before nightfall.\n </p>\n </div>\n \n <div class=\"flex space-x-2\">\n <button \n x-show=\"!scenario.started\" \n @click=\"startScenario(scenario)\" \n class=\"btn-primary flex-1\"\n aria-label=\"Start Scenario\"\n >\n Start Scenario\n </button>\n <button \n x-show=\"scenario.started\" \n @click=\"completeChallenge(scenario)\" \n class=\"btn-secondary flex-1\"\n aria-label=\"Complete Challenge\"\n >\n Complete Challenge\n </button>\n </div>\n \n <p class=\"mt-3 font-medium text-green-400 text-center\" x-text=\"scenario.outcome\"></p>\n </div>\n </div>\n </template>\n </div>\n </div>\n\n <!-- Checklist Tab -->\n <div x-show=\"activeTab === 'checklist'\" x-data=\"emergencyChecklist\" class=\"space-y-6\">\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Emergency Preparedness Checklist</h2>\n <p class=\"text-gray-400 text-sm\">Ensure you're ready for any emergency situation</p>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-6 mb-6\">\n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Readiness Level</span>\n <span class=\"font-bold text-white\" x-text=\"globalReadinessLevel\">Prepared</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" :style=\"`width: ${globalReadinessPercentage}%`\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0%</span>\n <span class=\"text-xs text-gray-400\" x-text=\"`${globalReadinessPercentage}%`\">75%</span>\n <span class=\"text-xs text-gray-400\">100%</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Items Checked</span>\n <span class=\"font-bold text-white\">24/32</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 75%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0</span>\n <span class=\"text-xs text-gray-400\">24</span>\n <span class=\"text-xs text-gray-400\">32</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Categories Complete</span>\n <span class=\"font-bold text-white\">3/6</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 50%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0</span>\n <span class=\"text-xs text-gray-400\">3</span>\n <span class=\"text-xs text-gray-400\">6</span>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n <template x-for=\"category in categories\" :key=\"category.name\">\n <div class=\"card p-6\">\n <div class=\"flex items-start justify-between mb-4\">\n <div class=\"flex items-center space-x-4\">\n <div class=\"skill-icon\" x-text=\"category.icon\">🛡️</div>\n <div>\n <h3 class=\"font-semibold text-lg\" x-text=\"category.name\">First Aid</h3>\n <div class=\"flex items-center mt-1\">\n <span class=\"text-sm text-gray-400\">Level:</span>\n <span class=\"ml-1 font-medium text-white\" x-text=\"getCategoryReadinessLevel(category.name)\">Advanced</span>\n </div>\n </div>\n </div>\n <button \n @click=\"toggleCategory(category)\" \n class=\"text-gray-400 hover:text-white transition-colors\"\n :aria-expanded=\"category.expanded\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </button>\n </div>\n \n <div class=\"mb-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-sm text-gray-400\">Progress</span>\n <span class=\"text-sm text-gray-400\" x-text=\"`${getCategoryPercentage(category.name)}%`\">80%</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" :style=\"`width: ${getCategoryPercentage(category.name)}%`\"></div>\n </div>\n </div>\n \n <div x-show=\"category.expanded\" class=\"mt-4 pt-4 border-t border-gray-700/50\">\n <template x-for=\"(item, index) in category.items\" :key=\"item.name\">\n <label class=\"flex items-center justify-between py-2 border-b border-gray-700/30 last:border-0\">\n <div class=\"flex items-center space-x-3\">\n <div class=\"relative\">\n <input \n type=\"checkbox\" \n class=\"hidden\" \n :id=\"`${category.name}-${index}`\" \n x-model=\"item.checked\" \n @change=\"toggleItem(item)\"\n :aria-label=\"item.name\"\n >\n <div class=\"w-5 h-5 border-2 border-gray-500 rounded flex items-center justify-center transition-all\" \n :class=\"{'bg-blue-500 border-blue-500': item.checked}\">\n <svg x-show=\"item.checked\" xmlns=\"http://www.w3.org/2000/svg\" class=\"h-3 w-3 text-white\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </div>\n </div>\n <span class=\"text-white\" x-text=\"item.name\">Bandages</span>\n </div>\n <span x-show=\"item.important\" class=\"px-2 py-1 bg-red-500/20 text-red-400 text-xs rounded-full\">Essential</span>\n </label>\n </template>\n </div>\n </div>\n </template>\n </div>\n </div>\n\n <!-- Tools Tab -->\n <div x-show=\"activeTab === 'tools'\" x-data=\"survivalTools\" class=\"space-y-6\">\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z\" />\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Survival Tools</h2>\n <p class=\"text-gray-400 text-sm\">Essential tools for emergency situations</p>\n </div>\n </div>\n </div>\n \n <!-- App Status Card -->\n <div class=\"card p-6\">\n <div class=\"flex flex-col md:flex-row items-center justify-between\">\n <div class=\"flex items-center space-x-4 mb-4 md:mb-0\">\n <div class=\"w-12 h-12 rounded-xl bg-gradient-to-br from-blue-500 to-blue-700 flex items-center justify-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6 text-white\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 11c0 3.517-1.009 6.799-2.753 9.571m-3.44-2.04l.054-.09A13.916 13.916 0 008 11a4 4 0 118 0c0 1.017-.07 2.019-.203 3m-2.118 6.844A21.88 21.88 0 0015.171 17m3.839 1.132c.645-2.266.99-4.659.99-7.132A8 8 0 008 4.07M3 15.364c.64-1.319 1-2.8 1-4.364 0-1.457.39-2.823 1.07-4\" />\n </svg>\n </div>\n <div>\n <h3 class=\"font-semibold\">Beacon v<span x-text=\"status.currentVersion\">2.1.0</span></h3>\n <p class=\"text-gray-400 text-sm\">Your survival preparedness companion</p>\n </div>\n </div>\n \n <div class=\"flex flex-col sm:flex-row space-y-2 sm:space-y-0 sm:space-x-3 w-full md:w-auto\">\n <button \n x-show=\"status.updateAvailable\" \n @click=\"status.updatePWA()\" \n class=\"btn-danger flex items-center justify-center space-x-2\"\n aria-label=\"Update Beacon\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\" />\n </svg>\n <span>Update Available</span>\n </button>\n \n <button \n @click=\"status.exportAppData()\" \n class=\"btn-secondary flex items-center justify-center space-x-2\"\n aria-label=\"Export Data\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10\" />\n </svg>\n <span>Export Data</span>\n </button>\n \n <label class=\"btn-primary flex items-center justify-center space-x-2 cursor-pointer\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12\" />\n </svg>\n <span>Import Data</span>\n <input type=\"file\" accept=\".json\" class=\"hidden\" @change=\"status.importAppData(event)\" aria-label=\"Import Data\">\n </label>\n </div>\n </div>\n </div>\n \n <!-- Tools Grid -->\n <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6\">\n <!-- SOS Signal -->\n <div class=\"tool-card\" x-data=\"{ playing: false }\">\n <div class=\"w-12 h-12 rounded-xl bg-red-500/20 text-red-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">SOS Signal</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Audible distress signal</p>\n <button \n class=\"w-full btn-primary flex items-center justify-center space-x-2 pulse\" \n @click=\"playing = !playing; playing ? $refs.sos.play() : ($refs.sos.pause(), $refs.sos.currentTime = 0)\" \n x-text=\"playing ? 'STOP SOS' : 'SOS'\"\n aria-label=\"Toggle SOS Signal\"\n >\n <audio x-ref=\"sos\">\n <source src=\"https://cdn.pixabay.com/audio/2022/03/10/audio_dfb929b28d.mp3\" type=\"audio/mpeg\" />\n </audio>\n </button>\n </div>\n \n <!-- Signal Mirror -->\n <div class=\"tool-card\">\n <div class=\"w-12 h-12 rounded-xl bg-yellow-500/20 text-yellow-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">Signal Mirror</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Visual distress signal</p>\n <button \n class=\"w-full btn-primary flex items-center justify-center space-x-2\" \n @click=\"signalMirror.flashing = !signalMirror.flashing; signalMirror.flashScreen()\" \n x-text=\"signalMirror.flashing ? 'STOP Flash' : 'Signal Mirror'\"\n aria-label=\"Toggle Signal Mirror\"\n >\n </button>\n </div>\n \n <!-- Compass -->\n <div class=\"tool-card\" x-data=\"compass\" x-init=\"initCompass()\">\n <div class=\"w-12 h-12 rounded-xl bg-blue-500/20 text-blue-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 10V3L4 14h7v7l9-11h-7z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">Digital Compass</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Find your direction</p>\n \n <div class=\"compass my-4\">\n <div class=\"compass-needle\" :style=\"`transform: translate(-50%, -50%) rotate(${compass.heading}deg); transform-origin: center center;`\">\n <svg class=\"w-full h-full\" viewBox=\"0 0 512 512\">\n <g x-ref=\"compassArrow\" style=\"transform-origin: center;\">\n <path d=\" M 248.445 67.683 C 248.279 67.978 248.129 68.282 247.997 68.594 C 247.526 69.592 247.22 70.66 247.092 71.756 L 210.24 254.254 C 210.013 255.45 210.013 256.677 210.24 257.872 L 246.875 440.559 C 247.687 445.167 251.69 448.526 256.369 448.526 C 261.048 448.526 265.051 445.166 265.862 440.559 L 302.498 257.858 C 302.724 256.663 302.724 255.435 302.498 254.24 L 265.638 71.749 C 264.964 68.179 262.335 65.294 258.844 64.29 C 255.352 63.287 251.593 64.336 249.126 67.002 L 248.453 67.675 L 248.445 67.683 Z M 229.683 256.056 L 283.048 256.049 L 256.362 389.465 L 229.683 256.056 Z \" fill=\"#000\"/>\n </g>\n </svg>\n </div>\n <div class=\"compass-center\"></div>\n </div>\n \n <div class=\"text-center\">\n <span class=\"text-xl font-bold\" x-text=\"compass.heading + '°'\">0°</span>\n <p class=\"text-gray-400 text-sm mt-1\" x-text=\"compass.direction\">N</p>\n </div>\n </div>\n \n <!-- Pedometer -->\n <div class=\"tool-card\" x-data=\"pedometer\" x-init=\"init()\">\n <div class=\"w-12 h-12 rounded-xl bg-green-500/20 text-green-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 7h8m0 0v8m0-8l-8 8-4-4-6 6\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">Pedometer</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Track your movement</p>\n \n <div class=\"w-full bg-gray-800/50 rounded-xl p-4 mb-4\">\n <div class=\"flex justify-between mb-2\">\n <span class=\"text-gray-400\">Steps:</span>\n <span class=\"font-medium text-white\" x-text=\"steps\">1,245</span>\n </div>\n <div class=\"flex justify-between\">\n <span class=\"text-gray-400\">Distance:</span>\n <span class=\"font-medium text-white\" x-text=\"(steps * stepLength).toFixed(2) + ' m'\">996.0 m</span>\n </div>\n </div>\n \n <button \n @click=\"reset()\" \n class=\"w-full btn-primary\"\n aria-label=\"Reset Pedometer\"\n >\n Reset\n </button>\n </div>\n \n <!-- Morse Code -->\n <div class=\"tool-card col-span-1 sm:col-span-2 lg:col-span-1\">\n <div class=\"w-12 h-12 rounded-xl bg-purple-500/20 text-purple-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">Morse Code</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Encode and decode messages</p>\n \n <div class=\"w-full mb-4\">\n <input \n x-model=\"morseCode.textInput\" \n @input=\"morseCode.updateMorse()\" \n type=\"text\" \n placeholder=\"Enter text...\" \n class=\"input-field w-full mb-3\"\n aria-label=\"Morse Code Input\"\n >\n <button \n @click=\"morseCode.playMorseCode()\" \n class=\"w-full btn-primary flex items-center justify-center space-x-2\"\n x-text=\"morseCode.playing ? 'Stop' : 'Play'\"\n aria-label=\"Play Morse Code\"\n >\n </button>\n </div>\n \n <div class=\"w-full bg-gray-800/50 rounded-xl p-4\">\n <p class=\"text-gray-400 text-sm mb-1\">Morse Code:</p>\n <p class=\"font-mono text-white break-all\" x-text=\"morseCode.morseOutput\">.... . .-.. .-.. ---</p>\n </div>\n </div>\n \n <!-- Level Tool -->\n <div class=\"tool-card col-span-1 sm:col-span-2 lg:col-span-1\" x-data=\"levelTool\">\n <div class=\"w-12 h-12 rounded-xl bg-indigo-500/20 text-indigo-400 flex items-center justify-center mb-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3\" />\n </svg>\n </div>\n <h3 class=\"font-semibold text-lg mb-2\">Level Tool</h3>\n <p class=\"text-gray-400 text-sm text-center mb-4\">Check surface levelness</p>\n \n <div class=\"relative w-full h-40 border-2 border-gray-700 rounded-xl flex justify-center items-center overflow-hidden bg-gray-800/50 mb-4\" style=\"transform: rotate(180deg);\">\n <div class=\"absolute w-8 h-8 bg-green-500 rounded-full transition-transform\" :style=\"'transform: ' + bubbleX() + ' ' + bubbleY()\"></div>\n <div class=\"absolute w-full h-0.5 bg-gray-600\"></div>\n <div class=\"absolute h-full w-0.5 bg-gray-600\"></div>\n </div>\n \n <p class=\"text-gray-400 text-sm text-center\">Tilt your device to see the bubble move.</p>\n </div>\n </div>\n </div>\n\n <!-- Guides Tab -->\n <div x-show=\"activeTab === 'library'\" x-data=\"library\" class=\"space-y-6\">\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Survival Guides</h2>\n <p class=\"text-gray-400 text-sm\">Learn essential survival skills and techniques</p>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-6 mb-6\">\n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Guides Completed</span>\n <span class=\"font-bold text-white\" x-text=\"completedGuides + '/' + totalGuides\">8/24</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" :style=\"`width: ${libraryProgress}%`\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0%</span>\n <span class=\"text-xs text-gray-400\" x-text=\"`${libraryProgress}%`\">33%</span>\n <span class=\"text-xs text-gray-400\">100%</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Readiness Level</span>\n <span class=\"font-bold text-white\" x-text=\"globalReadinessLevel\">Intermediate</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 60%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">Beginner</span>\n <span class=\"text-xs text-gray-400\">Intermediate</span>\n <span class=\"text-xs text-gray-400\">Expert</span>\n </div>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4\">\n <div class=\"flex justify-between items-center mb-2\">\n <span class=\"text-gray-400 text-sm\">Skills Mastered</span>\n <span class=\"font-bold text-white\">5/12</span>\n </div>\n <div class=\"progress-bar\">\n <div class=\"progress-fill\" style=\"width: 42%\"></div>\n </div>\n <div class=\"flex justify-between mt-1\">\n <span class=\"text-xs text-gray-400\">0</span>\n <span class=\"text-xs text-gray-400\">5</span>\n <span class=\"text-xs text-gray-400\">12</span>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Search and Filter -->\n <div class=\"card p-6\">\n <div class=\"flex flex-col space-y-4 \">\n <div class=\"flex-1\">\n <input \n x-model=\"searchQuery\" \n type=\"search\" \n placeholder=\"Search guides...\" \n class=\"input-field w-full rounded-full pr-10 search-input-with-icon\"\n aria-label=\"Search Guides\"\n >\n </div>\n \n <div class=\"flex flex-row overflow-x-auto pb-2 hide-scrollbar\">\n <div class=\"flex space-x-2\">\n <template x-for=\"category in categories\" :key=\"category.key\">\n <button \n @click=\"activeCategory = category.key\" \n :class=\"{ 'bg-blue-500 text-white': activeCategory === category.key }\" \n class=\"px-4 py-2 rounded-lg transition whitespace-nowrap bg-gray-800 hover:bg-gray-700\"\n :aria-label=\"`Filter by ${category.name}`\"\n >\n <span x-text=\"category.name\">All</span>\n <span class=\"ml-2 text-xs text-gray-300\" x-text=\"`(${getCategoryPercentage(category.key)}%)`\">(33%)</span>\n </button>\n </template>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Guides Grid -->\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n <template x-for=\"guide in filteredGuides\" :key=\"guide.title\">\n <div class=\"guide-card\">\n <div class=\"flex justify-between items-start mb-4\">\n <h3 class=\"font-semibold text-lg\" x-text=\"guide.title\">Fire Making</h3>\n <span class=\"px-2 py-1 bg-blue-500/20 text-blue-400 text-xs rounded-full\" x-text=\"guide.difficulty\">Intermediate</span>\n </div>\n \n <p class=\"text-gray-400 mb-4\" x-text=\"guide.description\">\n Learn how to create fire using various methods in survival situations.\n </p>\n \n <div class=\"flex justify-between items-center mb-4\">\n <button \n @click=\"toggleGuide(guide)\" \n class=\"btn-primary text-sm\"\n :aria-expanded=\"guide.expanded\"\n :aria-label=\"`Toggle ${guide.title} Details`\"\n >\n <span x-text=\"guide.expanded ? 'Hide Details' : 'View Guide'\">View Guide</span>\n </button>\n \n <label class=\"flex items-center cursor-pointer\">\n <input type=\"checkbox\" class=\"hidden\" @change=\"toggleGuideCompletion(guide)\" :checked=\"guide.completed\" :aria-label=\"`Mark ${guide.title} as Completed`\">\n <div class=\"relative w-10 h-5 rounded-full transition-all\" :class=\"guide.completed ? 'bg-green-500' : 'bg-gray-500'\">\n <div class=\"absolute left-1 top-1 w-3 h-3 bg-white rounded-full transition-all\" :class=\"{'translate-x-5': guide.completed}\"></div>\n </div>\n <span class=\"ml-2 text-sm\" :class=\"guide.completed ? 'text-green-400' : 'text-gray-300'\" x-text=\"guide.completed ? 'Completed' : 'Incomplete'\">Incomplete</span>\n </label>\n </div>\n \n <div x-show=\"guide.expanded\" class=\"mt-4 p-4 bg-gray-800/50 rounded-lg\">\n <h4 class=\"text-md font-semibold text-white mb-2\">Materials Needed:</h4>\n <ul class=\"list-disc list-inside text-gray-300 space-y-1 mb-4\">\n <template x-for=\"material in guide.materials\">\n <li x-text=\"material\">Dry tinder</li>\n </template>\n </ul>\n \n <h4 class=\"text-md font-semibold text-white mb-2\">Steps:</h4>\n <div class=\"list-decimal list-inside text-gray-300 space-y-2 mb-4\">\n <template x-for=\"step in guide.steps\">\n <div x-html=\"markdownToHTML(step)\">Gather dry tinder, kindling, and fuelwood.</div>\n </template>\n </div>\n \n <h4 class=\"text-md font-semibold text-white mb-2\">Tips:</h4>\n <ul class=\"list-disc list-inside text-gray-300 space-y-1\">\n <template x-for=\"tip in guide.tips\">\n <li x-html=\"markdownToHTML(tip)\">Always have multiple fire-starting methods available.</li>\n </template>\n </ul>\n </div>\n </div>\n </template>\n </div>\n </div>\n\n <!-- Emergency Plan Tab -->\n <div x-show=\"activeTab === 'plan'\" x-data=\"emergencyPlan\" class=\"space-y-6\">\n <div class=\"card p-6\">\n <div class=\"section-header\">\n <div class=\"section-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n </svg>\n </div>\n <div>\n <h2 class=\"text-xl font-semibold\">Emergency Preparedness Plan</h2>\n <p class=\"text-gray-400 text-sm\">Build a detailed emergency plan for you and your family</p>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-6 mb-6\">\n <div class=\"bg-gray-800/50 rounded-xl p-4 text-center\">\n <div class=\"w-12 h-12 rounded-xl bg-blue-500/20 text-blue-400 flex items-center justify-center mx-auto mb-3\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold mb-1\">Family Members</h3>\n <p class=\"text-gray-400 text-sm\" x-text=\"plan.coreIdentity.familyMembers.length\">4</p>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4 text-center\">\n <div class=\"w-12 h-12 rounded-xl bg-green-500/20 text-green-400 flex items-center justify-center mx-auto mb-3\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold mb-1\">Emergency Contacts</h3>\n <p class=\"text-gray-400 text-sm\" x-text=\"plan.coreIdentity.contacts.length\">6</p>\n </div>\n \n <div class=\"bg-gray-800/50 rounded-xl p-4 text-center\">\n <div class=\"w-12 h-12 rounded-xl bg-yellow-500/20 text-yellow-400 flex items-center justify-center mx-auto mb-3\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z\" />\n </svg>\n </div>\n <h3 class=\"font-semibold mb-1\">Go Bag Items</h3>\n <p class=\"text-gray-400 text-sm\" x-text=\"plan.goBag.length\">12</p>\n </div>\n </div>\n \n <div class=\"grid grid-cols-1 sm:grid-cols-3 gap-6\">\n <button @click=\"savePlan()\" class=\"btn-primary flex items-center justify-center space-x-2\" aria-label=\"Save Plan\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n </svg>\n <span>Save Plan</span>\n </button>\n <button @click=\"exportPlan()\" class=\"btn-secondary flex items-center justify-center space-x-2\" x-tooltip=\"'Exports plan as JSON'\" aria-label=\"Export Plan as JSON\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10\" />\n </svg>\n <span>Export JSON</span>\n </button>\n <button @click=\"exportPlanPDF()\" class=\"btn-primary flex items-center justify-center space-x-2\" x-tooltip=\"'Exports plan as PDF'\" aria-label=\"Export Plan as PDF\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n </svg>\n <span>Export PDF</span>\n </button>\n </div>\n </div>\n \n <!-- Plan Sections -->\n <div class=\"space-y-6\">\n <!-- Core Identity and Safety -->\n <div class=\"card p-6\">\n <div class=\"flex items-center justify-between mb-4 cursor-pointer\" @click=\"sections.coreIdentity = !sections.coreIdentity\" role=\"button\" :aria-expanded=\"sections.coreIdentity\">\n <div class=\"flex items-center space-x-3\">\n <div class=\"w-10 h-10 rounded-xl bg-blue-500/20 text-blue-400 flex items-center justify-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\" />\n </svg>\n </div>\n <div>\n <h3 class=\"font-semibold\">Core Identity and Safety</h3>\n <p class=\"text-gray-400 text-sm\">Essential family information and contacts</p>\n </div>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 text-gray-400 transition-transform\" :class=\"{'rotate-180': sections.coreIdentity}\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </div>\n \n <div x-show=\"sections.coreIdentity\" class=\"mt-6 space-y-6\">\n <!-- Safe Word and Meetup Locations -->\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\">\n <div>\n <label class=\"block text-sm font-medium mb-2\" for=\"safeWord\">Family Safe Word</label>\n <input x-model=\"plan.coreIdentity.safeWord\" type=\"text\" id=\"safeWord\" placeholder=\"Safe word\" class=\"input-field w-full\" aria-label=\"Safe Word\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" for=\"primaryMeetup\">Primary Meet-up</label>\n <input x-model=\"plan.coreIdentity.primaryMeetup\" type=\"text\" id=\"primaryMeetup\" placeholder=\"e.g., Neighbor's house\" class=\"input-field w-full\" aria-label=\"Primary Meet-up Location\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" for=\"backupMeetup\">Backup Meet-up</label>\n <input x-model=\"plan.coreIdentity.backupMeetup\" type=\"text\" id=\"backupMeetup\" placeholder=\"e.g., City hall\" class=\"input-field w-full\" aria-label=\"Backup Meet-up Location\">\n </div>\n </div>\n \n <!-- Emergency Contacts -->\n <div>\n <h4 class=\"font-semibold mb-4 flex items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 mr-2 text-blue-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\" />\n </svg>\n Emergency Contacts\n </h4>\n \n <div class=\"space-y-4\">\n <template x-for=\"(contact, index) in plan.coreIdentity.contacts\" :key=\"index\">\n <div class=\"grid grid-cols-1 md:grid-cols-4 gap-4 items-end\">\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'contact-name-' + index\">Name</label>\n <input x-model=\"contact.name\" type=\"text\" :id=\"'contact-name-' + index\" placeholder=\"Name\" class=\"input-field w-full\" :aria-label=\"'Contact Name ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'contact-phone-' + index\">Phone</label>\n <input x-model=\"contact.phone\" type=\"tel\" :id=\"'contact-phone-' + index\" placeholder=\"Phone\" class=\"input-field w-full\" :aria-label=\"'Contact Phone ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'contact-role-' + index\">Role</label>\n <input x-model=\"contact.role\" type=\"text\" :id=\"'contact-role-' + index\" placeholder=\"Role\" class=\"input-field w-full\" :aria-label=\"'Contact Role ' + index\">\n </div>\n <div>\n <button @click=\"removeContact(index)\" class=\"btn-danger w-full\" :disabled=\"plan.coreIdentity.contacts.length <= 1\" :aria-label=\"'Remove Contact ' + index\">Remove</button>\n </div>\n </div>\n </template>\n \n <button @click=\"addContact()\" class=\"btn-primary flex items-center justify-center space-x-2 w-full md:w-auto\" aria-label=\"Add Contact\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6v6m0 0v6m0-6h6m-6 0H6\" />\n </svg>\n <span>Add Contact</span>\n </button>\n </div>\n </div>\n \n <!-- Family Members -->\n <div>\n <h4 class=\"font-semibold mb-4 flex items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 mr-2 text-blue-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z\" />\n </svg>\n Family Members\n </h4>\n \n <div class=\"space-y-4\">\n <template x-for=\"(member, index) in plan.coreIdentity.familyMembers\" :key=\"index\">\n <div class=\"grid grid-cols-1 md:grid-cols-6 gap-4 items-end\">\n <div class=\"md:col-span-2\">\n <label class=\"block text-sm font-medium mb-2\" :for=\"'member-name-' + index\">Name</label>\n <input x-model=\"member.name\" type=\"text\" :id=\"'member-name-' + index\" placeholder=\"Name\" class=\"input-field w-full\" :aria-label=\"'Family Member Name ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'member-birthday-' + index\">Birthday</label>\n <input x-model=\"member.birthday\" type=\"text\" :id=\"'member-birthday-' + index\" placeholder=\"Birthday\" class=\"input-field w-full\" :aria-label=\"'Family Member Birthday ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'member-allergies-' + index\">Allergies</label>\n <input x-model=\"member.allergies\" type=\"text\" :id=\"'member-allergies-' + index\" placeholder=\"Allergies\" class=\"input-field w-full\" :aria-label=\"'Family Member Allergies ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'member-medications-' + index\">Medications</label>\n <input x-model=\"member.medications\" type=\"text\" :id=\"'member-medications-' + index\" placeholder=\"Medications\" class=\"input-field w-full\" :aria-label=\"'Family Member Medications ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'member-bloodType-' + index\">Blood Type</label>\n <input x-model=\"member.bloodType\" type=\"text\" :id=\"'member-bloodType-' + index\" placeholder=\"Blood Type\" class=\"input-field w-full\" :aria-label=\"'Family Member Blood Type ' + index\">\n </div>\n <div>\n <button @click=\"removeFamilyMember(index)\" class=\"btn-danger w-full\" :disabled=\"plan.coreIdentity.familyMembers.length <= 1\" :aria-label=\"'Remove Family Member ' + index\">Remove</button>\n </div>\n </div>\n </template>\n \n <button @click=\"addFamilyMember()\" class=\"btn-primary flex items-center justify-center space-x-2 w-full md:w-auto\" aria-label=\"Add Family Member\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6v6m0 0v6m0-6h6m-6 0H6\" />\n </svg>\n <span>Add Family Member</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Additional sections would follow the same pattern -->\n <!-- For brevity, I'm showing just the first section in this example -->\n \n <!-- Go Bag Checklist -->\n <div class=\"card p-6\">\n <div class=\"flex items-center justify-between mb-4 cursor-pointer\" @click=\"sections.goBag = !sections.goBag\" role=\"button\" :aria-expanded=\"sections.goBag\">\n <div class=\"flex items-center space-x-3\">\n <div class=\"w-10 h-10 rounded-xl bg-green-500/20 text-green-400 flex items-center justify-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4\" />\n </svg>\n </div>\n <div>\n <h3 class=\"font-semibold\">Go Bag Checklist</h3>\n <p class=\"text-gray-400 text-sm\">Essential items for emergency evacuation</p>\n </div>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 text-gray-400 transition-transform\" :class=\"{'rotate-180': sections.goBag}\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </div>\n \n <div x-show=\"sections.goBag\" class=\"mt-6\">\n <div class=\"space-y-4\">\n <template x-for=\"(item, index) in plan.goBag\" :key=\"index\">\n <div class=\"grid grid-cols-1 md:grid-cols-5 gap-4 items-end\">\n <div class=\"md:col-span-3\">\n <label class=\"block text-sm font-medium mb-2\" :for=\"'gobag-item-' + index\">Item Name</label>\n <input x-model=\"item.name\" type=\"text\" :id=\"'gobag-item-' + index\" placeholder=\"Item Name\" class=\"input-field w-full\" :aria-label=\"'Go Bag Item Name ' + index\">\n </div>\n <div>\n <label class=\"block text-sm font-medium mb-2\" :for=\"'gobag-quantity-' + index\">Quantity</label>\n <input x-model.number=\"item.quantity\" type=\"number\" :id=\"'gobag-quantity-' + index\" placeholder=\"Qty\" min=\"1\" class=\"input-field w-full\" :aria-label=\"'Go Bag Item Quantity ' + index\">\n </div>\n <div>\n <button @click=\"removeGoBagItem(index)\" class=\"btn-danger w-full\" :disabled=\"plan.goBag.length <= 1\" :aria-label=\"'Remove Go Bag Item ' + index\">Remove</button>\n </div>\n </div>\n </template>\n \n <button @click=\"addGoBagItem()\" class=\"btn-primary flex items-center justify-center space-x-2 w-full md:w-auto\" aria-label=\"Add Go Bag Item\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6v6m0 0v6m0-6h6m-6 0H6\" />\n </svg>\n <span>Add Go Bag Item</span>\n </button>\n </div>\n </div>\n </div>\n \n <!-- Additional plan sections would be implemented similarly -->\n </div>\n </div>\n </main>\n </div>\n\n <!-- Signal Mirror Overlay -->\n <div id=\"signalMirror\" class=\"fixed inset-0 bg-white hidden z-50\"></div>\n</div>",
"css": "@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');\n\n:root {\n --primary: #3b82f6;\n --primary-dark: #1d4ed8;\n --secondary: #10b981;\n --accent: #f59e0b;\n --danger: #ef4444;\n --dark: #111827;\n --darker: #0a0f1c;\n --light: #f9fafb;\n --gray: #6b7280;\n --gray-dark: #374151;\n}\n\nbody {\n font-family: 'Inter', sans-serif;\n background-color: var(--darker);\n color: var(--light);\n}\n\n.card {\n background: linear-gradient(145deg, #1f2937, #111827);\n border-radius: 12px;\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid rgba(255, 255, 255, 0.05);\n transition: all 0.3s ease;\n}\n\n.card:hover {\n transform: translateY(-2px);\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n}\n\n.tab-active {\n background: linear-gradient(135deg, var(--primary), var(--primary-dark));\n color: white;\n box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.3);\n}\n\n.progress-bar {\n height: 8px;\n border-radius: 4px;\n background-color: var(--gray-dark);\n overflow: hidden;\n}\n\n.progress-fill {\n height: 100%;\n border-radius: 4px;\n background: linear-gradient(90deg, var(--primary), var(--secondary));\n transition: width 0.5s ease;\n}\n\n.skill-icon {\n width: 48px;\n height: 48px;\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n background: rgba(59, 130, 246, 0.1);\n color: var(--primary);\n}\n\n.btn-primary {\n background: linear-gradient(135deg, var(--primary), var(--primary-dark));\n color: white;\n border-radius: 8px;\n padding: 10px 20px;\n font-weight: 500;\n transition: all 0.3s ease;\n}\n\n.btn-primary:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);\n}\n\n.btn-secondary {\n background: linear-gradient(135deg, var(--secondary), #059669);\n color: white;\n border-radius: 8px;\n padding: 10px 20px;\n font-weight: 500;\n transition: all 0.3s ease;\n}\n\n.btn-secondary:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);\n}\n\n.btn-danger {\n background: linear-gradient(135deg, var(--danger), #dc2626);\n color: white;\n border-radius: 8px;\n padding: 10px 20px;\n font-weight: 500;\n transition: all 0.3s ease;\n}\n\n.btn-danger:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);\n}\n\n.tool-card {\n background: linear-gradient(145deg, #1f2937, #111827);\n border-radius: 12px;\n padding: 20px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n transition: all 0.3s ease;\n border: 1px solid rgba(255, 255, 255, 0.05);\n}\n\n.tool-card:hover {\n transform: translateY(-5px);\n box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.2);\n}\n\n.guide-card {\n background: linear-gradient(145deg, #1f2937, #111827);\n border-radius: 12px;\n padding: 20px;\n transition: all 0.3s ease;\n border: 1px solid rgba(255, 255, 255, 0.05);\n}\n\n.guide-card:hover {\n transform: translateY(-3px);\n box-shadow: 0 8px 20px -5px rgba(0, 0, 0, 0.2);\n}\n\n.section-header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 20px;\n}\n\n.section-icon {\n width: 40px;\n height: 40px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n background: rgba(59, 130, 246, 0.1);\n color: var(--primary);\n}\n\n.input-field {\n background-color: rgba(31, 41, 55, 0.7);\n border: 1px solid rgba(255, 255, 255, 0.1);\n border-radius: 8px;\n padding: 12px 16px;\n color: white;\n transition: all 0.3s ease;\n}\n\n.search-input-with-icon {\n background-image: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"rgba(255, 255, 255, 0.2)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"/><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"/></svg>');\n background-repeat: no-repeat;\n background-position: right 15px center;\n background-size: 20px 20px;\n}\n\n.input-field:focus {\n outline: none;\n border-color: var(--primary);\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);\n}\n\n.toggle-switch {\n position: relative;\n display: inline-block;\n width: 60px;\n height: 30px;\n}\n\n.toggle-switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n\n.toggle-slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--gray-dark);\n transition: .4s;\n border-radius: 34px;\n}\n\n.toggle-slider:before {\n position: absolute;\n content: \"\";\n height: 22px;\n width: 22px;\n left: 4px;\n bottom: 4px;\n background-color: white;\n transition: .4s;\n border-radius: 50%;\n}\n\ninput:checked + .toggle-slider {\n background-color: var(--primary);\n}\n\ninput:checked + .toggle-slider:before {\n transform: translateX(30px);\n}\n\n.status-indicator {\n width: 10px;\n height: 10px;\n border-radius: 50%;\n display: inline-block;\n margin-right: 8px;\n}\n\n.status-active {\n background-color: var(--secondary);\n box-shadow: 0 0 8px var(--secondary);\n}\n\n.status-inactive {\n background-color: var(--gray);\n}\n\n.compass {\n width: 200px;\n height: 200px;\n border-radius: 50%;\n background: conic-gradient(from 0deg, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);\n position: relative;\n margin: 0 auto;\n}\n\n.compass-needle {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 120px;\n height: 120px;\n transform-origin: center center;\n}\n\n.compass-center {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 20px;\n height: 20px;\n background-color: #000;\n border-radius: 50%;\n z-index: 10;\n}\n\n@keyframes pulse {\n 0% { transform: scale(1); opacity: 1; }\n 50% { transform: scale(1.05); opacity: 0.8; }\n 100% { transform: scale(1); opacity: 1; }\n}\n\n.pulse {\n animation: pulse 2s infinite;\n}\n\n@keyframes flash {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.3; }\n}\n\n.flash {\n animation: flash 1s infinite;\n}\n\n/* Custom CSS for Markdown */\nul p, ul strong {\n display: unset;\n margin: 0;\n padding: 0;\n}",
"javascript": "document.addEventListener('alpine:init', () => {\n // App Data\n Alpine.data('app', () => ({\n appData: {\n appName: \"Beacon\",\n appDescription: \"Offline Survival Training & Tools\",\n features: {\n tools: {\n title: \"Survival Tools\",\n items: [\n { name: \"SOS Signal\", description: \"Emits a Morse code distress signal.\", icon: \"🚨\" },\n { name: \"Signal Mirror\", description: \"Flashes an SOS sequence using device screen.\", icon: \"🪞\" },\n { name: \"Compass\", description: \"Uses device orientation sensors for navigation.\", icon: \"🧭\" },\n { name: \"Pedometer\", description: \"Tracks steps and estimated travel distance.\", icon: \"🚶\" },\n { name: \"Level Tool\", description: \"Uses accelerometer to level objects.\", icon: \"📏\" }\n ]\n }\n }\n }, \n activeTab: loadStateFromLocalStorage('activeTab', 'training'),\n selectedGuide: null,\n searchQuery: '',\n activeCategory: 'all', \n wakeLock: null,\n countdownSeconds: 0,\n async requestWakeLock() {\n if ('wakeLock' in navigator) {\n try {\n this.wakeLock = await navigator.wakeLock.request('screen');\n console.log('Wake lock is active');\n } catch (err) {\n console.error('Wake lock error:', err.name, err.message);\n }\n } else {\n alert('Your browser does not support wake lock. Please keep your screen on manually during training.');\n }\n },\n releaseWakeLock() {\n if (this.wakeLock !== null) {\n this.wakeLock.release()\n .then(() => {\n console.log('Wake lock released');\n this.wakeLock = null;\n });\n }\n },\n\n // Filter Guides\n get filteredGuides() {\n let guides = this.appData.features.library.guides;\n if (this.activeCategory !== 'all') {\n guides = guides.filter(guide => guide.category === this.activeCategory);\n }\n if (this.searchQuery) {\n guides = guides.filter(guide =>\n guide.title.toLowerCase().includes(this.searchQuery.toLowerCase()) ||\n guide.description.toLowerCase().includes(this.searchQuery.toLowerCase())\n );\n }\n return guides;\n },\n\n // Method to set active tab and store it\n async setActiveTab(tab) {\n this.releaseWakeLock();\n this.activeTab = tab;\n saveStateToLocalStorage('activeTab', tab);\n if (['training', 'tools'].includes(tab)) {\n await this.requestWakeLock();\n }\n },\n\n // Open Guide\n openGuide(guide) {\n this.selectedGuide = guide;\n },\n }));\n \n // localStorage\n function saveStateToLocalStorage(key, state) {\n localStorage.setItem(key, JSON.stringify(state));\n }\n function loadStateFromLocalStorage(key, defaultValue) {\n const stored = localStorage.getItem(key);\n return stored ? JSON.parse(stored) : defaultValue;\n }\n \n // Training System\n Alpine.data('training', () => ({\n skillPoints: loadStateFromLocalStorage(\"skillPoints\", 0),\n\n skills: loadStateFromLocalStorage(\"skills\", [\n // 🎒 Bug-Out Bag Readiness\n {\n name: \"Bug-Out Bag Readiness\",\n icon: \"🎒\",\n subSkills: [\n { name: \"Weight Management\", progress: 0 },\n { name: \"Speed Packing\", progress: 0 },\n { name: \"Endurance Training\", progress: 0 }\n ],\n challenges: [\n { text: \"Pack a 45L bug-out bag in under 5 minutes.\", targetSubSkill: \"Speed Packing\" },\n { text: \"Adjust pack weight for optimal mobility in under 10 minutes.\", targetSubSkill: \"Weight Management\" },\n { text: \"Complete a 3-mile hike with a 30lb bag in under 1 hour.\", targetSubSkill: \"Endurance Training\" },\n { text: \"Pack essential bug-out gear while blindfolded (simulating power outage).\", targetSubSkill: \"Speed Packing\" },\n { text: \"Reduce your bug-out bag weight by at least 15% without removing essentials.\", targetSubSkill: \"Weight Management\" },\n { text: \"Perform a full gear check and repack under 3 minutes.\", targetSubSkill: \"Speed Packing\" },\n { text: \"Hike for 5 miles while carrying a full bug-out bag and map out water sources along the way.\", targetSubSkill: \"Endurance Training\" }\n ],\n challengeActive: false, expanded: false, level: \"Beginner\"\n },\n \n // 🛠 Tool Mastery\n {\n name: \"Tool Mastery\",\n description: \"Knife, Axe, Saw\",\n icon: \"🗡️\",\n subSkills: [\n { name: \"Knife Skills\", progress: 0 },\n { name: \"Axe Handling\", progress: 0 },\n { name: \"Saw Techniques\", progress: 0 }\n ],\n challenges: [\n // Knife Skills\n {\n text: \"Sharpen a knife to a razor edge in under 5 minutes.\",\n targetSubSkill: \"Knife Skills\"\n },\n {\n text: \"Carve a wooden spoon using only a knife in under 10 minutes.\",\n targetSubSkill: \"Knife Skills\"\n },\n {\n text: \"Split a log using a knife and a piece of wood in under 5 minutes.\",\n targetSubSkill: \"Knife Skills\"\n },\n {\n text: \"Whittle a tent peg from a stick in under 3 minutes.\",\n targetSubSkill: \"Knife Skills\"\n },\n // Axe Handling\n {\n text: \"Split a log using an axe in under 3 minutes.\",\n targetSubSkill: \"Axe Handling\"\n },\n {\n text: \"Polish an axe using animal fat.\",\n targetSubSkill: \"Axe Handling\"\n },\n {\n text: \"Make a featherstick using an axe in under 10 minutes.\",\n targetSubSkill: \"Axe Handling\"\n },\n {\n text: \"Chop down a small tree (4-6 inches in diameter) in under 5 minutes.\",\n targetSubSkill: \"Axe Handling\"\n },\n // Saw Techniques\n {\n text: \"Cut a straight line through a piece of wood using a saw in under 2 minutes.\",\n targetSubSkill: \"Saw Techniques\"\n },\n {\n text: \"Cut a v-notch in a piece of wood using a saw in under 5 minutes.\",\n targetSubSkill: \"Saw Techniques\"\n },\n {\n text: \"Cut a log into three equal pieces using a saw in under 10 minutes.\",\n targetSubSkill: \"Saw Techniques\"\n }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false,\n },\n \n // 🪨 Flint Knapping & Primitive Toolmaking\n {\n name: \"Flint Knapping & Primitive Toolmaking\",\n description: \"Stone Tools, Pressure Flaking, Advanced Crafting\",\n icon: \"🪨\",\n subSkills: [\n { name: \"Core Reduction\", progress: 0 },\n { name: \"Pressure Flaking\", progress: 0 },\n { name: \"Blade & Tool Making\", progress: 0 }\n ],\n challenges: [\n // Core Reduction\n { text: \"Select and prepare a suitable rock for knapping.\", targetSubSkill: \"Core Reduction\" },\n { text: \"Break a stone into usable flakes using percussion techniques.\", targetSubSkill: \"Core Reduction\" },\n { text: \"Create a sharp cutting tool from a raw stone.\", targetSubSkill: \"Core Reduction\" },\n \n // Pressure Flaking\n { text: \"Refine a stone blade using pressure flaking techniques.\", targetSubSkill: \"Pressure Flaking\" },\n { text: \"Sharpen a dull edge on a flint knife using only a bone or antler.\", targetSubSkill: \"Pressure Flaking\" },\n { text: \"Create a notched point for an arrowhead using pressure flaking.\", targetSubSkill: \"Pressure Flaking\" },\n \n // Blade & Tool Making\n { text: \"Make a stone knife and attach it to a handle using sinew or cordage.\", targetSubSkill: \"Blade & Tool Making\" },\n { text: \"Craft a primitive spearhead using stone and attach it to a shaft.\", targetSubSkill: \"Blade & Tool Making\" },\n { text: \"Create a stone scraper for hide processing.\", targetSubSkill: \"Blade & Tool Making\" },\n { text: \"Use a stone drill to bore a hole in wood or bone.\", targetSubSkill: \"Blade & Tool Making\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n \n // 🔥 Fire Mastery\n {\n name: \"Fire Starting\",\n icon: \"🔥\",\n subSkills: [\n { name: \"Ferro Rod\", progress: 0 },\n { name: \"Mirror\", progress: 0 },\n { name: \"Magnifying Lens\", progress: 0 },\n { name: \"Bow Drill\", progress: 0 },\n { name: \"Flint & Steel\", progress: 0 },\n { name: \"Hand Drill\", progress: 0 },\n { name: \"Fire Plough\", progress: 0 }\n ],\n challenges: [\n // Ferro Rod\n {\n text: \"Start a fire using a ferro rod in under 5 minutes.\",\n targetSubSkill: \"Ferro Rod\"\n },\n {\n text: \"Ignite a pile of dry tinder using a ferro rod in under 3 minutes.\",\n targetSubSkill: \"Ferro Rod\"\n },\n {\n text: \"Start a fire using a ferro rod with damp tinder in under 10 minutes.\",\n targetSubSkill: \"Ferro Rod\"\n },\n // Mirror\n {\n text: \"Start a fire using a mirror in under 10 minutes.\",\n targetSubSkill: \"Mirror\"\n },\n {\n text: \"Reflect sunlight onto a target 50 meters away using a mirror.\",\n targetSubSkill: \"Mirror\"\n },\n // Magnifying Lens\n {\n text: \"Start a fire using a magnifying lens in under 10 minutes.\",\n targetSubSkill: \"Magnifying Lens\"\n },\n {\n text: \"Ignite a piece of char cloth using a magnifying lens in under 5 minutes.\",\n targetSubSkill: \"Magnifying Lens\"\n },\n // Bow Drill\n {\n text: \"Start a fire using a bow drill in under 5 minutes.\",\n targetSubSkill: \"Bow Drill\"\n },\n {\n text: \"Carve a bow drill set from raw materials in under 20 minutes.\",\n targetSubSkill: \"Bow Drill\"\n },\n // Flint & Steel\n {\n text: \"Start a fire using flint and steel (or pyrite and chert) in under 7 minutes.\",\n targetSubSkill: \"Flint & Steel\"\n },\n {\n text: \"Ignite a pile of tinder using flint and steel in under 3 minutes.\",\n targetSubSkill: \"Flint & Steel\"\n },\n // Hand Drill\n {\n text: \"Start a fire using a hand drill in under 7 minutes.\",\n targetSubSkill: \"Hand Drill\"\n },\n {\n text: \"Carve a hand drill set from raw materials in under 15 minutes.\",\n targetSubSkill: \"Hand Drill\"\n },\n // Fire Plough\n {\n text: \"Start a fire using a fire plough in under 7 minutes.\",\n targetSubSkill: \"Fire Plough\"\n },\n {\n text: \"Create a fire plough from raw materials in under 10 minutes.\",\n targetSubSkill: \"Fire Plough\"\n }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false,\n },\n\n // 💧 Water Collection & Purification\n {\n name: \"Water Collection & Purification\",\n description: \"Gathering, Filtration, Boiling, Solar Still\",\n icon: \"💧\",\n subSkills: [\n { name: \"Water Collection\", progress: 0 },\n { name: \"Filtration\", progress: 0 },\n { name: \"Boiling\", progress: 0 },\n { name: \"Solar Still\", progress: 0 }\n ],\n challenges: [\n // Water Collection\n { text: \"Find and collect 2 liters of water from a natural source.\", targetSubSkill: \"Water Collection\" },\n { text: \"Construct a rainwater catchment system using only natural materials.\", targetSubSkill: \"Water Collection\" },\n { text: \"Extract water from plant sources such as grapevines or cactus in under 10 minutes.\", targetSubSkill: \"Water Collection\" },\n { text: \"Melt snow or ice into drinkable water without contaminating it.\", targetSubSkill: \"Water Collection\" },\n \n // Filtration\n { text: \"Filter muddy water using a cloth and sand in under 5 minutes.\", targetSubSkill: \"Filtration\" },\n { text: \"Filter muddy water using a grapevine within 24 hours.\", targetSubSkill: \"Filtration\" },\n { text: \"Create a multi-layer water filter using charcoal, sand, and gravel.\", targetSubSkill: \"Filtration\" },\n \n // Boiling\n { text: \"Boil water using a makeshift container and stones in under 10 minutes.\", targetSubSkill: \"Boiling\" },\n { text: \"Boil water using a metal container and a fire in under 5 minutes.\", targetSubSkill: \"Boiling\" },\n \n // Solar Still\n { text: \"Collect water using a solar still in under 15 minutes.\", targetSubSkill: \"Solar Still\" },\n { text: \"Create a solar still using a plastic sheet and a container.\", targetSubSkill: \"Solar Still\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // 🏋️ Fitness & Exercise\n {\n name: \"Fitness & Exercise\",\n icon: \"🏋️\",\n subSkills: [\n { name: \"Bodyweight Strength\", progress: 0 },\n { name: \"Cardio & Endurance\", progress: 0 },\n { name: \"Flexibility & Mobility\", progress: 0 },\n { name: \"Agility & Speed\", progress: 0 },\n { name: \"Survival-Specific Training\", progress: 0 }\n ],\n challenges: [\n // 🏋️ **Bodyweight Strength**\n { text: \"Complete 100 push-ups in under 5 minutes.\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Perform 20 pull-ups in one set.\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Hold a plank position for 5 minutes.\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Do 50 deep squats with no rest.\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Perform 10 one-arm push-ups (5 per arm).\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Do 50 lunges per leg without stopping.\", targetSubSkill: \"Bodyweight Strength\" },\n { text: \"Perform 10 muscle-ups (bar or tree branch).\", targetSubSkill: \"Bodyweight Strength\" },\n \n // 🏃 **Cardio & Endurance**\n { text: \"Run 5 miles without stopping.\", targetSubSkill: \"Cardio & Endurance\" },\n { text: \"Perform 200 jumping jacks in 2 minutes.\", targetSubSkill: \"Cardio & Endurance\" },\n { text: \"Sprint 100 meters in under 15 seconds.\", targetSubSkill: \"Cardio & Endurance\" },\n { text: \"Carry a 40lb pack for 10 miles.\", targetSubSkill: \"Cardio & Endurance\" },\n { text: \"Climb a 10ft wall without assistance.\", targetSubSkill: \"Cardio & Endurance\" },\n \n // 🧘 **Flexibility & Mobility**\n { text: \"Perform a deep squat hold for 5 minutes.\", targetSubSkill: \"Flexibility & Mobility\" },\n { text: \"Perform 10 slow controlled pistol squats per leg.\", targetSubSkill: \"Flexibility & Mobility\" },\n { text: \"Hold a bridge pose for 2 minutes.\", targetSubSkill: \"Flexibility & Mobility\" },\n { text: \"Do a full split (or close to it).\", targetSubSkill: \"Flexibility & Mobility\" },\n { text: \"Perform a full backbend from standing position.\", targetSubSkill: \"Flexibility & Mobility\" },\n \n // ⚡ **Agility & Speed**\n { text: \"Perform 50 burpees in under 3 minutes.\", targetSubSkill: \"Agility & Speed\" },\n { text: \"Complete a 10-yard sprint in under 2 seconds.\", targetSubSkill: \"Agility & Speed\" },\n { text: \"Jump over a 4-foot obstacle with a running start.\", targetSubSkill: \"Agility & Speed\" },\n { text: \"Perform a standing broad jump of 6 feet.\", targetSubSkill: \"Agility & Speed\" },\n { text: \"Perform 10 consecutive box jumps onto a 24-inch platform.\", targetSubSkill: \"Agility & Speed\" },\n \n // 🏕 **Survival-Specific Training**\n { text: \"Carry a person (fireman’s carry) for 100 meters.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Swim 500 meters in open water without stopping.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Climb a 15-foot tree or rope without assistance.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Crawl under a 20-foot obstacle in under 1 minute.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Perform 100 knee strikes on a tree or post (self-defense).\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Drag a 100lb object for 50 meters.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Escape a wrist grab using leverage in under 2 seconds.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Climb a ladder with a 30lb weight in each hand.\", targetSubSkill: \"Survival-Specific Training\" },\n { text: \"Run a 1-mile obstacle course with full gear.\", targetSubSkill: \"Survival-Specific Training\" }\n ],\n challengeActive: false, expanded: false, level: \"Beginner\"\n },\n\n // 🪢 Knot Tying & Ropes\n {\n name: \"Knot Tying & Ropes\",\n icon: \"🪢\",\n subSkills: [\n { name: \"Basic Knots\", progress: 0 },\n { name: \"Lashings\", progress: 0 },\n { name: \"Advanced Knots\", progress: 0 },\n { name: \"Rope Making\", progress: 0 }\n ],\n challenges: [\n // Basic Knots\n { text: \"Tie a bowline knot in under 10 seconds.\", targetSubSkill: \"Basic Knots\" },\n { text: \"Tie a square knot in under 5 seconds.\", targetSubSkill: \"Basic Knots\" },\n { text: \"Tie a clove hitch in under 10 seconds.\", targetSubSkill: \"Basic Knots\" },\n // Lashings\n { \n text: \"Create a secure tripod lashing using only natural materials.\", \n targetSubSkill: \"Lashings\" \n },\n { \n text: \"Lash together a simple A-frame structure in under 10 minutes.\", \n targetSubSkill: \"Lashings\" \n },\n // Advanced Knots\n { \n text: \"Tie a Prusik knot in under 15 seconds.\", \n targetSubSkill: \"Advanced Knots\" \n },\n { \n text: \"Tie a fisherman's knot in under 10 seconds.\", \n targetSubSkill: \"Advanced Knots\" \n },\n // Rope Making\n { \n text: \"Make 2 feet of cordage from plant fibers in under 15 minutes.\", \n targetSubSkill: \"Rope Making\" \n },\n { \n text: \"Create a rope from animal sinew in under 20 minutes.\", \n targetSubSkill: \"Rope Making\" \n }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false,\n },\n\n // 🏕️ Shelter Building\n {\n name: \"Shelter Building\",\n icon: \"🏕️\",\n subSkills: [\n { name: \"Debris Hut\", progress: 0 },\n { name: \"Lean-To Shelter\", progress: 0 },\n { name: \"Snow Cave\", progress: 0 }\n ],\n challenges: [\n { text: \"Build a debris hut using only natural materials in under 30 minutes.\", targetSubSkill: \"Debris Hut\" },\n { text: \"Improve a debris hut for insulation by adding extra layers in under 15 minutes.\", targetSubSkill: \"Debris Hut\" },\n { text: \"Construct a lean-to shelter using logs and cordage in under 20 minutes.\", targetSubSkill: \"Lean-To Shelter\" },\n { text: \"Make a lean-to with a reflective heat wall to stay warm in under 25 minutes.\", targetSubSkill: \"Lean-To Shelter\" },\n { text: \"Construct a snow cave that fits one person safely in under 30 minutes.\", targetSubSkill: \"Snow Cave\" },\n { text: \"Reinforce a snow cave to withstand wind and maintain warmth.\", targetSubSkill: \"Snow Cave\" }\n ],\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // 🌦️ Weatherproof Survival\n {\n name: \"Weatherproof Survival\",\n description: \"Cold, Wet, Hot Climates\",\n icon: \"🌦️\",\n subSkills: [\n { name: \"Cold Climates\", progress: 0 },\n { name: \"Wet Climates\", progress: 0 },\n { name: \"Hot Climates\", progress: 0 }\n ],\n challenges: [\n { text: \"Build a shelter to withstand freezing temperatures in under 15 minutes.\", targetSubSkill: \"Cold Climates\" },\n { text: \"Make a windproof barrier using natural materials in under 10 minutes.\", targetSubSkill: \"Cold Climates\" },\n { text: \"Create a waterproof shelter using natural materials in under 20 minutes.\", targetSubSkill: \"Wet Climates\" },\n { text: \"Make a quick rain cover from available resources in under 5 minutes.\", targetSubSkill: \"Wet Climates\" },\n { text: \"Find and create shade to avoid heatstroke in under 10 minutes.\", targetSubSkill: \"Hot Climates\" },\n { text: \"Make an evaporative cooling system to keep water cool.\", targetSubSkill: \"Hot Climates\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // 🧭 Navigation & Orienteering\n {\n name: \"Navigation & Orienteering\",\n description: \"Compass, Sun & Stars, Natural Landmarks\",\n icon: \"🧭\",\n subSkills: [\n { name: \"Compass Use\", progress: 0 },\n { name: \"Sun & Stars\", progress: 0 },\n { name: \"Natural Landmarks\", progress: 0 }\n ],\n challenges: [\n { text: \"Navigate to a specific location using a compass in under 10 minutes.\", targetSubSkill: \"Compass Use\" },\n { text: \"Determine your bearing with a compass and adjust your path accordingly.\", targetSubSkill: \"Compass Use\" },\n { text: \"Determine north using the sun and a stick in under 5 minutes.\", targetSubSkill: \"Sun & Stars\" },\n { text: \"Use the stars to navigate in a low-light setting.\", targetSubSkill: \"Sun & Stars\" },\n { text: \"Find your way back to camp using natural landmarks in under 15 minutes.\", targetSubSkill: \"Natural Landmarks\" },\n { text: \"Identify at least 3 natural signs of direction (e.g., moss growth, tree bends, wind patterns).\", targetSubSkill: \"Natural Landmarks\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // 🎣 Foraging & Trapping\n {\n name: \"Foraging & Trapping\",\n description: \"Identifying Edibles, Snares, Fishing\",\n icon: \"🎣\",\n subSkills: [\n { name: \"Identifying Edibles\", progress: 0 },\n { name: \"Snares\", progress: 0 },\n { name: \"Fishing\", progress: 0 }\n ],\n challenges: [\n { text: \"Identify and collect 5 edible plants in under 10 minutes.\", targetSubSkill: \"Identifying Edibles\" },\n { text: \"Harvest and properly prepare wild edibles for a meal.\", targetSubSkill: \"Identifying Edibles\" },\n { text: \"Set up a snare trap to catch small game in under 15 minutes.\", targetSubSkill: \"Snares\" },\n { text: \"Build and set a deadfall trap in under 15 minutes.\", targetSubSkill: \"Snares\" },\n { text: \"Catch a fish using improvised tools in under 20 minutes.\", targetSubSkill: \"Fishing\" },\n { text: \"Make and use a primitive fishing spear or hand-line.\", targetSubSkill: \"Fishing\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // 🏥 Medical & First Aid\n {\n name: \"Medical & First Aid\",\n description: \"Field Dressing, Tourniquets, Medicinal Plants\",\n icon: \"🏥\",\n subSkills: [\n { name: \"Field Dressing\", progress: 0 },\n { name: \"Tourniquets\", progress: 0 },\n { name: \"Medicinal Plants\", progress: 0 }\n ],\n challenges: [\n { text: \"Apply a field dressing to a simulated wound in under 5 minutes.\", targetSubSkill: \"Field Dressing\" },\n { text: \"Demonstrate how to clean and dress a wound using natural materials.\", targetSubSkill: \"Field Dressing\" },\n { text: \"Apply a tourniquet to stop simulated bleeding in under 3 minutes.\", targetSubSkill: \"Tourniquets\" },\n { text: \"Demonstrate proper pressure bandaging techniques for severe wounds.\", targetSubSkill: \"Tourniquets\" },\n { text: \"Identify and prepare a medicinal plant for use in under 10 minutes.\", targetSubSkill: \"Medicinal Plants\" },\n { text: \"Make a poultice from medicinal plants and apply it to a simulated injury.\", targetSubSkill: \"Medicinal Plants\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // Signaling & Communication\n {\n name: \"Signaling & Communication\",\n icon: \"📡\",\n subSkills: [\n { name: \"Mirror Signaling\", progress: 0 },\n { name: \"Smoke Signals\", progress: 0 },\n { name: \"Ground Markings\", progress: 0 }\n ],\n challenges: [\n { text: \"Use a mirror to reflect sunlight onto a target 50 meters away.\", targetSubSkill: \"Mirror Signaling\" },\n { text: \"Use a mirror to signal a partner at a long distance.\", targetSubSkill: \"Mirror Signaling\" },\n { text: \"Create a visible smoke signal using damp materials.\", targetSubSkill: \"Smoke Signals\" },\n { text: \"Build a fire that maximizes visibility for aerial rescue.\", targetSubSkill: \"Smoke Signals\" },\n { text: \"Create a visible ground SOS sign for aerial spotting.\", targetSubSkill: \"Ground Markings\" },\n { text: \"Mark a trail using natural materials for tracking or rescue.\", targetSubSkill: \"Ground Markings\" }\n ],\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n\n // ⚖️ Leadership & Conflict De-escalation\n {\n name: \"Leadership & Conflict De-escalation\",\n description: \"Urban & Group Survival\",\n icon: \"⚖️\",\n subSkills: [\n { name: \"Urban Survival\", progress: 0 },\n { name: \"Group Survival\", progress: 0 },\n { name: \"Conflict De-escalation\", progress: 0 }\n ],\n challenges: [\n { text: \"Lead a group through a simulated urban survival scenario in under 20 minutes.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Plan a safe escape route from a city during a simulated crisis.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Find and secure a defensible shelter in an urban survival scenario.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Gather supplies from an urban environment while avoiding unnecessary risks.\", targetSubSkill: \"Urban Survival\" },\n \n { text: \"Organize a group to build a shelter in under 15 minutes.\", targetSubSkill: \"Group Survival\" },\n { text: \"Establish clear roles within a group to enhance survival efficiency.\", targetSubSkill: \"Group Survival\" },\n { text: \"Resolve a disagreement within a survival group to maintain cohesion.\", targetSubSkill: \"Group Survival\" },\n { text: \"Create a food and water rationing plan for a group.\", targetSubSkill: \"Group Survival\" },\n \n { text: \"De-escalate a simulated conflict using verbal techniques in under 10 minutes.\", targetSubSkill: \"Conflict De-escalation\" },\n { text: \"Mediate a dispute between two individuals in a survival scenario.\", targetSubSkill: \"Conflict De-escalation\" },\n { text: \"Use body language and negotiation skills to prevent a fight.\", targetSubSkill: \"Conflict De-escalation\" },\n { text: \"Convince a hostile individual to stand down without using force.\", targetSubSkill: \"Conflict De-escalation\" }\n ],\n challenge: {},\n challengeActive: false,\n timeRemaining: 0,\n level: \"Beginner\",\n expanded: false\n },\n \n // ⚔ Tactical & War Preparation\n {\n name: \"Tactical & War Preparation\",\n icon: \"⚔\",\n subSkills: [\n { name: \"Handgun Training\", progress: 0 },\n { name: \"Rifle Training\", progress: 0 },\n { name: \"CQB (Close-Quarters Combat)\", progress: 0 },\n { name: \"Hand-to-Hand Combat\", progress: 0 },\n { name: \"Escape & Evasion\", progress: 0 }\n ],\n challenges: [\n // Handgun Training\n { text: \"Hit 10 targets within 15 meters using a handgun.\", targetSubSkill: \"Handgun Training\" },\n { text: \"Rapid fire drill: Hit 3 targets in under 3 seconds.\", targetSubSkill: \"Handgun Training\" },\n { text: \"Tactical reload drill: Reload in under 2 seconds.\", targetSubSkill: \"Handgun Training\" },\n \n // Rifle Training\n { text: \"Hit 5 targets at 50 meters in under 10 seconds.\", targetSubSkill: \"Rifle Training\" },\n { text: \"Transition from rifle to handgun in under 2 seconds.\", targetSubSkill: \"Rifle Training\" },\n { text: \"Fire from cover & change positions 3 times.\", targetSubSkill: \"Rifle Training\" },\n \n // CQB (Close-Quarters Combat)\n { text: \"Clear a room in under 30 seconds (dry run).\", targetSubSkill: \"CQB (Close-Quarters Combat)\" },\n { text: \"Engage a target from behind cover in under 2 seconds.\", targetSubSkill: \"CQB (Close-Quarters Combat)\" },\n { text: \"Execute a breach-and-clear drill using dummy weapons.\", targetSubSkill: \"CQB (Close-Quarters Combat)\" },\n \n // Hand-to-Hand Combat\n { text: \"Disarm a knife-wielding attacker in under 5 seconds.\", targetSubSkill: \"Hand-to-Hand Combat\" },\n { text: \"Escape from a rear chokehold using leverage.\", targetSubSkill: \"Hand-to-Hand Combat\" },\n { text: \"Control an opponent using wrist locks.\", targetSubSkill: \"Hand-to-Hand Combat\" },\n \n // Escape & Evasion\n { text: \"Pick handcuffs or zip ties in under 2 minutes.\", targetSubSkill: \"Escape & Evasion\" },\n { text: \"Escape from a locked room using only available materials.\", targetSubSkill: \"Escape & Evasion\" },\n { text: \"Evade a tracking team for 30 minutes.\", targetSubSkill: \"Escape & Evasion\" }\n ],\n challengeActive: false, expanded: false, level: \"Beginner\"\n },\n \n // ⚡ Electrical Engineering & Hacking\n {\n name: \"Electrical Engineering & Hacking\",\n icon: \"⚡\",\n subSkills: [\n { name: \"HAM Radio Operations\", progress: 0 },\n { name: \"Solar Power Systems\", progress: 0 },\n { name: \"Cybersecurity & Hacking\", progress: 0 },\n { name: \"EMP Protection & Recovery\", progress: 0 }\n ],\n challenges: [\n // HAM Radio Operations\n { text: \"Set up and test an emergency HAM radio.\", targetSubSkill: \"HAM Radio Operations\" },\n { text: \"Send and receive a Morse code message.\", targetSubSkill: \"HAM Radio Operations\" },\n { text: \"Use a HAM radio to establish long-distance communication.\", targetSubSkill: \"HAM Radio Operations\" },\n \n // Solar Power Systems\n { text: \"Install a solar panel and battery storage system.\", targetSubSkill: \"Solar Power Systems\" },\n { text: \"Build a small off-grid solar-powered system from scratch.\", targetSubSkill: \"Solar Power Systems\" },\n { text: \"Charge a 12V battery using solar power.\", targetSubSkill: \"Solar Power Systems\" },\n \n // Cybersecurity & Hacking\n { text: \"Encrypt a hard drive for data protection.\", targetSubSkill: \"Cybersecurity & Hacking\" },\n { text: \"Set up a secure VPN for private browsing.\", targetSubSkill: \"Cybersecurity & Hacking\" },\n { text: \"Find and remove a spyware infection from a computer.\", targetSubSkill: \"Cybersecurity & Hacking\" },\n \n // EMP Protection & Recovery\n { text: \"Shield electronics using a Faraday cage.\", targetSubSkill: \"EMP Protection & Recovery\" },\n { text: \"Diagnose and repair electronic devices after an EMP test.\", targetSubSkill: \"EMP Protection & Recovery\" },\n { text: \"Create an EMP-resistant backup power system.\", targetSubSkill: \"EMP Protection & Recovery\" }\n ],\n challengeActive: false, expanded: false, level: \"Beginner\"\n },\n \n // 💰 Finance & Wealth-Building\n {\n name: \"Finance & Wealth-Building\",\n icon: \"💰\",\n subSkills: [\n { name: \"Stock Trading\", progress: 0 },\n { name: \"Real Estate Investment\", progress: 0 },\n { name: \"Multiple Income Streams\", progress: 0 },\n { name: \"Bartering & Alternative Currency\", progress: 0 }\n ],\n challenges: [\n // Stock Trading\n { text: \"Identify and track a stock for 1 week.\", targetSubSkill: \"Stock Trading\" },\n { text: \"Predict a stock price movement correctly.\", targetSubSkill: \"Stock Trading\" },\n { text: \"Paper trade a stock and make a 10% return in 1 month.\", targetSubSkill: \"Stock Trading\" },\n \n // Real Estate Investment\n { text: \"Find and analyze a below-market property deal.\", targetSubSkill: \"Real Estate Investment\" },\n { text: \"Evaluate a rental market and determine best investments.\", targetSubSkill: \"Real Estate Investment\" },\n { text: \"Calculate cash flow and ROI on a potential rental.\", targetSubSkill: \"Real Estate Investment\" },\n \n // Multiple Income Streams\n { text: \"Generate $100 from a side hustle within 7 days.\", targetSubSkill: \"Multiple Income Streams\" },\n { text: \"Sell a flipped product for double the original price.\", targetSubSkill: \"Multiple Income Streams\" },\n { text: \"Start a dropshipping, e-commerce, or flipping business.\", targetSubSkill: \"Multiple Income Streams\" },\n \n // Bartering & Alternative Currency\n { text: \"Trade an item without using money for something of equal value.\", targetSubSkill: \"Bartering & Alternative Currency\" },\n { text: \"Make 3 successful barter trades in one day.\", targetSubSkill: \"Bartering & Alternative Currency\" },\n { text: \"Establish a local barter network for essential goods.\", targetSubSkill: \"Bartering & Alternative Currency\" }\n ],\n challengeActive: false, expanded: false, level: \"Beginner\"\n },\n\n // 🌍 Adaptive Survival Challenges\n {\n name: \"Adaptive Survival Challenges\",\n description: \"Survive extreme environments while securing resources or wealth.\",\n icon: \"🌍\",\n subSkills: [\n { name: \"2-Day Homeless Survival\", progress: 0 },\n { name: \"7-Day Homeless Survival\", progress: 0 },\n { name: \"30-Day Homeless Survival\", progress: 0 },\n { name: \"90-Day Survival Challenge\", progress: 0 },\n { name: \"Urban Survival\", progress: 0 },\n { name: \"Woodland Survival\", progress: 0 },\n { name: \"Desert Survival\", progress: 0 },\n { name: \"Island & Raft Survival\", progress: 0 },\n { name: \"Arctic Cold Survival\", progress: 0 }\n ],\n challenges: [\n // 🚶 **2-Day Homeless Survival**\n { text: \"Survive 2 days with no money, no shelter, and no assistance.\", targetSubSkill: \"2-Day Homeless Survival\" },\n { text: \"Find food and water within 24 hours.\", targetSubSkill: \"2-Day Homeless Survival\" },\n { text: \"Identify a safe sleeping location for 2 nights.\", targetSubSkill: \"2-Day Homeless Survival\" },\n { text: \"Make at least $10 from street-level strategies.\", targetSubSkill: \"2-Day Homeless Survival\" },\n \n // 🏚 **7-Day Homeless Survival**\n { text: \"Survive 7 days without shelter or external aid.\", targetSubSkill: \"7-Day Homeless Survival\" },\n { text: \"Find and prepare food daily for a week.\", targetSubSkill: \"7-Day Homeless Survival\" },\n { text: \"Earn at least $100 using legal survival methods.\", targetSubSkill: \"7-Day Homeless Survival\" },\n { text: \"Secure a safe semi-permanent shelter by day 4.\", targetSubSkill: \"7-Day Homeless Survival\" },\n { text: \"Avoid violent encounters and maintain personal safety.\", targetSubSkill: \"7-Day Homeless Survival\" },\n \n // 🏠 **30-Day Homeless Survival**\n { text: \"Survive 30 days while homeless with no starting cash.\", targetSubSkill: \"30-Day Homeless Survival\" },\n { text: \"Find a way to make at least $500 by day 30.\", targetSubSkill: \"30-Day Homeless Survival\" },\n { text: \"Secure stable food and water sources for a full month.\", targetSubSkill: \"30-Day Homeless Survival\" },\n { text: \"Network with local resources or build a community for support.\", targetSubSkill: \"30-Day Homeless Survival\" },\n { text: \"Stay undetected while sleeping in urban areas.\", targetSubSkill: \"30-Day Homeless Survival\" },\n \n // 🏆 **90-Day Survival Challenge**\n { text: \"Survive 90 days in a post-collapse world with minimal gear.\", targetSubSkill: \"90-Day Survival Challenge\" },\n { text: \"Start with $0 and build up to at least $5000 in 90 days.\", targetSubSkill: \"90-Day Survival Challenge\" },\n { text: \"Secure a long-term shelter that lasts at least 60 days.\", targetSubSkill: \"90-Day Survival Challenge\" },\n { text: \"Trade/barter your way to a sustainable food supply.\", targetSubSkill: \"90-Day Survival Challenge\" },\n { text: \"Avoid detection while navigating a hostile environment for 90 days.\", targetSubSkill: \"90-Day Survival Challenge\" },\n { text: \"Gain allies and form a self-sustaining survival community.\", targetSubSkill: \"90-Day Survival Challenge\" },\n \n // 🏙 **Urban Survival**\n { text: \"Find and secure shelter in a post-disaster urban environment.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Scavenge food and water while avoiding detection.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Navigate an unfamiliar city without a map or GPS.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Barter for supplies in a collapsed economy.\", targetSubSkill: \"Urban Survival\" },\n { text: \"Escape an urban riot scenario without harm.\", targetSubSkill: \"Urban Survival\" },\n \n // 🌲 **Woodland Survival**\n { text: \"Survive 7 days in a dense forest with minimal gear.\", targetSubSkill: \"Woodland Survival\" },\n { text: \"Build a waterproof shelter using only natural materials.\", targetSubSkill: \"Woodland Survival\" },\n { text: \"Find and purify water from a woodland source.\", targetSubSkill: \"Woodland Survival\" },\n { text: \"Hunt or forage enough food to sustain yourself for 3 days.\", targetSubSkill: \"Woodland Survival\" },\n { text: \"Navigate out of the wilderness without a compass.\", targetSubSkill: \"Woodland Survival\" },\n { text: \"Start a fire in wet conditions using natural materials.\", targetSubSkill: \"Woodland Survival\" },\n \n // 🏜 **Desert Survival**\n { text: \"Survive 7 days in a desert with minimal supplies.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Find and extract drinkable water in a desert environment.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Build a shelter to withstand extreme heat.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Travel 5 miles across the desert using minimal water.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Identify and safely consume desert plants and insects.\", targetSubSkill: \"Desert Survival\" },\n \n // 🌴 **Island & Raft Survival**\n { text: \"Survive 30 days on an uninhabited island.\", targetSubSkill: \"Island & Raft Survival\" },\n { text: \"Build a primitive raft and successfully sail it 5 miles.\", targetSubSkill: \"Island & Raft Survival\" },\n { text: \"Catch fish using only hand-crafted tools.\", targetSubSkill: \"Island & Raft Survival\" },\n { text: \"Desalinate seawater using primitive methods.\", targetSubSkill: \"Island & Raft Survival\" },\n { text: \"Create a distress signal visible from the air.\", targetSubSkill: \"Island & Raft Survival\" },\n { text: \"Construct a stormproof shelter using only natural materials.\", targetSubSkill: \"Island & Raft Survival\" },\n \n // ❄ **Arctic Cold Survival**\n { text: \"Survive 14 days in an arctic climate.\", targetSubSkill: \"Arctic Cold Survival\" },\n { text: \"Start a fire on snow using only natural materials.\", targetSubSkill: \"Arctic Cold Survival\" },\n { text: \"Build an igloo or snow cave shelter.\", targetSubSkill: \"Arctic Cold Survival\" },\n { text: \"Find and prepare food in a frozen wilderness.\", targetSubSkill: \"Arctic Cold Survival\" },\n { text: \"Navigate safely across a frozen lake or river.\", targetSubSkill: \"Arctic Cold Survival\" },\n { text: \"Avoid frostbite and hypothermia while outdoors for 24 hours.\", targetSubSkill: \"Arctic Cold Survival\" }\n ],\n challengeActive: false, expanded: false, level: \"Ultimate Survivalist\"\n },\n\n // ⚠️ Hardcore Mode Challenges\n {\n name: \"Hardcore Mode Challenges\",\n description: \"Extreme Randomized Scenarios\",\n icon: \"⚠️\",\n subSkills: [\n { name: \"Primitive Survival\", progress: 0 },\n { name: \"Fire in the Rain\", progress: 0 },\n { name: \"Night Navigation\", progress: 0 },\n { name: \"Extreme Cold\", progress: 0 },\n { name: \"Desert Survival\", progress: 0 },\n { name: \"Jungle Survival\", progress: 0 },\n { name: \"High-Altitude Adaptation\", progress: 0 },\n { name: \"Urban Post-Collapse\", progress: 0 }\n ],\n challenges: [\n // 🌿 **Primitive Survival**\n { text: \"Survive 10 days using only self-made primitive tools.\", targetSubSkill: \"Primitive Survival\" },\n { text: \"Make a primitive fishing trap and catch a fish.\", targetSubSkill: \"Primitive Survival\" },\n { text: \"Build a primitive debris hut and sleep in it for 3 nights.\", targetSubSkill: \"Primitive Survival\" },\n { text: \"Make a full primitive bow, arrows, and quiver.\", targetSubSkill: \"Primitive Survival\" },\n { text: \"Tann a hide using only natural materials.\", targetSubSkill: \"Primitive Survival\" },\n { text: \"Create a friction fire using only hand drill in under 10 minutes.\", targetSubSkill: \"Primitive Survival\" },\n \n // 🌧 **Fire in the Rain**\n { text: \"Start a fire in a storm using only natural materials.\", targetSubSkill: \"Fire in the Rain\" },\n { text: \"Make a fire without matches or lighters in under 5 minutes.\", targetSubSkill: \"Fire in the Rain\" },\n { text: \"Construct a long-lasting waterproof fire lay.\", targetSubSkill: \"Fire in the Rain\" },\n { text: \"Collect dry firewood in a soaking wet environment.\", targetSubSkill: \"Fire in the Rain\" },\n \n // 🌙 **Night Navigation**\n { text: \"Navigate 2 miles at night using only the stars.\", targetSubSkill: \"Night Navigation\" },\n { text: \"Identify the North Star and use it to maintain direction.\", targetSubSkill: \"Night Navigation\" },\n { text: \"Use the moon’s shadow to determine time and direction.\", targetSubSkill: \"Night Navigation\" },\n { text: \"Create an emergency light source from natural materials.\", targetSubSkill: \"Night Navigation\" },\n \n // ❄ **Extreme Cold Survival**\n { text: \"Survive 24 hours in below-freezing temperatures.\", targetSubSkill: \"Extreme Cold\" },\n { text: \"Build an emergency snow cave and sleep in it overnight.\", targetSubSkill: \"Extreme Cold\" },\n { text: \"Start a fire in deep snow using only a ferro rod.\", targetSubSkill: \"Extreme Cold\" },\n { text: \"Make a full winter outfit using only fur and natural insulation.\", targetSubSkill: \"Extreme Cold\" },\n { text: \"Find and purify drinking water in a frozen environment.\", targetSubSkill: \"Extreme Cold\" },\n \n // 🏜 **Desert Survival**\n { text: \"Locate and extract drinkable water in a desert.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Construct a shade shelter using only natural materials.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Identify edible desert plants and prepare a meal.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Survive a full day with no water source.\", targetSubSkill: \"Desert Survival\" },\n { text: \"Create a solar still to extract water from the ground.\", targetSubSkill: \"Desert Survival\" },\n \n // 🌴 **Jungle Survival**\n { text: \"Build a raised jungle shelter to avoid insects & wildlife.\", targetSubSkill: \"Jungle Survival\" },\n { text: \"Make a water filtration system from natural materials.\", targetSubSkill: \"Jungle Survival\" },\n { text: \"Find and extract drinking water from vines and plants.\", targetSubSkill: \"Jungle Survival\" },\n { text: \"Avoid dangerous jungle predators using stealth.\", targetSubSkill: \"Jungle Survival\" },\n { text: \"Navigate a dense jungle using natural markers.\", targetSubSkill: \"Jungle Survival\" },\n \n // ⛰ **High-Altitude Adaptation**\n { text: \"Survive 24 hours in a high-altitude, low-oxygen environment.\", targetSubSkill: \"High-Altitude Adaptation\" },\n { text: \"Build a shelter in rocky, high-altitude terrain.\", targetSubSkill: \"High-Altitude Adaptation\" },\n { text: \"Find and purify drinking water in a mountain environment.\", targetSubSkill: \"High-Altitude Adaptation\" },\n { text: \"Hike 5 miles uphill while carrying 50 lbs.\", targetSubSkill: \"High-Altitude Adaptation\" },\n { text: \"Identify and avoid altitude sickness symptoms.\", targetSubSkill: \"High-Altitude Adaptation\" },\n \n // 🏙 **Urban Post-Collapse Survival**\n { text: \"Find a defensible shelter in a collapsed city scenario.\", targetSubSkill: \"Urban Post-Collapse\" },\n { text: \"Scavenge essential supplies while avoiding detection.\", targetSubSkill: \"Urban Post-Collapse\" },\n { text: \"Make a rooftop escape using emergency rappel techniques.\", targetSubSkill: \"Urban Post-Collapse\" },\n { text: \"Navigate a city in total blackout conditions.\", targetSubSkill: \"Urban Post-Collapse\" },\n { text: \"Create a barter system using found resources.\", targetSubSkill: \"Urban Post-Collapse\" }\n ],\n challengeActive: false, expanded: false, level: \"Survival Master\"\n }\n ]),\n\n challengeInterval: null,\n\n // Compute Global Progress\n get globalProgress() {\n let totalProgress = this.skills.reduce((sum, skill) => {\n return sum + skill.subSkills.reduce((subSum, subSkill) => subSum + subSkill.progress, 0);\n }, 0);\n let totalSkills = this.skills.reduce((sum, skill) => sum + skill.subSkills.length, 0);\n return totalSkills ? Math.round((totalProgress / (totalSkills * 100)) * 100) : 0;\n },\n \n // Compute User's Overall Skill Level\n get overallSkillLevel() {\n const progress = this.globalProgress;\n\n if (progress >= 90) return \"Expert\";\n if (progress >= 60) return \"Advanced\";\n if (progress >= 30) return \"Intermediate\";\n return \"Beginner\";\n },\n\n // Compute Skill Progress\n getSkillProgress(skill) {\n let totalProgress = skill.subSkills.reduce((sum, subSkill) => sum + subSkill.progress, 0);\n return skill.subSkills.length ? Math.round(totalProgress / skill.subSkills.length) : 0;\n },\n\n // Expand/Collapse Skill Sections\n toggleSkill(skill) {\n skill.expanded = !skill.expanded;\n },\n\n // Start a new challenge\n startChallenge(skill) {\n if (!skill.challenge) {\n this.selectNewChallenge(skill);\n }\n\n skill.challengeActive = true;\n skill.timeRemaining = 300; // 5 minutes\n\n this.challengeInterval = setInterval(() => {\n skill.timeRemaining--;\n if (skill.timeRemaining <= 0) {\n clearInterval(this.challengeInterval);\n skill.challengeActive = false;\n alert(\"Challenge failed!\");\n }\n }, 1000);\n },\n\n // Complete a challenge\n completeChallenge(skill, success) {\n if (this.challengeInterval) {\n clearInterval(this.challengeInterval);\n this.challengeInterval = null; // Ensure the interval is fully cleared\n }\n \n skill.challengeActive = false;\n \n const targetSubSkill = skill.subSkills.find(subSkill => subSkill.name === skill.challenge.targetSubSkill);\n \n if (targetSubSkill) {\n if (success) {\n targetSubSkill.progress = Math.min(targetSubSkill.progress + 20, 100);\n this.skillPoints += 10;\n alert(\"Challenge completed! Progress updated.\");\n } else {\n targetSubSkill.progress = Math.max(targetSubSkill.progress - 10, 0);\n alert(\"Challenge failed. Progress decreased.\");\n }\n }\n \n this.updateSkillLevel(skill);\n this.selectNewChallenge(skill);\n },\n\n // Select a new challenge\n selectNewChallenge(skill) {\n if (skill.challenges.length > 0) {\n const randomIndex = Math.floor(Math.random() * skill.challenges.length);\n skill.challenge = skill.challenges[randomIndex];\n }\n },\n\n // Update skill level based on progress\n updateSkillLevel(skill) {\n const totalProgress = skill.subSkills.reduce((sum, subSkill) => sum + subSkill.progress, 0);\n const averageProgress = totalProgress / skill.subSkills.length;\n if (averageProgress >= 90) skill.level = \"Expert\";\n else if (averageProgress >= 60) skill.level = \"Advanced\";\n else if (averageProgress >= 30) skill.level = \"Intermediate\";\n else skill.level = \"Beginner\";\n },\n\n init() {\n this.skills.forEach(skill => this.selectNewChallenge(skill));\n this.$watch('skillPoints', (value) => saveStateToLocalStorage(\"skillPoints\", value));\n this.$watch('skills', (value) => saveStateToLocalStorage(\"skills\", value));\n },\n\n updateSkillProgress(skill, subSkillName, progressAmount) {\n let subSkill = skill.subSkills.find(s => s.name === subSkillName);\n if (subSkill) {\n subSkill.progress = Math.min(subSkill.progress + progressAmount, 100);\n saveStateToLocalStorage(\"skills\", this.skills);\n }\n }\n }));\n\n // Survival Scenario Simulator\n Alpine.data('scenarioSimulator', () => ({\n scenarios: [\n // 🏕️ Wilderness Survival Scenarios\n {\n title: \"Lost in the Wilderness\",\n description: \"You're stranded in a remote forest. Survive for 3 days.\",\n challenges: [\n \"Find and purify water\",\n \"Build a shelter\",\n \"Start a fire\",\n \"Forage for food\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 180 // 3 days in minutes\n },\n {\n title: \"Snowstorm Stranded\",\n description: \"You're caught in a blizzard with no shelter. Stay warm and survive for 24 hours.\",\n challenges: [\n \"Find or build an insulated shelter\",\n \"Avoid frostbite\",\n \"Melt snow for drinking water\",\n \"Signal for rescue\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 1440 // 1 day in minutes\n },\n {\n title: \"Desert Survival\",\n description: \"You're lost in a scorching desert with no water. Survive until rescue.\",\n challenges: [\n \"Find shade to prevent heatstroke\",\n \"Locate water source\",\n \"Travel at night to conserve energy\",\n \"Identify edible desert plants\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 120 // 2 hours in extreme heat\n },\n {\n title: \"Venomous Snake Bite\",\n description: \"You've been bitten by a snake. Survive until help arrives.\",\n challenges: [\n \"Identify the snake species\",\n \"Slow your movement to prevent venom spread\",\n \"Use first aid to minimize damage\",\n \"Get to safety\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 180 // 3 hours before effects worsen\n },\n {\n title: \"Bear Encounter\",\n description: \"A bear is nearby. Avoid provoking it and escape safely.\",\n challenges: [\n \"Stay calm and assess the bear’s behavior\",\n \"Slowly back away without turning your back\",\n \"Climb a tree or find a safe position\",\n \"Use deterrents like noise or bear spray\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 15 // 15 minutes of high stress!\n },\n\n // 🌆 Urban Disaster Scenarios\n {\n title: \"Major Earthquake\",\n description: \"An earthquake has struck your city. Survive for 48 hours.\",\n challenges: [\n \"Find safe shelter\",\n \"Locate emergency supplies\",\n \"Treat injuries\",\n \"Signal for help\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 120 // 2 days in minutes\n },\n {\n title: \"Citywide Blackout\",\n description: \"The power grid has failed. Survive without electricity.\",\n challenges: [\n \"Find alternative light sources\",\n \"Secure food before it spoils\",\n \"Stay safe from potential looters\",\n \"Communicate without the internet\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 1440 // 1 day in minutes\n },\n {\n title: \"Terrorist Attack\",\n description: \"A bomb or mass shooting occurred in your area. Escape and survive.\",\n challenges: [\n \"Find immediate cover\",\n \"Identify safe escape routes\",\n \"Avoid crowds and panic\",\n \"Help others while staying safe\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 60 // 1-hour escape window\n },\n {\n title: \"Nuclear Fallout\",\n description: \"A nuclear explosion occurred. Seek underground shelter and survive for 7 days.\",\n challenges: [\n \"Find a fallout shelter\",\n \"Seal windows and doors\",\n \"Ration food and water\",\n \"Avoid exposure to radiation\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 10080 // 7 days in minutes\n },\n\n // 🏝️ Island & Ocean Survival\n {\n title: \"Shipwrecked on an Island\",\n description: \"You've washed ashore with limited supplies. Survive for 7 days.\",\n challenges: [\n \"Find drinkable water\",\n \"Build a signal fire\",\n \"Hunt or fish for food\",\n \"Construct a shelter\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 10080 // 7 days in minutes\n },\n {\n title: \"Adrift on a Raft\",\n description: \"You’re lost at sea with minimal supplies. Stay alive and signal for rescue.\",\n challenges: [\n \"Collect rainwater for drinking\",\n \"Avoid sunburn and dehydration\",\n \"Catch fish with makeshift tools\",\n \"Signal for rescue\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 4320 // 3 days in minutes\n },\n {\n title: \"Shark Attack\",\n description: \"A shark is circling your raft. Defend yourself and escape.\",\n challenges: [\n \"Stay calm and avoid splashing\",\n \"Use an oar or object as a weapon\",\n \"Find a way to deter the shark\",\n \"Secure yourself on the raft\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 30 // 30-minute critical window\n },\n\n // 🔥 Fire & Natural Disasters\n {\n title: \"Forest Fire\",\n description: \"A wildfire is approaching fast. Escape before it's too late.\",\n challenges: [\n \"Determine wind direction to avoid flames\",\n \"Find or create a firebreak\",\n \"Protect yourself from smoke inhalation\",\n \"Signal for rescue\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 90 // 90 minutes before smoke overtakes you\n },\n {\n title: \"House Fire\",\n description: \"Your home is burning. Escape in time.\",\n challenges: [\n \"Stay low to avoid smoke inhalation\",\n \"Check doors for heat before opening\",\n \"Find the fastest escape route\",\n \"Stop, drop, and roll if needed\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 5 // 5 minutes before it's too late\n },\n {\n title: \"Tornado Hits Town\",\n description: \"A tornado is approaching. Seek shelter and survive.\",\n challenges: [\n \"Get to an underground shelter\",\n \"Protect yourself from debris\",\n \"Stay low and cover your head\",\n \"Wait for the storm to pass\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 30 // 30 minutes of terror\n },\n {\n title: \"Tsunami Warning\",\n description: \"A massive tsunami is approaching. Get to high ground immediately.\",\n challenges: [\n \"Recognize the warning signs\",\n \"Get to the highest possible ground\",\n \"Hold on and brace for impact\",\n \"Help others if possible\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 45 // 45 minutes until impact\n },\n\n // 🆘 Extreme Survival Scenarios\n {\n title: \"Hostage Situation\",\n description: \"You’ve been kidnapped. Find a way to escape or survive.\",\n challenges: [\n \"Stay calm and assess your captors\",\n \"Look for escape opportunities\",\n \"Try to communicate with rescuers\",\n \"Use psychology to gain trust\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 600 // 10-hour critical window\n },\n {\n title: \"Zombie Outbreak\",\n description: \"A deadly virus has spread. Find a safe location and survive.\",\n challenges: [\n \"Secure a shelter\",\n \"Stockpile supplies\",\n \"Avoid infected individuals\",\n \"Find a group for protection\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 2880 // 2 days in minutes\n },\n {\n title: \"EMP Attack\",\n description: \"All electronics have failed. Survive in a world without technology.\",\n challenges: [\n \"Find food without refrigeration\",\n \"Secure transportation without fuel\",\n \"Use maps instead of GPS\",\n \"Protect yourself from societal collapse\"\n ],\n expanded: false,\n timeRemaining: 0,\n challengeIndex: 0,\n outcome: null,\n intervalId: null,\n duration: 10080 // 7 days in minutes\n }\n ],\n activeScenario: null,\n\n // Toggle scenario details (expands/collapses)\n toggleScenario(scenario) {\n this.scenarios.forEach(s => {\n if (s !== scenario) s.expanded = false; // Collapse others\n });\n scenario.expanded = !scenario.expanded;\n },\n\n // Start scenario when \"Start Scenario\" is clicked\n startScenario(scenario) {\n // Stop any existing timers\n this.scenarios.forEach(s => {\n if (s.intervalId) clearInterval(s.intervalId);\n });\n\n // Start the new scenario\n scenario.started = true;\n scenario.outcome = \"\";\n scenario.timeRemaining = scenario.timeRemaining || 30;\n this.runScenario(scenario);\n },\n\n // Run scenario countdown\n runScenario(scenario) {\n scenario.intervalId = setInterval(() => {\n if (scenario.timeRemaining > 0) {\n scenario.timeRemaining--;\n } else {\n clearInterval(scenario.intervalId);\n scenario.outcome = \"You survived!\";\n }\n }, 1000);\n },\n\n // Complete challenges within the scenario\n completeChallenge(scenario) {\n if (scenario.challengeIndex < scenario.challenges.length - 1) {\n scenario.challengeIndex++;\n } else {\n clearInterval(scenario.intervalId);\n scenario.outcome = \"Scenario Completed! 🎉\";\n }\n }\n }));\n\n // Emergency Preparedness Checklist\n Alpine.data('emergencyChecklist', () => ({\n categories: loadStateFromLocalStorage(\"emergencyCategories\", [\n \n // 🚗 Stability & Mobility Status\n {\n name: \"Stability & Mobility Status\",\n description: \"Assess your shelter, transportation, and financial stability.\",\n icon: \"🚗\",\n items: [\n { name: \"I have a stable income\", checked: false },\n { name: \"I have an emergency savings fund (3-6 months of expenses)\", checked: false },\n { name: \"I have investments (stocks, real estate, crypto, etc.)\", checked: false },\n { name: \"I have a side hustle or passive income stream\", checked: false },\n { name: \"I have cash reserves for immediate emergencies ($500+ in cash)\", checked: false },\n { name: \"I have valuable tradeable assets (gold, silver, bartering items)\", checked: false },\n { name: \"I have a financial backup plan (loans, family support, credit line)\", checked: false },\n { name: \"I have a plan for generating income post-collapse (bartering, trading, selling skills)\", checked: false },\n { name: \"I have a stable shelter\", checked: false },\n { name: \"I have a bug-out location (cabin, secondary shelter)\", checked: false },\n { name: \"I have a vehicle for transportation\", checked: false },\n { name: \"I have an emergency backup vehicle (bike, motorcycle, etc.)\", checked: false },\n { name: \"I have a fully stocked bug-out bag ready to go\", checked: false },\n { name: \"I have an emergency evacuation plan\", checked: false }\n ]\n },\n \n // 💧 Water Essentials (Expanded)\n { \n name: \"Water\", icon: \"💧\", expanded: false,\n items: [\n { name: \"Bottled Water (4 liters per person per day)\", checked: false },\n { name: \"Water Purification Tablets (At least 20 per person)\", checked: false },\n { name: \"Portable Water Filter (e.g., Sawyer, LifeStraw)\", checked: false },\n { name: \"Collapsible Water Containers (For storage & transport)\", checked: false },\n { name: \"Water Storage Barrels (Long-term supply)\", checked: false },\n { name: \"Boiling Pot or Kettle (For water purification)\", checked: false },\n { name: \"DIY Rainwater Collection System\", checked: false },\n { name: \"Emergency Desalination Kit (If in coastal area)\", checked: false },\n { name: \"Bleach or Pool Shock (For emergency water treatment)\", checked: false }\n ]\n },\n\n // 🍲 Food Essentials (Expanded)\n {\n name: \"Food\", icon: \"🍲\", expanded: false,\n items: [\n { name: \"Canned Goods (Meats, Vegetables, Fruits, Soups)\", checked: false },\n { name: \"Energy Bars & Protein Bars\", checked: false },\n { name: \"Freeze-Dried or Dehydrated Meals\", checked: false },\n { name: \"Powdered Milk or Shelf-Stable Dairy Alternatives\", checked: false },\n { name: \"Rice, Beans, Lentils (Long-term bulk storage)\", checked: false },\n { name: \"Nut Butters (Peanut, Almond, etc.)\", checked: false },\n { name: \"Honey & Sugar (Natural sweeteners & preservatives)\", checked: false },\n { name: \"Cooking Oil (Coconut, Olive, or Vegetable Oil)\", checked: false },\n { name: \"Salt, Pepper, & Seasonings (Essential for nutrition & taste)\", checked: false },\n { name: \"Multivitamins (To prevent malnutrition)\", checked: false },\n { name: \"Camping Stove & Fuel (Propane, alcohol, or wood-burning)\", checked: false },\n { name: \"Cooking Pot & Utensils (For food prep & boiling water)\", checked: false },\n { name: \"Manual Can Opener (Non-electric backup)\", checked: false },\n { name: \"Fishing Kit (Hooks, line, lures, net, etc.)\", checked: false },\n { name: \"Foraging Guide & Plant Identification Book\", checked: false },\n { name: \"Food Storage Containers (For preserving leftovers)\", checked: false }\n ]\n },\n\n // 🏕️ Shelter Essentials\n {\n name: \"Shelter\", icon: \"⛺\", expanded: false,\n items: [\n { name: \"Tent (Lightweight & waterproof)\", checked: false },\n { name: \"Emergency Blankets (Thermal Mylar)\", checked: false },\n { name: \"Tarp & Rope (For makeshift shelters)\", checked: false },\n { name: \"Sleeping Bag (Rated for local climate)\", checked: false },\n { name: \"Sleeping Pad or Ground Mat\", checked: false },\n { name: \"Extra Clothing (Layered for all weather conditions)\", checked: false },\n { name: \"Wool Socks & Gloves (Cold weather protection)\", checked: false },\n { name: \"Work Gloves (For handling rough materials)\", checked: false },\n { name: \"Rain Poncho or Waterproof Jacket\", checked: false }\n ]\n },\n\n // 🔥 Fire & Heat Essentials\n {\n name: \"Fire & Heat\", icon: \"🔥\", expanded: false,\n items: [\n { name: \"Ferro Rod or Magnesium Fire Starter\", checked: false },\n { name: \"Waterproof Matches\", checked: false },\n { name: \"Lighters (At least 3 backups)\", checked: false },\n { name: \"Fire Starter Kit (Fatwood, cotton balls with Vaseline, etc.)\", checked: false },\n { name: \"Magnifying Lens (Sunlight fire-starting)\", checked: false },\n { name: \"Emergency Stove or Rocket Stove\", checked: false },\n { name: \"Extra Fuel (Propane, alcohol, wood, or charcoal)\", checked: false },\n { name: \"Candle Lantern or Oil Lamp\", checked: false },\n { name: \"Hand Warmers (For extreme cold survival)\", checked: false }\n ]\n },\n\n // 🗺️ Navigation & Communication Essentials\n {\n name: \"Navigation & Communication\", icon: \"🗺️\", expanded: false,\n items: [\n { name: \"Compass & Topographic Maps (For navigation without GPS)\", checked: false },\n { name: \"Hand-Crank or Solar-Powered Radio\", checked: false },\n { name: \"Whistle (For signaling rescue)\", checked: false },\n { name: \"Notebook & Pencil (For tracking locations & notes)\", checked: false },\n { name: \"Signal Mirror (Emergency signaling)\", checked: false },\n { name: \"Glow Sticks (Emergency lighting & signaling)\", checked: false },\n { name: \"Walkie-Talkies (Short-range emergency comms)\", checked: false },\n { name: \"HAM Radio or CB Radio (Long-range emergency comms)\", checked: false },\n { name: \"USB Charging Cables & Power Banks\", checked: false }\n ]\n },\n\n // ⚕️ Medical & First Aid Essentials\n { \n name: \"Medical & First Aid\", icon: \"⚕️\", expanded: false,\n items: [\n { name: \"First Aid Kit (Bandages, antiseptics, gauze, etc.)\", checked: false },\n { name: \"Prescription Medications (At least 14-day supply)\", checked: false },\n { name: \"Pain Relievers (Ibuprofen, Acetaminophen, etc.)\", checked: false },\n { name: \"Antiseptic Wipes & Alcohol Pads\", checked: false },\n { name: \"Tweezers, Scissors & Safety Pins\", checked: false },\n { name: \"Emergency Tourniquet (For severe bleeding)\", checked: false },\n { name: \"Suture Kit or Butterfly Closures\", checked: false },\n { name: \"Splint Materials (For immobilizing injuries)\", checked: false },\n { name: \"Snake Bite Kit (For venomous regions)\", checked: false },\n { name: \"N95 Masks (For air contamination protection)\", checked: false }\n ]\n },\n\n // 🛠️ Tools & Repair Essentials\n { \n name: \"Tools & Repairs\", icon: \"🛠️\", expanded: false,\n items: [\n { name: \"Multi-Tool or Swiss Army Knife\", checked: false },\n { name: \"Duct Tape (Fix anything)\", checked: false },\n { name: \"Paracord (50+ feet for tying & securing)\", checked: false },\n { name: \"Folding Saw or Wire Saw\", checked: false },\n { name: \"Hatchet or Machete\", checked: false },\n { name: \"Shovel (Compact, folding, or full-size)\", checked: false },\n { name: \"Sharpening Stone (For maintaining blades)\", checked: false },\n { name: \"Super Glue (Quick repairs & medical use)\", checked: false },\n { name: \"Sewing Kit (For repairing gear & clothing)\", checked: false }\n ]\n },\n \n // 🎒 Bug-Out Bag Essentials\n { \n name: \"Bug-Out Bag Essentials\", icon: \"🎒\", expanded: false,\n items: [\n { name: \"Bug-Out Bag (45L+)\", checked: false },\n { name: \"Tactical Knife\", checked: false },\n { name: \"Multi-Tool\", checked: false },\n { name: \"Paracord (50+ feet)\", checked: false },\n { name: \"Emergency Shelter (Tarp, Tent, Space Blanket)\", checked: false },\n { name: \"Portable Water Filter\", checked: false },\n { name: \"Solar Charger & Power Bank\", checked: false },\n { name: \"Headlamp & Extra Batteries\", checked: false },\n { name: \"Self-Defense Weapon (Pepper Spray, Baton, etc.)\", checked: false }\n ]\n },\n\n // ⚒️ Skills & Sustainability\n { \n name: \"Skills & Sustainability\", icon: \"⚒️\", expanded: false,\n items: [\n { name: \"Fire-Starting (Bow Drill, Flint & Steel)\", checked: false },\n { name: \"Water Collection & Purification\", checked: false },\n { name: \"Foraging & Wild Edibles\", checked: false },\n { name: \"Trapping & Hunting\", checked: false },\n { name: \"Gardening & Permaculture\", checked: false },\n { name: \"DIY Soap & Hygiene Production\", checked: false },\n { name: \"Knot Tying & Rope Work\", checked: false },\n { name: \"Sewing & Clothing Repair\", checked: false },\n { name: \"Leatherworking & Hide Tanning\", checked: false }\n ]\n },\n\n // ⚔️ Tactical & War Preparation\n { \n name: \"Tactical & War Preparation\", icon: \"⚔️\", expanded: false,\n items: [\n { name: \"Handgun & Ammo\", checked: false },\n { name: \"Rifle & Ammo\", checked: false },\n { name: \"Shotgun & Shells\", checked: false },\n { name: \"Bow & Arrows (Silent Weapon)\", checked: false },\n { name: \"Bulletproof Vest (Level III+)\", checked: false },\n { name: \"Gas Mask & Filters\", checked: false },\n { name: \"Combat First Aid & Tourniquet\", checked: false },\n { name: \"Urban & Rural Combat Tactics\", checked: false },\n { name: \"CQB & Hand-to-Hand Combat Training\", checked: false }\n ]\n },\n\n // 🕵️♂️ Advanced Defense & Counter-Surveillance\n { \n name: \"Advanced Defense & Counter-Surveillance\", icon: \"🕵️♂️\", expanded: false,\n items: [\n { name: \"Night Vision Goggles (Gen 3+)\", checked: false },\n { name: \"Thermal Imaging Device\", checked: false },\n { name: \"Security Cameras & Motion Sensors\", checked: false },\n { name: \"Tripwires & Alarm Systems\", checked: false },\n { name: \"Escape & Evasion Tactics\", checked: false },\n { name: \"Counter-Tracking & Deception Techniques\", checked: false },\n { name: \"Cybersecurity & Digital Privacy\", checked: false },\n { name: \"Dead Drop & Secret Communication Training\", checked: false },\n { name: \"Lock Picking & Bypass Techniques\", checked: false }\n ]\n },\n\n // ⚡ Electrical Engineering & Hacking\n { \n name: \"Electrical Engineering & Hacking\", icon: \"⚡\", expanded: false,\n items: [\n { name: \"Solar Panels & Battery Bank\", checked: false },\n { name: \"HAM Radio & Emergency Comms\", checked: false },\n { name: \"Multimeter & Soldering Tools\", checked: false },\n { name: \"EMP Protection (Faraday Cage)\", checked: false },\n { name: \"Cyber Hacking & Penetration Testing\", checked: false },\n { name: \"Alternative Energy Sources (Hydro, Wind, etc.)\", checked: false },\n { name: \"DIY Generator & Off-Grid Power Solutions\", checked: false },\n { name: \"DIY Drone & Remote Surveillance\", checked: false }\n ]\n },\n\n // 🏭 Post-Collapse Manufacturing & Zero Waste\n { \n name: \"Post-Collapse Manufacturing & Zero Waste\", icon: \"🏭\", expanded: false,\n items: [\n { name: \"Blacksmithing & Metalworking\", checked: false },\n { name: \"Glass Blowing & Reclaiming\", checked: false },\n { name: \"Plastic Recycling & Upcycling\", checked: false },\n { name: \"Leatherworking & Hide Tanning\", checked: false },\n { name: \"DIY Brick & Cement Making\", checked: false },\n { name: \"Clothing & Textile Production\", checked: false },\n { name: \"Soap, Candles, & Household Necessities\", checked: false },\n { name: \"Basic Carpentry & Shelter Building\", checked: false },\n { name: \"Renewable Agriculture & Off-Grid Farming\", checked: false }\n ]\n },\n\n // 💰 Finance & Wealth-Building\n { \n name: \"Finance & Wealth-Building\", icon: \"💰\", expanded: false,\n items: [\n { name: \"Emergency Fund (3-6 Months)\", checked: false },\n { name: \"Stock Market Investing\", checked: false },\n { name: \"Real Estate Flipping & Rentals\", checked: false },\n { name: \"Multiple Streams of Income\", checked: false },\n { name: \"Bartering & Alternative Economy Skills\", checked: false },\n { name: \"Precious Metals & Tangible Assets (Gold, Silver)\", checked: false },\n { name: \"Cryptocurrency & Digital Security\", checked: false },\n { name: \"Survival Business Ideas (Self-Sufficient Income)\", checked: false }\n ]\n }\n ]),\n\n // 🔥 Individual Readiness Meters\n getCategoryPercentage(categoryName) {\n let category = this.categories.find(c => c.name === categoryName);\n let checkedCount = category.items.filter(item => item.checked).length;\n return Math.round((checkedCount / category.items.length) * 100);\n },\n\n getCategoryReadinessLevel(categoryName) {\n const percentage = this.getCategoryPercentage(categoryName);\n if (percentage === 100) return \"Mastery 🏆\";\n if (percentage >= 80) return \"Highly Skilled ⚡\";\n if (percentage >= 60) return \"Competent 🔥\";\n if (percentage >= 40) return \"Beginner 🌱\";\n return \"Unprepared 🚨\";\n },\n\n // 🔥 Global Readiness Meter (Based on ALL categories)\n get globalReadinessPercentage() {\n let totalPercentage = this.categories.reduce((sum, category) => sum + this.getCategoryPercentage(category.name), 0);\n return Math.round(totalPercentage / this.categories.length);\n },\n\n get globalReadinessLevel() {\n const percentage = this.globalReadinessPercentage;\n if (percentage === 100) return \"Ultimate Survivalist 🏆\";\n if (percentage >= 80) return \"Elite Prepper ⚔️\";\n if (percentage >= 60) return \"Survivalist 🔥\";\n if (percentage >= 40) return \"Basic Preparedness 🌱\";\n return \"Unprepared & Vulnerable 🚨\";\n },\n\n init() {\n this.$watch('categories', (value) => saveStateToLocalStorage(\"emergencyCategories\", value));\n },\n \n toggleItem(item) {\n this.$set(item, 'checked', !item.checked);\n saveStateToLocalStorage(\"emergencyCategories\", this.categories);\n },\n\n toggleCategory(category) {\n category.expanded = !category.expanded;\n }\n }));\n\n // Survival Tools\n Alpine.data('survivalTools', () => ({\n status: {\n currentVersion: \"1.0.7\", // Update this every time you release a new version\n latestVersion: null,\n updateAvailable: false,\n init() {\n this.checkForUpdate();\n },\n async checkForUpdate() {\n try {\n let response = await fetch('/version.json', { cache: 'no-cache' });\n let data = await response.json();\n this.latestVersion = data.version;\n \n if (this.latestVersion !== this.currentVersion) {\n this.updateAvailable = true;\n }\n } catch (error) {\n console.warn(\"Could not check for updates:\", error);\n }\n },\n \n updatePWA() {\n if (navigator.serviceWorker) {\n navigator.serviceWorker.getRegistrations().then(registrations => {\n for (let registration of registrations) {\n registration.unregister();\n }\n });\n }\n \n caches.keys().then(cacheNames => {\n cacheNames.forEach(cacheName => caches.delete(cacheName));\n });\n \n setTimeout(() => {\n location.reload();\n }, 1000);\n },\n \n // Import/Export Data\n exportAppData() {\n const appData = {\n emergencyCategories: JSON.parse(localStorage.getItem(\"emergencyCategories\") || \"[]\"),\n guides: JSON.parse(localStorage.getItem(\"guides\") || \"[]\"),\n plan: JSON.parse(localStorage.getItem(\"emergencyPlan\") || \"[]\"),\n skills: JSON.parse(localStorage.getItem(\"skills\") || \"[]\")\n };\n \n const dataStr = \"data:text/json;charset=utf-8,\" + encodeURIComponent(JSON.stringify(appData, null, 2));\n const downloadAnchor = document.createElement(\"a\");\n downloadAnchor.setAttribute(\"href\", dataStr);\n downloadAnchor.setAttribute(\"download\", \"BeaconAppData.json\");\n document.body.appendChild(downloadAnchor);\n downloadAnchor.click();\n document.body.removeChild(downloadAnchor);\n },\n importAppData(event) {\n const file = event.target.files[0];\n if (!file) return;\n \n const reader = new FileReader();\n reader.onload = function(event) {\n try {\n const appData = JSON.parse(event.target.result);\n \n if (appData) {\n localStorage.setItem(\"emergencyCategories\", JSON.stringify(appData.emergencyCategories || []));\n localStorage.setItem(\"guides\", JSON.stringify(appData.guides || []));\n localStorage.setItem(\"skillPoints\", JSON.stringify(appData.skillPoints || 0));\n localStorage.setItem(\"skills\", JSON.stringify(appData.skills || []));\n \n alert(\"Data imported successfully! Refreshing the page...\");\n location.reload(); // Refresh the page to apply changes\n }\n } catch (error) {\n alert(\"Invalid JSON file. Please upload a valid BeaconAppData.json file.\");\n }\n };\n \n reader.readAsText(file);\n },\n },\n \n // 📡 Signal Mirror\n signalMirror: {\n flashing: false,\n interval: null,\n sosPattern: [250, 250, 250, 250, 250, 750, 250, 750, 250, 750, 250, 250, 250, 250, 250, 1000],\n flashIndex: 0,\n flashScreen() {\n if (this.flashing) {\n this.flashIndex = 0;\n this.runSOS();\n } else {\n clearInterval(this.interval);\n document.getElementById('signalMirror').classList.add('hidden');\n document.querySelectorAll('.tile').forEach(e => e.classList.remove('hidden'));\n }\n },\n runSOS() {\n if (!this.flashing) return;\n let duration = this.sosPattern[this.flashIndex];\n document.getElementById('signalMirror').classList.toggle('hidden');\n this.flashIndex++;\n if (this.flashIndex >= this.sosPattern.length) {\n setTimeout(() => {\n this.flashIndex = 0;\n this.runSOS();\n }, 2000);\n } else {\n setTimeout(() => this.runSOS(), duration);\n }\n }\n },\n\n // 🧭 Compass\n compass: {\n heading: 0\n },\n\n initCompass() {\n if ('ondeviceorientationabsolute' in window) {\n window.addEventListener('deviceorientationabsolute', (event) => {\n heading = Math.round(event.alpha); // Get the heading in degrees\n this.compass.heading = heading; // Display direction in degrees\n $refs.compassArrow.style.transform = `rotate(${360 - heading}deg)`; // Rotate the arrow\n });\n } else { heading = 'Not Supported'; }\n },\n\n // 🚶 Pedometer\n pedometer: {\n steps: 0,\n stepLength: 0.75, // Average step length in meters\n reset() {\n this.steps = 0;\n },\n init() {\n if ('ondevicemotion' in window) {\n let lastY = null;\n window.addEventListener('devicemotion', (event) => {\n let y = event.accelerationIncludingGravity.y;\n if (lastY !== null && Math.abs(y - lastY) > 1) {\n this.steps++;\n }\n lastY = y;\n });\n }\n }\n },\n\n // 📝 Morse Code Translator\n morseCode: {\n playing: null,\n textInput: '',\n morseOutput: '',\n morseMap: {\n 'A': '.-', 'B': '-...', 'C': '-.-.', 'D': '-..', 'E': '.', 'F': '..-.', 'G': '--.',\n 'H': '....', 'I': '..', 'J': '.---', 'K': '-.-', 'L': '.-..', 'M': '--', 'N': '-.',\n 'O': '---', 'P': '.--.', 'Q': '--.-', 'R': '.-.', 'S': '...', 'T': '-',\n 'U': '..-', 'V': '...-', 'W': '.--', 'X': '-..-', 'Y': '-.--', 'Z': '--..',\n '0': '-----', '1': '.----', '2': '..---', '3': '...--', '4': '....-', '5': '.....',\n '6': '-....', '7': '--...', '8': '---..', '9': '----.'\n },\n updateMorse() {\n this.morseOutput = this.textInput.toUpperCase().split('')\n .map(letter => this.morseMap[letter] || ' ')\n .join(' ');\n },\n playMorseCode() {\n if (this.playing) {\n this.playing = false;\n clearTimeout(this.timeout);\n navigator.vibrate(0);\n return;\n }\n this.playing = true;\n let morseSequence = this.morseOutput.split('');\n let index = 0;\n let unit = 200;\n const playNext = () => {\n if (!this.playing || index >= morseSequence.length) {\n this.playing = false;\n return;\n }\n let symbol = morseSequence[index];\n index++;\n switch (symbol) {\n case '.':\n navigator.vibrate(unit);\n this.timeout = setTimeout(playNext, unit * 2);\n break;\n case '-':\n navigator.vibrate(unit * 3);\n this.timeout = setTimeout(playNext, unit * 4);\n break;\n case ' ':\n this.timeout = setTimeout(playNext, unit * 6);\n break;\n default:\n playNext();\n }\n };\n playNext();\n }\n },\n\n // 📏 Level Tool\n levelTool: {\n x: 0,\n y: 0,\n init() {\n if ('ondevicemotion' in window) {\n window.addEventListener('devicemotion', (event) => {\n if (event.accelerationIncludingGravity) {\n this.x = event.accelerationIncludingGravity.x.toFixed(2);\n this.y = event.accelerationIncludingGravity.y.toFixed(2);\n }\n });\n }\n },\n bubbleX() { return `translateX(${this.x * 10}px)`; },\n bubbleY() { return `translateY(${this.y * 10}px)`; }\n }\n }));\n\n // Guides\n Alpine.data(\"library\", () => ({\n activeCategory: loadStateFromLocalStorage(\"activeCategory\", \"all\"),\n searchQuery: loadStateFromLocalStorage(\"searchQuery\", \"\"),\n categories: [\n { name: \"All\", key: \"all\" },\n { name: \"Packing\", key: \"packing\" },\n { name: \"Tool Mastery\", key: \"tool-mastery\" },\n { name: \"Fire\", key: \"fire\" },\n { name: \"Water\", key: \"water\" },\n { name: \"Shelter\", key: \"shelter\" },\n { name: \"Navigation\", key: \"navigation\" },\n { name: \"First Aid\", key: \"first-aid\" },\n { name: \"Foraging\", key: \"foraging\" },\n { name: \"Trapping\", key: \"trapping\" },\n { name: \"Knots\", key: \"knots\" },\n { name: \"Signaling\", key: \"signaling\" },\n { name: \"Tactical\", key: \"tactical\" },\n { name: \"Electrical\", key: \"electrical\" },\n { name: \"Finance\", key: \"finance\" },\n { name: \"Hardcore\", key: \"hardcore\" }\n ],\n\n // 📖 Survival Guides (Fully Detailed)\n guides: loadStateFromLocalStorage(\"guides\", [\n\n // 🎒 Bug-Out Bag Readiness\n {\n \"title\": \"Ranger Rolling: T-Shirts & Base Layers\",\n \"description\": \"Learn how to ranger roll t-shirts and base layers to save space in your pack.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"T-shirt or base layer\",\n \"Flat surface for rolling\"\n ],\n \"steps\": [\n \"🔎 **Why Use Ranger Rolling?** – This method **compresses clothing**, saves space, and keeps items **tight and organized**.\",\n \"1️⃣ **Lay the Shirt Flat** – Place the t-shirt **face-down on a flat surface**, smoothing out wrinkles.\",\n \"2️⃣ **Fold the Bottom Up** – Fold **3-4 inches of fabric** at the bottom inside-out to create a **pocket**.\",\n \"3️⃣ **Fold in the Sleeves** – Fold each sleeve **straight in toward the center**.\",\n \"4️⃣ **Fold the Sides In** – Bring the **left and right sides** inward so the shirt forms a **narrow rectangle**.\",\n \"5️⃣ **Roll Tightly from the Top** – Start from the **collar** and roll **downward** as **tight as possible**.\",\n \"6️⃣ **Secure Using the Pocket** – Flip the **inside-out pocket over the roll**, locking it in place.\"\n ],\n \"tips\": [\n \"🎒 **Use This for All Base Layers** – Works great for **long-sleeve shirts, thermals, and undershirts**.\",\n \"🧳 **Prepares Clothes for Quick Access** – Easily pull one roll from your bag **without disrupting the rest**.\",\n \"🌀 **Roll Evenly for Maximum Compression** – Uneven rolls **waste space** and unravel more easily.\"\n ]\n },\n {\n \"title\": \"Ranger Rolling: Pants & Trousers\",\n \"description\": \"Master ranger rolling for pants and trousers to fit more in your bag.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Pants, jeans, or tactical trousers\",\n \"Flat surface for rolling\"\n ],\n \"steps\": [\n \"🔎 **Why Roll Pants?** – Rolling pants **reduces bulk**, keeps them **tight and wrinkle-free**, and **saves space** in a bug-out bag.\",\n \"1️⃣ **Lay Pants Flat** – Place the pants **face-up on a flat surface**, ensuring the legs are straight.\",\n \"2️⃣ **Fold the Waistband Over** – Fold **4-5 inches** inside-out at the **waist** to create a **pocket**.\",\n \"3️⃣ **Fold in the Legs** – Fold **one leg over the other**, keeping it even.\",\n \"4️⃣ **Roll from the Cuffs Up** – Start rolling **tightly from the bottom** up toward the waist.\",\n \"5️⃣ **Secure Using the Waist Pocket** – Flip the **inside-out pocket over the roll** to lock it in place.\"\n ],\n \"tips\": [\n \"🧢 **Avoid Rolling Too Tight** – If rolled too tight, pants **may become difficult to unpack**.\",\n \"🎒 **Use for Tactical Pants & BDU Gear** – Works well for **military and hiking pants**.\",\n \"🌲 **Great for Packing in Bug-Out Bags** – Saves space for more **gear and supplies**.\"\n ]\n },\n {\n \"title\": \"Ranger Rolling: Socks & Underwear\",\n \"description\": \"Keep socks and underwear compact and easy to find using the ranger roll method.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Pairs of socks\",\n \"Underwear (boxers, briefs, or thermal bottoms)\",\n \"Flat surface\"\n ],\n \"steps\": [\n \"🔎 **Why Roll Socks & Underwear?** – Keeps these **small essentials organized**, **prevents them from getting lost**, and **saves space**.\",\n \"1️⃣ **Lay Socks Flat & Stack Together** – Place one sock **on top of the other**, aligning the cuffs.\",\n \"2️⃣ **Roll from Toes to Cuff** – Start at the toe section and **roll tightly toward the cuff**.\",\n \"3️⃣ **Use the Cuff to Secure the Roll** – Stretch the **top sock’s cuff over the roll** to lock it in place.\",\n \"4️⃣ **For Underwear: Fold & Roll** – Lay underwear flat, **fold into thirds**, then **roll tightly from the waistband down**.\",\n \"5️⃣ **Secure Using the Waistband** – Flip the waistband over the roll to **keep everything compact**.\"\n ],\n \"tips\": [\n \"🧦 **Pair Socks Before Rolling** – This makes it **easier to grab matching pairs**.\",\n \"🎒 **Use for Thermals & Base Layers Too** – Works well for **cold-weather layers**.\",\n \"🗂 **Sort by Type** – Keep **undergarments and socks separated** for quick packing.\"\n ]\n },\n {\n \"title\": \"Packing a Bug-Out Bag with Ranger Rolls\",\n \"description\": \"Learn how to pack a bug-out bag efficiently using ranger rolling techniques.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Bug-out bag (or backpack)\",\n \"Ranger-rolled clothing\",\n \"Compression straps or packing cubes (optional)\"\n ],\n \"steps\": [\n \"🔎 **Why Ranger Roll Your Bug-Out Bag?** – Organizes your gear for **fast access, weight balance, and maximum efficiency**.\",\n \"1️⃣ **Roll & Group Items by Category** – Separate **shirts, pants, socks, and underwear** into distinct bundles.\",\n \"2️⃣ **Place Heavy Items at the Bottom** – Store **boots, cooking gear, and heavier tools** at the base.\",\n \"3️⃣ **Layer Clothing Rolls for Balance** – Stack ranger-rolled clothes **above heavy items** to **distribute weight evenly**.\",\n \"4️⃣ **Use Side Pockets for Quick Access** – Pack **essential gear (fire kit, first aid, water filter)** in easily accessible areas.\",\n \"5️⃣ **Compress & Secure with Straps** – Use **compression straps or packing cubes** to **prevent shifting** during movement.\"\n ],\n \"tips\": [\n \"🎒 **Keep Heavier Items Close to Your Back** – This improves **balance and reduces strain** while carrying the bag.\",\n \"🔄 **Repack as Needed** – Adjust layout based on **urgency and ease of access** to supplies.\",\n \"🏕 **Test the Load Before Hiking** – Wear your packed bag **to ensure comfort and proper weight distribution**.\"\n ]\n },\n {\n \"title\": \"Ranger Rolling for Tactical & Military Gear\",\n \"description\": \"Organize military and tactical gear efficiently using ranger rolling.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"BDU or tactical uniforms\",\n \"Tactical belts & pouches\",\n \"Military boots (optional)\",\n \"Backpack or rucksack\"\n ],\n \"steps\": [\n \"🔎 **Why Roll Tactical Gear?** – Keeps **military clothing, uniforms, and pouches compact**, preventing clutter in the field.\",\n \"1️⃣ **Fold BDU Shirts & Pants as Standard** – Follow the ranger roll techniques for **shirts and pants**.\",\n \"2️⃣ **Secure Utility Pouches with Straps** – Keep small gear items **tight and accessible**.\",\n \"3️⃣ **Pack Ammo & Equipment Strategically** – Place **tactical gear in layers**, keeping **weapons and survival tools within reach**.\",\n \"4️⃣ **Use Modular Packing for Fast Deployment** – Arrange gear so it can be **grabbed and deployed instantly**.\",\n \"5️⃣ **Secure Using Compression Straps** – Tighten load to prevent **gear shifting during movement**.\"\n ],\n \"tips\": [\n \"⚔ **Pack Heavier Tactical Gear in the Center** – Helps **balance the pack for movement**.\",\n \"🛠 **Label or Mark Essential Gear** – Use **color-coding or pouches** to identify critical items fast.\",\n \"🔄 **Practice Unpacking & Repacking** – The **faster you can set up your gear, the more prepared you’ll be**.\"\n ]\n },\n {\n \"title\": \"Packing a Bug-Out Bag: Essentials & Organization\",\n \"description\": \"Learn how to efficiently pack a bug-out bag with all necessary survival gear.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Bug-out bag (backpack, rucksack, or duffel bag)\",\n \"Survival gear (fire starter, water filter, first aid kit, etc.)\",\n \"Clothing and sleeping gear\",\n \"Food and emergency rations\",\n \"Compression straps or packing cubes (optional)\"\n ],\n \"steps\": [\n \"🔎 **Why Pack a Bug-Out Bag Correctly?** – A well-packed bug-out bag ensures **balance, easy access to gear, and weight efficiency for long-term survival**.\",\n \"1️⃣ **Choose the Right Bag** – Select a **durable, waterproof bag** with enough storage for at least **72 hours of survival gear**.\",\n \"2️⃣ **Pack Heavy Items at the Bottom** – Store **water bottles, tools, and cookware** at the base for better weight distribution.\",\n \"3️⃣ **Keep Frequently Used Items Accessible** – Place **fire starters, maps, first aid, and weapons in outer pockets**.\",\n \"4️⃣ **Use Waterproof Bags for Electronics & Documents** – Keep **phones, radios, and ID documents in zip-lock or dry bags**.\",\n \"5️⃣ **Distribute Weight Evenly** – Avoid overloading one side, which can cause **strain and discomfort** during movement.\",\n \"6️⃣ **Test the Bag's Weight & Fit** – Adjust straps and test-wear the bag **before an emergency** to ensure comfort.\"\n ],\n \"tips\": [\n \"🎒 **Stay Under 25% of Your Body Weight** – Avoid carrying too much weight to prevent **fatigue and injury**.\",\n \"💦 **Carry Water Wisely** – Use **hydration bladders** or lightweight filtration systems instead of multiple heavy bottles.\",\n \"🚑 **Make a Quick-Grab Emergency Pouch** – Keep **first aid, emergency food, and small tools in an easy-access pocket**.\"\n ]\n },\n {\n \"title\": \"Packing for Cold Weather: Winter Survival Loadout\",\n \"description\": \"Learn how to pack for cold weather survival, ensuring warmth and efficiency.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Cold-weather clothing (thermal layers, insulated jacket, gloves, hat, etc.)\",\n \"Sleeping bag rated for sub-zero temperatures\",\n \"Hand warmers and fire-starting gear\",\n \"Extra socks and waterproof boots\"\n ],\n \"steps\": [\n \"🔎 **Why Pack Smart for Cold Weather?** – In extreme cold, **staying warm, dry, and mobile is essential** for survival.\",\n \"1️⃣ **Layer Clothing Properly** – Pack in layers: **base layer (moisture-wicking), mid-layer (insulation), and outer layer (waterproof)**.\",\n \"2️⃣ **Use Compression Bags for Bulkier Gear** – Stuff jackets, sleeping bags, and extra socks into **compression sacks**.\",\n \"3️⃣ **Protect Fire-Starting Gear from Moisture** – Store **lighters, matches, and tinder in waterproof containers**.\",\n \"4️⃣ **Keep Heat Packs in Outer Pockets** – Place hand and foot warmers where they’re easily accessible.\",\n \"5️⃣ **Secure Ice & Snow Gear Separately** – Attach **crampons, snowshoes, or ice axes to external MOLLE straps**.\",\n \"6️⃣ **Avoid Sweating** – **Overpacking causes overheating**, leading to sweat that **freezes in cold weather**.\"\n ],\n \"tips\": [\n \"🧊 **Insulate Water Bottles** – Store water **inside your jacket or sleeping bag** to prevent freezing.\",\n \"🔥 **Have Multiple Fire Starters** – A single **failed fire-starting method could be deadly in freezing conditions**.\",\n \"🦶 **Pack Extra Socks** – Wet feet in winter lead to **frostbite**, so always carry **dry backups**.\"\n ]\n },\n {\n \"title\": \"Packing a Tactical Loadout: Military & Combat Gear\",\n \"description\": \"Optimize your tactical gear loadout for movement, accessibility, and combat readiness.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Tactical backpack or plate carrier\",\n \"Ammunition pouches and firearm accessories\",\n \"Medical kit and tourniquet\",\n \"Body armor and protective gear\"\n ],\n \"steps\": [\n \"🔎 **Why Pack a Tactical Loadout Efficiently?** – **Weight balance, quick access, and protection** are key for tactical readiness.\",\n \"1️⃣ **Distribute Weight Evenly** – Heavy **ammo and gear should be close to the center of mass** for better agility.\",\n \"2️⃣ **Prioritize Ammo & First Aid** – Place **magazines and medical gear in easy-access pouches**.\",\n \"3️⃣ **Secure Body Armor Properly** – Adjust plate carriers and chest rigs for **mobility and protection**.\",\n \"4️⃣ **Use MOLLE Attachments for Quick Deployment** – Store **flashlights, knives, and radios within reach**.\",\n \"5️⃣ **Avoid Carrying Unnecessary Gear** – **Minimize bulk** by focusing on **mission-critical equipment only**.\",\n \"6️⃣ **Pack a Backup Weapon if Possible** – A secondary firearm or knife **provides redundancy in emergencies**.\"\n ],\n \"tips\": [\n \"⚔ **Keep Loadout Under 35 lbs** – A heavy pack **reduces speed and maneuverability**.\",\n \"🔫 **Train with Your Gear** – Regularly **wear and move with your tactical setup** to adjust for real-world use.\",\n \"🗃 **Label & Organize Ammo** – Store **different calibers separately** for quick identification.\"\n ]\n },\n {\n \"title\": \"Packing for Long-Term Survival: Extended Gear Loadout\",\n \"description\": \"Prepare for long-term survival with a pack designed for self-sufficiency.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Large-capacity backpack or external frame pack\",\n \"Multi-tool and survival knife\",\n \"Food and water purification system\",\n \"Shelter and fire-starting gear\",\n \"Hunting and trapping supplies\"\n ],\n \"steps\": [\n \"🔎 **Why Pack for Long-Term Survival?** – This pack ensures **self-sufficiency for extended periods in the wild**.\",\n \"1️⃣ **Pack Lightweight, High-Calorie Food** – Focus on **dried meats, nuts, and meal replacements** to maximize nutrition.\",\n \"2️⃣ **Carry a Multi-Purpose Tool** – A **multi-tool or survival knife reduces the need for extra gear**.\",\n \"3️⃣ **Include Renewable Water Collection** – Pack a **water filter, purification tablets, and solar still setup**.\",\n \"4️⃣ **Pack Durable Shelter Gear** – A **lightweight tarp, hammock, or bivy sack** is preferable to a heavy tent.\",\n \"5️⃣ **Keep a Backup Fire-Starting Method** – Always have **multiple ways to make fire (ferro rod, lighter, bow drill)**.\",\n \"6️⃣ **Balance Between Mobility & Resources** – Avoid overloading your pack **beyond sustainable carrying weight**.\"\n ],\n \"tips\": [\n \"🌲 **Plan for Resupply** – Long-term survival relies on **hunting, foraging, and replenishing supplies**.\",\n \"🔥 **Use Minimal Fuel Cooking Methods** – A small camp stove or Dakota fire hole **conserves resources**.\",\n \"🗺 **Have Navigation Tools** – A **map, compass, or GPS device** ensures you **can relocate supply caches**.\"\n ]\n },\n {\n \"title\": \"Packing a First Aid Kit: Medical Readiness\",\n \"description\": \"Assemble a well-stocked medical kit for survival situations.\",\n \"category\": \"packing\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Tourniquets, bandages, and gauze\",\n \"Antiseptic wipes and antibiotic ointment\",\n \"Emergency medications (pain relievers, antihistamines)\",\n \"Medical gloves and trauma shears\"\n ],\n \"steps\": [\n \"🔎 **Why Have a First Aid Kit?** – Injuries are **common in survival situations**; a medical kit can **prevent infection and save lives**.\",\n \"1️⃣ **Start with Trauma Supplies** – Pack **tourniquets, gauze, and hemostatic agents** for serious injuries.\",\n \"2️⃣ **Include Everyday Essentials** – Pack **band-aids, antiseptics, and allergy meds** for minor issues.\",\n \"3️⃣ **Organize for Quick Access** – Store **critical items in separate pouches for fast retrieval**.\",\n \"4️⃣ **Label Everything Clearly** – Ensure you **know what each item is and how to use it**.\",\n \"5️⃣ **Store in a Waterproof Case** – A sealed medical bag **protects against moisture and contamination**.\",\n \"6️⃣ **Restock Regularly** – Replace used or expired items to **keep your kit effective**.\"\n ],\n \"tips\": [\n \"🚑 **Learn Basic First Aid Skills** – Having supplies is useless **if you don’t know how to use them**.\",\n \"🧼 **Prioritize Hygiene** – **Clean wounds immediately** to prevent infection in survival scenarios.\",\n \"📋 **Pack a Medical Reference Guide** – **A small manual or printed instructions can save lives**.\"\n ]\n },\n \n // 🗡️ Tool Mastery\n {\n \"title\": \"Flint Knapping: Understanding the Basics\",\n \"description\": \"Learn the fundamental techniques of flint knapping to create sharp stone tools.\",\n \"category\": \"tool-mastery\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Flint, chert, or obsidian\",\n \"Hammerstone (for percussion flaking)\",\n \"Pressure flaker (antler tine or copper-tipped tool)\",\n \"Leather pad or hand protection\"\n ],\n \"steps\": [\n \"🔎 **What is Flint Knapping?** – Flint knapping is the process of shaping **stone tools and weapons** by carefully striking rock.\",\n \"1️⃣ **Choose Your Stone** – **Flint, chert, and obsidian** are ideal for knapping due to their fine-grained structure.\",\n \"2️⃣ **Prepare the Core** – Strike off an **initial flake** using a hammerstone to create a workable edge.\",\n \"3️⃣ **Percussion Flaking** – Hold the stone and strike at a **sharp angle** to remove **long, thin flakes**.\",\n \"4️⃣ **Pressure Flaking** – Use a pointed tool (antler, bone, or copper) to refine the edge by applying controlled pressure.\",\n \"5️⃣ **Shape the Tool** – Continue **removing small flakes** to form a **knife, scraper, or arrowhead**.\",\n \"6️⃣ **Smooth & Sharpen** – Grind dull edges and refine the tool's shape for usability.\"\n ],\n \"tips\": [\n \"🛠 **Wear Gloves & Eye Protection** – Knapping creates **sharp shards** that can cut skin easily.\",\n \"⚡ **Control Your Strikes** – Use **firm but controlled** blows for **better accuracy and efficiency**.\",\n \"🪵 **Practice on Thicker Stones First** – Thin flakes are easier to break, so start with **larger cores**.\"\n ]\n },\n {\n \"title\": \"Flint Knapping: Making a Stone Knife\",\n \"description\": \"Craft a sharp, durable stone knife using flint knapping techniques.\",\n \"category\": \"tool-mastery\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Flint or chert\",\n \"Hammerstone\",\n \"Pressure flaker\",\n \"Wood or bone handle\",\n \"Cordage or sinew (for binding)\"\n ],\n \"steps\": [\n \"🔎 **Why a Stone Knife?** – Stone knives are **versatile survival tools** used for **cutting, skinning, and carving**.\",\n \"1️⃣ **Select Your Flint Core** – Choose a piece with **a sharp edge** and a **manageable size**.\",\n \"2️⃣ **Shape the Blade** – Use **percussion flaking** to remove excess material and form a **long, thin shape**.\",\n \"3️⃣ **Refine the Edge** – Apply **pressure flaking** along both sides to create a **sharp cutting edge**.\",\n \"4️⃣ **Prepare the Handle** – Carve a **notch in wood or bone** to fit the stone blade securely.\",\n \"5️⃣ **Secure the Blade** – Use **sinew, plant fiber, or cordage** to tightly wrap the knife in place.\",\n \"6️⃣ **Test & Sharpen** – Carefully test the knife on **softwood or meat** and refine if needed.\"\n ],\n \"tips\": [\n \"🔪 **Use Fine Pressure Flakes** – A **well-knapped edge** cuts better and lasts longer.\",\n \"🪵 **Choose a Comfortable Handle** – Ensure the **grip feels secure** for safe handling.\",\n \"🔥 **Fire-Harden the Handle** – Slightly charring wood **improves durability and grip**.\"\n ]\n },\n {\n \"title\": \"Flint Knapping: Crafting an Arrowhead\",\n \"description\": \"Create a sharp stone arrowhead for hunting and survival tools.\",\n \"category\": \"tool-mastery\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Flint or obsidian\",\n \"Pressure flaker\",\n \"Hammerstone\",\n \"Wooden shaft for mounting\"\n ],\n \"steps\": [\n \"🔎 **Why Make an Arrowhead?** – Stone arrowheads were **essential tools for hunting** and **self-defense**.\",\n \"1️⃣ **Find a Suitable Flake** – Choose a thin **but strong** piece of flint or obsidian.\",\n \"2️⃣ **Shape the Arrowhead** – Use **percussion flaking** to rough out a **triangular shape**.\",\n \"3️⃣ **Create Notches for Lashing** – Use **pressure flaking** to carve small notches at the base for attaching the shaft.\",\n \"4️⃣ **Sharpen the Edges** – Refine the blade edge with **light, controlled pressure flaking**.\",\n \"5️⃣ **Attach to a Shaft** – Use **sinew, glue, or resin** to secure the arrowhead to a wooden shaft.\",\n \"6️⃣ **Test for Balance & Strength** – Ensure the arrow **flies straight** and doesn't break on impact.\"\n ],\n \"tips\": [\n \"🎯 **Thin = Sharp, Thick = Strong** – Balance **cutting ability** with **durability**.\",\n \"🔥 **Fire-Harden the Shaft** – Heating the wood strengthens the arrow for better performance.\",\n \"🛠 **Practice on Small Flakes First** – Arrowheads require **precise shaping**, so refine skills before making them.\"\n ]\n },\n {\n \"title\": \"Flint Knapping: Making a Spearhead\",\n \"description\": \"Learn to craft a larger stone spearhead for big game hunting or self-defense.\",\n \"category\": \"tool-mastery\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Large piece of flint or chert\",\n \"Hammerstone\",\n \"Pressure flaker\",\n \"Wooden spear shaft\",\n \"Cordage or sinew\"\n ],\n \"steps\": [\n \"🔎 **Why a Spearhead?** – Stone-tipped spears were used for **big game hunting and survival defense**.\",\n \"1️⃣ **Choose a Large Flint Flake** – Look for a **thicker and wider** piece than an arrowhead.\",\n \"2️⃣ **Rough Out the Shape** – Use **percussion flaking** to form a **broad, pointed blade**.\",\n \"3️⃣ **Refine with Pressure Flaking** – Create **sharp edges** and notch the base for secure attachment.\",\n \"4️⃣ **Prepare the Shaft** – Carve a **slot in a wooden pole** to hold the spearhead.\",\n \"5️⃣ **Secure the Spearhead** – Lash it tightly with **sinew, rawhide, or plant fiber**.\",\n \"6️⃣ **Reinforce with Resin (Optional)** – Pine resin or hide glue can **strengthen the binding**.\"\n ],\n \"tips\": [\n \"⚒ **Use a Stronger Core** – A **thicker, denser stone** makes the spearhead **more durable**.\",\n \"🔥 **Harden the Shaft** – Fire-hardening the wood **increases spear strength**.\",\n \"🎯 **Test for Balance** – A well-balanced spear flies straighter and hits harder.\"\n ]\n },\n {\n \"title\": \"Flint Knapping: Advanced Pressure Flaking Techniques\",\n \"description\": \"Master fine-detail pressure flaking to refine and perfect stone tools.\",\n \"category\": \"tool-mastery\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Flint, chert, or obsidian\",\n \"Copper-tipped or antler flaker\",\n \"Leather pad for hand protection\",\n \"Abrader stone\"\n ],\n \"steps\": [\n \"🔎 **What is Pressure Flaking?** – This technique **removes small, controlled flakes** to sharpen and refine tools.\",\n \"1️⃣ **Select Your Tool** – Use an **antler tine, copper flaker, or strong bone** for best results.\",\n \"2️⃣ **Grip the Stone Securely** – Hold the tool **on a leather pad or against your leg** for control.\",\n \"3️⃣ **Apply Steady Pressure** – Press **firmly and consistently** near the tool’s edge to remove fine flakes.\",\n \"4️⃣ **Work Evenly on Both Sides** – This ensures the blade **remains symmetrical and balanced**.\",\n \"5️⃣ **Sharpen & Finish** – Continue refining **until the blade reaches desired sharpness**.\",\n \"6️⃣ **Polish & Strengthen** – Use an **abrader stone** to smooth edges and **harden the surface**.\"\n ],\n \"tips\": [\n \"🛠 **Use Small, Controlled Movements** – Large pressure changes **can break delicate tools**.\",\n \"🔥 **Heat-Treating Stone Helps** – Heating flint **improves flake quality and sharpness**.\",\n \"⚡ **Practice on Scrap First** – Perfect your **technique** before working on a **final tool**.\"\n ]\n },\n \n // 🔥 Fire Starting\n {\n title: \"Fire Making: Ferro Rod\",\n description: \"Learn how to start a fire using a ferro rod. This reliable method creates sparks to ignite tinder.\",\n category: \"fire\",\n completed: false,\n expanded: false,\n materials: [\n \"Ferro rod (ferrocerium rod)\",\n \"Metal striker or knife spine\",\n \"Tinder bundle (dry grass, bark shavings, cotton balls, char cloth)\",\n \"Kindling (small twigs, dry leaves)\",\n \"Firewood (small to large pieces)\"\n ],\n steps: [\n \"🔎 **Understanding the Ferro Rod** – A ferro rod produces hot sparks when scraped with a metal striker. These sparks ignite tinder to start a fire.\",\n \"1️⃣ **Prepare Your Tinder Bundle** – Gather dry, fluffy materials like dry grass, bark shavings, or cotton balls. Fluff the tinder to make it catch sparks easily.\",\n \"2️⃣ **Position the Ferro Rod** – Hold the ferro rod close to the tinder bundle. Angle the rod slightly downward to direct sparks into the tinder.\",\n \"3️⃣ **Scrape the Rod** – Use a metal striker or the back of a knife to scrape the ferro rod firmly and quickly. Aim for **long, controlled scrapes** to produce a shower of sparks.\",\n \"4️⃣ **Catch the Sparks** – Direct the sparks onto the tinder bundle. If the tinder begins to smolder, gently blow on it to encourage flames.\",\n \"5️⃣ **Add Kindling** – Once the tinder ignites, carefully add small twigs and dry leaves to build the fire.\",\n \"6️⃣ **Build the Fire** – Gradually add larger sticks and logs to sustain the fire.\"\n ],\n tips: [\n \"🔥 **Use Dry Tinder** – Wet or damp tinder won’t catch sparks. Always keep your tinder dry.\",\n \"🎯 **Aim for the Base** – Direct sparks at the base of the tinder bundle for the best chance of ignition.\",\n \"🪵 **Practice Scraping** – Ferro rods require a firm, quick scrape. Practice your technique before relying on it in the wild.\"\n ]\n },\n {\n title: \"Fire Making: Flint & Steel (Pyrite & Chert)\",\n description: \"Master the ancient fire-starting technique using flint and steel or pyrite and chert.\",\n category: \"fire\",\n completed: false,\n expanded: false,\n materials: [\n \"Flint (or chert) rock\",\n \"High-carbon steel striker (or the back of a knife blade)\",\n \"Char cloth (or natural tinder like dry fungus, chaga, or amadou)\",\n \"Tinder nest (dry grass, shredded bark, cotton)\",\n \"Kindling (small twigs, dry leaves)\"\n ],\n steps: [\n \"🔎 **Understanding Flint & Steel** – Striking flint against steel creates high-temperature sparks, which can ignite char cloth or dry tinder.\",\n \"1️⃣ **Prepare Your Tinder** – Place char cloth on top of the flint so it catches sparks easily.\",\n \"2️⃣ **Hold the Flint Correctly** – Grip the flint with a sharp edge facing outward. Hold the striker in the other hand.\",\n \"3️⃣ **Strike to Create Sparks** – Strike the steel down against the flint at a sharp angle. A bright orange spark should land on the char cloth.\",\n \"4️⃣ **Nurture the Ember** – When the char cloth smolders, carefully place it in a tinder nest.\",\n \"5️⃣ **Blow Gently** – Blow on the ember until the tinder nest catches fire.\",\n \"6️⃣ **Build the Fire** – Add small twigs and progressively larger wood to sustain the flame.\"\n ],\n tips: [\n \"🪨 **Use Sharp Flint** – A dull edge won’t create strong sparks. Break off a fresh edge if needed.\",\n \"🔥 **Have Char Cloth Ready** – Char cloth catches sparks much faster than dry grass or bark.\",\n \"💨 **Blow Slowly** – Too much air can smother the ember. Blow gently and evenly.\"\n ]\n },\n {\n title: \"Fire Making: Bow Drill\",\n description: \"Learn the art of friction fire using a bow drill to create an ember.\",\n category: \"fire\",\n completed: false,\n expanded: false,\n materials: [\n \"Bow (a flexible stick with a cord tied at both ends)\",\n \"Spindle (a straight, smooth hardwood stick)\",\n \"Hearthboard (a softwood base with a carved notch)\",\n \"Handhold (a smooth rock, bone, or wood piece to apply pressure)\",\n \"Tinder bundle (dry grass, fine bark, wood shavings)\"\n ],\n steps: [\n \"🔎 **Understanding the Bow Drill** – A bow drill creates heat through friction, generating an ember that ignites tinder.\",\n \"1️⃣ **Prepare the Hearthboard** – Cut a shallow notch in the hearthboard where the spindle will rotate.\",\n \"2️⃣ **Position the Spindle** – Place the spindle upright in the notch and secure the top with the handhold.\",\n \"3️⃣ **Wrap the Bowstring** – Wrap the bowstring around the spindle in one loop.\",\n \"4️⃣ **Start Drilling** – Move the bow back and forth in smooth, steady strokes. Apply downward pressure on the spindle.\",\n \"5️⃣ **Generate Heat** – Continue drilling until smoke and fine wood dust appear in the notch.\",\n \"6️⃣ **Catch the Ember** – Once an ember forms, carefully transfer it to the tinder bundle.\",\n \"7️⃣ **Blow Gently** – Blow until the tinder ignites into a flame, then build your fire.\"\n ],\n tips: [\n \"🔥 **Use Softwood for the Hearthboard** – Cedar, poplar, or willow works best.\",\n \"🪵 **Keep the Spindle Dry** – Moisture prevents friction heat.\",\n \"🎯 **Apply Firm, Even Pressure** – Too much pressure can stop the spindle; too little won’t create enough heat.\"\n ]\n },\n {\n title: \"Fire Making: Fire Plough\",\n description: \"Create fire through friction using the fire plough method.\",\n category: \"fire\",\n completed: false,\n expanded: false,\n materials: [\n \"Hearthboard (softwood like cedar, willow, or pine)\",\n \"Fire plough stick (a hardwood stick for friction)\",\n \"Tinder bundle (dry grass, bark shavings, fine wood dust)\"\n ],\n steps: [\n \"🔎 **Understanding the Fire Plough** – Rubbing a hardwood stick against a softwood base creates friction, producing heat to ignite tinder.\",\n \"1️⃣ **Set Up the Hearthboard** – Cut a shallow groove down the center.\",\n \"2️⃣ **Position the Fire Plough Stick** – Hold the stick at a 45° angle in the groove.\",\n \"3️⃣ **Plough Back & Forth** – Apply firm downward pressure while moving the stick rapidly back and forth.\",\n \"4️⃣ **Create Wood Dust** – Fine wood particles will build up and start to smolder.\",\n \"5️⃣ **Catch the Ember in Tinder** – Transfer the glowing dust into a tinder bundle.\",\n \"6️⃣ **Blow to Ignite** – Blow gently until flames appear, then build your fire.\"\n ],\n tips: [\n \"🔥 **Use Dry Wood** – Wet or damp wood won’t generate enough heat.\",\n \"🪵 **Increase Friction** – A rougher surface increases heat buildup.\",\n \"💨 **Be Patient** – This method takes time and persistence.\"\n ]\n },\n {\n \"title\": \"Fire Making: Hand Drill\",\n \"description\": \"Master the most primitive friction fire-starting method using only your hands and a drill.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Drill (straight, dry plant stalk or branch, 1-2 feet long)\",\n \"Hearth board (softwood with a small notch)\",\n \"Tinder bundle (dry grass, bark fibers, fine plant material)\"\n ],\n \"steps\": [\n \"🔎 **Understanding the Hand Drill** – The hand drill method uses direct hand friction to rotate a spindle, generating heat to create an ember.\",\n \"1️⃣ **Prepare the Hearth Board** – Carve a small notch in the hearth board to collect dust and form an ember.\",\n \"2️⃣ **Position the Drill** – Place the drill into the notch and hold it upright between your palms.\",\n \"3️⃣ **Spin the Drill with Your Hands** – Move your hands downward while pressing and rolling the drill between your palms.\",\n \"4️⃣ **Increase Speed & Pressure** – Once smoke appears, apply more pressure and spin faster to generate an ember.\",\n \"5️⃣ **Transfer the Ember** – Carefully move the ember into a tinder bundle and gently blow to start a flame.\",\n \"6️⃣ **Build the Fire** – Add kindling and larger fuel to sustain the fire.\"\n ],\n \"tips\": [\n \"🔥 **Use Dry, Straight Wood** – The drill should be light and dry for better friction.\",\n \"✋ **Protect Your Hands** – If your hands blister easily, wrap them with cloth for cushioning.\",\n \"💨 **Focus on Speed & Pressure** – A steady increase in both produces the best results.\"\n ]\n },\n {\n \"title\": \"Fire Making: Fire Piston\",\n \"description\": \"Learn how to use a fire piston to create fire by compressing air to ignite tinder.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Fire piston (or DIY version using metal, wood, or bamboo tube)\",\n \"Char cloth or dry tinder (fungus, cotton, punk wood)\",\n \"Lubrication (grease, oil, or wax for sealing the piston)\",\n \"Kindling and fuel wood\"\n ],\n \"steps\": [\n \"🔎 **Understanding the Fire Piston** – A fire piston uses rapid compression of air inside a sealed cylinder to create heat, igniting tinder inside.\",\n \"1️⃣ **Prepare the Fire Piston** – Ensure the piston’s seal is tight by applying grease or wax around the gasket.\",\n \"2️⃣ **Load the Tinder** – Place a small piece of char cloth or finely processed tinder at the end of the piston.\",\n \"3️⃣ **Compress the Piston** – Insert the piston quickly and forcefully into the cylinder, creating rapid air compression.\",\n \"4️⃣ **Extract the Ember** – Once compressed, remove the piston and check if the tinder is glowing.\",\n \"5️⃣ **Transfer the Ember** – Carefully place the ember into a dry tinder bundle and blow gently to encourage flames.\",\n \"6️⃣ **Build the Fire** – Once the tinder ignites, add small twigs, then larger fuel wood.\"\n ],\n \"tips\": [\n \"💨 **Speed Matters** – The piston must be compressed rapidly to generate enough heat.\",\n \"🔥 **Use Dry Tinder** – Char cloth is highly recommended for best results.\",\n \"🛠 **Check the Seal** – A loose or dry gasket won’t create enough pressure, so keep it greased.\"\n ]\n },\n {\n \"title\": \"Fire Making: Fire Thong\",\n \"description\": \"Master the rare and ancient fire thong technique, using friction to ignite wood fibers.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Fire board (softwood like cedar, pine, or willow)\",\n \"Flexible cordage (plant fiber, rawhide, or natural rope)\",\n \"Tinder bundle (dry grass, bark fibers, fine plant material)\"\n ],\n \"steps\": [\n \"🔎 **Understanding the Fire Thong** – This method generates friction by rapidly pulling a flexible cord back and forth against a groove in a wooden board.\",\n \"1️⃣ **Carve a Groove** – Cut a shallow groove into the fire board where friction will generate heat.\",\n \"2️⃣ **Position the Cord** – Wrap the cord around both ends of the groove so it crosses the fire board.\",\n \"3️⃣ **Apply Pressure** – Press the cord into the groove while maintaining tension.\",\n \"4️⃣ **Saw Back & Forth** – Rapidly pull both ends of the cord back and forth to generate heat through friction.\",\n \"5️⃣ **Create an Ember** – Once charred wood dust forms and begins smoldering, stop sawing and gently blow on it.\",\n \"6️⃣ **Transfer the Ember** – Place the ember into a tinder bundle and blow until flames appear.\",\n \"7️⃣ **Build the Fire** – Add small twigs and gradually larger wood to maintain the fire.\"\n ],\n \"tips\": [\n \"💪 **Use Strong Cordage** – Thin or weak cord may snap under tension.\",\n \"🔥 **Keep the Groove Dry** – Moisture can prevent heat buildup, so use completely dry wood.\",\n \"⏳ **Be Patient** – This method requires endurance and persistence.\"\n ]\n },\n {\n \"title\": \"Fire Making: Solar Fire (Lens & Mirror)\",\n \"description\": \"Learn how to start a fire using magnification from a lens or reflection from a mirror.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Magnifying glass or convex lens (eyeglasses, binoculars, or camera lens)\",\n \"Mirror or shiny metal (signal mirror, polished tin can, CD)\",\n \"Tinder bundle (dry grass, shredded bark, char cloth)\",\n \"Kindling and fuel wood\"\n ],\n \"steps\": [\n \"🔎 **Understanding Solar Fire** – A lens focuses sunlight into a concentrated point, while a mirror redirects sunlight to ignite tinder.\",\n \"1️⃣ **Find a Lens or Mirror** – Use a magnifying glass, eyeglasses, binocular lens, or polished metal.\",\n \"2️⃣ **Position the Lens or Mirror** – Hold the lens at an angle to direct sunlight onto the tinder.\",\n \"3️⃣ **Focus the Light** – Adjust the distance so that the light forms a small, bright point on the tinder.\",\n \"4️⃣ **Wait for Ignition** – Hold steady as the tinder heats up and starts to smolder.\",\n \"5️⃣ **Blow on the Tinder** – Gently blow to encourage a flame.\",\n \"6️⃣ **Build the Fire** – Add small twigs, then larger sticks to keep the fire going.\"\n ],\n \"tips\": [\n \"☀️ **Use Direct Sunlight** – This method only works in clear, sunny conditions.\",\n \"🎯 **Focus the Beam** – The smaller and brighter the focal point, the faster ignition occurs.\",\n \"🔥 **Use Char Cloth** – Blackened material absorbs heat better than light-colored tinder.\"\n ]\n },\n {\n \"title\": \"Fire Making: Empty Lighter Sparks\",\n \"description\": \"Learn how to start a fire using only the sparks from an empty lighter.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Empty gas lighter (non-electric, non-piezo type)\",\n \"Fine tinder (char cloth, dry grass, shredded bark, steel wool)\",\n \"Kindling (small twigs, leaves)\"\n ],\n \"steps\": [\n \"🔎 **Understanding Empty Lighter Sparks** – Even if a lighter is out of fuel, its flint still produces sparks that can ignite tinder.\",\n \"1️⃣ **Prepare Fine Tinder** – Use char cloth, dry grass, or shredded bark. The finer the material, the better.\",\n \"2️⃣ **Position the Tinder** – Hold the tinder close to the lighter’s nozzle.\",\n \"3️⃣ **Strike the Lighter** – Rapidly flick the lighter’s wheel to generate sparks.\",\n \"4️⃣ **Catch the Sparks** – The sparks should land on the tinder and begin smoldering.\",\n \"5️⃣ **Encourage the Ember** – Blow gently to increase heat and ignite flames.\",\n \"6️⃣ **Build the Fire** – Add small twigs, then gradually larger wood.\"\n ],\n \"tips\": [\n \"⚡ **Flint Must Be Intact** – If the lighter’s flint is completely worn down, it won’t produce sparks.\",\n \"🔥 **Use Char Cloth** – It catches sparks easily and holds an ember longer.\",\n \"💨 **Blow Gently** – Too much air can extinguish the ember before it catches.\"\n ]\n },\n {\n \"title\": \"Fire Making: Steel Wool & Battery\",\n \"description\": \"Create fire instantly by short-circuiting a battery with steel wool.\",\n \"category\": \"fire\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Fine steel wool (0000-grade recommended)\",\n \"Battery (9V, AA, AAA, or larger)\",\n \"Tinder bundle (dry grass, shredded bark, char cloth)\",\n \"Kindling (small twigs, dry leaves)\"\n ],\n \"steps\": [\n \"🔎 **Understanding Steel Wool & Battery Fire** – When steel wool touches both battery terminals, it short-circuits, creating sparks and heat.\",\n \"1️⃣ **Prepare Fine Steel Wool** – Stretch out a small amount to maximize air exposure.\",\n \"2️⃣ **Place the Steel Wool on Tinder** – Position it directly over a dry tinder bundle.\",\n \"3️⃣ **Touch the Battery Terminals** – Press both ends of the steel wool against the battery terminals.\",\n \"4️⃣ **Observe the Ignition** – Sparks will travel through the steel wool, igniting it.\",\n \"5️⃣ **Transfer the Fire** – Once the steel wool catches, blow on it and use it to ignite the tinder.\",\n \"6️⃣ **Build the Fire** – Add small twigs and gradually larger fuel to keep the fire going.\"\n ],\n \"tips\": [\n \"⚠️ **Only Use Fine Steel Wool** – Coarse steel wool won’t ignite as easily.\",\n \"🔥 **Have Tinder Ready** – Steel wool burns fast, so work quickly.\",\n \"🔋 **Works with Most Batteries** – 9V batteries work best, but AA/AAA batteries can also work in pairs.\"\n ]\n },\n\n // 💧 Water Purification\n {\n title: \"Water Collection: Finding Natural Sources\",\n description: \"Learn how to locate safe, natural water sources in the wild.\",\n category: \"water\",\n completed: false,\n expanded: false,\n materials: [\n \"Map (optional but useful for terrain analysis)\",\n \"Container for collecting water\",\n \"Cloth or bandana for filtering debris\",\n \"Water purification method (boiling, filter, tablets, etc.)\"\n ],\n steps: [\n \"🔎 **Understanding Natural Water Sources** – Water is most commonly found in streams, rivers, lakes, and underground sources. Knowing where to look is essential for survival.\",\n \"1️⃣ **Look for Flowing Water** – Moving water (streams, rivers) is generally safer than stagnant water (ponds, puddles), as it is less likely to contain bacteria and parasites.\",\n \"2️⃣ **Follow Animal Trails & Insects** – Many animals create paths leading to water sources. Increased insect activity can also indicate water nearby.\",\n \"3️⃣ **Search Low-Lying Areas** – Water naturally flows downhill. Valleys, depressions, and the base of hills are likely to have water sources.\",\n \"4️⃣ **Check Vegetation Growth** – Green, lush plants often indicate underground water. Digging at their base may reveal moisture.\",\n \"5️⃣ **Use the Sound of Water** – In quiet environments, you may hear running water before seeing it. Listen for the distinct sound of a stream or waterfall.\",\n \"6️⃣ **Avoid Contaminated Water** – Stay away from water sources with dead animals, algae blooms, or a foul odor, as these indicate contamination.\"\n ],\n tips: [\n \"💧 **Avoid Stagnant Water** – Stagnant pools are breeding grounds for bacteria and parasites.\",\n \"🌿 **Look for Morning Dew** – In dry environments, dew can be collected from grass and leaves using a cloth.\",\n \"🏔️ **Use Rock Formations** – Rock crevices and indentations may contain rainwater or condensation.\"\n ]\n },\n {\n \"title\": \"Water Collection: Rainwater Collection & Filtering\",\n \"description\": \"Rainwater is a clean source of water, but it should still be filtered before drinking.\",\n \"category\": \"water\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Large tarp or plastic sheet\",\n \"Container (bowl, bucket, or bottle)\",\n \"Cloth or bandana (for filtering debris)\",\n \"Storage bottle (for long-term use)\"\n ],\n \"steps\": [\n \"🔎 **Why Collect Rainwater?** – Rainwater is naturally distilled by the atmosphere, making it one of the cleanest water sources.\",\n \"1️⃣ **Set Up a Collection Surface** – Lay a tarp or plastic sheet in an open area to catch rain.\",\n \"2️⃣ **Create a Funnel System** – Tilt the tarp slightly so water flows into a container.\",\n \"3️⃣ **Filter Through Cloth** – Pour collected water through a cloth to remove dirt and debris.\",\n \"4️⃣ **Store in Clean Containers** – Transfer rainwater to a sealed bottle or container for later use.\",\n \"5️⃣ **Boil or Purify Before Drinking** – While rainwater is generally clean, bacteria or contaminants from the air may still be present.\"\n ],\n \"tips\": [\n \"☔ **Use a Large Surface Area** – A bigger tarp collects more water.\",\n \"🔄 **Filter After Collection** – Even clean rainwater can contain dust or insect debris.\",\n \"🏺 **Store Properly** – Use **sealed bottles** to prevent contamination.\"\n ]\n },\n {\n title: \"Water Collection: Solar Still\",\n description: \"A solar still uses the sun’s heat to collect clean water from the ground.\",\n category: \"water\",\n completed: false,\n expanded: false,\n materials: [\n \"Plastic sheet or tarp\",\n \"Small container or cup\",\n \"Digging tool (stick or rock)\",\n \"Green plants or damp soil\"\n ],\n steps: [\n \"🔎 **How a Solar Still Works** – The sun heats the ground, causing water to evaporate and condense on the plastic sheet, collecting clean water.\",\n \"1️⃣ **Dig a Hole in Moist Ground** – Find a low spot with damp soil and dig a hole about **2 feet wide and 1 foot deep**.\",\n \"2️⃣ **Place a Container in the Center** – Put a cup or container at the bottom of the hole to collect condensed water.\",\n \"3️⃣ **Cover the Hole with Plastic** – Stretch a plastic sheet over the hole, securing the edges with rocks or soil.\",\n \"4️⃣ **Place a Small Rock in the Center of the Plastic** – This creates a low point for water droplets to drip into the cup.\",\n \"5️⃣ **Let the Sun Do the Work** – Over several hours, water will evaporate, condense on the plastic, and drip into the container.\",\n \"6️⃣ **Collect & Drink the Water** – Retrieve the container and enjoy the purified water.\"\n ],\n tips: [\n \"☀️ **Works Best in Sunny Weather** – Cloudy conditions reduce effectiveness.\",\n \"🌱 **Add Green Leaves for Extra Moisture** – Placing plants inside the hole increases water collection.\",\n \"💦 **Seal the Edges Tight** – Any air leaks reduce water collection.\"\n ]\n },\n {\n title: \"Water Filtration: DIY Charcoal Filter\",\n description: \"Learn how to make a simple charcoal water filter using natural materials.\",\n category: \"water\",\n completed: false,\n expanded: false,\n materials: [\n \"Plastic bottle or hollowed-out log\",\n \"Charcoal (from a fire)\",\n \"Sand\",\n \"Small gravel\",\n \"Cloth or grass fibers\",\n \"Container for filtered water\"\n ],\n steps: [\n \"🔎 **How Filtration Works** – Charcoal filters out bacteria, dirt, and some toxins, making water safer to drink.\",\n \"1️⃣ **Prepare a Filtering Container** – Cut the bottom off a plastic bottle, or hollow out a log to create a funnel.\",\n \"2️⃣ **Layer the Filter** – Add layers from bottom to top: **charcoal**, **sand**, and **gravel**.\",\n \"3️⃣ **Add Cloth or Grass as a Final Filter** – Place a layer of cloth, grass fibers, or even moss at the top to catch large debris.\",\n \"4️⃣ **Pour Water Through the Filter** – Slowly pour murky water into the filter. Let it drip into a clean container.\",\n \"5️⃣ **Boil the Filtered Water** – Although the filter removes debris and some bacteria, boiling afterward ensures safety.\"\n ],\n tips: [\n \"🛠️ **Use Hardwood Charcoal** – Softwood charcoal is less effective at filtering impurities.\",\n \"🌊 **Let Water Drip Slowly** – Fast water flow reduces filtration effectiveness.\",\n \"🔥 **Combine Filtration & Boiling** – A DIY filter removes debris, but boiling is necessary to kill pathogens.\"\n ]\n },\n {\n \"title\": \"Water Filtration: Using Grapevines as a Natural Filter\",\n \"description\": \"Learn how to use grapevines to naturally filter and purify water.\",\n \"category\": \"water\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Grapevine (or similar water-bearing vine)\",\n \"Knife or machete (to cut the vine)\",\n \"Container (for collecting water)\"\n ],\n \"steps\": [\n \"🔎 **Why Use Grapevines?** – Certain vines, including wild grapevines, contain **naturally filtered water** free of most contaminants.\",\n \"1️⃣ **Identify a Suitable Vine** – Look for **thick, green, and flexible vines** growing from trees or on the ground. Avoid vines with **milky or colored sap**, as they may be toxic.\",\n \"2️⃣ **Cut the Vine Near the Base** – Use a knife or machete to make a clean cut close to the ground.\",\n \"3️⃣ **Make a Second Cut Higher Up** – This allows water to **flow freely** through the vine.\",\n \"4️⃣ **Collect the Water** – Hold the lower end of the vine over your container and let the water drip out.\",\n \"5️⃣ **Test Before Drinking** – If the water is clear and has **no bitter or unusual taste**, it is safe to drink.\",\n \"6️⃣ **Optional Additional Filtering** – If needed, pour the water through a cloth or sand filter for further purification.\"\n ],\n \"tips\": [\n \"🌿 **Only Use Safe Vines** – Avoid vines with **colored or milky sap**, as they may be toxic.\",\n \"💧 **Best After Rainfall** – Grapevines contain the most water after heavy rainfall or in humid environments.\",\n \"🪵 **Use Multiple Vines** – A single vine may not provide much water, so check several vines if needed.\"\n ]\n },\n {\n title: \"Water Purification: Using Water Purification Tablets\",\n description: \"Purification tablets kill harmful pathogens in water, making it safe to drink.\",\n category: \"water\",\n completed: false,\n expanded: false,\n materials: [\n \"Water purification tablets (iodine, chlorine, or other chemical-based)\",\n \"Container for water\",\n \"Unclean water source\"\n ],\n steps: [\n \"🔎 **How Tablets Work** – These tablets use chemicals like iodine or chlorine to kill bacteria, viruses, and parasites.\",\n \"1️⃣ **Collect Water** – Gather water from a natural source, preferably clear water. If murky, let it settle or filter it first.\",\n \"2️⃣ **Read Tablet Instructions** – Follow the manufacturer's instructions for the correct dosage per liter of water.\",\n \"3️⃣ **Drop the Tablet in the Water** – Add the tablet to the container and stir if needed.\",\n \"4️⃣ **Wait for Purification** – Let the tablet work for **30 minutes to 4 hours**, depending on the type used.\",\n \"5️⃣ **Drink or Store Safely** – The water is now safe to drink. Store in a clean container if not drinking immediately.\"\n ],\n tips: [\n \"⏳ **Be Patient** – Chemical purification takes time to be effective.\",\n \"💊 **Iodine Tablets Have a Taste** – If the taste is too strong, add vitamin C or let it air out.\",\n \"🦠 **Tablets Don't Remove Sediment** – Use a cloth or sand filter for debris before purifying.\"\n ]\n },\n {\n title: \"Water Purification: Boiling\",\n description: \"Boiling is the most reliable way to kill bacteria and parasites in water.\",\n category: \"water\",\n completed: false,\n expanded: false,\n materials: [\n \"Fire source (matches, ferro rod, lighter, or bow drill)\",\n \"Metal container or pot\",\n \"Unclean water source\"\n ],\n steps: [\n \"🔎 **Why Boiling Works** – Boiling water kills bacteria, viruses, and parasites that can cause illness.\",\n \"1️⃣ **Collect Water** – Gather water from a natural source. If murky, let it settle or filter it through a cloth first.\",\n \"2️⃣ **Prepare a Fire** – Start a fire using any available method. The fire must be strong enough to sustain a boil.\",\n \"3️⃣ **Pour Water into a Metal Container** – Use a metal pot or any fire-safe container to hold the water.\",\n \"4️⃣ **Boil for at Least 1 Minute** – Bring the water to a **rolling boil** for at least **1 minute**. If at high altitudes (above 6,500 ft), boil for **3 minutes**.\",\n \"5️⃣ **Let Cool & Store Safely** – Once boiled, let the water cool and store it in a clean container.\"\n ],\n tips: [\n \"🔥 **Always Boil When in Doubt** – If unsure about water quality, boiling is your safest option.\",\n \"⏳ **Boil Longer at High Altitudes** – Water boils at a lower temperature at high elevations, so extend boiling time.\",\n \"🩺 **Boiling Does Not Remove Toxins** – Chemical pollutants (like heavy metals) require additional filtration.\"\n ]\n },\n\n // 🏕️ Shelter Building\n {\n title: \"Shelter Building: Debris Hut\",\n description: \"A debris hut is a simple, effective survival shelter using natural materials for insulation and protection.\",\n category: \"shelter\",\n completed: false,\n expanded: false,\n materials: [\n \"Long branch (6-8 feet long)\",\n \"Shorter sticks (3-4 feet long)\",\n \"Leaves, grass, pine needles, or bark for insulation\",\n \"Optional: Cordage for securing structure\"\n ],\n steps: [\n \"🔎 **Why a Debris Hut?** – A debris hut provides insulation and protection against wind, rain, and cold without requiring tools.\",\n \"1️⃣ **Find a Sturdy Ridgepole** – Locate a straight branch **6-8 feet long** to act as the central support beam.\",\n \"2️⃣ **Prop the Ridgepole Up** – Lean one end on a log, rock, or forked branch to create an A-frame.\",\n \"3️⃣ **Add Ribbing Sticks** – Place **3-4 foot long** sticks along both sides of the ridgepole, forming a triangular shape.\",\n \"4️⃣ **Layer Smaller Sticks** – Add smaller sticks across the ribbing for additional support.\",\n \"5️⃣ **Insulate the Shelter** – Cover the frame with **at least 2 feet** of leaves, pine needles, or dry grass to trap heat.\",\n \"6️⃣ **Block the Entrance** – Use a pile of debris or a small branch to block the entrance for warmth retention.\",\n \"7️⃣ **Test the Shelter** – Crawl inside and check for gaps. Add more debris if needed.\"\n ],\n tips: [\n \"🌿 **Use Dry Materials** – Wet leaves and grass won’t insulate well.\",\n \"🔥 **Position Near a Fire** – If possible, build near a safe fire source for added warmth.\",\n \"💨 **Avoid Windy Areas** – Set up your debris hut in a **wind-protected** location.\"\n ]\n },\n {\n title: \"Shelter Building: Lean-To\",\n description: \"A lean-to shelter is a fast and effective way to shield yourself from wind and rain.\",\n category: \"shelter\",\n completed: false,\n expanded: false,\n materials: [\n \"1 long ridgepole (6-8 feet)\",\n \"Several sturdy branches (for framing)\",\n \"Leaves, bark, or grass for insulation\",\n \"Cordage (optional)\"\n ],\n steps: [\n \"🔎 **Why a Lean-To?** – A lean-to provides protection from **wind and rain**, is quick to build, and allows for a fire in front for added warmth.\",\n \"1️⃣ **Find Two Support Trees** – Locate two trees about **6-8 feet apart** or use large rocks to support your ridgepole.\",\n \"2️⃣ **Secure the Ridgepole** – Tie or wedge a **6-8 foot branch** between the two supports at **chest height**.\",\n \"3️⃣ **Lean Support Sticks** – Place branches or logs against the ridgepole at an **angle**, forming a slanted wall.\",\n \"4️⃣ **Add Insulation** – Layer leaves, bark, or dry grass over the sticks to create a waterproof wall.\",\n \"5️⃣ **Face Away from Wind** – Position the open side opposite **strong winds** for maximum protection.\",\n \"6️⃣ **Use a Fire Reflector** – If building a fire, place a **heat-reflecting wall** (rocks or logs) opposite the shelter.\"\n ],\n tips: [\n \"🌬 **Angle Matters** – A **steeper** lean-to sheds rain better; a **shallower** one traps heat better.\",\n \"🔥 **Add a Fire** – A lean-to pairs well with a **fire in front** for warmth and safety.\",\n \"🪵 **Reinforce the Frame** – Use stronger logs if expecting heavy rain or snow.\"\n ]\n },\n {\n title: \"Shelter Building: Snow Cave\",\n description: \"A snow cave provides excellent insulation in extreme cold environments, preventing heat loss and wind exposure.\",\n category: \"shelter\",\n completed: false,\n expanded: false,\n materials: [\n \"Deep snowdrift or packed snow\",\n \"Shovel or digging tool (if available)\",\n \"Branch or pole (for ventilation)\"\n ],\n steps: [\n \"🔎 **Why a Snow Cave?** – A snow cave **traps body heat**, shielding you from cold winds and freezing temperatures.\",\n \"1️⃣ **Find a Deep Snowbank** – Look for a **6+ foot snowdrift** or compact snow suitable for digging.\",\n \"2️⃣ **Dig an Entrance Tunnel** – Use a **shovel, stick, or hands** to dig a small tunnel leading into the snowbank.\",\n \"3️⃣ **Expand the Sleeping Chamber** – Hollow out a **larger inner chamber** where you will sleep. Keep the roof dome-shaped to prevent collapse.\",\n \"4️⃣ **Keep the Entrance Low** – Make sure the entrance is **lower** than your sleeping area to trap warm air inside.\",\n \"5️⃣ **Ventilation is Key** – Poke a **small hole** in the roof using a stick or pole for fresh air circulation.\",\n \"6️⃣ **Smooth the Ceiling** – A smooth interior prevents melting snow from dripping onto you.\",\n \"7️⃣ **Block the Entrance at Night** – Use a backpack, snow block, or natural material to **partially** seal the entrance, reducing cold air entry.\"\n ],\n tips: [\n \"☃️ **Avoid Thin Snow** – Snow caves only work with **deep, packed snow**.\",\n \"🌡️ **Body Heat is Your Best Insulation** – The smaller the cave, the **warmer** it will be.\",\n \"🔄 **Check Ventilation** – Always keep a small airflow hole to **prevent suffocation**.\"\n ]\n },\n {\n title: \"Shelter Building: Tarp Shelter\",\n description: \"A tarp shelter is a quick and effective way to create protection from rain and wind.\",\n category: \"shelter\",\n completed: false,\n expanded: false,\n materials: [\n \"Tarp or emergency blanket\",\n \"Cordage (paracord or rope)\",\n \"Stakes or heavy rocks\"\n ],\n steps: [\n \"🔎 **Why a Tarp Shelter?** – A tarp shelter is **lightweight, fast to set up, and highly versatile**, making it ideal for unexpected survival situations.\",\n \"1️⃣ **Choose a Setup Location** – Find a **flat, dry** area protected from wind and falling branches.\",\n \"2️⃣ **Tie the Tarp Overhead** – Secure a rope between two trees and drape the tarp over it.\",\n \"3️⃣ **Stake the Corners Down** – Use **rocks, logs, or stakes** to secure the tarp edges to the ground.\",\n \"4️⃣ **Angle for Rain Runoff** – Set one side higher than the other to allow rainwater to run off.\",\n \"5️⃣ **Block Windy Sides** – Adjust the tarp or add natural windbreaks (logs, branches) for better protection.\"\n ],\n tips: [\n \"🏕 **Use a Ridgeline** – A horizontal rope makes setup **easier** and more stable.\",\n \"🌬 **Face Away from Wind** – Always position your **entrance opposite** strong winds.\",\n \"🔥 **Reflect Heat** – If using a **space blanket**, angle it towards a fire for **heat reflection**.\"\n ]\n },\n {\n title: \"Shelter Building: A-Frame Shelter\",\n description: \"An A-frame shelter provides excellent protection from rain, wind, and snow by using natural materials.\",\n category: \"shelter\",\n completed: false,\n expanded: false,\n materials: [\n \"1 long ridgepole (6-8 feet)\",\n \"Several sturdy branches (for frame)\",\n \"Leaves, bark, or grass for insulation\",\n \"Cordage (optional for securing)\"\n ],\n steps: [\n \"🔎 **Why an A-Frame?** – This shelter is **stable, durable, and weather-resistant**, making it one of the best all-around options.\",\n \"1️⃣ **Find a Ridgepole** – Locate a **6-8 foot long** sturdy branch to serve as the main support beam.\",\n \"2️⃣ **Support the Ridgepole** – Prop each end on two **forked sticks** or secure between two trees.\",\n \"3️⃣ **Create the A-Frame** – Lean **sturdy branches** against both sides of the ridgepole to form an A-shape.\",\n \"4️⃣ **Add Smaller Cross-Sticks** – Lay smaller branches **horizontally** across the A-frame for extra stability.\",\n \"5️⃣ **Layer Insulation** – Cover the frame with **leaves, grass, bark, or snow** for protection from wind and rain.\",\n \"6️⃣ **Check for Gaps** – Crawl inside and **look for light coming through**. Add more debris to seal gaps.\"\n ],\n tips: [\n \"🛠 **Stronger Frame = Better Protection** – Use thick, sturdy branches for durability.\",\n \"🌦 **More Insulation = More Warmth** – The thicker the debris layer, the **warmer** the shelter.\",\n \"🔥 **Fire Placement** – Build a fire **in front** of the shelter for warmth and visibility.\"\n ]\n },\n\n // 🧭 Navigation\n {\n title: \"Navigation: Using a Compass\",\n description: \"Learn how to properly use a compass to navigate through any terrain.\",\n category: \"navigation\",\n completed: false,\n expanded: false,\n materials: [\n \"Compass (preferably with a baseplate and rotating bezel)\",\n \"Topographic map (optional but helpful)\",\n \"Landmarks for reference\"\n ],\n steps: [\n \"🔎 **Why Use a Compass?** – A compass helps you determine direction even in unfamiliar environments. It remains reliable without batteries or technology.\",\n \"1️⃣ **Understand the Compass Parts** – A compass consists of a **magnetic needle**, a **rotating bezel** (degree markings), a **direction-of-travel arrow**, and a **baseplate**.\",\n \"2️⃣ **Hold the Compass Correctly** – Keep it flat in your hand, ensuring the **needle moves freely**.\",\n \"3️⃣ **Find North** – The red end of the needle always points **toward magnetic north**.\",\n \"4️⃣ **Set Your Bearing** – Rotate the bezel until the **degree marking** lines up with your intended direction.\",\n \"5️⃣ **Follow the Arrow** – Once set, move in the direction of the **direction-of-travel arrow**, keeping the needle inside the orienting box.\",\n \"6️⃣ **Check Your Surroundings** – Use landmarks (mountains, rivers, trees) to verify your path and prevent accidental drift.\"\n ],\n tips: [\n \"🧭 **Keep it Flat** – Holding the compass at an angle may cause incorrect readings.\",\n \"🌍 **Adjust for Declination** – In some areas, **true north** and **magnetic north** differ. Adjust your bearing accordingly.\",\n \"🛑 **Avoid Metal & Electronics** – Large metal objects or electronics can **interfere with the compass needle**.\"\n ]\n },\n {\n title: \"Navigation: Finding North Without a Compass\",\n description: \"Learn multiple ways to determine direction without a compass using the sun, stars, and natural signs.\",\n category: \"navigation\",\n completed: false,\n expanded: false,\n materials: [\n \"Stick (for shadow method)\",\n \"Watch (for analog clock method)\",\n \"Clear night sky (for star navigation)\"\n ],\n steps: [\n \"🔎 **Why Find North Without a Compass?** – If you lose your compass, these natural methods can still help you determine direction.\",\n \"1️⃣ **Shadow Stick Method (Daytime)** – Place a stick in the ground and mark the tip of the shadow. Wait 15 minutes and mark the new position. **A line between the two points runs west to east**.\",\n \"2️⃣ **Using an Analog Watch (Daytime, Northern Hemisphere)** – Point the **hour hand** at the sun. Halfway between the hour hand and 12 o’clock is **south** (opposite is north).\",\n \"3️⃣ **Using the North Star (Nighttime, Northern Hemisphere)** – Locate the **Big Dipper** and follow the two stars at the edge of the bowl. These lead directly to the **North Star (Polaris)**, which always points north.\",\n \"4️⃣ **Using the Southern Cross (Nighttime, Southern Hemisphere)** – Find the **Southern Cross constellation** and extend an imaginary line **5 times its length** downward. This points **toward south**.\",\n \"5️⃣ **Observing Natural Landmarks** – Moss grows **more abundantly on the north** side of trees in the Northern Hemisphere. **Ant hills** are often **built facing the sun (south)**.\"\n ],\n tips: [\n \"☀ **Use Multiple Methods** – Always cross-check techniques for accuracy.\",\n \"🌍 **Hemispheres Matter** – Star navigation differs between the **Northern and Southern Hemispheres**.\",\n \"🕰 **Time of Day Affects Shadows** – The **shadow stick method works best midday** when the sun is highest.\"\n ]\n },\n {\n title: \"Navigation: Reading a Topographic Map\",\n description: \"Understand how to read contour lines, elevation, and terrain features on a topographic map.\",\n category: \"navigation\",\n completed: false,\n expanded: false,\n materials: [\n \"Topographic map\",\n \"Compass (for orientation)\",\n \"Landmarks for reference\"\n ],\n steps: [\n \"🔎 **What is a Topographic Map?** – A topographic map shows elevation, terrain features, and navigation landmarks using **contour lines** and symbols.\",\n \"1️⃣ **Understand Contour Lines** – Contour lines **connect points of the same elevation**. The closer the lines, the **steeper** the terrain.\",\n \"2️⃣ **Identify Terrain Features** – Look for valleys, ridges, and peaks by how contour lines bend.\",\n \"3️⃣ **Orient the Map with a Compass** – Align north on the map with north on your compass to match the real-world layout.\",\n \"4️⃣ **Use Landmarks for Navigation** – Compare visible landmarks (rivers, mountains, trails) with those on the map.\",\n \"5️⃣ **Follow Contour Lines for Easy Travel** – Instead of climbing up and down hills, follow a **path along contour lines** to conserve energy.\"\n ],\n tips: [\n \"🗺 **Check the Map Scale** – Some maps cover large areas; others show detailed sections. Know your map’s scale.\",\n \"⛰ **Look for Water Features** – Rivers and lakes are great navigation aids.\",\n \"🛑 **Avoid Steep Areas** – If contour lines are packed closely together, the terrain is steep and difficult to cross.\"\n ]\n },\n {\n title: \"Navigation: Using Landmarks for Wayfinding\",\n description: \"Learn how to use natural and man-made landmarks for navigation without tools.\",\n category: \"navigation\",\n completed: false,\n expanded: false,\n materials: [\n \"Clear view of surroundings\",\n \"Notepad (optional for marking landmarks)\"\n ],\n steps: [\n \"🔎 **Why Use Landmarks?** – Landmarks help maintain direction and track progress when navigating.\",\n \"1️⃣ **Choose a Distinct Landmark** – Pick a mountain, large tree, or other **unique features** visible from a distance.\",\n \"2️⃣ **Align Your Path with Landmarks** – When traveling, keep your landmark in **a consistent position** (e.g., ahead or to your right).\",\n \"3️⃣ **Use Two or More Landmarks** – Cross-check with a second landmark to confirm you are staying on track.\",\n \"4️⃣ **Update Landmarks as You Travel** – As you move, select new landmarks in the direction you’re heading.\",\n \"5️⃣ **Track Your Distance Using Pacing** – Count your steps between landmarks to estimate distance traveled.\"\n ],\n tips: [\n \"🗺 **Use Permanent Landmarks** – Temporary objects (fallen trees, snowbanks) may change over time.\",\n \"🌄 **Mountain Peaks Make Great Guides** – They remain visible over long distances.\",\n \"🛑 **Don’t Rely on Just One Landmark** – If you lose sight of it, have a secondary point of reference.\"\n ]\n },\n {\n title: \"Navigation: Creating a Bushcraft Compass\",\n description: \"Learn how to make a simple survival compass using natural materials.\",\n category: \"navigation\",\n completed: false,\n expanded: false,\n materials: [\n \"Metal sewing needle or straight piece of wire\",\n \"Small leaf or cork\",\n \"Small bowl or puddle of still water\",\n \"Magnet or silk cloth (for magnetizing the needle)\"\n ],\n steps: [\n \"🔎 **Why Make a Compass?** – If lost without a real compass, this technique helps you find **north using magnetism**.\",\n \"1️⃣ **Magnetize the Needle** – Stroke a **needle or wire** in one direction with a magnet (or silk cloth) at least **20-30 times**.\",\n \"2️⃣ **Prepare the Floating Platform** – Place the needle on a **small leaf or piece of cork**.\",\n \"3️⃣ **Set It in Water** – Float the leaf with the needle in a bowl of **still water**.\",\n \"4️⃣ **Watch the Needle Align** – The needle will slowly rotate, with one end pointing **north**.\",\n \"5️⃣ **Verify with Landmarks** – Double-check the direction using **natural signs like the sun or stars**.\"\n ],\n tips: [\n \"🧲 **Stronger Magnet = Faster Alignment** – A powerful magnet will magnetize the needle more effectively.\",\n \"💨 **Use Still Water** – Even small movements in the water **can disrupt accuracy**.\",\n \"🌞 **Double-Check with the Sun** – Ensure your compass aligns with other natural navigation methods.\"\n ]\n },\n\n // 🏥 First Aid & Medical Guides\n {\n title: \"First Aid: Treating a Bleeding Wound\",\n description: \"Learn how to properly stop bleeding and dress a wound using first aid techniques.\",\n category: \"first-aid\",\n completed: false,\n expanded: false,\n materials: [\n \"Sterile gauze or clean cloth\",\n \"Adhesive bandages or medical tape\",\n \"Antiseptic wipes or clean water\",\n \"Gloves (if available)\",\n \"Tourniquet (if severe bleeding)\"\n ],\n steps: [\n \"🔎 **Understanding Bleeding Control** – Controlling bleeding quickly prevents excessive blood loss and reduces infection risk.\",\n \"1️⃣ **Apply Direct Pressure** – Place sterile gauze or a clean cloth over the wound and press firmly to slow bleeding.\",\n \"2️⃣ **Elevate the Wound** – If possible, raise the injured area above heart level to reduce blood flow.\",\n \"3️⃣ **Apply Additional Layers if Needed** – If blood soaks through the first layer, **do not remove it**. Instead, apply another layer on top.\",\n \"4️⃣ **Secure the Dressing** – Use medical tape or a bandage to keep the gauze in place.\",\n \"5️⃣ **Apply a Tourniquet (for Severe Bleeding)** – If bleeding is **uncontrollable**, place a tourniquet **2 inches above the wound**, tighten it, and note the time applied.\",\n \"6️⃣ **Monitor for Shock** – Look for symptoms like pale skin, rapid breathing, and dizziness. Keep the person warm and calm until help arrives.\"\n ],\n tips: [\n \"🩸 **Do Not Remove Impaled Objects** – If an object is stuck in the wound, **leave it in place** and bandage around it.\",\n \"🛑 **Use Clean Materials** – Avoid using dirty cloths, which can cause infections.\",\n \"⏳ **Tourniquets Are a Last Resort** – Only apply if **direct pressure fails** and help is far away.\"\n ]\n },\n {\n title: \"First Aid: Performing CPR\",\n description: \"Learn how to perform CPR (Cardiopulmonary Resuscitation) to help someone who is not breathing.\",\n category: \"first-aid\",\n completed: false,\n expanded: false,\n materials: [\n \"None (CPR can be performed without tools)\",\n \"CPR mask (optional for rescue breaths)\"\n ],\n steps: [\n \"🔎 **Why Perform CPR?** – CPR helps restart the heart and lungs in emergencies like cardiac arrest or drowning.\",\n \"1️⃣ **Check Responsiveness** – Shake the person and ask loudly, ‘Are you okay?’ If no response, check for breathing.\",\n \"2️⃣ **Call for Help** – If no one is nearby, call **911 (or emergency services)** before starting CPR.\",\n \"3️⃣ **Begin Chest Compressions** – Place your hands **centered on the chest**, interlock fingers, and push **hard and fast (100-120 beats per minute)**.\",\n \"4️⃣ **Rescue Breaths (if trained)** – Tilt the head back, pinch the nose, and give **2 breaths** after every **30 compressions**.\",\n \"5️⃣ **Continue Until Help Arrives** – Keep going until professional medical help takes over.\"\n ],\n tips: [\n \"🫀 **Use Only Chest Compressions if Untrained** – If unsure, hands-only CPR is still effective.\",\n \"⚠️ **Do Not Stop Unless Necessary** – CPR should continue until the person revives or medical help arrives.\",\n \"🎵 **Use a Rhythm** – Press to the beat of ‘Stayin’ Alive’ or ‘Baby Shark’ to maintain proper speed.\"\n ]\n },\n {\n title: \"First Aid: Treating a Burn\",\n description: \"Learn how to properly treat burns to reduce pain and prevent infection.\",\n category: \"first-aid\",\n completed: false,\n expanded: false,\n materials: [\n \"Cool running water\",\n \"Sterile gauze or clean cloth\",\n \"Aloe vera gel or burn cream\",\n \"Pain relievers (if available)\"\n ],\n steps: [\n \"🔎 **Understanding Burn Severity** – Burns are categorized as **first-degree (mild), second-degree (blisters), and third-degree (deep tissue damage).**\",\n \"1️⃣ **Cool the Burn** – Immediately run **cool (not cold)** water over the burn for at least **10-15 minutes** to reduce damage.\",\n \"2️⃣ **Avoid Ice** – **Do not apply ice**, as it can cause further skin damage.\",\n \"3️⃣ **Cover with a Sterile Dressing** – Use a **clean gauze or cloth** to protect the area and prevent infection.\",\n \"4️⃣ **Apply Aloe Vera or Burn Ointment** – Only for **first-degree burns** (mild redness). Avoid applying to severe burns.\",\n \"5️⃣ **Do Not Pop Blisters** – If blisters form, **leave them intact** to prevent infection.\",\n \"6️⃣ **Seek Medical Help for Severe Burns** – If the burn is **larger than your palm**, affects the face or joints, or is **third-degree**, seek immediate medical care.\"\n ],\n tips: [\n \"❌ **Avoid Butter or Oils** – These **trap heat** and make the burn worse.\",\n \"🩹 **Keep It Covered** – Protect the burn from dirt and bacteria while healing.\",\n \"🆘 **Watch for Infection** – Red streaks, swelling, or pus may indicate infection.\"\n ]\n },\n {\n title: \"First Aid: Treating a Fracture or Broken Bone\",\n description: \"Learn how to stabilize a broken bone and provide first aid before medical treatment.\",\n category: \"first-aid\",\n completed: false,\n expanded: false,\n materials: [\n \"Splint (rigid stick, rolled-up cloth, or board)\",\n \"Bandages or strips of cloth\",\n \"Ice pack (optional)\"\n ],\n steps: [\n \"🔎 **Identifying a Fracture** – Signs include **swelling, bruising, deformity, and severe pain** when moving the area.\",\n \"1️⃣ **Do Not Move the Limb** – Keep the injured area **still** to prevent further damage.\",\n \"2️⃣ **Create a Splint** – Use a **rigid object** (stick, board) and tie it securely with cloth or bandages.\",\n \"3️⃣ **Immobilize the Joint** – If the **bone is in the leg or arm**, stabilize the nearest joints as well.\",\n \"4️⃣ **Apply Ice (if available)** – Wrap ice in cloth and place on the injury to reduce swelling.\",\n \"5️⃣ **Seek Immediate Medical Help** – A fracture needs **professional treatment** to heal properly.\"\n ],\n tips: [\n \"🛑 **Do Not Try to ‘Reset’ the Bone** – Never attempt to push a broken bone back into place.\",\n \"🩹 **Keep It Immobilized** – Movement can cause **worse injuries or internal bleeding**.\",\n \"🚑 **Shock is a Risk** – Watch for **pale skin, confusion, and fainting**.\"\n ]\n },\n {\n title: \"First Aid: Identifying & Treating Hypothermia\",\n description: \"Learn how to recognize and treat hypothermia, a life-threatening cold exposure condition.\",\n category: \"first-aid\",\n completed: false,\n expanded: false,\n materials: [\n \"Warm clothing or blankets\",\n \"Dry shelter\",\n \"Warm (not hot) drinks\",\n \"Body heat (if needed)\"\n ],\n steps: [\n \"🔎 **What is Hypothermia?** – A dangerous condition where body temperature drops **below 95°F (35°C)**.\",\n \"1️⃣ **Recognize Symptoms** – Look for **shivering, confusion, slurred speech, weak pulse, and cold skin**.\",\n \"2️⃣ **Move to a Warmer Place** – Get the person **indoors, inside a tent, or near a fire** if possible.\",\n \"3️⃣ **Remove Wet Clothing** – Wet clothes **increase heat loss**. Replace them with **dry, warm layers**.\",\n \"4️⃣ **Wrap in Blankets** – Cover the person **entirely**, including the head and hands.\",\n \"5️⃣ **Provide Warm Liquids** – Offer **warm (not hot) drinks** to help gradually increase body temperature.\",\n \"6️⃣ **Use Body Heat** – If no blankets are available, **use body heat by sharing warmth** under insulation.\"\n ],\n tips: [\n \"🔥 **Avoid Direct Heat** – Placing a person **next to a fire too quickly can shock the system**.\",\n \"🛑 **Do Not Give Alcohol** – Alcohol **lowers body temperature** even though it feels warm.\",\n \"💨 **Shelter is Key** – Wind and moisture accelerate hypothermia, so **stay covered**.\"\n ]\n },\n \n // 🎣 Foraging & Trapping Guides \n {\n \"title\": \"Foraging: Identifying Edible Wild Plants\",\n \"description\": \"Learn how to safely identify and gather edible wild plants for survival.\",\n \"category\": \"foraging\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Field guide (or plant identification apps like iNaturalist, Seek, or PlantNet)\",\n \"AI research tool (DeepSeek AI, ChatGPT for historical uses)\",\n \"Knife or scissors for harvesting\",\n \"Collection bag or basket\"\n ],\n \"steps\": [\n \"🔎 **Understanding Wild Edibles** – Many wild plants are edible, but some are toxic. **Proper identification is crucial before consuming any plant.**\",\n \"1️⃣ **Use Plant Identification Apps** – Take clear photos of plants and use **iNaturalist, Seek, or PlantNet** to identify them before consuming.\",\n \"2️⃣ **Research Traditional Uses** – Use **DeepSeek AI or ChatGPT** to learn how **indigenous tribes** used the plant for food or medicine.\",\n \"3️⃣ **Check for Toxic Traits** – **Avoid plants with:** white sap, bitter taste, almond-like scent (cyanide risk), three-leaf patterns (may be poison ivy), or umbrella-shaped flowers (hemlock lookalike).\",\n \"4️⃣ **Perform the Universal Edibility Test (Step-by-Step)** – If you're unsure if a plant is safe, follow this process over **24 hours**:\",\n \" - **Step 1:** Separate the plant into parts (leaves, stems, roots, flowers, fruits).\",\n \" - **Step 2:** Rub a small piece on your **inner wrist** for 15 minutes. If irritation occurs, **do not eat.**\",\n \" - **Step 3:** Hold a small portion on your lips for **3 minutes**. If burning/tingling occurs, **spit it out.**\",\n \" - **Step 4:** Place a tiny piece on your **tongue for 15 minutes** without chewing. If there’s discomfort, **spit it out.**\",\n \" - **Step 5:** Chew but do not swallow. Wait **15 minutes**. If no reaction, swallow a tiny piece.\",\n \" - **Step 6:** Wait **6 hours** for signs of sickness (vomiting, dizziness, stomach pain).\",\n \" - **Step 7:** If no reaction, eat a **small amount** and wait another **6 hours**.\",\n \" - **Step 8:** If still no reaction, the plant is likely safe in moderation.\",\n \"5️⃣ **Harvest Only in Clean Areas** – Avoid plants near **roadsides, polluted water, or pesticide-treated areas**.\",\n \"6️⃣ **Prepare the Plant Properly** – Some wild plants **must be boiled or cooked** before eating to remove toxins.\",\n \"7️⃣ **Test Small Samples First** – Even with safe plants, eat **only a tiny portion** at first to avoid digestive upset.\"\n ],\n \"tips\": [\n \"📱 **Use AI & Foraging Apps** – Apps like **iNaturalist** help with plant ID, while **DeepSeek AI** can provide historical context on traditional uses.\",\n \"🌿 **Learn 5-10 Safe Plants First** – Focus on a few reliable edibles before expanding knowledge.\",\n \"🚫 **Avoid White Sap & Bitter Taste** – Many poisonous plants have **milky sap** or an extremely bitter taste.\",\n \"🛑 **Mushrooms Require Expert Knowledge** – Unless you **100% identify** an edible mushroom, **do not eat it**.\",\n \"🏕 **Edible Parts Matter** – Some plants have edible **leaves but toxic roots**, or **flowers but toxic stems**.\"\n ]\n },\n {\n title: \"Foraging: Finding & Collecting Wild Berries\",\n description: \"Learn how to identify safe wild berries and avoid poisonous ones.\",\n category: \"foraging\",\n completed: false,\n expanded: false,\n materials: [\n \"Berry identification guide\",\n \"Collection container\",\n \"Gloves (optional for thorny bushes)\"\n ],\n steps: [\n \"🔎 **Why Forage Berries?** – Berries are a great source of **vitamins, hydration, and calories** in survival situations.\",\n \"1️⃣ **Identify the Berry Type** – Safe berries include **blackberries, raspberries, blueberries, and strawberries**.\",\n \"2️⃣ **Avoid Poisonous Berries** – **Bright red or white berries** are often toxic (e.g., **holly, baneberry, yew**).\",\n \"3️⃣ **Pick Only Ripe Berries** – Unripe berries may be **sour, hard, or mildly toxic**.\",\n \"4️⃣ **Wash Before Eating** – Rinse berries in **clean water** to remove dirt and insects.\",\n \"5️⃣ **Store for Later Use** – Dry or mash berries into a **paste for longer shelf life**.\"\n ],\n tips: [\n \"🍓 **Stick to What You Know** – If you’re unsure about a berry, **do not eat it**.\",\n \"🌿 **Observe Animal Behavior** – Birds and small mammals eating a berry doesn’t always mean it’s safe for humans.\",\n \"❌ **Do Not Eat Bitter or Soapy-Tasting Berries** – This is a sign of toxicity.\"\n ]\n },\n {\n title: \"Trapping: Making a Basic Snare Trap\",\n description: \"Learn how to construct a simple snare trap for catching small game.\",\n category: \"trapping\",\n completed: false,\n expanded: false,\n materials: [\n \"Wire or strong cordage (paracord, sinew, or natural fiber)\",\n \"Knife or sharp tool\",\n \"Small sticks for trigger mechanism\"\n ],\n steps: [\n \"🔎 **What is a Snare Trap?** – A snare is a **looped wire or cordage trap** that tightens when an animal steps into it.\",\n \"1️⃣ **Find a Game Trail** – Look for **tracks, droppings, or disturbed vegetation** near water sources.\",\n \"2️⃣ **Cut a Length of Wire or Cordage** – Around **12-18 inches** is typically enough.\",\n \"3️⃣ **Make a Noose** – Form a small loop **just big enough for the target animal’s head or foot**.\",\n \"4️⃣ **Anchor the Snare** – Tie the other end of the snare **to a sturdy branch or stake**.\",\n \"5️⃣ **Set the Snare at the Right Height** – Position it **just above the ground** where the animal is likely to step.\",\n \"6️⃣ **Check Your Trap Often** – Animals may **struggle and escape** if not checked regularly.\"\n ],\n tips: [\n \"🐾 **Camouflage the Trap** – Use **leaves, dirt, or grass** to hide unnatural materials.\",\n \"🦊 **Check Traps Every Few Hours** – Leaving an animal trapped for too long **causes suffering and escape risk**.\",\n \"🚫 **Follow Local Laws** – Trapping regulations vary, so **know the rules before using in non-survival situations**.\"\n ]\n },\n {\n title: \"Trapping: Building a Deadfall Trap\",\n description: \"Learn how to construct a deadfall trap to catch small animals using a falling weight.\",\n category: \"trapping\",\n completed: false,\n expanded: false,\n materials: [\n \"Heavy flat rock or log\",\n \"Trigger stick (Y-shaped or notched stick)\",\n \"Bait (nuts, fruit, or small meat scraps)\"\n ],\n steps: [\n \"🔎 **What is a Deadfall Trap?** – A deadfall trap **crushes small game** when triggered by the animal’s movement.\",\n \"1️⃣ **Find a Suitable Location** – Look for **animal tracks or burrow entrances**.\",\n \"2️⃣ **Select a Heavy Weight** – A **flat rock or log** heavy enough to kill small game instantly.\",\n \"3️⃣ **Carve the Trigger Mechanism** – Use a **Y-stick or notch two sticks together** to make a balanced trigger.\",\n \"4️⃣ **Position the Trap Properly** – The rock or log must **balance** on the trigger without falling prematurely.\",\n \"5️⃣ **Bait the Trap** – Place **small food scraps** under the weight where the animal will step.\",\n \"6️⃣ **Set the Trap & Leave the Area** – Animals avoid human scent, so check from a distance.\"\n ],\n tips: [\n \"🪵 **Use Dry, Heavy Wood or Stone** – Damp wood may not fall with enough force.\",\n \"🦝 **Use the Right Bait** – Target specific animals (e.g., **seeds for rodents, meat for predators**).\",\n \"🚷 **Do Not Set Near Trails** – Avoid setting traps where people or pets may trigger them.\"\n ]\n },\n {\n title: \"Fishing: Making a Handline Fishing Rig\",\n description: \"Learn how to catch fish using a simple handline without a fishing rod.\",\n category: \"trapping\",\n completed: false,\n expanded: false,\n materials: [\n \"Strong fishing line (10-20 ft.)\",\n \"Fish hooks (or sharpened bone/metal hooks)\",\n \"Bait (worms, insects, or small fish parts)\",\n \"Small weight (rock or metal piece)\",\n \"Bobber (optional, such as cork or bottle cap)\"\n ],\n steps: [\n \"🔎 **Why Use a Handline?** – A handline is an **easy, portable way to catch fish without rods or reels**.\",\n \"1️⃣ **Tie a Hook to the Line** – Secure a **fishing hook or sharpened bone hook** with a strong knot.\",\n \"2️⃣ **Attach a Small Weight** – This helps the bait **sink** to where fish are swimming.\",\n \"3️⃣ **Add a Bobber (Optional)** – If fishing in still water, a floating bobber **helps indicate bites**.\",\n \"4️⃣ **Bait the Hook** – Use **worms, insects, or fish scraps** to attract fish.\",\n \"5️⃣ **Cast the Line** – Throw the baited hook **into the water** and hold onto the free end.\",\n \"6️⃣ **Feel for Bites & Reel In** – When a fish bites, **pull the line steadily** to hook it.\"\n ],\n tips: [\n \"🎣 **Be Patient** – Fish may take **minutes or hours** to bite.\",\n \"🐠 **Choose the Right Bait** – Match bait to local fish species (e.g., **worms for freshwater, shrimp for saltwater**).\",\n \"🧤 **Protect Hands from the Line** – Wrapping the line around fingers **can cut skin when pulling in a big fish**.\"\n ]\n },\n \n // 🪢 Knot Tying & Rope Work Guides \n {\n title: \"Basic Knot: Bowline\",\n description: \"Learn how to tie a bowline knot, known as the 'rescue knot' due to its secure, non-slipping loop.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"3-5 feet of rope or paracord\"\n ],\n steps: [\n \"🔎 **What is a Bowline?** – The bowline forms a **secure, non-tightening loop** that is easy to untie even after heavy strain.\",\n \"1️⃣ **Make a Small Loop** – Form a small loop near the end of the rope, leaving a few inches of tail.\",\n \"2️⃣ **Pass the Tail Through the Loop** – Imagine the tail as a ‘rabbit’ that comes out of the hole.\",\n \"3️⃣ **Wrap Around the Standing Line** – The ‘rabbit’ moves **around the tree** (standing part of the rope).\",\n \"4️⃣ **Tuck the Tail Back into the Loop** – The ‘rabbit’ **goes back into the hole** (through the original loop).\",\n \"5️⃣ **Tighten the Knot** – Pull the standing line while holding the tail to **secure the loop**.\"\n ],\n tips: [\n \"🛟 **Perfect for Rescue** – A bowline is ideal for **pulling someone up or securing loads**.\",\n \"🧵 **Easy to Untie** – Unlike other knots, the bowline **doesn’t jam** under heavy strain.\",\n \"🚫 **Not for Slippery Rope** – If using **synthetic rope**, use a double bowline for extra security.\"\n ]\n },\n {\n title: \"Basic Knot: Square Knot\",\n description: \"Learn how to tie a square knot, commonly used for joining two ropes of equal thickness.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"Two pieces of rope (same thickness)\"\n ],\n steps: [\n \"🔎 **What is a Square Knot?** – The square knot securely joins two ropes **of equal size**, useful for tying bandages or securing bundles.\",\n \"1️⃣ **Hold One Rope in Each Hand** – Start with an **overhand right-over-left** cross.\",\n \"2️⃣ **Cross the Ropes Again** – Now do a **left-over-right** cross, forming a symmetrical pattern.\",\n \"3️⃣ **Tighten Evenly** – Pull both ends firmly to **lock the knot in place**.\"\n ],\n tips: [\n \"❌ **Not for Critical Loads** – The square knot **can slip** under uneven tension. Use a **sheet bend** for ropes of different thicknesses.\",\n \"⚓ **Common in Sailing** – This knot is often used for **tying sails and securing bundles**.\"\n ]\n },\n {\n title: \"Basic Knot: Clove Hitch\",\n description: \"Learn how to tie a clove hitch, a quick and adjustable knot for securing a rope to a post.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"A rope\",\n \"A pole or stick to tie onto\"\n ],\n steps: [\n \"🔎 **What is a Clove Hitch?** – The clove hitch is a **fast, adjustable knot** used for tying **ropes to poles or trees**.\",\n \"1️⃣ **Wrap Around the Pole** – Pass the rope **around the post** and cross it over itself.\",\n \"2️⃣ **Wrap Around Again** – Loop the rope around the post **a second time**, creating an X-shape.\",\n \"3️⃣ **Tuck the End Under** – Pass the tail of the rope under the final loop and pull tight.\"\n ],\n tips: [\n \"🌲 **Great for Temporary Use** – Clove hitches **can slip** under heavy strain, so add an extra half-hitch for security.\",\n \"🚣 **Common in Boating** – This knot is frequently used for **securing boats to docks**.\"\n ]\n },\n {\n title: \"Advanced Knot: Prusik Knot\",\n description: \"Learn how to tie a Prusik knot, used for climbing, rescue, and securing a loop around a rope.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"A main rope\",\n \"A smaller loop of cord or rope\"\n ],\n steps: [\n \"🔎 **What is a Prusik Knot?** – This knot grips tightly when weight is applied but **slides when loose**, making it useful for **climbing and rescue**.\",\n \"1️⃣ **Make a Loop with the Small Rope** – The Prusik needs a smaller loop to wrap around the main rope.\",\n \"2️⃣ **Wrap the Loop Around the Main Rope** – Pass the loop **through itself** and wrap around **3-5 times**.\",\n \"3️⃣ **Tighten by Pulling Both Ends** – The more wraps, the stronger the grip.\",\n \"4️⃣ **Test the Grip** – Pull down to check if the knot **locks in place**.\"\n ],\n tips: [\n \"🧗 **Used in Climbing & Rescue** – Prusik knots allow **ascending ropes or creating safety backups**.\",\n \"🔄 **Must Use a Smaller Rope** – The loop should be **smaller in diameter than the main rope** for proper grip.\"\n ]\n },\n {\n title: \"Lashings: Tripod Lashing\",\n description: \"Learn how to tie a tripod lashing, useful for building three-legged structures in survival situations.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"Three sturdy sticks (4-6 feet long)\",\n \"Strong rope or cordage\"\n ],\n steps: [\n \"🔎 **What is a Tripod Lashing?** – This binding technique **connects three poles together**, creating a stable tripod for shelters or cooking.\",\n \"1️⃣ **Position the Three Poles** – Lay them next to each other with the tops aligned.\",\n \"2️⃣ **Start Wrapping the Rope** – Secure the rope around **all three poles** with a few tight wraps.\",\n \"3️⃣ **Weave Between Poles** – Go over and under each pole to **bind them together**.\",\n \"4️⃣ **Tie Off & Spread the Tripod** – Secure the end and spread the legs apart **to create a stable tripod**.\"\n ],\n tips: [\n \"🏕 **Use for Cooking Racks & Shelters** – This lashing is **great for hanging pots or tarp shelters**.\",\n \"🪢 **Tighten as Needed** – If the tripod loosens over time, **adjust the lashings** to maintain stability.\"\n ]\n },\n {\n title: \"Rope Making: Twisting Natural Fibers\",\n description: \"Learn how to make strong, usable rope from natural plant fibers.\",\n category: \"knots\",\n completed: false,\n expanded: false,\n materials: [\n \"Long plant fibers (grass, bark, sinew, or vines)\"\n ],\n steps: [\n \"🔎 **Why Make Rope?** – In survival situations, strong rope is **essential for securing shelters, traps, and gear**.\",\n \"1️⃣ **Find Strong Fibers** – Use **inner bark from trees, long grass, or sinew**.\",\n \"2️⃣ **Separate & Soften Fibers** – Rub and twist the fibers to **loosen them** for braiding.\",\n \"3️⃣ **Start Twisting** – Hold the fibers in two sections and twist **both in opposite directions**.\",\n \"4️⃣ **Reverse Wrap for Strength** – Loop one twisted section over the other **to lock them together**.\",\n \"5️⃣ **Continue Twisting & Adding Fibers** – Keep twisting and adding more material for **longer, stronger cordage**.\"\n ],\n tips: [\n \"🌿 **Use Dry Fibers** – Wet fibers may weaken over time.\",\n \"💪 **Test Strength Before Use** – Tug the rope **before relying on it** for weight-bearing tasks.\",\n \"🛠 **Make Extra Rope** – Having spare rope **prevents emergencies** where cordage is needed.\"\n ]\n },\n \n // 📡 Signaling & Communication Guides \n {\n title: \"Mirror Signaling for Rescue\",\n description: \"Learn how to use a mirror to send distress signals over long distances using sunlight.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Signal mirror (or any reflective surface)\",\n \"Sunlight\",\n \"Target (aircraft, rescue team, or distant observer)\"\n ],\n steps: [\n \"🔎 **Why Use a Signal Mirror?** – A mirror can reflect sunlight to **attract attention over long distances**, making it an **essential survival tool**.\",\n \"1️⃣ **Find a Clear View** – Position yourself in an open area where **rescuers or aircraft can see the reflection**.\",\n \"2️⃣ **Hold the Mirror Steady** – Hold the mirror **at arm’s length**, angling it toward the sun.\",\n \"3️⃣ **Aim at Your Target** – Use a **finger or V-sign with your hand** to line up the reflection with the target.\",\n \"4️⃣ **Flash in Intervals** – Move the mirror slightly to create **short flashes of light**, signaling intentionally.\",\n \"5️⃣ **Use SOS Signals** – Flash **three short, three long, three short** signals (**Morse code for SOS**).\"\n ],\n tips: [\n \"☀ **Works Best on Sunny Days** – Cloudy conditions reduce the mirror’s effectiveness.\",\n \"🚁 **Aim for Aircraft Cockpits** – Pilots **can see flashes from miles away**.\",\n \"🌊 **Great for Ocean Survival** – A signal mirror **can be seen up to 20 miles over water**.\"\n ]\n },\n {\n title: \"Creating Effective Smoke Signals\",\n description: \"Learn how to make a smoke signal for long-distance distress communication.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Firewood\",\n \"Green leaves, moss, or wet grass (to create thick smoke)\",\n \"Lighter, ferro rod, or fire-starting tool\"\n ],\n steps: [\n \"🔎 **Why Smoke Signals?** – Smoke can be seen **from miles away**, making it an effective emergency signal.\",\n \"1️⃣ **Build a Fire in an Open Area** – Clear a **safe space** where smoke can rise without obstruction.\",\n \"2️⃣ **Use Dry Wood to Create a Base Fire** – Start with a small, **steady flame** before adding smoke-producing material.\",\n \"3️⃣ **Add Greenery for Dense Smoke** – Throw **wet leaves, moss, or fresh grass** onto the flames to **produce thick white smoke**.\",\n \"4️⃣ **Create a Signal Pattern** – Use a blanket or tarp to **cover and release the smoke in bursts**.\",\n \"5️⃣ **Use the SOS Pattern** – Three **short, distinct smoke puffs** mean distress.\"\n ],\n tips: [\n \"🔥 **White Smoke is More Visible** – Avoid black smoke from burning plastics or oil.\",\n \"🌬 **Choose a High Location** – Hills and open spaces **help smoke rise and travel farther**.\",\n \"🚁 **Use with a Mirror** – A mirror and smoke combo **improves visibility for rescuers**.\"\n ]\n },\n {\n title: \"Ground Markings & SOS Signs\",\n description: \"Learn how to create large ground signals to communicate distress to aircraft and search teams.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Logs, rocks, or contrasting material\",\n \"Open ground (sand, snow, or grassy field)\"\n ],\n steps: [\n \"🔎 **Why Use Ground Markings?** – Large symbols are visible **from the air**, signaling distress to rescue teams.\",\n \"1️⃣ **Choose a Clear Area** – Find an open space like a **beach, field, or snowy area**.\",\n \"2️⃣ **Use Contrasting Materials** – Arrange **dark rocks on light sand** or **light branches on dark ground**.\",\n \"3️⃣ **Make Large Letters** – Create an **SOS (at least 10-15 feet tall)** or **arrows pointing toward safety**.\",\n \"4️⃣ **Add Fire or Reflection** – Improve visibility by **placing a fire near the marking at night** or adding reflective objects.\"\n ],\n tips: [\n \"📏 **Bigger is Better** – Letters should be **at least 10 feet tall** for aircraft visibility.\",\n \"🌲 **Use Natural Materials** – Logs, branches, or stones make great emergency markings.\",\n \"🔦 **Enhance with Light** – A flashlight, fire, or mirror near the marking **increases visibility at night**.\"\n ]\n },\n {\n title: \"Whistle Communication for Rescue\",\n description: \"Learn how to use a whistle to signal for help in emergencies.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Loud whistle (plastic or metal)\",\n \"Clear open area (for sound travel)\"\n ],\n steps: [\n \"🔎 **Why Use a Whistle?** – A loud whistle **carries farther than shouting** and is useful in forests, canyons, and survival situations.\",\n \"1️⃣ **Blow in Sets of Three** – Three short blasts (**Morse SOS**) signal distress.\",\n \"2️⃣ **Pause Between Blasts** – Wait a few seconds between sets to **listen for a response**.\",\n \"3️⃣ **Repeat Every Minute** – Continue the pattern **until help arrives**.\"\n ],\n tips: [\n \"🔊 **Use a Pealess Whistle** – Pealess models work **in any weather** and don’t freeze.\",\n \"🌲 **Best for Dense Forests** – A whistle **carries farther than shouting** in wooded areas.\",\n \"👂 **Listen for Echoes** – An echo can **help gauge distance** or confirm someone heard the signal.\"\n ]\n },\n {\n title: \"Using Flashlights for Night Signaling\",\n description: \"Learn how to use a flashlight to send distress signals at night.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Flashlight or headlamp\",\n \"Dark, open area for visibility\"\n ],\n steps: [\n \"🔎 **Why Use a Flashlight?** – A strong flashlight can **send distress signals over long distances**, especially in remote areas.\",\n \"1️⃣ **Use the SOS Pattern** – Flash **three short, three long, three short** beams (**Morse code for SOS**).\",\n \"2️⃣ **Aim at Searchlights or Aircraft** – Direct the beam toward rescuers or searchlights **to get noticed**.\",\n \"3️⃣ **Create Slow Flashing Patterns** – Flash **once every 5-10 seconds** for consistent visibility.\"\n ],\n tips: [\n \"🔋 **Save Battery** – Use brief flashes to **conserve power**.\",\n \"🛠 **Use a Reflective Surface** – Direct the flashlight beam **off a mirror or CD** for a wider signal.\",\n \"🌃 **Best in Open Areas** – Flashlights work **best in darkness away from city lights**.\"\n ]\n },\n {\n title: \"Hand Signals for Silent Communication\",\n description: \"Learn basic hand signals used for silent communication in survival situations.\",\n category: \"signaling\",\n completed: false,\n expanded: false,\n materials: [\n \"Knowledge of hand signals\",\n \"Visibility of team members\"\n ],\n steps: [\n \"🔎 **Why Use Hand Signals?** – Silent communication is useful for **stealth, hunting, and emergency teamwork**.\",\n \"1️⃣ **Stop Signal** – Raise one hand, **palm facing out**, to indicate stopping.\",\n \"2️⃣ **Go Forward** – Point **two fingers forward** to signal movement.\",\n \"3️⃣ **Danger Signal** – Cross arms **in an X over your chest** for warning.\",\n \"4️⃣ **Need Assistance** – Raise both hands **above your head and wave**.\",\n \"5️⃣ **Rally Here** – Make a **circle motion with one hand** to regroup.\"\n ],\n tips: [\n \"🖐 **Agree on Signals in Advance** – Make sure **everyone in your group knows the meaning** of each signal.\",\n \"🌲 **Great for Hunting or Stealth** – Avoid making noise when **tracking animals or moving quietly**.\",\n \"🚀 **Use at Night with a Glow Stick** – A small light **enhances visibility in darkness**.\"\n ]\n },\n \n // ⚔ Tactical & War Preparation Guides\n {\n title: \"Basic Handgun Training\",\n description: \"Learn the fundamentals of handling, aiming, and firing a handgun safely.\",\n category: \"tactical\",\n completed: false,\n expanded: false,\n materials: [\n \"Handgun (9mm recommended for beginners)\",\n \"Eye and ear protection\",\n \"Paper target or steel target\",\n \"Ammunition (appropriate for the firearm)\"\n ],\n steps: [\n \"🔎 **Understanding Handgun Basics** – A handgun is a short-barrel firearm designed for self-defense or tactical use. Mastering **grip, stance, sight alignment, and trigger control** is essential.\",\n \"1️⃣ **Safety First** – Always keep the gun pointed in a safe direction. **Finger off the trigger** until ready to fire.\",\n \"2️⃣ **Proper Grip** – Wrap your dominant hand around the grip, keeping the **thumb forward**. Support with the **non-dominant hand**.\",\n \"3️⃣ **Stance & Balance** – Stand with feet **shoulder-width apart**, slightly leaning forward.\",\n \"4️⃣ **Aiming & Sight Picture** – Align the front sight **between the rear sights**, focusing on the **front sight, not the target**.\",\n \"5️⃣ **Trigger Control** – Slowly squeeze the trigger without jerking the firearm to maintain accuracy.\",\n \"6️⃣ **Firing in Controlled Bursts** – Start with **single shots**, then practice controlled **double-taps**.\",\n \"7️⃣ **Reloading** – Drop the magazine, insert a fresh one, and **chamber a round smoothly**.\"\n ],\n tips: [\n \"🔫 **Grip is Key** – A weak grip will cause **poor recoil control**.\",\n \"🎯 **Focus on the Front Sight** – Your target should be slightly blurry; the **front sight must be crystal clear**.\",\n \"🔥 **Trigger Pull Must Be Smooth** – Avoid flinching; let the gun surprise you when it fires.\"\n ]\n },\n {\n title: \"Close Quarters Battle (CQB) Basics\",\n description: \"Learn how to move and engage threats in close-quarter combat situations.\",\n category: \"tactical\",\n completed: false,\n expanded: false,\n materials: [\n \"Training pistol or airsoft gun (for practice)\",\n \"Protective gear (gloves, goggles, helmet)\",\n \"A mock indoor environment (hallways, rooms)\"\n ],\n steps: [\n \"🔎 **What is CQB?** – Close Quarters Battle (CQB) is combat within **confined spaces** like buildings or alleyways. **Speed, surprise, and aggression** are key.\",\n \"1️⃣ **Weapon Ready Position** – Keep your gun **low and ready** to engage threats quickly.\",\n \"2️⃣ **Pie the Corner** – Instead of rushing in, **slice the pie** by moving slowly around a corner while keeping your gun trained forward.\",\n \"3️⃣ **Entry Techniques** – Use **doorway entry techniques** such as the **button hook (quick side movement)** or **cross entry (opposite sides).**\",\n \"4️⃣ **Room Clearing** – Upon entering, **scan and clear** sectors of the room systematically.\",\n \"5️⃣ **Engage Threats Quickly** – Fire two controlled shots to center mass if a target is hostile.\",\n \"6️⃣ **Use Cover & Movement** – Always stay **near cover** and move in **short bursts** to avoid exposure.\"\n ],\n tips: [\n \"🏃 **Never Stand in a Doorway** – The **fatal funnel** is a prime kill zone in CQB.\",\n \"🔍 **Look Before You Enter** – Always **scan the corners first** when entering a room.\",\n \"🛡️ **Move as a Team** – If working with others, **cover each other's blind spots**.\"\n ]\n },\n {\n title: \"Hand-to-Hand Combat: Striking Basics\",\n description: \"Learn essential self-defense strikes that can disable an opponent in survival situations.\",\n category: \"tactical\",\n completed: false,\n expanded: false,\n materials: [\n \"Striking pads or heavy bag\",\n \"Training gloves (optional)\",\n \"Practice partner (for controlled drills)\"\n ],\n steps: [\n \"🔎 **Why Learn Hand-to-Hand Combat?** – In survival situations, **you may not have a weapon**. Learning to strike effectively can **neutralize threats quickly**.\",\n \"1️⃣ **Stance & Balance** – Keep feet **shoulder-width apart**, hands up, **chin tucked**.\",\n \"2️⃣ **Basic Strikes** – Master the **jab, cross, elbow strike, and palm strike**.\",\n \"3️⃣ **Target Areas** – Strike vulnerable points like the **nose, throat, groin, and solar plexus**.\",\n \"4️⃣ **Power Generation** – Use your **hips and body rotation** to generate maximum force.\",\n \"5️⃣ **Defensive Movements** – Learn to **block, slip, and counterattack** efficiently.\"\n ],\n tips: [\n \"👊 **Use the Palm, Not Fists** – A palm strike reduces the risk of **breaking knuckles**.\",\n \"🎯 **Aim for Soft Targets** – Eyes, throat, and groin are **highly effective strike zones**.\",\n \"🏃 **Escape After Striking** – Don't stay engaged; **disable and disengage**.\"\n ]\n },\n {\n title: \"Escape & Evasion Tactics\",\n description: \"Learn how to evade capture and escape restraints in a survival scenario.\",\n category: \"tactical\",\n completed: false,\n expanded: false,\n materials: [\n \"Duct tape or zip ties (for practice)\",\n \"Handcuffs (if available)\",\n \"Escape tools (bobby pins, paper clips, shoelaces)\"\n ],\n steps: [\n \"🔎 **Why Escape & Evasion?** – If captured, knowing how to **escape restraints and avoid detection** can save your life.\",\n \"1️⃣ **Breaking Zip Ties** – Raise your **bound hands overhead**, then **slam them down quickly onto your thigh** to snap the ties.\",\n \"2️⃣ **Escaping Duct Tape** – Twist your wrists back and forth to **weaken the adhesive**, then pull apart rapidly.\",\n \"3️⃣ **Picking Handcuffs** – Use a **bobby pin** or paperclip to **manipulate the locking mechanism**.\",\n \"4️⃣ **Evasion Techniques** – If pursued, **change directions frequently, move through dense cover, and avoid predictable routes.**\",\n \"5️⃣ **Blending In** – Act natural in urban environments to avoid looking suspicious.\"\n ],\n tips: [\n \"🔗 **Zip Tie Weakness** – Heat or **friction weakens plastic ties**.\",\n \"🚶 **Walk Like You Belong** – Avoid **suspicious movements** when blending in.\",\n \"🌲 **Use Nature for Cover** – Dense foliage provides **natural concealment** from pursuers.\"\n ]\n },\n {\n title: \"Tactical Reloading Techniques\",\n description: \"Learn how to reload a firearm efficiently during combat scenarios.\",\n category: \"tactical\",\n completed: false,\n expanded: false,\n materials: [\n \"Handgun or rifle (unloaded for practice)\",\n \"Extra magazines\",\n \"Dummy rounds (for safety)\"\n ],\n steps: [\n \"🔎 **Why Learn Tactical Reloads?** – Reloading **under stress** is a crucial skill in self-defense and combat situations.\",\n \"1️⃣ **Speed Reload** – Drop the empty magazine, insert a new one **without retaining the old mag**.\",\n \"2️⃣ **Tactical Reload** – Swap an **almost-empty magazine with a fresh one** while keeping the partially loaded mag.\",\n \"3️⃣ **Emergency Reload** – If your firearm **runs empty**, reload as fast as possible under cover.\",\n \"4️⃣ **Magazine Indexing** – Keep magazines in a **consistent position on your belt** for quick access.\",\n \"5️⃣ **Reassess the Situation** – After reloading, scan for threats before resuming engagement.\"\n ],\n tips: [\n \"🔫 **Keep Your Gun Up** – Don’t drop your firearm while reloading.\",\n \"📏 **Practice with Dummy Rounds** – Train safely before using live ammo.\",\n \"🚀 **Muscle Memory is Key** – Repetition makes reloading instinctive.\"\n ]\n },\n \n // ⚡ Electrical Engineering & Hacking Guides\n {\n title: \"HAM Radio Basics: Long-Distance Emergency Communication\",\n description: \"Learn how to set up and use a HAM radio for emergency communication.\",\n category: \"electrical\",\n completed: false,\n expanded: false,\n materials: [\n \"HAM radio (Baofeng UV-5R or similar)\",\n \"Antenna (default or extended for better range)\",\n \"Battery pack or solar charger\",\n \"Local frequency chart or band plan\"\n ],\n steps: [\n \"🔎 **What is HAM Radio?** – HAM radio is a reliable way to communicate **over long distances** without relying on cell towers or the internet.\",\n \"1️⃣ **Power On the Radio** – Ensure the battery is charged, then turn on the radio.\",\n \"2️⃣ **Set the Frequency** – Use a local frequency chart to tune into an active emergency or general frequency.\",\n \"3️⃣ **Adjust the Antenna** – A longer antenna improves signal range. Position it **vertically for best reception.**\",\n \"4️⃣ **Listen Before Transmitting** – Always **listen** before pressing the PTT (Push-to-Talk) button.\",\n \"5️⃣ **Make a Call** – Press PTT and say, 'This is [Your Call Sign], is anyone receiving?'. Speak **clearly and concisely.**\",\n \"6️⃣ **Respond to Incoming Calls** – If someone responds, **confirm your location and intent** (e.g., requesting emergency help).\"\n ],\n tips: [\n \"📻 **Practice in Non-Emergencies** – Test your radio before an actual crisis.\",\n \"🔋 **Conserve Battery** – Keep transmissions **short** to extend battery life.\",\n \"🌎 **Use Repeaters** – If the signal is weak, try **repeater frequencies** to boost communication range.\"\n ]\n },\n {\n title: \"Building a Simple Solar Power System\",\n description: \"Set up a small off-grid solar power system to generate electricity.\",\n category: \"electrical\",\n completed: false,\n expanded: false,\n materials: [\n \"Solar panel (50W or higher)\",\n \"Charge controller\",\n \"12V deep-cycle battery\",\n \"Power inverter (optional for AC devices)\",\n \"Wiring and connectors\"\n ],\n steps: [\n \"🔎 **How Solar Power Works** – Solar panels convert sunlight into **electricity**, which is stored in a battery for later use.\",\n \"1️⃣ **Position the Solar Panel** – Place the panel **facing the sun** at an optimal angle (30-45°).\",\n \"2️⃣ **Connect to the Charge Controller** – Wire the **solar panel to the charge controller** to regulate power flow.\",\n \"3️⃣ **Connect the Battery** – Attach the charge controller to the **12V battery** to store power.\",\n \"4️⃣ **Add an Inverter (Optional)** – If using **AC-powered devices**, connect an inverter to the battery.\",\n \"5️⃣ **Test the System** – Power a small device (USB charger, LED light) to confirm everything works.\",\n \"6️⃣ **Expand as Needed** – Add more panels or batteries for a larger off-grid setup.\"\n ],\n tips: [\n \"☀️ **Maximize Sunlight Exposure** – Move the panel **throughout the day** for peak energy collection.\",\n \"🔋 **Use Deep-Cycle Batteries** – Regular car batteries **aren't ideal** for long-term solar use.\",\n \"⚡ **Use LED Lights** – They consume less power, extending battery life.\"\n ]\n },\n {\n title: \"Cybersecurity: Protecting Your Digital Identity\",\n description: \"Learn how to secure your personal and financial data online.\",\n category: \"electrical\",\n completed: false,\n expanded: false,\n materials: [\n \"Password manager (Bitwarden, LastPass, or KeePass)\",\n \"Two-Factor Authentication (Google Authenticator, Authy)\",\n \"VPN (ProtonVPN, NordVPN, or Mullvad)\",\n \"Secure browser (Brave, Firefox, or Tor)\"\n ],\n steps: [\n \"🔎 **Why Cybersecurity Matters** – Hackers can **steal passwords, monitor activity, and hijack accounts**. These steps prevent digital theft.\",\n \"1️⃣ **Use Strong Passwords** – Create **unique** passwords for every account (16+ characters, random).\",\n \"2️⃣ **Enable Two-Factor Authentication (2FA)** – Require **a second verification step** (SMS codes, Authenticator apps).\",\n \"3️⃣ **Use a VPN** – Encrypt internet traffic to **prevent tracking** from hackers and ISPs.\",\n \"4️⃣ **Secure Your Browser** – Use **Brave, Firefox, or Tor** with privacy settings enabled.\",\n \"5️⃣ **Avoid Phishing Scams** – Never **click suspicious email links** or download unknown attachments.\",\n \"6️⃣ **Regularly Update Software** – Keep **all apps, browsers, and operating systems updated** to prevent vulnerabilities.\"\n ],\n tips: [\n \"🔐 **Never Reuse Passwords** – If one account gets hacked, all others remain safe.\",\n \"🌍 **Browse Securely** – Avoid entering sensitive information on **public Wi-Fi** without a VPN.\",\n \"⚠️ **Check Email Senders** – Hackers disguise themselves as trusted companies; **always verify sender addresses**.\"\n ]\n },\n {\n title: \"EMP Protection: Shielding Electronics from Electromagnetic Pulses\",\n description: \"Learn how to protect sensitive electronics from an EMP attack.\",\n category: \"electrical\",\n completed: false,\n expanded: false,\n materials: [\n \"Faraday bag or metal container\",\n \"Aluminum foil\",\n \"Plastic insulation (bubble wrap, cloth, or cardboard)\",\n \"Battery-powered emergency devices (radio, flashlight, USB charger)\"\n ],\n steps: [\n \"🔎 **What is an EMP?** – An **Electromagnetic Pulse (EMP)** can fry electronics **instantly** if unprotected.\",\n \"1️⃣ **Wrap Electronics in Foil** – Completely cover devices in **multiple layers of aluminum foil**.\",\n \"2️⃣ **Use a Faraday Cage** – Store items inside a **metal box lined with insulation** (plastic or cardboard).\",\n \"3️⃣ **Avoid Gaps in Protection** – Even **small openings** allow EMP waves in.\",\n \"4️⃣ **Backup Critical Devices** – Protect **radios, batteries, and survival electronics**.\",\n \"5️⃣ **Test Your Faraday Cage** – Use a radio **inside the container**. If it doesn’t receive a signal, the cage works.\",\n \"6️⃣ **Have Manual Backups** – Store printed maps, physical cash, and mechanical tools.\"\n ],\n tips: [\n \"⚡ **Store a Spare Phone** – Keep an **old phone** in a Faraday cage as an emergency backup.\",\n \"🔋 **Use Hand-Crank Radios** – EMP-proof radios **don’t rely on batteries**.\",\n \"🔎 **Wrap Cables Separately** – EMPs travel through wires; **disconnect all electronics when stored.**\"\n ]\n },\n {\n title: \"Hacking Survival: Basic Ethical Hacking for Self-Defense\",\n description: \"Learn basic hacking techniques for personal cybersecurity and survival.\",\n category: \"electrical\",\n completed: false,\n expanded: false,\n materials: [\n \"Kali Linux (or Parrot OS) on USB\",\n \"USB Rubber Ducky or basic keylogger\",\n \"Wireshark (for packet analysis)\",\n \"Tor Browser (for anonymous browsing)\"\n ],\n steps: [\n \"🔎 **Why Learn Ethical Hacking?** – Knowing how hackers attack **helps you defend yourself.**\",\n \"1️⃣ **Use Kali Linux** – This hacking-focused operating system has tools for **network security and penetration testing**.\",\n \"2️⃣ **Detect Keyloggers** – Run **task manager (Windows)** or **top (Linux)** to find unauthorized software recording keystrokes.\",\n \"3️⃣ **Monitor Network Traffic** – Use **Wireshark** to **analyze suspicious connections** in real time.\",\n \"4️⃣ **Secure Your Router** – Change the default **admin password** and enable **WPA3 encryption**.\",\n \"5️⃣ **Use Tor for Privacy** – If anonymous browsing is needed, **use Tor with caution** (avoid illegal activity).\",\n \"6️⃣ **Check for Data Breaches** – Use websites like **HaveIBeenPwned** to see if your email/password was leaked.\"\n ],\n tips: [\n \"🔍 **Use VPN with Tor** – Prevent ISPs from knowing **when** you’re using Tor.\",\n \"🖥️ **Always Log Out** – Don’t stay signed in to sensitive accounts.\",\n \"🚫 **Never Use Public USB Ports** – Avoid **juice jacking** attacks by using your own charger.\"\n ]\n },\n \n // 💰 Finance & Wealth-Building Guides\n {\n title: \"Trading Stocks, Futures, Forex, and Crypto: The Smart Way\",\n description: \"Learn how to trade profitably by using a simulated account, practicing risk management, and leveraging prop firms.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Demo trading account (e.g., ThinkorSwim, TradingView, MetaTrader, NinjaTrader)\",\n \"Brokerage account (for real trading later)\",\n \"Economic calendar (Forex Factory, Investing.com)\",\n \"Risk management calculator\",\n \"Access to a prop firm (e.g., Topstep, Earn2Trade, Apex Trader Funding)\"\n ],\n steps: [\n \"🔎 **What is Trading?** – Trading involves buying and selling assets like stocks, futures, forex, or crypto to profit from price movements.\",\n \"1️⃣ **Start with a Simulated Account** – Before risking real money, **trade in a demo (paper) account** for 3-6 months to practice strategy and refine risk management.\",\n \"2️⃣ **Learn Risk vs. Reward** – Your goal is to risk small amounts for **larger potential gains (Risk-Reward Ratio of 1:2 or better).**\",\n \"3️⃣ **Develop a Trading Plan** – A solid trading plan includes:\",\n \" - ✅ **Entry & Exit Strategy** – Know exactly when to **buy and sell**.\",\n \" - ✅ **Risk Management** – Risk **no more than 1-2% of your capital per trade**.\",\n \" - ✅ **Stop Loss & Take Profit** – Set limits on **how much you’re willing to lose and when to take profits**.\",\n \"4️⃣ **Test Your Strategy** – Track results in your demo account and **only go live if consistently profitable** after 3-6 months.\",\n \"5️⃣ **Move to a Prop Firm** – Instead of risking personal savings, trade with a **prop firm** like **Topstep (the #1 prop firm in the US & world)**.\",\n \"6️⃣ **Pass the Prop Firm Evaluation** – To trade their capital, you must pass a **challenge or combine** by showing consistent profits while following rules.\",\n \"7️⃣ **Trade Their Money** – Once approved, you trade the firm’s money with a profit split. **Topstep gives a 90/10 split after you make $5,000**, meaning you keep 90% of profits.\",\n \"8️⃣ **Fund Your Own Account** – Use your **prop firm earnings** to build a personal trading account, reducing risk and increasing financial independence.\"\n ],\n tips: [\n \"📉 **Risk Small, Win Big** – Never risk more than **1-2% of your account per trade**.\",\n \"📊 **Keep a Trading Journal** – Track trades to **analyze mistakes and improve strategy**.\",\n \"🏆 **Patience is Key** – **Don’t rush into real trading** until profitable in demo mode.\",\n \"💰 **Topstep is the #1 Prop Firm** – If going the prop firm route, **Topstep is a proven and regulated choice**.\"\n ]\n },\n {\n title: \"Stock Trading: How to Buy & Sell Shares\",\n description: \"Learn how to invest in the stock market, analyze stocks, and execute trades.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Online brokerage account (e.g., TD Ameritrade, E*TRADE, Webull)\",\n \"Stock market tracking app (Yahoo Finance, TradingView)\",\n \"Investment funds (optional)\"\n ],\n steps: [\n \"🔎 **What is Stock Trading?** – Buying and selling company shares allows you to grow wealth over time.\",\n \"1️⃣ **Open a Brokerage Account** – Choose an online brokerage and complete registration.\",\n \"2️⃣ **Fund Your Account** – Deposit money into your brokerage account (minimum varies by platform).\",\n \"3️⃣ **Research Stocks** – Use **Yahoo Finance, TradingView, or brokerage tools** to study companies.\",\n \"4️⃣ **Choose a Stock** – Look for **stable companies with growth potential**.\",\n \"5️⃣ **Place a Trade** – Buy shares at **market price (instant) or limit price (at your preferred price)**.\",\n \"6️⃣ **Monitor and Sell** – Watch price changes and sell when profit targets are reached.\"\n ],\n tips: [\n \"📈 **Start Small** – Don’t risk money you can’t afford to lose.\",\n \"💹 **Use Stop-Loss Orders** – Set limits to **automatically sell if the price drops**.\",\n \"📊 **Diversify** – Invest in **different industries** to reduce risk.\"\n ]\n },\n {\n title: \"Real Estate Investment: How to Buy Rental Properties\",\n description: \"Learn how to invest in real estate and generate rental income.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Cash savings or loan approval\",\n \"Property listing websites (Zillow, Realtor, Redfin)\",\n \"Property valuation tools (BiggerPockets, PropStream)\"\n ],\n steps: [\n \"🔎 **Why Real Estate?** – Owning rental properties can create **passive income** and build wealth.\",\n \"1️⃣ **Choose Your Market** – Research **affordable cities with high rental demand**.\",\n \"2️⃣ **Find a Property** – Look on **Zillow, Realtor.com, or through local agents**.\",\n \"3️⃣ **Analyze the Numbers** – Use the **1% rule** (rent should be 1% of purchase price).\",\n \"4️⃣ **Secure Financing** – Pay with cash or apply for a **mortgage loan**.\",\n \"5️⃣ **Close the Deal** – Sign contracts and **officially own the property**.\",\n \"6️⃣ **Rent It Out** – List your property online and find tenants.\"\n ],\n tips: [\n \"🏡 **Start with Small Properties** – Single-family homes are easier for beginners.\",\n \"📉 **Don’t Overpay** – Use property valuation tools to estimate **fair market value**.\",\n \"💰 **Account for Hidden Costs** – Repairs, taxes, and management fees **reduce profit**.\"\n ]\n },\n {\n title: \"Creating Multiple Income Streams\",\n description: \"Learn how to make money from different sources instead of relying on one job.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Internet connection\",\n \"Online marketplace accounts (eBay, Etsy, Facebook Marketplace)\",\n \"Side hustle idea\"\n ],\n steps: [\n \"🔎 **Why Multiple Income Streams?** – Having multiple ways to make money protects you from job loss.\",\n \"1️⃣ **Identify Your Skills** – What services or products can you sell? (e.g., graphic design, carpentry, flipping items).\",\n \"2️⃣ **Choose a Platform** – Sell products on **eBay, Etsy, or Amazon** or offer services on **Fiverr or Upwork**.\",\n \"3️⃣ **Start with One Income Source** – Focus on **one side hustle at a time**.\",\n \"4️⃣ **Scale Up** – Reinvest profits to **grow your business or add more income streams**.\",\n \"5️⃣ **Automate Income** – Create **passive income sources** (rental properties, dividends, online courses).\"\n ],\n tips: [\n \"💡 **Start Small & Expand** – Don’t overwhelm yourself by **trying too many things at once**.\",\n \"📊 **Track Your Earnings** – Keep records of **what’s profitable** and what’s not.\",\n \"🛑 **Avoid Get-Rich-Quick Scams** – Real income growth **takes time and effort**.\"\n ]\n },\n {\n title: \"Bartering & Alternative Currency in Survival Situations\",\n description: \"Learn how to trade goods and services when traditional money loses value.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Valuable barter items (food, medicine, tools, ammo, alcohol, skills)\",\n \"A network of potential trade partners\",\n \"Knowledge of supply and demand in your local area\"\n ],\n steps: [\n \"🔎 **Why Bartering?** – If the economy collapses, physical goods become more valuable than cash.\",\n \"1️⃣ **Stock Up on Barter Items** – Collect **high-demand goods** like canned food, fuel, and first-aid supplies.\",\n \"2️⃣ **Find Trade Partners** – Establish **trusted connections** with like-minded individuals.\",\n \"3️⃣ **Assess Trade Value** – Compare **supply and demand** before making a deal.\",\n \"4️⃣ **Negotiate Smartly** – Never reveal how much stock you have; **start with low offers** and adjust.\",\n \"5️⃣ **Trade Securely** – Avoid trading in **unsafe or public places**; have protection if needed.\",\n \"6️⃣ **Use Skills as Currency** – If you lack goods, offer **useful survival skills in exchange**.\"\n ],\n tips: [\n \"⚖️ **Diversify Trade Goods** – Not everyone needs the same items, so **offer variety**.\",\n \"🎯 **Know When to Trade** – Trade when **demand is highest** for what you have.\",\n \"🛡️ **Stay Cautious** – Don’t let people know **everything you own** to avoid becoming a target.\"\n ]\n },\n {\n title: \"Prepping Financially for an Economic Collapse\",\n description: \"Learn how to protect your wealth and survive financial instability.\",\n category: \"finance\",\n completed: false,\n expanded: false,\n materials: [\n \"Cash savings (in small denominations)\",\n \"Precious metals (gold, silver)\",\n \"Non-perishable food and survival supplies\",\n \"Alternative currency (crypto, trade goods)\"\n ],\n steps: [\n \"🔎 **Why Prepare Financially?** – If the economy crashes, cash **may lose value overnight**.\",\n \"1️⃣ **Diversify Wealth** – Store **cash, precious metals, and tradeable goods**.\",\n \"2️⃣ **Reduce Debt** – Pay off **high-interest loans** to avoid financial collapse.\",\n \"3️⃣ **Stockpile Essential Supplies** – Focus on **food, water, medicine, and energy sources**.\",\n \"4️⃣ **Keep Some Cash Handy** – In a crisis, banks **may freeze accounts** or limit withdrawals.\",\n \"5️⃣ **Invest in Skills** – Learn **self-sufficiency** (gardening, repairs, first aid).\",\n \"6️⃣ **Find Alternative Income Sources** – Side hustles, remote work, and barter networks ensure financial stability.\"\n ],\n tips: [\n \"💵 **Small Bills Are Better** – In a collapse, making **change for large bills** will be difficult.\",\n \"🔑 **Keep Important Documents Safe** – Store ID, property deeds, and emergency contacts in a **fireproof safe**.\",\n \"📈 **Be Flexible** – Adapt to **new economic conditions quickly**.\"\n ]\n },\n {\n \"title\": \"Dropshipping: Sell Products Without Inventory\",\n \"description\": \"Learn how to start a dropshipping business and make profits without handling inventory.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Dropshipping platform (Shopify, eBay, TikTok Shop, etc.)\",\n \"Reliable supplier (Walmart, AliExpress, CJ Dropshipping, etc.)\",\n \"Product research tool (Google Trends, TikTok, etc.)\"\n ],\n \"steps\": [\n \"🔎 **Understanding Dropshipping** – Dropshipping is a retail model where you sell products without keeping inventory, and the supplier ships the items directly to the customer.\",\n \"1️⃣ **Find a Winning Product** – Use Google Trends, TikTok trends, or product research tools to find high-demand items.\",\n \"2️⃣ **Choose a Supplier** – Select a reliable supplier from platforms like Walmart, CJ Dropshipping, or AliExpress.\",\n \"3️⃣ **Set Up Your Store** – Use Shopify, eBay, or TikTok Shop to create a storefront for your products.\",\n \"4️⃣ **List Products at a Markup** – Download product images and descriptions, then list them at a 10-20% markup.\",\n \"5️⃣ **Advertise Your Store** – Promote your products through TikTok videos, Facebook ads, or influencer marketing.\",\n \"6️⃣ **Process Orders and Scale** – When a customer buys, order from your supplier with the buyer’s shipping details and reinvest profits into ads to scale.\"\n ],\n \"tips\": [\n \"💡 **Sell Trending Products** – Focus on items that solve problems or have viral potential.\",\n \"🚚 **Check Shipping Times** – Choose suppliers with fast shipping to improve customer satisfaction.\",\n \"📊 **Track Profit Margins** – Ensure your selling price covers product cost, ad spend, and platform fees.\"\n ]\n },\n {\n \"title\": \"Freelancing: Get Paid for Your Skills\",\n \"description\": \"Start freelancing on platforms like Upwork, Fiverr, or Freelancer to earn money remotely.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Freelance platform account (Upwork, Fiverr, Freelancer)\",\n \"Marketable skills (graphic design, writing, programming, etc.)\",\n \"Portfolio or sample work\"\n ],\n \"steps\": [\n \"🔎 **Understanding Freelancing** – Freelancers provide services remotely and get paid per project or hourly.\",\n \"1️⃣ **Identify Your Skills** – Choose a service you can offer, such as graphic design, copywriting, web development, or virtual assistance.\",\n \"2️⃣ **Create a Portfolio** – Showcase previous work samples to attract clients.\",\n \"3️⃣ **Sign Up on a Freelance Platform** – Register on Upwork, Fiverr, or Freelancer to find work.\",\n \"4️⃣ **Optimize Your Profile** – Write a compelling bio, add a professional profile picture, and set competitive pricing.\",\n \"5️⃣ **Start Bidding on Jobs** – Apply for projects that match your skills and gradually build up reviews.\",\n \"6️⃣ **Scale Your Income** – Once you have positive reviews, increase your rates and attract higher-paying clients.\"\n ],\n \"tips\": [\n \"📝 **Specialize in a Niche** – Narrow down your services to stand out (e.g., “Shopify store setup” instead of just “web design”).\",\n \"📢 **Market Yourself** – Share your work on LinkedIn, Reddit, or Twitter to attract more clients.\",\n \"💰 **Negotiate Smartly** – Don’t undersell your skills; research market rates before setting prices.\"\n ]\n },\n {\n \"title\": \"Flipping & Reselling: Profiting from Used Goods\",\n \"description\": \"Learn how to buy and sell used items for profit using platforms like Craigslist, Facebook Marketplace, and OfferUp.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"A smartphone with a camera\",\n \"Access to Facebook Marketplace, Craigslist, OfferUp, or eBay\",\n \"Basic knowledge of product pricing\"\n ],\n \"steps\": [\n \"🔎 **Understanding Flipping** – Flipping involves buying undervalued items and reselling them for profit.\",\n \"1️⃣ **Find Undervalued Items** – Look for free or cheap items on Craigslist, Facebook Marketplace, and thrift stores.\",\n \"2️⃣ **Research Market Value** – Check eBay ‘sold listings’ or search for similar items online to determine resale price.\",\n \"3️⃣ **Clean & Fix Items** – Improve the value of items with minor repairs, cleaning, or better photos.\",\n \"4️⃣ **List the Item for Sale** – Take clear pictures, write a compelling description, and price competitively.\",\n \"5️⃣ **Negotiate & Sell** – Be prepared to negotiate with buyers and accept payments securely.\",\n \"6️⃣ **Scale Your Reselling Business** – Use profits to buy higher-value items and reinvest into more inventory.\"\n ],\n \"tips\": [\n \"📦 **Start with Small Items** – Electronics, furniture, and power tools flip quickly.\",\n \"📸 **Take Good Photos** – High-quality pictures increase selling price and buyer trust.\",\n \"🚚 **Offer Local Pickup** – This reduces shipping costs and makes selling easier.\"\n ]\n },\n {\n \"title\": \"Wholesaling Real Estate: Contract Flipping\",\n \"description\": \"Learn how to wholesale real estate by securing contracts and selling them to investors without buying property.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Access to online property listings (Zillow, Redfin, Craigslist)\",\n \"Basic contract knowledge (purchase agreements, assignment contracts)\",\n \"Real estate investor network\"\n ],\n \"steps\": [\n \"🔎 **Understanding Wholesaling** – Wholesaling is finding a distressed property, securing it under contract, and assigning that contract to a buyer for a fee.\",\n \"1️⃣ **Find Distressed Properties** – Look for motivated sellers, foreclosure properties, or abandoned homes.\",\n \"2️⃣ **Make an Offer** – Negotiate with the seller to secure the property at a below-market price.\",\n \"3️⃣ **Secure the Contract** – Sign a purchase agreement with the seller, ensuring you have an assignment clause.\",\n \"4️⃣ **Find a Cash Buyer** – Market the contract to real estate investors and landlords who want to buy below market value.\",\n \"5️⃣ **Assign the Contract** – Sell your contract to the investor for an assignment fee (typically $5,000-$20,000).\",\n \"6️⃣ **Close the Deal & Get Paid** – The investor buys the property, and you collect your assignment fee.\"\n ],\n \"tips\": [\n \"🏠 **Network with Investors** – The more buyers you have, the faster you can sell contracts.\",\n \"📜 **Use Legal Contracts** – Ensure all agreements are legally binding and allow assignment.\",\n \"💰 **Negotiate Smartly** – The lower you get the property under contract, the higher your assignment fee.\"\n ]\n },\n {\n \"title\": \"Affiliate Marketing: Passive Income from Commissions\",\n \"description\": \"Learn how to earn commissions by promoting products from Amazon, ClickBank, or other affiliate networks.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"An affiliate account (Amazon Associates, ClickBank, ShareASale, etc.)\",\n \"A blog, YouTube channel, or social media account\",\n \"Knowledge of product niches\"\n ],\n \"steps\": [\n \"🔎 **Understanding Affiliate Marketing** – Affiliate marketing is promoting other people’s products and earning a commission per sale.\",\n \"1️⃣ **Sign Up for an Affiliate Program** – Join Amazon Associates, ClickBank, or ShareASale.\",\n \"2️⃣ **Choose a Niche** – Pick a category (fitness, tech, survival gear) that aligns with your content.\",\n \"3️⃣ **Create Content Around the Product** – Write reviews, tutorials, or make videos showcasing the product.\",\n \"4️⃣ **Insert Your Affiliate Links** – Place unique tracking links in your content.\",\n \"5️⃣ **Drive Traffic to Your Content** – Use SEO, social media, or ads to increase clicks on your links.\",\n \"6️⃣ **Earn Commissions** – Get paid every time someone purchases through your link.\"\n ],\n \"tips\": [\n \"💡 **Choose High-Paying Programs** – Some programs pay 30-50% commission per sale.\",\n \"📊 **Use SEO for Traffic** – Rank your blog or videos on Google for free traffic.\",\n \"📈 **Build an Email List** – Capture leads and send them affiliate offers over time.\"\n ]\n },\n {\n \"title\": \"Passive Income: Make Money While You Sleep\",\n \"description\": \"Learn how to create passive income through digital products, YouTube, or rental properties.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"A monetizable platform (YouTube, blog, online store)\",\n \"Digital product ideas (eBooks, courses, printables)\",\n \"An audience or marketing strategy\"\n ],\n \"steps\": [\n \"🔎 **Understanding Passive Income** – Passive income is money earned with minimal ongoing effort.\",\n \"1️⃣ **Choose a Passive Income Stream** – Options include YouTube monetization, online courses, eBooks, or real estate.\",\n \"2️⃣ **Create a Digital Product** – Write an eBook, design a printable, or develop a course.\",\n \"3️⃣ **List the Product for Sale** – Sell on Gumroad, Teachable, or Amazon Kindle.\",\n \"4️⃣ **Automate Your Sales** – Use paid ads, SEO, or email marketing to generate ongoing sales.\",\n \"5️⃣ **Expand and Scale** – Launch more products or grow your audience for higher earnings.\"\n ],\n \"tips\": [\n \"📚 **Start with Low-Cost Digital Products** – eBooks and printables are cheap to create.\",\n \"📹 **Monetize YouTube Content** – Earn ad revenue, sponsorships, and affiliate commissions.\",\n \"🏠 **Invest in Rental Properties** – Real estate provides steady passive income over time.\"\n ]\n },\n {\n \"title\": \"Budgeting & Money Management: Take Control of Your Finances\",\n \"description\": \"Learn how to create a budget, manage spending, and grow savings using apps like Mint or EveryDollar.\",\n \"category\": \"finance\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Budgeting app (Mint, EveryDollar, YNAB)\",\n \"A list of monthly income and expenses\",\n \"Financial goals (saving, investing, debt repayment)\"\n ],\n \"steps\": [\n \"🔎 **Understanding Budgeting** – Budgeting is planning how you allocate money to cover expenses, save, and invest.\",\n \"1️⃣ **Track Your Income & Expenses** – List all sources of income and monthly expenses.\",\n \"2️⃣ **Categorize Your Spending** – Divide expenses into necessities (rent, food) and discretionary (entertainment, shopping).\",\n \"3️⃣ **Set Financial Goals** – Plan to save, pay off debt, or invest a portion of income.\",\n \"4️⃣ **Use a Budgeting App** – Track spending automatically using Mint, EveryDollar, or YNAB.\",\n \"5️⃣ **Adjust and Improve Over Time** – Review spending habits monthly and make adjustments to improve financial health.\"\n ],\n \"tips\": [\n \"💰 **Follow the 50/30/20 Rule** – 50% needs, 30% wants, 20% savings/investing.\",\n \"📉 **Cut Unnecessary Expenses** – Identify subscriptions or habits that drain money.\",\n \"📈 **Automate Savings** – Set up automatic transfers to a savings or investment account.\"\n ]\n },\n \n // ⚠️ Hardcore Survival Challenges\n {\n \"title\": \"Primitive Survival: Living Off the Land\",\n \"description\": \"Survive 10 days using only self-made primitive tools and natural resources.\",\n \"category\": \"hardcore\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Natural materials (wood, stone, plant fibers)\",\n \"Flint or chert for tool-making\",\n \"Cordage (natural or handmade)\",\n \"Basic knowledge of primitive shelter and fire-starting\"\n ],\n \"steps\": [\n \"🔎 **Understanding Primitive Survival** – This challenge tests your ability to live with **no modern tools** and only what you can craft.\",\n \"1️⃣ **Choose a Suitable Location** – Find an area with **water, shelter-building materials, and food sources**.\",\n \"2️⃣ **Build a Shelter First** – Use **debris huts, lean-tos, or natural caves** to protect yourself from the elements.\",\n \"3️⃣ **Start a Fire with Primitive Methods** – Use a **bow drill, fire plough, or hand drill** to create an ember.\",\n \"4️⃣ **Find & Purify Water** – Collect water from natural sources and **boil or filter it** using natural materials.\",\n \"5️⃣ **Make Primitive Tools** – Knapp a **stone knife**, carve a **digging stick**, and weave **cordage** for traps.\",\n \"6️⃣ **Hunt, Trap & Forage for Food** – Set up **deadfall traps**, make **fishing spears**, and **identify edible plants**.\",\n \"7️⃣ **Adapt & Improve Daily** – Strengthen your shelter, refine your tools, and secure long-term food sources.\"\n ],\n \"tips\": [\n \"🪨 **Use Sharp Rocks** – Flint, chert, or obsidian can be knapped into knives and scrapers.\",\n \"🔥 **Always Have Fire Ready** – Keeping an ember alive makes fire-starting much easier.\",\n \"🥩 **Prioritize Protein** – Small game and insects are crucial for survival energy.\",\n \"🚰 **Stay Hydrated** – Dehydration is the number one killer in primitive survival.\"\n ]\n },\n {\n \"title\": \"Fire in the Rain: Wet Weather Fire Starting\",\n \"description\": \"Start a fire in stormy, wet conditions using only natural materials.\",\n \"category\": \"hardcore\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Ferro rod or flint and steel\",\n \"Waterproof tinder (birch bark, fatwood, or char cloth)\",\n \"Dry kindling stored in a waterproof container\"\n ],\n \"steps\": [\n \"🔎 **Why is Fire Hard in the Rain?** – Wet wood and rain make it nearly impossible to start a fire without proper preparation.\",\n \"1️⃣ **Find or Make Dry Tinder** – Look for **dead standing wood**, peel away wet bark, or make **feather sticks**.\",\n \"2️⃣ **Use a Waterproof Fire Starter** – Fatwood, birch bark, and char cloth ignite even when damp.\",\n \"3️⃣ **Build a Fire Base** – Use large logs or rocks to create a **dry platform** for your fire.\",\n \"4️⃣ **Use a Ferro Rod or Flint & Steel** – Striking sparks onto **fine, dry tinder** will ignite a fire even in rain.\",\n \"5️⃣ **Protect the Fire from Wind & Rain** – Use **a lean-to structure, body cover, or a tarp** to shield the flames.\",\n \"6️⃣ **Gradually Dry Out Larger Wood** – Start with **small twigs** and slowly add damp wood as it dries out.\"\n ],\n \"tips\": [\n \"🪵 **Split Wood to Find Dryness** – The inside of logs stays dry even in the rain.\",\n \"🔥 **Use a Fire Reflector** – Rocks or a heat wall help keep flames strong and dry surrounding fuel.\",\n \"💨 **Create an Airflow Pocket** – Raising the fire slightly off the wet ground keeps oxygen flowing.\"\n ]\n },\n {\n \"title\": \"Night Navigation: Finding Your Way in the Dark\",\n \"description\": \"Navigate at night using only natural signs, stars, and terrain.\",\n \"category\": \"hardcore\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"No artificial light (challenge is done in total darkness)\",\n \"Knowledge of stars (North Star, Orion’s Belt, etc.)\",\n \"Awareness of terrain features\"\n ],\n \"steps\": [\n \"🔎 **Why Night Navigation?** – In survival, moving at night can help you avoid predators and conserve energy.\",\n \"1️⃣ **Find the North Star** – Locate **Polaris** in the night sky to determine **true north**.\",\n \"2️⃣ **Use the Moon’s Shadow** – A **full moon rises in the east and sets in the west**, helping with orientation.\",\n \"3️⃣ **Follow Natural Terrain** – Rivers **flow downhill**, moss **grows on the shaded side of trees**, and mountain ridges lead to valleys.\",\n \"4️⃣ **Mark Your Path** – Leave **stick markers, rock piles, or scratches** on trees to track your movement.\",\n \"5️⃣ **Stay Quiet & Alert** – Move slowly, avoid making noise, and **listen for natural sounds** like water or wind patterns.\",\n \"6️⃣ **Only Move if Necessary** – If lost, staying put is often safer than walking aimlessly in darkness.\"\n ],\n \"tips\": [\n \"🌌 **Memorize Star Patterns** – Orion’s Belt and the Big Dipper help confirm directions.\",\n \"🌑 **Avoid Using Flashlights** – Light can ruin night vision and alert animals or people.\",\n \"🎯 **Practice Before You Need It** – Try night navigation in familiar areas first.\"\n ]\n },\n {\n \"title\": \"Extreme Cold Survival: Staying Alive in Freezing Conditions\",\n \"description\": \"Survive 24+ hours in below-freezing temperatures with limited resources.\",\n \"category\": \"hardcore\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Multiple layers of clothing (preferably wool)\",\n \"Emergency fire-starting kit\",\n \"Shelter-building materials (snow, branches, tarp)\"\n ],\n \"steps\": [\n \"🔎 **Cold Kills Fast** – **Frostbite and hypothermia** set in within minutes in extreme cold if you are unprepared.\",\n \"1️⃣ **Layer Your Clothing Correctly** – Use **wool or synthetic layers**, avoiding cotton (which absorbs moisture).\",\n \"2️⃣ **Build a Shelter Immediately** – Snow caves, **lean-tos**, or **windbreaks** prevent deadly heat loss.\",\n \"3️⃣ **Keep Extremities Covered** – Use **gloves, hats, and thick socks** to prevent frostbite on fingers and toes.\",\n \"4️⃣ **Start a Fire ASAP** – Use **fatwood, birch bark, or a fire reflector** to maintain warmth.\",\n \"5️⃣ **Stay Dry at All Costs** – Wet clothes lose **95% of insulation ability**. **Remove damp clothing immediately.**\",\n \"6️⃣ **Conserve Energy** – Move **slowly and efficiently** to avoid sweating, which cools the body dangerously fast.\"\n ],\n \"tips\": [\n \"🔥 **Use Rocks to Store Heat** – Heat **stones in a fire** and place them inside your shelter.\",\n \"🥶 **Keep Moving if Stuck Without Shelter** – Sitting still will cause you to freeze faster.\",\n \"🍵 **Drink Warm Liquids** – Hot water or soup helps keep your core temperature stable.\"\n ]\n },\n {\n \"title\": \"Urban Post-Collapse Survival: Staying Alive in a City Gone Dark\",\n \"description\": \"Survive in a city where basic infrastructure has collapsed.\",\n \"category\": \"hardcore\",\n \"completed\": false,\n \"expanded\": false,\n \"level\": \"Unprepared 🚨\",\n \"materials\": [\n \"Scavenged survival supplies\",\n \"Bartering items (food, fuel, medical gear)\",\n \"Self-defense tools\"\n ],\n \"steps\": [\n \"🔎 **Why Urban Survival?** – Cities have resources, but they’re also **dangerous** post-collapse due to looters and lack of clean water.\",\n \"1️⃣ **Find a Safe Shelter** – Avoid **obvious places (grocery stores, hospitals, police stations)** as they attract desperate crowds.\",\n \"2️⃣ **Secure a Water Source** – Rain collection, rooftop condensation, and underground pipes may provide water.\",\n \"3️⃣ **Stay Low-Key** – Do **not** draw attention with **flashlights, noise, or fires** at night.\",\n \"4️⃣ **Gather Barter Items** – People will trade for **water filters, medicine, alcohol, and batteries.**\",\n \"5️⃣ **Avoid Open Conflict** – If confronted, **negotiate or escape** instead of fighting.\",\n \"6️⃣ **Travel Only When Necessary** – Moving during the **early morning or night** reduces encounters with hostile people.\"\n ],\n \"tips\": [\n \"⚠️ **Blend In** – Avoid looking **too clean, too rich, or too prepared**.\",\n \"💰 **Use Skills, Not Just Goods** – Knowing how to **purify water or repair things** is more valuable than just hoarding supplies.\",\n \"🏃 **Have Multiple Escape Routes** – Cities can be **traps**. Always have a **backup plan**.\"\n ]\n }\n ]),\n\n // 📌 Convert Markdown to HTML\n markdownToHTML(text) {\n return marked.parse(text); // Converts Markdown to HTML\n },\n\n // 📊 Individual Readiness Meters (Per Guide Category)\n getCategoryPercentage(categoryName) {\n let categoryGuides = this.guides.filter(guide => guide.category === categoryName);\n let completedCount = categoryGuides.filter(guide => guide.completed).length;\n return categoryGuides.length > 0 ? Math.round((completedCount / categoryGuides.length) * 100) : 0;\n },\n \n getCategoryReadinessLevel(categoryName) {\n const percentage = this.getCategoryPercentage(categoryName);\n if (percentage === 100) return \"Mastery 🏆\";\n if (percentage >= 80) return \"Highly Skilled ⚡\";\n if (percentage >= 60) return \"Competent 🔥\";\n if (percentage >= 40) return \"Beginner 🌱\";\n return \"Unprepared 🚨\";\n },\n \n // 🌎 Global Readiness Meter (Based on ALL Categories)\n get globalReadinessPercentage() {\n let totalPercentage = this.categories\n .filter(c => c.key !== 'all')\n .reduce((sum, category) => sum + this.getCategoryPercentage(category.key), 0);\n return Math.round(totalPercentage / (this.categories.length - 1));\n },\n \n get globalReadinessLevel() {\n const percentage = this.globalReadinessPercentage;\n \n if (percentage === 100) return \"Ultimate Survivalist 🦾\";\n if (percentage >= 95) return \"Legendary Survivalist 🌍\";\n if (percentage >= 80) return \"Elite Prepper ⚔️\";\n if (percentage >= 60) return \"Survivalist 🔥\";\n if (percentage >= 40) return \"Basic Preparedness 🏕\";\n if (percentage >= 20) return \"Survival Novice 🌱\";\n return \"Totally Unprepared 🆘\";\n },\n \n // 🏷️ Filtered Guides\n get filteredGuides() {\n return this.guides.filter(guide =>\n (this.activeCategory === 'all' || guide.category === this.activeCategory) &&\n (guide.title.toLowerCase().includes(this.searchQuery.toLowerCase()) ||\n guide.description.toLowerCase().includes(this.searchQuery.toLowerCase()))\n );\n },\n \n get totalGuides() {\n return this.guides.length;\n },\n \n get completedGuides() {\n return this.guides.filter(guide => guide.completed).length;\n },\n \n get libraryProgress() {\n return Math.round((this.completedGuides / this.totalGuides) * 100) || 0;\n },\n \n toggleGuide(guide) {\n guide.expanded = !guide.expanded;\n },\n \n toggleGuideCompletion(guide) {\n guide.completed = !guide.completed;\n saveStateToLocalStorage(\"guides\", this.guides);\n this.updateProgress();\n },\n \n updateProgress() {\n this.libraryProgress;\n }\n }));\n\n // Emergency Plan Component\n Alpine.data('emergencyPlan', () => ({\n sections: {\n coreIdentity: true,\n scenarios: false,\n goBag: false,\n familyRoles: false,\n petPlan: false,\n drills: false,\n binder: false,\n mindset: false,\n advanced: false,\n },\n plan: loadStateFromLocalStorage('emergencyPlan', {\n coreIdentity: {\n safeWord: '',\n primaryMeetup: '',\n backupMeetup: '',\n contacts: [{ name: '', phone: '', role: '' }],\n familyMembers: [{ name: '', birthday: '', allergies: '', medications: '', bloodType: '' }],\n },\n scenarios: {\n fireEscape: '',\n powerOutage: '',\n medicalEmergency: '',\n intruder: '',\n severeWeather: '',\n evacuation: '',\n civilUnrest: '',\n },\n goBag: [\n { name: 'Water (bottles + filter)', quantity: 1 },\n { name: 'Non-perishable food (3 days)', quantity: 1 },\n { name: 'First aid kit', quantity: 1 },\n { name: 'Whistle', quantity: 1 },\n { name: 'Emergency blanket', quantity: 1 },\n { name: 'Headlamp or flashlight', quantity: 1 },\n { name: 'Extra clothes', quantity: 1 },\n { name: 'Emergency radio', quantity: 1 },\n { name: 'Copies of documents (ID, insurance)', quantity: 1 },\n { name: 'Cash (small bills)', quantity: 1 },\n { name: 'Multi-tool', quantity: 1 },\n { name: 'Charger + power bank', quantity: 1 },\n { name: 'Personal hygiene items', quantity: 1 },\n { name: 'Face masks', quantity: 1 },\n { name: 'Medications', quantity: 1 },\n { name: 'Maps (digital + printed)', quantity: 1 },\n { name: 'Notebook and pen', quantity: 1 },\n ],\n familyRoles: {\n roles: '',\n reconnection: '',\n beaconTools: '',\n },\n petPlan: {\n supplies: [{ name: '', quantity: 1 }],\n vetContacts: [{ name: '', phone: '' }],\n vaccinations: '',\n },\n drills: [{ type: '', date: '', participants: '', notes: '' }],\n binder: {\n contents: '',\n created: false,\n },\n mindset: {\n techniques: '',\n },\n advanced: {\n homeDefense: '',\n ediblePlants: '',\n waterPurification: '',\n offGridComms: '',\n hiddenStash: '',\n primitiveSkills: '',\n },\n }),\n init() {\n // Ensure critical arrays exist\n this.plan.coreIdentity.contacts = Array.isArray(this.plan.coreIdentity.contacts) ? this.plan.coreIdentity.contacts : [{ name: '', phone: '', role: '' }];\n this.plan.coreIdentity.familyMembers = Array.isArray(this.plan.coreIdentity.familyMembers) ? this.plan.coreIdentity.familyMembers : [{ name: '', birthday: '', allergies: '', medications: '', bloodType: '' }];\n this.plan.goBag = Array.isArray(this.plan.goBag) ? this.plan.goBag : [{ name: '', quantity: 1 }];\n this.plan.petPlan.supplies = Array.isArray(this.plan.petPlan.supplies) ? this.plan.petPlan.supplies : [{ name: '', quantity: 1 }];\n this.plan.petPlan.vetContacts = Array.isArray(this.plan.petPlan.vetContacts) ? this.plan.petPlan.vetContacts : [{ name: '', phone: '' }];\n this.plan.drills = Array.isArray(this.plan.drills) ? this.plan.drills : [{ type: '', date: '', participants: '', notes: '' }];\n },\n addContact() {\n if (!Array.isArray(this.plan.coreIdentity.contacts)) {\n this.plan.coreIdentity.contacts = [];\n }\n this.plan.coreIdentity.contacts.push({ name: '', phone: '', role: '' });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removeContact(index) {\n if (Array.isArray(this.plan.coreIdentity.contacts) && this.plan.coreIdentity.contacts.length > 1) {\n this.plan.coreIdentity.contacts.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n addFamilyMember() {\n if (!Array.isArray(this.plan.coreIdentity.familyMembers)) {\n this.plan.coreIdentity.familyMembers = [];\n }\n this.plan.coreIdentity.familyMembers.push({ name: '', birthday: '', allergies: '', medications: '', bloodType: '' });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removeFamilyMember(index) {\n if (Array.isArray(this.plan.coreIdentity.familyMembers) && this.plan.coreIdentity.familyMembers.length > 1) {\n this.plan.coreIdentity.familyMembers.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n addGoBagItem() {\n if (!Array.isArray(this.plan.goBag)) {\n this.plan.goBag = [];\n }\n this.plan.goBag.push({ name: '', quantity: 1 });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removeGoBagItem(index) {\n if (Array.isArray(this.plan.goBag) && this.plan.goBag.length > 1) {\n this.plan.goBag.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n addPetSupply() {\n if (!Array.isArray(this.plan.petPlan.supplies)) {\n this.plan.petPlan.supplies = [];\n }\n this.plan.petPlan.supplies.push({ name: '', quantity: 1 });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removePetSupply(index) {\n if (Array.isArray(this.plan.petPlan.supplies) && this.plan.petPlan.supplies.length > 1) {\n this.plan.petPlan.supplies.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n addVetContact() {\n if (!Array.isArray(this.plan.petPlan.vetContacts)) {\n this.plan.petPlan.vetContacts = [];\n }\n this.plan.petPlan.vetContacts.push({ name: '', phone: '' });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removeVetContact(index) {\n if (Array.isArray(this.plan.petPlan.vetContacts) && this.plan.petPlan.vetContacts.length > 1) {\n this.plan.petPlan.vetContacts.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n addDrill() {\n if (!Array.isArray(this.plan.drills)) {\n this.plan.drills = [];\n }\n this.plan.drills.push({ type: '', date: '', participants: '', notes: '' });\n saveStateToLocalStorage('emergencyPlan', this.plan);\n },\n removeDrill(index) {\n if (Array.isArray(this.plan.drills) && this.plan.drills.length > 1) {\n this.plan.drills.splice(index, 1);\n saveStateToLocalStorage('emergencyPlan', this.plan);\n }\n },\n savePlan() {\n saveStateToLocalStorage('emergencyPlan', this.plan);\n alert('Plan saved successfully!');\n },\n exportPlan() {\n const blob = new Blob([JSON.stringify(this.plan)], { type: 'application/json' });\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = 'emergency-plan.json';\n a.click();\n URL.revokeObjectURL(url);\n },\n exportPlanPDF() {\n if (!window.jspdf) {\n console.error('jsPDF not loaded');\n alert('PDF export failed: jsPDF not loaded');\n return;\n }\n const { jsPDF } = window.jspdf;\n const doc = new jsPDF();\n let y = 10;\n\n const addText = (text, x, y, size, isBold = false) => {\n if (y > 270) {\n doc.addPage();\n y = 10;\n }\n doc.setFontSize(size);\n doc.setFont('helvetica', isBold ? 'bold' : 'normal');\n const lines = doc.splitTextToSize(text, 180);\n doc.text(lines, x, y);\n return y + lines.length * (size / 2);\n };\n\n y = addText('Emergency Preparedness Plan', 10, y, 16, true);\n y += 5;\n y = addText('Core Identity and Safety', 10, y, 12, true);\n y = addText(`Safe Word: ${this.plan.coreIdentity.safeWord || 'Not specified'}`, 15, y, 10);\n y = addText(`Primary Meet-up: ${this.plan.coreIdentity.primaryMeetup || 'Not specified'}`, 15, y, 10);\n y = addText(`Backup Meet-up: ${this.plan.coreIdentity.backupMeetup || 'Not specified'}`, 15, y, 10);\n y = addText('Emergency Contacts:', 15, y, 10, true);\n if (!Array.isArray(this.plan.coreIdentity.contacts) || this.plan.coreIdentity.contacts.every(c => !c.name && !c.phone && !c.role)) {\n y = addText('No contacts specified.', 20, y, 10);\n } else {\n this.plan.coreIdentity.contacts.forEach(c => {\n y = addText(`${c.name || 'Unnamed'}: ${c.phone || 'No phone'} (${c.role || 'No role'})`, 20, y, 10);\n });\n }\n y = addText('Family Members:', 15, y, 10, true);\n if (!Array.isArray(this.plan.coreIdentity.familyMembers) || this.plan.coreIdentity.familyMembers.every(m => !m.name && !m.birthday && !m.allergies && !m.medications && !m.bloodType)) {\n y = addText('No family members specified.', 20, y, 10);\n } else {\n this.plan.coreIdentity.familyMembers.forEach(m => {\n y = addText(`${m.name || 'Unnamed'}: Birthday: ${m.birthday || 'N/A'}, Allergies: ${m.allergies || 'None'}, Medications: ${m.medications || 'None'}, Blood Type: ${m.bloodType || 'N/A'}`, 20, y, 10);\n });\n }\n y += 5;\n y = addText('Scenario-Specific Response Plans', 10, y, 12, true);\n y = addText('Fire Escape Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.fireEscape || 'Not specified', 15, y, 10);\n y = addText('Power Outage Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.powerOutage || 'Not specified', 15, y, 10);\n y = addText('Medical Emergency Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.medicalEmergency || 'Not specified', 15, y, 10);\n y = addText('Home Intruder / Lockdown Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.intruder || 'Not specified', 15, y, 10);\n y = addText('Severe Weather Plans:', 15, y, 10, true);\n y = addText(this.plan.scenarios.severeWeather || 'Not specified', 15, y, 10);\n y = addText('Evacuation Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.evacuation || 'Not specified', 15, y, 10);\n y = addText('Civil Unrest / Martial Law Plan:', 15, y, 10, true);\n y = addText(this.plan.scenarios.civilUnrest || 'Not specified', 15, y, 10);\n y += 5;\n y = addText('Go Bag Checklist', 10, y, 12, true);\n if (!Array.isArray(this.plan.goBag) || this.plan.goBag.every(i => !i.name)) {\n y = addText('No items specified.', 15, y, 10);\n } else {\n this.plan.goBag.forEach(i => {\n y = addText(`${i.name || 'Unnamed'}: ${i.quantity || 0}`, 15, y, 10);\n });\n }\n y += 5;\n y = addText('Family Roles and Communication', 10, y, 12, true);\n y = addText('Roles:', 15, y, 10, true);\n y = addText(this.plan.familyRoles.roles || 'Not specified', 15, y, 10);\n y = addText('Reconnection Plan:', 15, y, 10, true);\n y = addText(this.plan.familyRoles.reconnection || 'Not specified', 15, y, 10);\n y = addText('Beacon Tool Usage:', 15, y, 10, true);\n y = addText(this.plan.familyRoles.beaconTools || 'Not specified', 15, y, 10);\n y += 5;\n y = addText('Pet Emergency Plan', 10, y, 12, true);\n y = addText('Pet Supplies:', 15, y, 10, true);\n if (!Array.isArray(this.plan.petPlan.supplies) || this.plan.petPlan.supplies.every(s => !s.name)) {\n y = addText('No supplies specified.', 20, y, 10);\n } else {\n this.plan.petPlan.supplies.forEach(s => {\n y = addText(`${s.name || 'Unnamed'}: ${s.quantity || 0}`, 20, y, 10);\n });\n }\n y = addText('Vet Contacts:', 15, y, 10, true);\n if (!Array.isArray(this.plan.petPlan.vetContacts) || this.plan.petPlan.vetContacts.every(v => !v.name && !v.phone)) {\n y = addText('No vet contacts specified.', 20, y, 10);\n } else {\n this.plan.petPlan.vetContacts.forEach(v => {\n y = addText(`${v.name || 'Unnamed'}: ${v.phone || 'No phone'}`, 20, y, 10);\n });\n }\n y = addText('Vaccination Records:', 15, y, 10, true);\n y = addText(this.plan.petPlan.vaccinations || 'Not specified', 15, y, 10);\n y += 5;\n y = addText('Drills & Practice Logs', 10, y, 12, true);\n if (!Array.isArray(this.plan.drills) || this.plan.drills.every(d => !d.type && !d.date && !d.participants && !d.notes)) {\n y = addText('No drills specified.', 15, y, 10);\n } else {\n this.plan.drills.forEach(d => {\n y = addText(`${d.type || 'Untitled Drill'} (${d.date || 'No date'}): ${d.participants || 'No participants'}`, 15, y, 10);\n y = addText(`Notes: ${d.notes || 'None'}`, 20, y, 10);\n });\n }\n y += 5;\n y = addText('Emergency Plan Binder/Digital Vault', 10, y, 12, true);\n y = addText(`Contents: ${this.plan.binder.contents || 'Not specified'}`, 15, y, 10);\n y = addText(`Created: ${this.plan.binder.created ? 'Yes' : 'No'}`, 15, y, 10);\n y += 5;\n y = addText('Mindset and Psychological Prep', 10, y, 12, true);\n y = addText(this.plan.mindset.techniques || 'Not specified', 15, y, 10);\n y += 5;\n y = addText('Optional Advanced Items', 10, y, 12, true);\n y = addText('Home Defense Plan:', 15, y, 10, true);\n y = addText(this.plan.advanced.homeDefense || 'Not specified', 15, y, 10);\n y = addText('Edible Plant ID Guide:', 15, y, 10, true);\n y = addText(this.plan.advanced.ediblePlants || 'Not specified', 15, y, 10);\n y = addText('DIY Water Purification:', 15, y, 10, true);\n y = addText(this.plan.advanced.waterPurification || 'Not specified', 15, y, 10);\n y = addText('Off-Grid Communication:', 15, y, 10, true);\n y = addText(this.plan.advanced.offGridComms || 'Not specified', 15, y, 10);\n y = addText('Hidden Stash Locations:', 15, y, 10, true);\n y = addText(this.plan.advanced.hiddenStash || 'Not specified', 15, y, 10);\n y = addText('Primitive Survival Skills:', 15, y, 10, true);\n y = addText(this.plan.advanced.primitiveSkills || 'Not specified', 15, y, 10);\n\n doc.save('emergency-plan.pdf');\n },\n }));\n});",
"logo": "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgY2xhc3M9ImgtNiB3LTYgdGV4dC13aGl0ZSIKICAgZmlsbD0ibm9uZSIKICAgdmlld0JveD0iMCAwIDUxMiA1MTIiCiAgIHN0cm9rZT0iY3VycmVudENvbG9yIgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmcxIgogICB3aWR0aD0iNTEyIgogICBoZWlnaHQ9IjUxMiIKICAgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczEiPgogICAgPGxpbmVhckdyYWRpZW50CiAgICAgICBpZD0ibGluZWFyR3JhZGllbnQxIj4KICAgICAgPHN0b3AKICAgICAgICAgc3R5bGU9InN0b3AtY29sb3I6IzNiODJmNjtzdG9wLW9wYWNpdHk6MTsiCiAgICAgICAgIG9mZnNldD0iMCIKICAgICAgICAgaWQ9InN0b3AxIiAvPgogICAgICA8c3RvcAogICAgICAgICBzdHlsZT0ic3RvcC1jb2xvcjojMWQ0ZWQ4O3N0b3Atb3BhY2l0eToxOyIKICAgICAgICAgb2Zmc2V0PSIxIgogICAgICAgICBpZD0ic3RvcDIiIC8+CiAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPGxpbmVhckdyYWRpZW50CiAgICAgICB4bGluazpocmVmPSIjbGluZWFyR3JhZGllbnQxIgogICAgICAgaWQ9ImxpbmVhckdyYWRpZW50MiIKICAgICAgIHgxPSItMjguMzE2MDAyIgogICAgICAgeTE9Ii0xLjQyNjMxNTEiCiAgICAgICB4Mj0iLTEwLjE1OTE1IgogICAgICAgeTI9IjIxLjc2NTI5NyIKICAgICAgIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIgogICAgICAgZ3JhZGllbnRUcmFuc2Zvcm09Im1hdHJpeCgyNy4zNjIzMTksMCwwLDIxLjUxNTY2OSw3NzkuMTMwNDQsMzcuMTk2NTgpIiAvPgogIDwvZGVmcz4KICA8cmVjdAogICAgIHN0eWxlPSJvcGFjaXR5OjE7ZmlsbDp1cmwoI2xpbmVhckdyYWRpZW50Mik7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjI0LjI2MzU7c3Ryb2tlLWxpbmVjYXA6cm91bmQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1kYXNoYXJyYXk6bm9uZTtwYWludC1vcmRlcjpmaWxsIG1hcmtlcnMgc3Ryb2tlIgogICAgIGlkPSJyZWN0MSIKICAgICB3aWR0aD0iNTEyIgogICAgIGhlaWdodD0iNTEyIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICByeT0iMCIgLz4KICA8cGF0aAogICAgIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIKICAgICBzdHJva2UtbGluZWpvaW49InJvdW5kIgogICAgIHN0cm9rZS13aWR0aD0iMjkuMTA5MyIKICAgICBkPSJtIDI1Mi42MTA2NiwyNDAuOTIwNTMgYyAwLDUxLjE4ODY3IC0xNC42ODU2Myw5OC45NTcwMSAtNDAuMDY4OTQsMTM5LjMwMjQ4IG0gLTUwLjA2Nzk4LC0yOS42OTE0NSAwLjc4NTk0LC0xLjMwOTg3IGEgMjAyLjU0MjQzLDIwMi41NDI0MyAwIDAgMCAzMS4xMzIzOCwtMTA4LjMwMTEgNTguMjE4NTgsNTguMjE4NTggMCAxIDEgMTE2LjQzNzE2LDAgYyAwLDE0LjgwMjA3IC0xLjAxODY2LDI5LjM4NTg0IC0yLjk1NDU4LDQzLjY2Mzk0IG0gLTMwLjgyNjc1LDk5LjYxMTk5IGEgMzE4LjQ1NTYzLDMxOC40NTU2MyAwIDAgMCAyMS43MTU1NCwtNTUuOTQ4MDYgbSA1NS44NzUyNiwxNi40NzU4NyBjIDkuMzg3NzgsLTMyLjk4MDggMTQuNDA5MTEsLTY3LjgxMDA3IDE0LjQwOTExLC0xMDMuODAzNjkgQSAxMTYuNDM3MTUsMTE2LjQzNzE1IDAgMCAwIDE5NC4zOTIwOCwxNDAuMDU2ODQgbSAtNzIuNzczMjMsMTY0LjM4MDE1IGMgOS4zMTQ5OCwtMTkuMTk3NTcgMTQuNTU0NjUsLTQwLjc1MyAxNC41NTQ2NSwtNjMuNTE2NDYgMCwtMjEuMjA2MTIgNS42NzYzMSwtNDEuMDg3NzcgMTUuNTczNDcsLTU4LjIxODU4IgogICAgIGlkPSJwYXRoMSIKICAgICBzdHlsZT0ic3Ryb2tlOiNmY2ZhZmY7c3Ryb2tlLW9wYWNpdHk6MSIgLz4KPC9zdmc+Cg==",
"console": false,
"dark": true,
"previewDark": true,
"module": false,
"autorun": true,
"pwa": true,
"preview": true,
"activePanel": "css",
"columns": false,
"columnsRight": true
}