feat: 完善 MVP-2 演示和进度体验

app/templates/index.html

@@ -1,13 +1,20 @@
 {% extends "base.html" %}
 {% set has_running_tasks = tasks | selectattr("status", "equalto", "running") | list | length > 0 %}
-{% block title %}任务列表 - 热榜评论分析工具{% endblock %}
+{% block title %}热榜评论雷达 - 热榜评论分析工具{% endblock %}
 {% block content %}
-<div class="d-flex justify-content-between align-items-center mb-3">
-  <h1 class="h3 mb-0">任务列表</h1>
-  <button class="btn btn-outline-secondary btn-sm" onclick="window.location.href='/'">手动刷新</button>
-</div>
+<section class="hero-band mb-4">
+  <div class="hero-copy">
+    <p class="eyebrow">Hot Comment Radar</p>
+    <h1>热榜评论雷达</h1>
+    <p>从小红书和抖音热点出发，抓取真实评论，生成 AI 情绪、标签和可导出的分析报告。</p>
+  </div>
+  <div class="hero-actions">
+    <a class="btn btn-light" href="#create-task">创建新任务</a>
+    <a class="btn btn-outline-light" href="#task-history">查看 Demo 数据</a>
+  </div>
+</section>
 
-<section class="card mb-4">
+<section class="card mb-4" id="create-task">
   <div class="card-header">创建抓取任务</div>
   <div class="card-body">
     <div id="form-error" class="alert alert-danger d-none" role="alert"></div>
@@ -43,8 +50,11 @@
   </div>
 </section>
 
-<section class="card">
-  <div class="card-header">历史任务</div>
+<section class="card" id="task-history">
+  <div class="card-header d-flex justify-content-between align-items-center">
+    <span>最近任务与 Demo 数据</span>
+    <button class="btn btn-outline-secondary btn-sm" onclick="window.location.href='/'">手动刷新</button>
+  </div>
   <div class="table-responsive">
     <table class="table table-hover align-middle mb-0">
       <thead>