Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Open Agentic Deep Research</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| .gradient-bg { | |
| background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #1d4ed8 100%); | |
| } | |
| .iframe-container { | |
| transition: all 0.3s ease; | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); | |
| } | |
| .iframe-container:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .nav-link { | |
| position: relative; | |
| } | |
| .nav-link::after { | |
| content: ''; | |
| position: absolute; | |
| width: 0; | |
| height: 2px; | |
| bottom: -2px; | |
| left: 0; | |
| background-color: white; | |
| transition: width 0.3s ease; | |
| } | |
| .nav-link:hover::after { | |
| width: 100%; | |
| } | |
| .mentor-card { | |
| transition: all 0.3s ease; | |
| max-width: 800px; | |
| margin: 0 auto; | |
| } | |
| .mentor-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| /* Slider styles */ | |
| .slider-container { | |
| position: relative; | |
| width: 100%; | |
| overflow: hidden; | |
| } | |
| .slider { | |
| display: flex; | |
| transition: transform 0.5s ease; | |
| } | |
| .slide { | |
| min-width: 100%; | |
| box-sizing: border-box; | |
| } | |
| .slider-nav { | |
| display: flex; | |
| justify-content: center; | |
| margin-top: 20px; | |
| } | |
| .slider-dot { | |
| width: 12px; | |
| height: 12px; | |
| border-radius: 50%; | |
| background-color: #d1d5db; | |
| margin: 0 5px; | |
| cursor: pointer; | |
| transition: background-color 0.3s ease; | |
| } | |
| .slider-dot.active { | |
| background-color: #3b82f6; | |
| } | |
| .slider-arrow { | |
| position: absolute; | |
| top: 50%; | |
| transform: translateY(-50%); | |
| background-color: rgba(255,255,255,0.7); | |
| border-radius: 50%; | |
| width: 40px; | |
| height: 40px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| cursor: pointer; | |
| z-index: 10; | |
| box-shadow: 0 2px 5px rgba(0,0,0,0.2); | |
| } | |
| .slider-arrow.left { | |
| left: 15px; | |
| } | |
| .slider-arrow.right { | |
| right: 15px; | |
| } | |
| /* Mentor details sections */ | |
| .mentor-section { | |
| display: none; | |
| padding: 20px; | |
| background-color: #f8fafc; | |
| border-radius: 8px; | |
| margin-top: 20px; | |
| } | |
| .mentor-section.active { | |
| display: block; | |
| } | |
| .mentor-tabs { | |
| display: flex; | |
| justify-content: center; | |
| margin-bottom: 20px; | |
| flex-wrap: wrap; | |
| } | |
| .mentor-tab { | |
| padding: 10px 20px; | |
| margin: 0 5px; | |
| background-color: #e2e8f0; | |
| border-radius: 8px 8px 0 0; | |
| cursor: pointer; | |
| transition: all 0.3s ease; | |
| } | |
| .mentor-tab:hover { | |
| background-color: #cbd5e1; | |
| } | |
| .mentor-tab.active { | |
| background-color: #3b82f6; | |
| color: white; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 font-sans"> | |
| <!-- Header --> | |
| <header class="gradient-bg text-white"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="flex items-center mb-6 md:mb-0"> | |
| <i class="fas fa-robot text-3xl mr-3"></i> | |
| <h1 class="text-3xl font-bold">Open Agentic Deep Research</h1> | |
| </div> | |
| <nav class="flex space-x-6"> | |
| <a href="#about" class="nav-link">About</a> | |
| <a href="#mentors" class="nav-link">Mentors</a> | |
| <a href="#tools" class="nav-link">Research Tools</a> | |
| <a href="#contact" class="nav-link">Contact</a> | |
| </nav> | |
| </div> | |
| <div class="mt-12 text-center"> | |
| <h2 class="text-4xl font-bold mb-4">Navigating Knowledge with AI Mentors</h2> | |
| <p class="text-xl max-w-3xl mx-auto"> | |
| Specialized browser automation for deep research across academic papers, technical resources, and curated knowledge bases. | |
| </p> | |
| <div class="mt-6 bg-blue-50 p-4 rounded-lg max-w-3xl mx-auto"> | |
| <h3 class="text-lg font-semibold mb-2">Browser Extensions for Navigation and Control</h3> | |
| <p class="text-gray-700"> | |
| For optimal experience, we recommend installing these browser extensions: | |
| </p> | |
| <ul class="list-disc pl-5 mt-2 space-y-1"> | |
| <li><a href="https://github.com/nanobrowser/nanobrowser" class="text-blue-600 hover:underline">Nanobrowser (free)</a> - Lightweight browser optimized for research</li> | |
| <li><a href="https://www.rtrvr.ai/" class="text-blue-600 hover:underline">rtrvr.ai</a> - Advanced page navigation and content extraction</li> | |
| <li><a href="https://convergence.ai/welcome" class="text-blue-600 hover:underline">convergence</a> - Unified interface for multiple research tools</li> | |
| </ul> | |
| </div> | |
| <div class="mt-6 max-w-4xl mx-auto bg-white p-6 rounded-xl shadow-md border border-blue-100"> | |
| <h3 class="text-2xl font-semibold mb-4 text-center text-blue-800">Browser Extensions for Navigation and Control</h3> | |
| <p class="text-gray-600 mb-6 text-center"> | |
| These specialized extensions enhance your research capabilities when using this platform: | |
| </p> | |
| <div class="grid md:grid-cols-3 gap-4"> | |
| <div class="bg-blue-50 p-4 rounded-lg border border-blue-200"> | |
| <a href="https://github.com/nanobrowser/nanobrowser" class="no-underline"> | |
| <h4 class="font-bold text-blue-700 mb-2">Nanobrowser</h4> | |
| <p class="text-gray-600 text-sm"> | |
| Free lightweight browser optimized for research workflows with minimal resource usage and maximum control. | |
| </p> | |
| <div class="mt-3 text-blue-600 text-xs font-medium"> | |
| Key Features: Tab grouping, Session saving, Memory optimization | |
| </div> | |
| </a> | |
| </div> | |
| <div class="bg-blue-50 p-4 rounded-lg border border-blue-200"> | |
| <a href="https://www.rtrvr.ai/" class="no-underline"> | |
| <h4 class="font-bold text-blue-700 mb-2">rtrvr.ai</h4> | |
| <p class="text-gray-600 text-sm"> | |
| AI-powered navigation that understands research intent and extracts relevant content automatically. | |
| </p> | |
| <div class="mt-3 text-blue-600 text-xs font-medium"> | |
| Key Features: Smart extraction, Context-aware navigation, Citation tracing | |
| </div> | |
| </a> | |
| </div> | |
| <div class="bg-blue-50 p-4 rounded-lg border border-blue-200"> | |
| <a href="https://convergence.ai/welcome" class="no-underline"> | |
| <h4 class="font-bold text-blue-700 mb-2">Convergence</h4> | |
| <p class="text-gray-600 text-sm"> | |
| Unified interface for managing multiple research sessions and combining insights across sources. | |
| </p> | |
| <div class="mt-3 text-blue-600 text-xs font-medium"> | |
| Key Features: Session merging, Cross-source analysis, Unified search | |
| </div> | |
| </a> | |
| </div> | |
| </div> | |
| <p class="text-gray-500 text-sm mt-6 text-center"> | |
| Install these extensions to unlock the full potential of your research workflow. | |
| </p> | |
| </div> | |
| <button class="mt-8 bg-white text-blue-800 font-semibold px-6 py-3 rounded-full hover:bg-gray-100 transition duration-300"> | |
| Explore Research Tools | |
| </button> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- About Section --> | |
| <section id="about" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Revolutionizing Research with Agentic AI</h2> | |
| <div class="grid md:grid-cols-1 gap-12 items-center"> | |
| <div class="max-w-3xl mx-auto"> | |
| <h3 class="text-2xl font-semibold mb-4 text-gray-800">Specialized Web Navigation</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Our platform leverages specialized AI agents ("Mentors") that are trained to navigate complex research websites, academic databases, and technical resources with human-like understanding but machine efficiency. | |
| </p> | |
| <p class="text-gray-600 mb-4"> | |
| Unlike traditional search engines, our Mentors understand research context, can follow citation trails, identify key findings, and synthesize information across multiple sources. | |
| </p> | |
| <div class="flex items-center mt-6"> | |
| <div class="bg-blue-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-brain text-blue-600 text-xl"></i> | |
| </div> | |
| <p class="text-gray-700"> | |
| <span class="font-semibold">Context-aware:</span> Understands research questions in depth | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Mentors Section --> | |
| <section id="mentors" class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Meet Your Research Mentors</h2> | |
| <div class="slider-container relative"> | |
| <div class="slider-arrow left" onclick="prevMentorSlide()"> | |
| <i class="fas fa-chevron-left text-gray-700"></i> | |
| </div> | |
| <div class="slider" id="mentor-slider"> | |
| <!-- Mentor 1 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-blue-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-stethoscope text-blue-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Medical Researcher</h3> | |
| <p class="text-gray-500">Evidence-based medical research with clinical application focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To provide scientifically accurate medical information with appropriate clinical context. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-1')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-1')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-1')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-1')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-1" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Peer-reviewed literature analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Treatment differentiation</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Clinical practice contextualization</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Research limitation assessment</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-1" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Medical Researcher operates by analyzing clinical questions with a focus on evidence quality and patient safety. It follows structured frameworks for evaluating treatments, including efficacy evidence, safety profiles, and mechanism of action. | |
| </p> | |
| <p class="text-gray-600"> | |
| It maintains a precise, evidence-based approach using appropriate medical terminology while considering patient-centered outcomes. The researcher balances established medical knowledge with emerging treatments and recognizes the limitations of current research. | |
| </p> | |
| </div> | |
| <div id="background-1" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained across multiple medical domains including clinical medicine, medical research, pharmacology, public health, and epidemiology. It understands the hierarchy of medical evidence and applies systematic review methodologies. | |
| </p> | |
| <p class="text-gray-600"> | |
| The researcher is aware of publication bias and funding influences in medical research, and maintains a critical approach to evaluating clinical evidence. It can assess biological mechanism plausibility and contextualize findings within established clinical practice guidelines. | |
| </p> | |
| </div> | |
| <div id="iframes-1" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">PubMed</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">Cochrane Library</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">UpToDate</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">ClinicalTrials.gov</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames allow the mentor to directly access and interact with evidence-based medical resources while maintaining the security and privacy of your research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 2 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-purple-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-tags text-purple-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Best Price Finder</h3> | |
| <p class="text-gray-500">Comprehensive price comparison with value optimization focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To identify the most cost-effective options with relevant price-quality considerations. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-2')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-2')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-2')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-2')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-2" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-purple-500 mr-2"></i> Multi-channel price comparison</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-purple-500 mr-2"></i> Hidden cost identification</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-purple-500 mr-2"></i> Pricing cycle analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-purple-500 mr-2"></i> Long-term cost assessment</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-2" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Best Price Finder operates by conducting thorough price comparisons across multiple channels, with a structured approach to analyzing base prices, shipping fees, taxes, and additional charges. It evaluates warranty value and return policies as part of the total cost assessment. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses a value-focused approach that's transparent about tradeoffs, with precise numerical comparisons. The finder goes beyond the lowest price point to assess quality differentials, longevity estimates, maintenance costs, and potential resale value to determine true cost-effectiveness. | |
| </p> | |
| </div> | |
| <div id="background-2" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on consumer markets, e-commerce platforms, pricing strategies, and retail patterns. It understands seasonal pricing fluctuations and can identify optimal purchase timing based on historical data. | |
| </p> | |
| <p class="text-gray-600"> | |
| The finder can verify the legitimacy and reliability of sellers, identify discount opportunities, and assess the true value proposition of products beyond their sticker price. It maintains awareness of common pricing tactics and how they affect perceived versus actual value. | |
| </p> | |
| </div> | |
| <div id="iframes-2" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-purple-100 text-purple-800 px-4 py-2 rounded-full">Amazon</span> | |
| <span class="bg-purple-100 text-purple-800 px-4 py-2 rounded-full">PriceTracker</span> | |
| <span class="bg-purple-100 text-purple-800 px-4 py-2 rounded-full">CamelCamelCamel</span> | |
| <span class="bg-purple-100 text-purple-800 px-4 py-2 rounded-full">RetailMeNot</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames allow direct access to price comparison tools and e-commerce platforms while maintaining the security and privacy of your shopping session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 3 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-green-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-bullseye text-green-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Best Product Fit</h3> | |
| <p class="text-gray-500">Personalized product matching with comprehensive need assessment</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To identify optimal products that match specific user requirements and contexts. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-3')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-3')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-3')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-3')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-3" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> User requirement elicitation</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> Feature-need alignment</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> Usage context analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> Compatibility assessment</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-3" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Best Product Fit operates by first conducting a detailed user requirement elicitation to identify must-have and nice-to-have features. It analyzes usage contexts and technical constraints to create a comprehensive requirement profile before searching for matching products. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses a solutions-oriented, empathetic approach that's specific with recommendations. The product matcher conducts comparative analysis of core features, performance metrics, reliability factors, and user experience elements to identify the best fit for specific user needs. | |
| </p> | |
| </div> | |
| <div id="background-3" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on product design principles, user experience factors, compatibility standards, and feature analysis methodologies. It understands how to prioritize critical versus optional features based on specific use cases. | |
| </p> | |
| <p class="text-gray-600"> | |
| The product matcher recognizes subjective preference factors and can assess how well products integrate with existing systems. It maintains awareness of user experience considerations that impact satisfaction beyond technical specifications. | |
| </p> | |
| </div> | |
| <div id="iframes-3" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-green-100 text-green-800 px-4 py-2 rounded-full">ProductReview</span> | |
| <span class="bg-green-100 text-green-800 px-4 py-2 rounded-full">ConsumerReports</span> | |
| <span class="bg-green-100 text-green-800 px-4 py-2 rounded-full">RTINGs</span> | |
| <span class="bg-green-100 text-green-800 px-4 py-2 rounded-full">Wirecutter</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to product review and comparison resources while maintaining the security and privacy of your product research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 4 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-red-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-chart-bar text-red-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Market Analyzer</h3> | |
| <p class="text-gray-500">Data-driven market intelligence with trend anticipation focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To provide actionable insights on market conditions, trends, and competitive landscapes. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-4')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-4')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-4')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-4')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-4" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-red-500 mr-2"></i> Market trend identification</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-red-500 mr-2"></i> Competitive positioning analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-red-500 mr-2"></i> Demographic influence assessment</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-red-500 mr-2"></i> Regulatory impact evaluation</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-4" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Market Analyzer operates by conducting comprehensive market assessments that include market size estimation, growth trajectory analysis, segmentation analysis, and competitive landscape mapping. It evaluates entry barriers, regulatory environments, and technological factors to provide strategic positioning insights. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses an analytical, trend-focused approach that's contextually aware of market dynamics. The analyzer identifies historical patterns, assesses current market states, recognizes leading indicators, and analyzes causal factors to develop prediction scenarios with strategic implications. | |
| </p> | |
| </div> | |
| <div id="background-4" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on market research methodologies, competitive analysis frameworks, consumer behavior patterns, industry structures, and macroeconomic factors. It understands how to apply tools like PESTEL analysis and Porter's Five Forces. | |
| </p> | |
| <p class="text-gray-600"> | |
| The analyzer can identify emerging market trends from data patterns, evaluate supply chain implications, and consider technological disruption factors. It balances quantitative market data with qualitative market signals to provide a comprehensive view of market dynamics. | |
| </p> | |
| </div> | |
| <div id="iframes-4" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-red-100 text-red-800 px-4 py-2 rounded-full">Bloomberg</span> | |
| <span class="bg-red-100 text-red-800 px-4 py-2 rounded-full">Statista</span> | |
| <span class="bg-red-100 text-red-800 px-4 py-2 rounded-full">IBISWorld</span> | |
| <span class="bg-red-100 text-red-800 px-4 py-2 rounded-full">MarketWatch</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to market intelligence resources while maintaining the security and privacy of your market research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 5 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-yellow-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-chart-line text-yellow-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Stock Analyzer</h3> | |
| <p class="text-gray-500">Comprehensive financial analysis with investment orientation</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To assess investment opportunities through rigorous financial and company analysis. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-5')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-5')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-5')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-5')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-5" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-yellow-500 mr-2"></i> Financial statement analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-yellow-500 mr-2"></i> Technical chart pattern recognition</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-yellow-500 mr-2"></i> Management quality assessment</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-yellow-500 mr-2"></i> Risk-return evaluation</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-5" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Stock Analyzer operates by conducting comprehensive stock evaluations that include business model assessment, financial health analysis, competitive positioning review, and growth prospect evaluation. It examines valuation metrics, risk factors, and potential catalysts to determine risk-adjusted potential. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses an analytical approach that balances quantitative and qualitative factors with risk awareness. The analyzer develops market theses by examining macroeconomic contexts, sector trends, company specifics, valuation comparisons, and technical setups to create robust investment frameworks with appropriate risk management considerations. | |
| </p> | |
| </div> | |
| <div id="background-5" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on financial analysis methodologies, company valuation techniques, economic indicators, industry analysis frameworks, and market psychology principles. It understands both fundamental and technical analysis approaches. | |
| </p> | |
| <p class="text-gray-600"> | |
| The analyzer can evaluate financial statements using ratio analysis, assess management quality and strategic direction, and analyze historical performance patterns. It maintains awareness of market sentiment factors and risk-return relationships within specific market contexts. | |
| </p> | |
| </div> | |
| <div id="iframes-5" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-yellow-100 text-yellow-800 px-4 py-2 rounded-full">Yahoo Finance</span> | |
| <span class="bg-yellow-100 text-yellow-800 px-4 py-2 rounded-full">TradingView</span> | |
| <span class="bg-yellow-100 text-yellow-800 px-4 py-2 rounded-full">Morningstar</span> | |
| <span class="bg-yellow-100 text-yellow-800 px-4 py-2 rounded-full">SEC EDGAR</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to financial data and analysis tools while maintaining the security and privacy of your investment research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 6 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-indigo-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-apple-alt text-indigo-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Nutrition Guide</h3> | |
| <p class="text-gray-500">Evidence-based nutritional analysis with practical application focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To provide scientifically sound nutritional guidance adapted to individual contexts. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-6')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-6')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-6')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-6')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-6" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-indigo-500 mr-2"></i> Nutritional science evaluation</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-indigo-500 mr-2"></i> Metabolic variation recognition</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-indigo-500 mr-2"></i> Practical implementation planning</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-indigo-500 mr-2"></i> Nutritional claim assessment</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-6" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Nutrition Guide operates by conducting dietary assessments that analyze nutrient intake, evaluate dietary patterns, identify nutritional gaps and excesses, and highlight improvement opportunities with practical suggestions for sustainable improvement. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses an evidence-based, practical approach that's encouraging while remaining scientifically grounded. The guide evaluates nutrition claims by assessing evidence quality, mechanism plausibility, population relevance, and risk factors to provide evidence-based guidance that can be practically implemented. | |
| </p> | |
| </div> | |
| <div id="background-6" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on nutritional science, metabolism, dietary patterns, food composition, and behavioral nutrition. It distinguishes between established and emerging nutritional science while recognizing individual metabolic variations. | |
| </p> | |
| <p class="text-gray-600"> | |
| The guide balances optimal nutrition with practical implementation considerations, including cultural and preference factors. It critically evaluates nutritional claims, acknowledges psychosocial aspects of eating, and integrates nutrition within a holistic health context. | |
| </p> | |
| </div> | |
| <div id="iframes-6" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-indigo-100 text-indigo-800 px-4 py-2 rounded-full">USDA Database</span> | |
| <span class="bg-indigo-100 text-indigo-800 px-4 py-2 rounded-full">PubMed Nutrition</span> | |
| <span class="bg-indigo-100 text-indigo-800 px-4 py-2 rounded-full">Examine.com</span> | |
| <span class="bg-indigo-100 text-indigo-800 px-4 py-2 rounded-full">Nutrition.gov</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to nutritional databases and research resources while maintaining the security and privacy of your nutrition research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 7 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-pink-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-tools text-pink-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">DIY Project Planner</h3> | |
| <p class="text-gray-500">Comprehensive project planning with practical execution focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To create detailed, achievable project plans with appropriate skill-level considerations. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-7')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-7')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-7')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-7')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-7" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-pink-500 mr-2"></i> Project task decomposition</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-pink-500 mr-2"></i> Skill requirement assessment</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-pink-500 mr-2"></i> Obstacle identification</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-pink-500 mr-2"></i> Resource optimization</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-7" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The DIY Project Planner operates by creating comprehensive project plans that include requirements clarification, scope definition, materials lists, tools inventory, step sequencing, time estimation, risk assessment, and quality checks with a focus on achievable execution. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses a practical, step-oriented approach that's supportive with skill-appropriate guidance. The planner provides technique instruction by identifying prerequisite skills, explaining setup preparation, demonstrating techniques, highlighting common errors, offering troubleshooting advice, and suggesting practice approaches for skill development. | |
| </p> | |
| </div> | |
| <div id="background-7" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on project planning methodologies, materials science, tool usage techniques, construction methods, and safety protocols. It understands how to break complex projects into manageable steps and assess skill requirements realistically. | |
| </p> | |
| <p class="text-gray-600"> | |
| The planner can identify potential obstacles and failure points, provide detailed material and tool specifications, and suggest alternatives for specialized equipment. It incorporates safety considerations throughout while balancing quality outcomes with resource constraints. | |
| </p> | |
| </div> | |
| <div id="iframes-7" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-pink-100 text-pink-800 px-4 py-2 rounded-full">Instructables</span> | |
| <span class="bg-pink-100 text-pink-800 px-4 py-2 rounded-full">Home Depot</span> | |
| <span class="bg-pink-100 text-pink-800 px-4 py-2 rounded-full">DIY Network</span> | |
| <span class="bg-pink-100 text-pink-800 px-4 py-2 rounded-full">MakerShed</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to DIY project resources and materials databases while maintaining the security and privacy of your project planning session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 8 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-teal-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-lightbulb text-teal-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Problem Solver</h3> | |
| <p class="text-gray-500">Structured problem analysis with solution development focus</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To identify root causes and develop effective solutions to complex problems. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-8')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-8')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-8')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-8')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-8" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-teal-500 mr-2"></i> Systematic framework application</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-teal-500 mr-2"></i> Root cause identification</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-teal-500 mr-2"></i> Solution pathway development</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-teal-500 mr-2"></i> Implementation feasibility analysis</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-8" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Problem Solver operates by conducting thorough problem diagnoses that include problem definition, symptom mapping, causal analysis, system interactions assessment, constraint identification, impact evaluation, and priority determination with a focus on identifying root causes. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses an analytical, solution-focused approach that clearly articulates cause-effect relationships. The solver develops solutions by defining requirements, generating options, assessing feasibility, evaluating resources, planning implementation, anticipating resistance, and establishing success metrics to ensure implementable effectiveness. | |
| </p> | |
| </div> | |
| <div id="background-8" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on problem analysis methodologies, systems thinking approaches, decision theory, implementation science, and change management principles. It applies systematic problem-solving frameworks to distinguish symptoms from underlying causes. | |
| </p> | |
| <p class="text-gray-600"> | |
| The solver considers multiple solution pathways and evaluates potential unintended consequences of each. It adapts solutions to resource constraints, incorporates implementation feasibility considerations, and balances short-term fixes with sustainable long-term solutions. | |
| </p> | |
| </div> | |
| <div id="iframes-8" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-teal-100 text-teal-800 px-4 py-2 rounded-full">MindTools</span> | |
| <span class="bg-teal-100 text-teal-800 px-4 py-2 rounded-full">ASQ</span> | |
| <span class="bg-teal-100 text-teal-800 px-4 py-2 rounded-full">HBR</span> | |
| <span class="bg-teal-100 text-teal-800 px-4 py-2 rounded-full">McKinsey Insights</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to problem-solving frameworks and methodologies while maintaining the security and privacy of your problem-solving session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 9 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-gray-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-graduation-cap text-gray-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Academic Scholar</h3> | |
| <p class="text-gray-500">Deep academic research with rigorous academic standards and paper analysis</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To provide comprehensive academic analysis with proper citations and methodological critique. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-9')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-9')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-9')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-9')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-9" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-gray-500 mr-2"></i> Peer-reviewed literature analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-gray-500 mr-2"></i> Methodological assessment</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-gray-500 mr-2"></i> Statistical findings interpretation</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-gray-500 mr-2"></i> Research gap identification</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-9" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Academic Scholar operates by conducting thorough paper analyses that include summary, methodology review, findings assessment, limitations evaluation, and implications discussion with a focus on methodological rigor. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses a measured, analytical approach that's precise with careful qualification of claims. The scholar performs comprehensive literature reviews by providing field overviews, identifying key papers, analyzing research trends, and highlighting gaps in the existing literature. | |
| </p> | |
| </div> | |
| <div id="background-9" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on academic research methodologies, critical analysis techniques, and scholarly communication standards. It understands the structure and expectations of academic writing across disciplines. | |
| </p> | |
| <p class="text-gray-600"> | |
| The scholar is well-versed in research design principles, statistical analysis methods, and academic citation styles (particularly APA). It can evaluate the validity and reliability of research findings and place them within the broader context of academic discourse. | |
| </p> | |
| </div> | |
| <div id="iframes-9" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-gray-100 text-gray-800 px-4 py-2 rounded-full">Google Scholar</span> | |
| <span class="bg-gray-100 text-gray-800 px-4 py-2 rounded-full">JSTOR</span> | |
| <span class="bg-gray-100 text-gray-800 px-4 py-2 rounded-full">Web of Science</span> | |
| <span class="bg-gray-100 text-gray-800 px-4 py-2 rounded-full">Academia.edu</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to academic databases and scholarly resources while maintaining the security and privacy of your academic research session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 10 --> | |
| <div class="slide px-4"> | |
| <div class="mentor-card bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex flex-col md:flex-row items-center mb-6"> | |
| <div class="bg-blue-100 p-4 rounded-full mr-6 mb-4 md:mb-0"> | |
| <i class="fas fa-rocket text-blue-600 text-3xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold">Business Development Strategist</h3> | |
| <p class="text-gray-500">Market-oriented growth analysis with actionable frameworks</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 mb-6 text-lg"> | |
| To identify market opportunities and develop strategic growth plans. | |
| </p> | |
| <!-- Mentor tabs --> | |
| <div class="mentor-tabs"> | |
| <div class="mentor-tab active" onclick="showMentorTab(this, 'info-10')">Information</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'operation-10')">Operation</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'background-10')">Background</div> | |
| <div class="mentor-tab" onclick="showMentorTab(this, 'iframes-10')">iFrames</div> | |
| </div> | |
| <!-- Mentor details sections --> | |
| <div id="info-10" class="mentor-section active"> | |
| <div class="mb-6"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Specialized Skills:</h4> | |
| <ul class="grid grid-cols-1 md:grid-cols-2 gap-2"> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Market opportunity identification</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Growth strategy development</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Competitive landscape analysis</li> | |
| <li class="flex items-center"><i class="fas fa-check-circle text-blue-500 mr-2"></i> Implementation roadmapping</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="operation-10" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">How It Operates:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| The Business Development Strategist operates by analyzing market opportunities through assessment of market size, growth trends, competitive landscape, entry barriers, and execution requirements with a focus on developing actionable strategies. | |
| </p> | |
| <p class="text-gray-600"> | |
| It uses a visionary yet practical approach that's market-focused with implementation awareness. The strategist develops growth strategies by evaluating current position, identifying opportunity spaces, assessing capabilities, determining resource requirements, and creating implementation roadmaps. | |
| </p> | |
| </div> | |
| <div id="background-10" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">Background Knowledge:</h4> | |
| <p class="text-gray-600 mb-4"> | |
| This mentor has been trained on market analysis frameworks, growth strategy methodologies, and competitive analysis techniques. It understands business models, market dynamics, and strategic planning processes. | |
| </p> | |
| <p class="text-gray-600"> | |
| The strategist balances innovation with execution capabilities, identifying practical market opportunities through research synthesis. It can evaluate market potential, assess competitive advantages, and develop actionable growth plans with clear implementation steps. | |
| </p> | |
| </div> | |
| <div id="iframes-10" class="mentor-section"> | |
| <h4 class="font-semibold text-gray-800 mb-3">iFrames Used:</h4> | |
| <div class="flex flex-wrap gap-3"> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">Crunchbase</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">CB Insights</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">Statista</span> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full">Harvard Business Review</span> | |
| </div> | |
| <p class="text-gray-600 mt-4"> | |
| These iFrames provide direct access to business intelligence resources and market research databases while maintaining the security and privacy of your strategic planning session. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="slider-arrow right" onclick="nextMentorSlide()"> | |
| <i class="fas fa-chevron-right text-gray-700"></i> | |
| </div> | |
| <div class="slider-nav" id="mentor-nav"> | |
| <div class="slider-dot active" onclick="goToMentorSlide(0)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(1)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(2)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(3)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(4)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(5)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(6)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(7)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(8)"></div> | |
| <div class="slider-dot" onclick="goToMentorSlide(9)"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Research Tools Section --> | |
| <section id="tools" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Specialized Research Tools</h2> | |
| <div class="slider-container relative mb-12"> | |
| <div class="slider-arrow left" onclick="prevToolSlide()"> | |
| <i class="fas fa-chevron-left text-gray-700"></i> | |
| </div> | |
| <div class="slider" id="tool-slider"> | |
| <!-- Slide 1 --> | |
| <div class="slide"> | |
| <h3 class="text-2xl font-semibold mb-6 text-gray-800">OpenRouter Interface</h3> | |
| <p class="text-gray-600 mb-6 max-w-4xl"> | |
| Our OpenRouter interface provides seamless access to multiple AI models, allowing researchers to compare outputs and select the most appropriate model for their specific research needs. The interface understands academic queries and can reformulate them for optimal results across different AI systems. | |
| </p> | |
| <div class="iframe-container bg-gray-100 p-4 rounded-xl"> | |
| <iframe src="https://leon4gr45-openrouter.hf.space" frameborder="0" width="100%" height="600"></iframe> | |
| </div> | |
| </div> | |
| <!-- Slide 2 --> | |
| <div class="slide"> | |
| <h3 class="text-2xl font-semibold mb-6 text-gray-800">arXiv Deep Research Agent</h3> | |
| <p class="text-gray-600 mb-6 max-w-4xl"> | |
| Our specialized arXiv agent goes beyond simple search. It can trace citation networks, identify key papers in a field, summarize technical content at varying levels of detail, and even suggest related papers you might have missed. The agent understands mathematical notation and technical jargon specific to each discipline. | |
| </p> | |
| <div class="iframe-container bg-gray-100 p-4 rounded-xl"> | |
| <iframe src="https://leon4gr45-deep-research-arxivx.hf.space" frameborder="0" width="100%" height="600"></iframe> | |
| </div> | |
| </div> | |
| <!-- Slide 3 --> | |
| <div class="slide"> | |
| <h3 class="text-2xl font-semibold mb-6 text-gray-800">Golden Browser</h3> | |
| <p class="text-gray-600 mb-6 max-w-4xl"> | |
| The Golden Browser represents our most advanced research interface, combining multiple specialized agents into a unified workflow. It can simultaneously search academic databases, technical resources, and curated knowledge bases while maintaining context across all sources. The browser remembers your research trajectory and can suggest new directions based on your reading patterns. | |
| </p> | |
| <div class="iframe-container bg-gray-100 p-4 rounded-xl"> | |
| <iframe src="https://bahaa78-golden-browser.static.hf.space" frameborder="0" width="100%" height="600"></iframe> | |
| </div> | |
| </div> | |
| <!-- Slide 4 --> | |
| <div class="slide"> | |
| <h3 class="text-2xl font-semibold mb-6 text-gray-800">WebUI Docker Interface</h3> | |
| <p class="text-gray-600 mb-6 max-w-4xl"> | |
| Our WebUI Docker interface provides a flexible environment for running custom research workflows. It allows researchers to containerize their analysis pipelines and share reproducible research environments with collaborators. | |
| </p> | |
| <div class="iframe-container bg-gray-100 p-4 rounded-xl"> | |
| <iframe src="https://leon4gr45-webui-docker.hf.space" frameborder="0" width="100%" height="600"></iframe> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="slider-arrow right" onclick="nextToolSlide()"> | |
| <i class="fas fa-chevron-right text-gray-700"></i> | |
| </div> | |
| <div class="slider-nav" id="tool-nav"> | |
| <div class="slider-dot active" onclick="goToToolSlide(0)"></div> | |
| <div class="slider-dot" onclick="goToToolSlide(1)"></div> | |
| <div class="slider-dot" onclick="goToToolSlide(2)"></div> | |
| <div class="slider-dot" onclick="goToToolSlide(3)"></div> | |
| </div> | |
| <div class="flex justify-center mt-4"> | |
| <button id="duplicate-carousel-btn" class="bg-blue-600 text-white p-2 rounded-full hover:bg-blue-700 transition duration-300"> | |
| <i class="fas fa-plus"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <script> | |
| // Duplicate iframe carousel functionality | |
| const maxCarousels = 5; | |
| let currentCarousels = 1; | |
| const duplicateBtn = document.getElementById('duplicate-carousel-btn'); | |
| duplicateBtn.addEventListener('click', () => { | |
| if (currentCarousels >= maxCarousels) { | |
| alert('You reached the capacity limit for iframes running simultaneously.'); | |
| return; | |
| } | |
| const toolsSection = document.getElementById('tools'); | |
| const originalCarousel = document.querySelector('.slider-container'); | |
| const clonedCarousel = originalCarousel.cloneNode(true); | |
| // Reset cloned carousel state | |
| const clonedSlider = clonedCarousel.querySelector('.slider'); | |
| clonedSlider.style.transform = 'translateX(0)'; | |
| const clonedDots = clonedCarousel.querySelectorAll('.slider-dot'); | |
| clonedDots.forEach(dot => dot.classList.remove('active')); | |
| clonedDots[0].classList.add('active'); | |
| toolsSection.insertBefore(clonedCarousel, originalCarousel.nextSibling); | |
| currentCarousels++; | |
| // Reinitialize event listeners for the cloned carousel | |
| initCarousel(clonedCarousel); | |
| }); | |
| function initCarousel(carouselElement) { | |
| let currentSlide = 0; | |
| const slides = carouselElement.querySelectorAll('.slide'); | |
| const dots = carouselElement.querySelectorAll('.slider-dot'); | |
| const slider = carouselElement.querySelector('.slider'); | |
| function updateSlider() { | |
| slider.style.transform = `translateX(-${currentSlide * 100}%)`; | |
| dots.forEach((dot, index) => { | |
| dot.classList.toggle('active', index === currentSlide); | |
| }); | |
| } | |
| carouselElement.querySelector('.slider-arrow.left').onclick = () => { | |
| currentSlide = (currentSlide - 1 + slides.length) % slides.length; | |
| updateSlider(); | |
| }; | |
| carouselElement.querySelector('.slider-arrow.right').onclick = () => { | |
| currentSlide = (currentSlide + 1) % slides.length; | |
| updateSlider(); | |
| }; | |
| dots.forEach((dot, index) => { | |
| dot.onclick = () => { | |
| currentSlide = index; | |
| updateSlider(); | |
| }; | |
| }); | |
| } | |
| </script> | |
| <!-- Features Section --> | |
| <section class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Advanced Research Capabilities</h2> | |
| <div class="grid md:grid-cols-3 gap-8"> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="text-blue-600 text-3xl mb-4"> | |
| <i class="fas fa-project-diagram"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Citation Network Analysis</h3> | |
| <p class="text-gray-600"> | |
| Visualize and navigate complex citation networks to understand the development of ideas in your field. | |
| </p> | |
| </div> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="text-purple-600 text-3xl mb-4"> | |
| <i class="fas fa-language"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Technical Language Understanding</h3> | |
| <p class="text-gray-600"> | |
| Our agents comprehend discipline-specific terminology and notation, from mathematics to biochemistry. | |
| </p> | |
| </div> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="text-green-600 text-3xl mb-4"> | |
| <i class="fas fa-sync-alt"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Continuous Learning</h3> | |
| <p class="text-gray-600"> | |
| The system learns from your research patterns to suggest increasingly relevant materials over time. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section id="contact" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4 max-w-4xl"> | |
| <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Join Our Research Community</h2> | |
| <div class="bg-gray-50 p-8 rounded-xl shadow-md"> | |
| <form> | |
| <div class="grid md:grid-cols-2 gap-6"> | |
| <div> | |
| <label for="name" class="block text-gray-700 font-medium mb-2">Name</label> | |
| <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| </div> | |
| <div> | |
| <label for="email" class="block text-gray-700 font-medium mb-2">Email</label> | |
| <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| </div> | |
| </div> | |
| <div class="mt-6"> | |
| <label for="message" class="block text-gray-700 font-medium mb-2">Research Interests</label> | |
| <textarea id="message" rows="4" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"></textarea> | |
| </div> | |
| <button type="submit" class="mt-8 w-full bg-blue-600 text-white font-semibold px-6 py-3 rounded-lg hover:bg-blue-700 transition duration-300"> | |
| Get Research Access | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="gradient-bg text-white py-12"> | |
| <div class="container mx-auto px-4"> | |
| <div class="grid md:grid-cols-4 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4">Open Agentic Deep Research</h3> | |
| <p class="text-blue-100"> | |
| Advanced AI-powered research tools for academics, scientists, and knowledge workers. | |
| </p> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-4">Resources</h4> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-blue-100 hover:text-white">Documentation</a></li> | |
| <li><a href="#" class="text-blue-100 hover:text-white">Research Papers</a></li> | |
| <li><a href="#" class="text-blue-100 hover:text-white">API Reference</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-4">Community</h4> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-blue-100 hover:text-white">Forum</a></li> | |
| <li><a href="#" class="text-blue-100 hover:text-white">GitHub</a></li> | |
| <li><a href="#" class="text-blue-100 hover:text-white">Slack</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-4">Connect</h4> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="text-blue-100 hover:text-white text-xl"><i class="fab fa-twitter"></i></a> | |
| <a href="#" class="text-blue-100 hover:text-white text-xl"><i class="fab fa-github"></i></a> | |
| <a href="#" class="text-blue-100 hover:text-white text-xl"><i class="fab fa-linkedin"></i></a> | |
| <a href="#" class="text-blue-100 hover:text-white text-xl"><i class="fab fa-discord"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="border-t border-blue-400 mt-12 pt-8 text-center text-blue-100"> | |
| <p>© 2023 Open Agentic Deep Research. All rights reserved.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| // Mentor Slider | |
| let mentorCurrentSlide = 0; | |
| const mentorSlides = document.querySelectorAll('#mentor-slider .slide'); | |
| const mentorDots = document.querySelectorAll('#mentor-nav .slider-dot'); | |
| function updateMentorSlider() { | |
| const mentorSlider = document.getElementById('mentor-slider'); | |
| mentorSlider.style.transform = `translateX(-${mentorCurrentSlide * 100}%)`; | |
| mentorDots.forEach((dot, index) => { | |
| dot.classList.toggle('active', index === mentorCurrentSlide); | |
| }); | |
| } | |
| function nextMentorSlide() { | |
| mentorCurrentSlide = (mentorCurrentSlide + 1) % mentorSlides.length; | |
| updateMentorSlider(); | |
| } | |
| function prevMentorSlide() { | |
| mentorCurrentSlide = (mentorCurrentSlide - 1 + mentorSlides.length) % mentorSlides.length; | |
| updateMentorSlider(); | |
| } | |
| function goToMentorSlide(index) { | |
| mentorCurrentSlide = index; | |
| updateMentorSlider(); | |
| } | |
| // Tool Slider | |
| let toolCurrentSlide = 0; | |
| const toolSlides = document.querySelectorAll('#tool-slider .slide'); | |
| const toolDots = document.querySelectorAll('#tool-nav .slider-dot'); | |
| function updateToolSlider() { | |
| const toolSlider = document.getElementById('tool-slider'); | |
| toolSlider.style.transform = `translateX(-${toolCurrentSlide * 100}%)`; | |
| toolDots.forEach((dot, index) => { | |
| dot.classList.toggle('active', index === toolCurrentSlide); | |
| }); | |
| } | |
| function nextToolSlide() { | |
| toolCurrentSlide = (toolCurrentSlide + 1) % toolSlides.length; | |
| updateToolSlider(); | |
| } | |
| function prevToolSlide() { | |
| toolCurrentSlide = (toolCurrentSlide - 1 + toolSlides.length) % toolSlides.length; | |
| updateToolSlider(); | |
| } | |
| function goToToolSlide(index) { | |
| toolCurrentSlide = index; | |
| updateToolSlider(); | |
| } | |
| // Mentor tab switching | |
| function showMentorTab(tabElement, sectionId) { | |
| // Get all tabs and sections for the current mentor | |
| const mentorCard = tabElement.closest('.mentor-card'); | |
| const allTabs = mentorCard.querySelectorAll('.mentor-tab'); | |
| const allSections = mentorCard.querySelectorAll('.mentor-section'); | |
| // Remove active class from all tabs and sections | |
| allTabs.forEach(tab => tab.classList.remove('active')); | |
| allSections.forEach(section => section.classList.remove('active')); | |
| // Add active class to clicked tab and corresponding section | |
| tabElement.classList.add('active'); | |
| document.getElementById(sectionId).classList.add('active'); | |
| } | |
| // Initialize sliders | |
| updateMentorSlider(); | |
| updateToolSlider(); | |
| // Manual navigation only - auto-advance disabled | |
| // setInterval(() => { | |
| // nextMentorSlide(); | |
| // }, 5000); | |
| // Duplicate carousel functionality | |
| const toolSliderContainer = document.querySelector('.slider-container'); | |
| let carouselCount = 1; | |
| document.getElementById('duplicate-carousel-btn').addEventListener('click', () => { | |
| if (carouselCount >= 5) { | |
| alert('You reached the capacity limit for iframes running simultaneously.'); | |
| return; | |
| } | |
| const clone = toolSliderContainer.cloneNode(true); | |
| clone.id = `tool-slider-${carouselCount}`; | |
| toolSliderContainer.parentNode.insertBefore(clone, toolSliderContainer.nextSibling); | |
| // Update the cloned slider's navigation to work with the new instance | |
| const navDots = clone.querySelectorAll('.slider-dot'); | |
| navDots.forEach((dot, index) => { | |
| dot.onclick = () => { | |
| const slider = clone.querySelector('.slider'); | |
| slider.style.transform = `translateX(-${index * 100}%)`; | |
| navDots.forEach(d => d.classList.remove('active')); | |
| dot.classList.add('active'); | |
| }; | |
| }); | |
| carouselCount++; | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Leon4gr45/openagenticresearch" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> | |