<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <link rel="icon" type="image/svg+xml" href="/icon.svg">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Primary Meta Tags -->
    <title>AI-Powered Task Manager with Smart Prioritization — Task App</title>
    <meta name="title" content="Task App — Efficiently Organize Projects &amp; Daily Tasks">
    <meta name="description" content="The intuitive task manager that helps you organize projects, track progress with beautiful charts, and hit every deadline. Try it free today.">
    <link rel="canonical" href="https://taskapp.studio/">

    <!-- Open Graph / Facebook / LinkedIn -->
    <meta property="og:type" content="website">
    <meta property="og:locale" content="en_US">
    <meta property="og:url" content="https://taskapp.studio/">
    <meta property="og:title" content="Task App — Organize Projects &amp; Daily Tasks Efficiently">
    <meta property="og:description" content="The intuitive task manager that helps you organize projects, track progress with beautiful charts, and hit every deadline.">
    <meta property="og:image" content="https://taskapp.studio/social-preview.png">
    <meta property="og:site_name" content="Task App">

    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:url" content="https://taskapp.studio/">
    <meta name="twitter:title" content="Task App — Organize Projects &amp; Daily Tasks Efficiently">
    <meta name="twitter:description" content="The intuitive task manager that helps you organize projects, track progress with beautiful charts, and hit every deadline.">
    <meta name="twitter:image" content="https://taskapp.studio/social-preview.png">

    <!-- Additional SEO -->
    <meta name="theme-color" content="#1f1f1f">
    <meta name="robots" content="index, follow">

    <!-- Apple PWA -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="Tasks">
    <link rel="apple-touch-icon" href="/icon.svg">

    <!-- Structured Data -->
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "SoftwareApplication",
        "name": "Task App",
        "url": "https://taskapp.studio/",
        "applicationCategory": "ProductivityApplication",
        "operatingSystem": "Web",
        "browserRequirements": "Requires a modern web browser with JavaScript enabled",
        "description": "AI-powered task manager with a mathematical priority algorithm that weighs importance, urgency, deadline proximity, and task aging to surface exactly what to work on next. Supports location-aware suggestions, visual analytics, recurring tasks, and bring-your-own AI API key.",
        "offers": {
          "@type": "Offer",
          "price": "2.00",
          "priceCurrency": "USD",
          "url": "https://taskapp.studio/",
          "description": "Pro plan billed monthly. Free guest mode available."
        },
        "featureList": [
          "Mathematical priority algorithm (importance × urgency × aging + escalation)",
          "Location-aware smart task suggestions filtered by available time",
          "Bring-your-own API key AI features (OpenAI, Anthropic, Google Gemini, and more)",
          "Visual productivity analytics with completion trends and workload charts",
          "Recurring tasks with flexible scheduling and end-date support",
          "Project organization with drag-and-drop groups",
          "CSV import and export",
          "Guest mode — no signup required",
          "Dark and light theme",
          "Progressive Web App with offline support"
        ]
      }
    </script>

    <!-- Fonts are self-hosted via @fontsource-variable packages, imported in src/index.css -->
    <!-- Analytics and marketing scripts are loaded dynamically after cookie consent -->
    <!-- See src/hooks/useCookieConsent.ts -->
    <script type="module" crossorigin="" src="/assets/index-D1DqzDdn.js"></script>
    <link rel="modulepreload" crossorigin="" href="/assets/vendor-DGOOBDAg.js">
    <link rel="modulepreload" crossorigin="" href="/assets/firebase-BP7WTz-p.js">
    <link rel="modulepreload" crossorigin="" href="/assets/date-fns-BXQYIbOZ.js">
    <link rel="stylesheet" crossorigin="" href="/assets/index-Dq--qlCt.css">
  <link rel="manifest" href="/manifest.webmanifest"><meta name="title" content="AI-Powered Task Manager with Smart Prioritization — Task App" data-rh="true"><meta name="description" content="AI-powered task manager that uses a mathematical priority algorithm to tell you exactly what to work on next. Location-aware suggestions, visual analytics, and BYO API key. Try free as a guest." data-rh="true"><meta property="og:title" content="AI-Powered Task Manager with Smart Prioritization — Task App" data-rh="true"><meta property="og:description" content="AI-powered task manager that uses a mathematical priority algorithm to tell you exactly what to work on next. Location-aware suggestions, visual analytics, and BYO API key. Try free as a guest." data-rh="true"><meta name="twitter:title" content="AI-Powered Task Manager with Smart Prioritization — Task App" data-rh="true"><meta name="twitter:description" content="AI-powered task manager that uses a mathematical priority algorithm to tell you exactly what to work on next. Location-aware suggestions, visual analytics, and BYO API key. Try free as a guest." data-rh="true"></head>
  <body>
    <div id="root"><div class="fixed bottom-0 inset-x-0 z-[100] p-4 md:p-6" role="dialog" aria-label="Cookie consent"><div class="mx-auto max-w-2xl rounded-xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-5 shadow-2xl shadow-black/20"><div class="mb-4"><h3 class="text-base font-semibold text-[hsl(var(--foreground))] mb-1">Cookie Preferences</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">We use cookies to analyze site usage and improve your experience. You can choose which cookies to allow. See our <a class="underline hover:text-[hsl(var(--foreground))]" href="/privacy">Privacy Policy</a> for details.</p></div><div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-2"><button class="rounded-lg px-4 py-2 text-sm font-medium transition-colors bg-[hsl(var(--accent))] text-white hover:bg-[hsl(var(--accent))]/90">Accept All</button><button class="rounded-lg px-4 py-2 text-sm font-medium transition-colors border border-[hsl(var(--border))] text-[hsl(var(--foreground))] hover:bg-[hsl(var(--surface-muted))]">Reject Non-Essential</button><button class="rounded-lg px-4 py-2 text-sm font-medium text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors">Customize</button></div></div></div><div class="min-h-screen bg-[hsl(var(--background))] text-[hsl(var(--foreground))] overflow-x-hidden"><section class="relative flex flex-col items-center justify-center px-4 pt-20 pb-16 text-center"><div class="pointer-events-none absolute inset-0 overflow-hidden"><div class="absolute -top-32 -left-32 h-96 w-96 rounded-full bg-[hsl(var(--primary))] opacity-10 blur-[100px]"></div><div class="absolute -bottom-32 -right-32 h-96 w-96 rounded-full bg-purple-500 opacity-10 blur-[100px]"></div></div><div class="relative z-10 max-w-3xl mx-auto"><div class="mb-6 inline-flex items-center gap-2 rounded-full border border-[hsl(var(--border))] bg-[hsl(var(--card))] px-4 py-1.5 text-sm text-[hsl(var(--muted-foreground))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap h-4 w-4 text-amber-500" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg>AI-Powered Prioritization</div><h1 class="mb-2 text-5xl sm:text-6xl md:text-7xl font-bold tracking-tight leading-tight">Task App</h1><p class="mb-6 text-xl sm:text-2xl font-medium bg-gradient-to-r from-[hsl(var(--primary))] to-purple-500 bg-clip-text text-transparent">Think Less. Do More.</p><p class="mb-8 max-w-2xl mx-auto text-lg text-[hsl(var(--muted-foreground))] leading-relaxed">You need to call back a client, workout, fix the kitchen sink, pay a bill, <em>and</em> schedule a dentist appointment. Let <strong>Task App</strong> prioritize everything for you. Stop holding stuff in your head and focus on what you're doing <em>right now</em>.</p><div class="flex flex-col items-center justify-center gap-4"><button class="inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--accent))] focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none bg-[hsl(var(--accent))] text-white hover:opacity-90 px-4 py-2 text-sm px-8 py-3 text-base shadow-lg shadow-[hsl(var(--primary))]/20 hover:shadow-[hsl(var(--primary))]/30 transition-all gap-2 w-full sm:w-64">Get Started</button><button class="inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--accent))] focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none border border-[hsl(var(--border))] text-[hsl(var(--foreground))] hover:bg-[hsl(var(--surface-muted))] px-4 py-2 text-sm px-8 py-3 text-base shadow-md transition-all gap-2 w-full sm:w-64 font-medium">Continue as Guest</button></div><p class="mt-4 text-xs text-[hsl(var(--muted-foreground))]">*AI features require your own API key (OpenAI, Anthropic, or Gemini)</p><a class="mt-3 inline-block text-sm text-[hsl(var(--primary))] hover:underline" href="/features">See all features →</a></div></section><section class="px-4 py-16 max-w-5xl mx-auto"><h2 class="text-center text-sm font-semibold uppercase tracking-wider text-[hsl(var(--primary))] mb-3">The Psychology of Getting Things Done</h2><p class="text-center text-2xl sm:text-3xl font-bold mb-4">Cognitive Offloading</p><p class="text-center max-w-2xl mx-auto text-[hsl(var(--muted-foreground))] mb-12 leading-relaxed">Your brain is for thinking, not remembering. When you write tasks down, you instantly free up mental bandwidth and reduce anxiety. When you aren't busy remembering, you can focus on <em>doing</em>.</p><div class="grid gap-6 sm:grid-cols-3"><div class="group rounded-xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6 transition-all hover:border-[hsl(var(--primary))]/50 hover:shadow-lg hover:shadow-[hsl(var(--primary))]/5"><div class="mb-4 inline-flex rounded-lg bg-blue-500/10 p-3 text-blue-500"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-brain h-6 w-6" aria-hidden="true"><path d="M12 18V5"></path><path d="M15 13a4.17 4.17 0 0 1-3-4 4.17 4.17 0 0 1-3 4"></path><path d="M17.598 6.5A3 3 0 1 0 12 5a3 3 0 1 0-5.598 1.5"></path><path d="M17.997 5.125a4 4 0 0 1 2.526 5.77"></path><path d="M18 18a4 4 0 0 0 2-7.464"></path><path d="M19.967 17.483A4 4 0 1 1 12 18a4 4 0 1 1-7.967-.517"></path><path d="M6 18a4 4 0 0 1-2-7.464"></path><path d="M6.003 5.125a4 4 0 0 0-2.526 5.77"></path></svg></div><h3 class="mb-2 text-lg font-semibold">Free Your Mind</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Stop carrying a mental inventory of every task. Externalize everything and let your working memory breathe. Less mental clutter means clearer thinking.</p></div><div class="group rounded-xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6 transition-all hover:border-[hsl(var(--primary))]/50 hover:shadow-lg hover:shadow-[hsl(var(--primary))]/5"><div class="mb-4 inline-flex rounded-lg bg-purple-500/10 p-3 text-purple-500"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-target h-6 w-6" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="12" r="6"></circle><circle cx="12" cy="12" r="2"></circle></svg></div><h3 class="mb-2 text-lg font-semibold">Focus on What Matters</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">AI-driven prioritization analyzes urgency, deadlines, and importance so you always know exactly what to work on next — without the mental overhead.</p></div><div class="group rounded-xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6 transition-all hover:border-[hsl(var(--primary))]/50 hover:shadow-lg hover:shadow-[hsl(var(--primary))]/5"><div class="mb-4 inline-flex rounded-lg bg-emerald-500/10 p-3 text-emerald-500"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trending-up h-6 w-6" aria-hidden="true"><path d="M16 7h6v6"></path><path d="m22 7-8.5 8.5-5-5L2 17"></path></svg></div><h3 class="mb-2 text-lg font-semibold">Build Momentum</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Track your progress with visual analytics. See your completion trends, workload balance, and project health at a glance to stay motivated.</p></div></div></section><section class="px-4 py-16 max-w-5xl mx-auto"><h2 class="text-center text-sm font-semibold uppercase tracking-wider text-[hsl(var(--primary))] mb-3">Features</h2><p class="text-center text-2xl sm:text-3xl font-bold mb-12">Everything You Need to Stay on Track</p><div class="grid gap-8 sm:grid-cols-2 lg:grid-cols-3"><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles h-5 w-5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></div><div><h3 class="font-semibold mb-1">AI Task Creation</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Describe your work in natural language and let AI structure it into actionable tasks. (BYO API Key)</p></div></div><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar-clock h-5 w-5" aria-hidden="true"><path d="M16 14v2.2l1.6 1"></path><path d="M16 2v4"></path><path d="M21 7.5V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h3.5"></path><path d="M3 10h5"></path><path d="M8 2v4"></path><circle cx="16" cy="16" r="6"></circle></svg></div><div><h3 class="font-semibold mb-1">Smart Scheduling</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Auto-schedule tasks across your week based on priority, deadlines, and capacity.</p></div></div><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chart-column h-5 w-5" aria-hidden="true"><path d="M3 3v16a2 2 0 0 0 2 2h16"></path><path d="M18 17V9"></path><path d="M13 17V5"></path><path d="M8 17v-3"></path></svg></div><div><h3 class="font-semibold mb-1">Visual Analytics</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Workload breakdown, completion trends, and weekly capacity analysis at a glance.</p></div></div><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-target h-5 w-5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="12" r="6"></circle><circle cx="12" cy="12" r="2"></circle></svg></div><div><h3 class="font-semibold mb-1">Priority Algorithm</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">A configurable scoring system weighs urgency, importance, aging, and deadlines.</p></div></div><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-brain h-5 w-5" aria-hidden="true"><path d="M12 18V5"></path><path d="M15 13a4.17 4.17 0 0 1-3-4 4.17 4.17 0 0 1-3 4"></path><path d="M17.598 6.5A3 3 0 1 0 12 5a3 3 0 1 0-5.598 1.5"></path><path d="M17.997 5.125a4 4 0 0 1 2.526 5.77"></path><path d="M18 18a4 4 0 0 0 2-7.464"></path><path d="M19.967 17.483A4 4 0 1 1 12 18a4 4 0 1 1-7.967-.517"></path><path d="M6 18a4 4 0 0 1-2-7.464"></path><path d="M6.003 5.125a4 4 0 0 0-2.526 5.77"></path></svg></div><div><h3 class="font-semibold mb-1">AI Onboarding</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Tell the AI about your projects and it generates a full task board in seconds. (BYO API Key)</p></div></div><div class="flex gap-4"><div class="mt-1 shrink-0 rounded-lg bg-[hsl(var(--surface-muted))] p-2.5 text-[hsl(var(--primary))]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trending-up h-5 w-5" aria-hidden="true"><path d="M16 7h6v6"></path><path d="m22 7-8.5 8.5-5-5L2 17"></path></svg></div><div><h3 class="font-semibold mb-1">Recurring Tasks</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed">Set up repeating tasks with flexible intervals — daily, weekly, monthly, or custom.</p></div></div></div></section><section class="px-4 py-8 text-center bg-[hsl(var(--surface-muted))] border-y border-[hsl(var(--border))]"><div class="max-w-3xl mx-auto"><h2 class="text-xl font-bold mb-4">Simplicity with a Pro Option</h2><p class="text-[hsl(var(--muted-foreground))] mb-6 leading-relaxed">The <strong>Free</strong> version limits the number of active tasks and projects.<br>Upgrade to <strong>Task App Pro</strong> for unlimited tasks and projects for just <strong>$2/month</strong> (or $12/year), tax included.</p></div></section><section class="px-4 py-16 bg-[hsl(var(--surface-muted))]/50"><div class="mx-auto max-w-4xl rounded-2xl border border-[hsl(var(--primary))]/20 bg-[hsl(var(--card))] p-8 md:p-12 shadow-sm relative overflow-hidden"><div class="absolute top-0 right-0 w-64 h-64 bg-[hsl(var(--primary))] opacity-5 blur-[80px] rounded-full pointer-events-none"></div><h2 class="text-2xl sm:text-3xl font-bold mb-4">Partner with Task App &amp; Earn 50% Recurring Commission!</h2><p class="text-[hsl(var(--muted-foreground))] mb-8 leading-relaxed max-w-2xl">Task App is a great productivity tool for people who love productivity tools. Help your audience get organized and get paid for it!</p><div class="grid sm:grid-cols-2 gap-8 mb-8"><div><h3 class="font-semibold mb-4 text-[hsl(var(--primary))]">Features your audience will love:</h3><ul class="space-y-4"><li class="flex items-start gap-3 text-sm text-[hsl(var(--muted-foreground))]"><span class="text-xl leading-none">🤖</span><span><strong>AI Task Creation:</strong> Turns thoughts into structured projects instantly.</span></li><li class="flex items-start gap-3 text-sm text-[hsl(var(--muted-foreground))]"><span class="text-xl leading-none">📊</span><span><strong>Detailed Visuals:</strong> Workload breakdowns and completion trends at a glance.</span></li><li class="flex items-start gap-3 text-sm text-[hsl(var(--muted-foreground))]"><span class="text-xl leading-none">⚖️</span><span><strong>Priority Algorithm:</strong> Weighs urgency, importance, and deadlines automatically.</span></li></ul></div><div class="bg-[hsl(var(--background))] p-6 rounded-xl border border-[hsl(var(--border))]"><h3 class="font-semibold mb-3">The Details</h3><p class="text-sm text-[hsl(var(--muted-foreground))] leading-relaxed mb-6">Our Pro subscription is highly accessible at just <strong>$2/month</strong> or <strong>$12/year</strong>, making it an easy recommendation. As an affiliate, you'll earn <strong>50% commission</strong> on both the first payment AND all future subscription renewals!</p><button class="inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--accent))] focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none bg-[hsl(var(--accent))] text-white hover:opacity-90 px-4 py-2 text-sm w-full text-base gap-2">Join the Affiliate Program</button></div></div></div></section><section class="px-4 py-16 text-center"><div class="mx-auto max-w-lg rounded-2xl border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-8 shadow-sm"><h2 class="text-2xl font-bold mb-3">Ready to Start?</h2><p class="text-[hsl(var(--muted-foreground))] mb-6">If you love getting nerdy with productivity systems, you will absolutely love Task App.<br><br><span class="italic opacity-80"></span></p><div class="flex flex-col items-center justify-center gap-3"><button class="inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--accent))] focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none bg-[hsl(var(--accent))] text-white hover:opacity-90 px-4 py-2 text-sm px-8 py-3 text-base gap-2 w-full sm:w-64">Sign In / Sign Up</button><button class="inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-[hsl(var(--accent))] focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none border border-[hsl(var(--border))] text-[hsl(var(--foreground))] hover:bg-[hsl(var(--surface-muted))] px-4 py-2 text-sm px-8 py-3 text-base gap-2 w-full sm:w-64 font-medium">Try the App</button></div></div></section><footer class="border-t border-[hsl(var(--border))] px-4 py-6"><div><div class="flex flex-wrap items-center justify-center gap-x-4 gap-y-1 text-xs text-[hsl(var(--muted-foreground))]"><span>© 2026 Task App</span><a class="hover:text-[hsl(var(--foreground))] transition-colors" href="/privacy">Privacy Policy</a><a class="hover:text-[hsl(var(--foreground))] transition-colors" href="/terms">Terms of Service</a><a class="hover:text-[hsl(var(--foreground))] transition-colors" href="/accessibility">Accessibility</a></div></div></footer></div><div class="fixed top-4 md:top-auto md:bottom-6 bottom-auto left-0 right-0 md:left-auto md:right-6 z-[100] flex flex-col items-center md:items-end gap-2 p-4 md:p-0 w-full md:w-auto md:max-w-md pointer-events-none" aria-live="polite"></div></div>
    <script>
      // If the app hasn't mounted after 8s, show a hint (avoids hiding a slow-loading app)
      setTimeout(function () {
        if (
          document.getElementById('root') &&
          !document.querySelector('#root > *:not(#load-hint):not(noscript)')
        ) {
          var hint = document.getElementById('load-hint');
          var textEl = document.getElementById('load-hint-text');
          if (!hint || !textEl) return;
          var origin = window.location.origin || '';
          var isLocal = /^https?:\/\/(localhost|127\.0\.0\.1)(:\d+)?$/i.test(origin);
          if (isLocal) {
            textEl.innerHTML =
              'The app didn\'t load. Open the browser console (F12 → Console) to see any errors, and make sure <code style="background:#eee; padding: 0.2rem 0.5rem;">npm run dev</code> is still running in the terminal.';
          } else if (origin === 'null' || origin.startsWith('file://')) {
            textEl.innerHTML =
              'Task App needs to run from the dev server. In a terminal, run:<br><code style="background:#eee; padding: 0.2rem 0.5rem;">npm run dev</code><br>Then open the <strong>Local</strong> URL shown in the terminal (e.g. <code>http://localhost:5174</code>) in this browser.';
          } else {
            textEl.innerHTML =
              'The app failed to load. This can happen if an update was just released. Please <strong>refresh the page</strong> or clear your browser cache.';
          }
          hint.style.display = 'block';
        }
      }, 8000);
    </script>
  

</body></html>