feat(brand): update CSG logo and site title

放宽同一出口 IP 5 分钟内可发送的验证码次数，避免办公网 / 校园网 / NAT
下多个真实用户互相挤掉配额。单手机号 60s 限频不变。

注意：当前 REDIS_URL 未配置，限流走进程内 Map，多副本部署时该阈值
按 pod 各自计数，实际放大为 N × 100。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

.dockerignore

@@ -0,0 +1,21 @@
+.git
+.gitignore
+.next
+node_modules
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+.env.local
+.env.*.local
+!.env.example
+.DS_Store
+*.pem
+coverage
+.vercel
+docs
+README.md
+.dockerignore
+Dockerfile
+k8s
+.gitea

.env

@@ -0,0 +1,3 @@
+# Prisma CLI 默认读这个文件 (Next.js 也会读, .env.local 优先级更高)
+# 该文件已 .gitignore, 不会进仓库
+DATABASE_URL=mysql://zyc:Zyc188208@mysql-8351f937d637-public.rds.volces.com:3306/cyberstar?charset=utf8mb4

.env.example

@@ -19,7 +19,7 @@ TOS_REGION="cn-beijing"
 TOS_BUCKET="cyber-star"
 TOS_ACCESS_KEY="CHANGE_ME"
 TOS_SECRET_KEY="CHANGE_ME"
-NEXT_PUBLIC_TOS_DOMAIN="https://cyber-star.tos-cn-beijing.volces.com"
+NEXT_PUBLIC_TOS_DOMAIN="https://cyber-star.tos-cn-shanghai.volces.com"
 
 # ── Auth.js 鉴权 ──
 # 用 `openssl rand -base64 32` 生成

.env.local

@@ -0,0 +1,14 @@
+# 本地开发环境变量（已被 .gitignore 忽略）
+AUTH_SECRET=9GhMXqoAASnh9qySSrkuZ14Cdi2BbyMPNwZeF3OSL/4=
+AUTH_URL=http://localhost:3000
+AUTH_TRUST_HOST=true
+
+# 火山 TOS 静态资源前缀（不含末尾斜杠）
+NEXT_PUBLIC_TOS_DOMAIN=https://cyber-star.tos-cn-shanghai.volces.com
+
+# 阿里云短信（dysmsapi.aliyuncs.com）
+SMS_SIGN_NAME=广州气元科技
+SMS_TEMPLATE_CODE=SMS_506210397
+SMS_ACCESS_KEY=LTAI5t7jGzFH4ExkJ9TSmQyd
+SMS_SECRET_KEY=u0d3OyTWe9BjnNjK81bvEElky4xcHk
+

.env.production

@@ -0,0 +1,23 @@
+# =============================================================
+# CYBER STAR · 生产环境变量
+# 仅在 NODE_ENV=production 时被 Next.js 加载 (部署容器里)
+# 本机开发请用 .env.local 覆盖
+# =============================================================
+
+# ── 数据库 · 火山 RDS VPC 内网 (从 K8s Pod 访问) ──
+DATABASE_URL=mysql://zyc:Zyc188208@mysql8351f937d637.rds.ivolces.com:3306/cyberstar?charset=utf8mb4
+
+# ── Auth.js JWT 签名密钥 ──
+# 用 `openssl rand -base64 32` 重新生成 (不要复用本机 .env.local 那把)
+AUTH_SECRET=eI6svHTg/Uj2EfyP5r0Dt0DbpJDhiX26lRqkC+EylUM=
+AUTH_URL=https://cyberstar.airlabs.art
+AUTH_TRUST_HOST=true
+
+# ── 火山 TOS 静态资源前缀 (build 时需要,因为 NEXT_PUBLIC_* 会被烧进 client bundle) ──
+NEXT_PUBLIC_TOS_DOMAIN=https://cyber-star.tos-cn-shanghai.volces.com
+
+# ── 阿里云短信 ──
+SMS_SIGN_NAME=广州气元科技
+SMS_TEMPLATE_CODE=SMS_506210397
+SMS_ACCESS_KEY=LTAI5t7jGzFH4ExkJ9TSmQyd
+SMS_SECRET_KEY=u0d3OyTWe9BjnNjK81bvEElky4xcHk

.gitea/workflows/deploy.yaml

@@ -0,0 +1,180 @@
+name: Build and Deploy
+
+on:
+  push:
+    branches:
+      - main
+      - airlabs
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        run: |
+          git clone --depth=1 --branch=${{ github.ref_name }} https://gitea.airlabs.art/${{ github.repository }}.git .
+
+      - name: Set environment by branch
+        run: |
+          SHORT_SHA=$(echo "${{ github.sha }}" | cut -c1-7)
+          BUILD_DATE=$(date +%Y%m%d)
+
+          echo "IMAGE_TAG=internal-${BUILD_DATE}-${SHORT_SHA}" >> $GITHUB_ENV
+          echo "CR_SERVER_ACTIVE=${{ secrets.CR_SERVER }}" >> $GITHUB_ENV
+          echo "CR_USERNAME_ACTIVE=${{ secrets.CR_USERNAME }}" >> $GITHUB_ENV
+          echo "CR_PASSWORD_ACTIVE=${{ secrets.CR_PASSWORD }}" >> $GITHUB_ENV
+          echo "CR_ORG=internal" >> $GITHUB_ENV
+          echo "DEPLOY_ENV=internal" >> $GITHUB_ENV
+          echo "DOMAIN_WEB=cyberstar.airlabs.art" >> $GITHUB_ENV
+
+      - name: Login to Volcano Engine CR
+        run: |
+          echo "${{ env.CR_PASSWORD_ACTIVE }}" | docker login --username "${{ env.CR_USERNAME_ACTIVE }}" --password-stdin ${{ env.CR_SERVER_ACTIVE }}
+
+      - name: Build and Push Web
+        id: build_web
+        run: |
+          set -o pipefail
+          for attempt in 1 2 3; do
+            echo "Build web attempt $attempt/3..."
+            DOCKER_BUILDKIT=0 docker build \
+              --build-arg NEXT_PUBLIC_TOS_DOMAIN=https://cyber-star.tos-cn-shanghai.volces.com \
+              --tag ${{ env.CR_SERVER_ACTIVE }}/${{ env.CR_ORG }}/cyberstar-web:${{ env.IMAGE_TAG }} \
+              --tag ${{ env.CR_SERVER_ACTIVE }}/${{ env.CR_ORG }}/cyberstar-web:latest \
+              . 2>&1 | tee /tmp/build.log && break
+            echo "Attempt $attempt failed, retrying in 10s..." && sleep 10
+          done
+          for attempt in 1 2 3; do
+            docker push ${{ env.CR_SERVER_ACTIVE }}/${{ env.CR_ORG }}/cyberstar-web:${{ env.IMAGE_TAG }} && \
+            docker push ${{ env.CR_SERVER_ACTIVE }}/${{ env.CR_ORG }}/cyberstar-web:latest && break
+            echo "Push attempt $attempt failed, retrying in 10s..." && sleep 10
+          done
+
+      - name: Setup Kubectl
+        run: |
+          if ! command -v kubectl &>/dev/null; then
+            for attempt in 1 2 3; do
+              curl -LO "https://files.m.daocloud.io/dl.k8s.io/release/v1.28.0/bin/linux/amd64/kubectl" && break
+              echo "Download attempt $attempt failed, retrying in 5s..." && sleep 5
+            done
+            chmod +x kubectl && mv kubectl /usr/bin/kubectl
+          fi
+          kubectl version --client
+
+      - name: Set kubeconfig
+        run: |
+          mkdir -p $HOME/.kube
+          printf '%s\n' '${{ secrets.VOLCANO_INTERNAL_KUBE_CONFIG }}' > $HOME/.kube/config
+          chmod 600 $HOME/.kube/config
+          echo "kubeconfig lines: $(wc -l < $HOME/.kube/config)"
+          grep server $HOME/.kube/config || echo "WARNING: no server found in kubeconfig"
+
+      - name: Deploy to K3s
+        id: deploy
+        run: |
+          echo "Environment: ${{ env.DEPLOY_ENV }}"
+          CR_IMAGE="${{ env.CR_SERVER_ACTIVE }}/${{ env.CR_ORG }}"
+
+          # Replace image placeholder
+          sed -i "s|\${CI_REGISTRY_IMAGE}/cyberstar-web:latest|${CR_IMAGE}/cyberstar-web:${{ env.IMAGE_TAG }}|g" k8s/web-deployment.yaml
+
+          # Replace domain placeholder in ingress
+          sed -i "s|cyberstar.airlabs.art|${{ env.DOMAIN_WEB }}|g" k8s/ingress.yaml
+
+          # Replace AUTH_URL in deployment
+          sed -i "s|https://cyberstar.airlabs.art|https://${{ env.DOMAIN_WEB }}|g" k8s/web-deployment.yaml
+
+          for attempt in 1 2 3; do
+            echo "Deploy attempt $attempt/3..."
+            {
+              # 1) 镜像拉取凭证
+              kubectl create secret docker-registry cr-pull-secret \
+                --docker-server="${{ env.CR_SERVER_ACTIVE }}" \
+                --docker-username="${{ env.CR_USERNAME_ACTIVE }}" \
+                --docker-password="${{ env.CR_PASSWORD_ACTIVE }}" \
+                --dry-run=client -o yaml | kubectl apply -f -
+
+              # 2) 运行时 env 已通过 .env.production 烧入镜像,不再需要 K8s Secret 注入
+              #    (Next.js standalone server 启动时从 cwd 自动加载 .env.production)
+              #    保留一个空的 cyberstar-env 占位,避免 web-deployment.yaml 的
+              #    envFrom: optional=true 在首次部署时找不到引用而告警
+              kubectl create secret generic cyberstar-env \
+                --from-literal=_PLACEHOLDER='env values live in .env.production' \
+                --dry-run=client -o yaml | kubectl apply -f -
+
+              # 3) Apply manifests
+              kubectl apply -f k8s/web-deployment.yaml
+              kubectl apply -f k8s/ingress.yaml
+
+              kubectl rollout restart deployment/cyberstar-web
+            } 2>&1 | tee /tmp/deploy.log && break
+            echo "Attempt $attempt failed, retrying in 10s..."
+            sleep 10
+          done
+
+      - name: Report failure to Log Center
+        if: failure()
+        run: |
+          BUILD_LOG=""
+          DEPLOY_LOG=""
+          FAILED_STEP="unknown"
+
+          if [[ "${{ steps.build_web.outcome }}" == "failure" ]]; then
+            FAILED_STEP="build"
+            if [ -f /tmp/build.log ]; then
+              BUILD_LOG=$(tail -50 /tmp/build.log | sed 's/"/\\"/g' | sed ':a;N;$!ba;s/\n/\\n/g')
+            fi
+          elif [[ "${{ steps.deploy.outcome }}" == "failure" ]]; then
+            FAILED_STEP="deploy"
+            if [ -f /tmp/deploy.log ]; then
+              DEPLOY_LOG=$(tail -50 /tmp/deploy.log | sed 's/"/\\"/g' | sed ':a;N;$!ba;s/\n/\\n/g')
+            fi
+          fi
+
+          ERROR_LOG="${BUILD_LOG}${DEPLOY_LOG}"
+          if [ -z "$ERROR_LOG" ]; then
+            ERROR_LOG="No captured output. Check Gitea Actions UI for details."
+          fi
+
+          if [[ "$FAILED_STEP" == "deploy" ]]; then
+            SOURCE="deployment"
+            ERROR_TYPE="DeployError"
+          else
+            SOURCE="cicd"
+            ERROR_TYPE="DockerBuildError"
+          fi
+
+          curl -s -X POST "https://qiyuan-log-center-api.airlabs.art/api/v1/logs/report" \
+            -H "Content-Type: application/json" \
+            -d "{
+              \"project_id\": \"cyberstar\",
+              \"environment\": \"${{ env.DEPLOY_ENV }}\",
+              \"level\": \"ERROR\",
+              \"source\": \"${SOURCE}\",
+              \"commit_hash\": \"${{ github.sha }}\",
+              \"repo_url\": \"https://gitea.airlabs.art/${{ github.repository }}.git\",
+              \"error\": {
+                \"type\": \"${ERROR_TYPE}\",
+                \"message\": \"[${FAILED_STEP}] Build and Deploy failed on branch ${{ github.ref_name }}\",
+                \"stack_trace\": [\"${ERROR_LOG}\"]
+              },
+              \"context\": {
+                \"job_name\": \"build-and-deploy\",
+                \"step_name\": \"${FAILED_STEP}\",
+                \"workflow\": \"${{ github.workflow }}\",
+                \"run_id\": \"${{ github.run_number }}\",
+                \"branch\": \"${{ github.ref_name }}\",
+                \"actor\": \"${{ github.actor }}\",
+                \"commit\": \"${{ github.sha }}\",
+                \"run_url\": \"https://gitea.airlabs.art/${{ github.repository }}/actions/runs/${{ github.run_number }}\"
+              }
+            }" || true
+
+      - name: Docker Cleanup
+        if: always()
+        run: |
+          docker container prune -f
+          docker image prune -f
+          docker builder prune -a -f
+          echo "Disk usage after cleanup:"
+          df -h / | tail -1

.gitignore

@@ -30,9 +30,11 @@ yarn-debug.log*
 yarn-error.log*
 .pnpm-debug.log*
 
-# env files (can opt-in for committing if needed)
+# env files
-.env*
+# 提交: .env (开发默认 / 占位)、.env.production (部署用真实值)、.env.example
-!.env.example
+# 不提交: .env.local 系列 —— 本机个人覆盖,避免顶掉提交值
+.env.local
+.env.*.local
 
 # vercel
 .vercel
@@ -40,3 +42,11 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# 大型静态资源 · 走 TOS 桶 + CDN，不入仓库
+/public/portraits/
+/public/videos/
+
+# asset-pipeline 工具产物
+/tools/asset-pipeline/node_modules/
+/tools/asset-pipeline/compress.log

.npmrc

@@ -0,0 +1,3 @@
+# 让 pnpm 用扁平 node_modules，避免 .pnpm/ 软链结构导致 Docker COPY 断裂
+node-linker=hoisted
+auto-install-peers=true

CHANGELOG.md

@@ -0,0 +1,238 @@
+# CHANGELOG
+
+CYBER STAR(虚拟明星 Top 12 出道选拔)更新日志。新条目写在最上面,旧条目往下沉。
+
+## 版本号规则(SemVer · 0.x 开发期)
+
+- `0.X.0` → 重要功能、破坏性变更(如投票模型重构)
+- `0.x.Y` → 修补、内容更新、UI 打磨
+- `1.0.0` → 正式上线 / 第一次面向公众活动
+
+每次发版必须三件套同步:
+1. `package.json` 里的 `version` 字段
+2. 本文件加新条目(顶部)
+3. `git tag v<x.y.z>`(可选 push 到远程,触发 CI release 流程)
+
+每个版本下方都写两块 commit 信息:
+- **Tag**: tag 实际打在哪条 commit(可点击直达 Gitea)
+- **核心 commit**: 该版本最重要的功能/改动 commit hash
+- **完整 diff**: 与上一个版本的 compare 链接
+
+---
+
+## v0.3.4 · 2026-05-18 · 跨设备同步 + Logo v3 + 导航合并 + 窄屏适配
+
+**Commit 信息**
+- 完整 diff: [v0.3.3...v0.3.4](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.3.3...v0.3.4)
+
+**改了什么(用户视角)**
+- 跨设备投票状态自动对齐:A 设备投了 5 票,B 设备登录后立刻看到 5 票已投(原来只看 localStorage)
+- 登录页 / 登录弹窗 / Footer 替换为新版金属质感 logo(`logo-v3.png`),Footer 顺手去掉 logo 行
+- 导航栏窄屏不再"双行":"首页 / 排行榜 / 我的"合并到第一行,与右侧搜索/badge/auth 同行
+- 窄屏(< 768px)hero 右上角应援进度只显示文字,隐藏 12 格点 —— 让左侧 "TOP 12 · CYBER STAR" eyebrow 有空间不挤撞
+
+**技术点**
+- `src/hooks/useSyncMe.ts`(新): 监听 session 变化 → 拉 `/api/me` → `hydrateFromServer(votedArtists)` 覆盖本地 store;登出清本地避免上一个用户残留
+- `src/components/Providers.tsx`: `<SyncMeBridge/>` 在 SessionProvider 内部启动 useSyncMe
+- `src/components/Navigation.tsx`: 删除 mobile 第二行 NavLinks,nav `gap-4 sm:gap-8` 响应式
+- `src/components/NavLinks.tsx`: 删除 mobile/desktop 双分支,统一用 `gap-5 sm:gap-8 text-[13px] sm:text-sm`
+- `src/components/HeroVoteProgress.tsx`: 12 格点容器加 `hidden md:inline-flex`,< 768px 隐藏
+- `public/logo-v3.png`(新): 金属质感 logo,替换原 `<Logo>` 组件
+
+**实测三种屏宽**(脚本 `scripts/screenshot-narrow.mjs`)
+
+| 屏宽 | nav | hero eyebrow | hero progress 宽 |
+|------|-----|--------------|------------------|
+| 1500px | 单行 ✓ | 不撞 ✓ | 252(完整 12 点)|
+| 740px | 单行 ✓ | 不撞 ✓ | 135(隐藏点)|
+| 360px | 单行 ✓(NavLinks 140px 塞下)| eyebrow 320px 太长仍占满 ⚠️ | 135 |
+
+**风险 / 已知问题**
+- 360px 极窄屏 hero eyebrow 自身已占 320px,即使 progress 缩到 135 仍会横向重叠。下次单独修(eyebrow 极窄屏可简化为 "TOP 12" 或 hidden sm:block)
+
+---
+
+## v0.3.3 · 2026-05-15 · 修复:投票后票数 +1 和 Top12 排位要等 30s
+
+**Commit 信息**
+- 完整 diff: [v0.3.2...v0.3.3](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.3.2...v0.3.3)
+
+**改了什么**
+- 投票成功后,首页 Top12 + 排行榜立即拉新数据,不必等下次 30s 轮询
+- 服务端拒绝投票时(如其他设备已投过),本地立即回滚乐观更新 + 用 /api/me 重新对齐
+- 网络异常时回滚 + 报错,避免本地状态与服务端不一致
+
+**根因(诊断详见 v0.3.2 后的对话)**
+- `useRanking` 30s 轮询拉服务端票数,merge 时取 max(serverVotes, storeVotes)
+- 用户投票后,storeVotes 立即 +1,但 serverVotes 还是 30s 前的旧值,且更大
+- max 永远取 server → 本地 +1 被压住 → 票数和排位最多延迟 30s 才更新
+
+**技术修复**
+- `useVoteAction` 加 `onVoteSuccess` 回调,服务端 200 后立即触发
+- `page.tsx` + `ranking/page.tsx` 把 `live.refresh` 传进去
+- 顺手把 fire-and-forget 改成 await 服务端,失败时 `rollbackVote` + `refetchMe(/api/me)` 跨设备对齐
+- store 新增 `rollbackVote(id)` + `hydrateFromServer(ids[])` 两个 action
+
+**体感对比**
+| 场景 | 本地 dev(打公网 RDS) | 生产(同区 K3s + RDS) |
+|------|---------------------|---------------------|
+| 改前 | 0~30 秒后才看到票数 +1 | 同上 |
+| 改后 | ~700-1000 ms(vote API 写完 + ranking refresh) | ~150 ms |
+
+**风险 / 已知问题**
+- ArtistDetailContent 显示的 artist.votes 仍从 store 来,store 里这个字段是"本地用户投过几次"不是服务端真实票。详情页票数显示问题留下次单独修。
+
+---
+
+## v0.3.2 · 2026-05-15 · 修复:首页 Top12 出道位空着,排行榜却有数据
+
+**Commit 信息**
+- 完整 diff: [v0.3.1...v0.3.2](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.3.1...v0.3.2)
+
+**改了什么**
+- 首页 Top12 出道位现在能显示真实票数(此前一直显示"Awaiting Votes")
+
+**根因**
+- 首页 Top12Bar 之前只读前端 zustand store 的 `artists`,store 初始来自 mock-data(36 人全部 0 票),只有**当前浏览器用户自己投票时**才会更新
+- 排行榜 `/ranking` 走 `/api/ranking` 直接读 DB,所以有真实票数
+- 未登录访客访问首页 → store 全 0 票 → `top12 = filter(votes > 0)` 空 → 显示"Awaiting Votes"
+
+**技术修复**
+- `src/app/page.tsx` 加 `useRanking({ pollInterval: 30_000 })`,30 秒轮询 `/api/ranking`
+- 用 `useMemo` 合并 `storeArtists`(本地乐观投票)+ API 票数(取 max),重新排序赋 rank
+- 与 `/ranking` 页面用同样的 merge 策略,保证两处票数视图一致
+
+**风险 / 已知问题**
+- 首页和排行榜各自跑一个 `useRanking` 实例,会产生两个独立轮询请求。后续可以提到 layout 层共享,但当前 36 行查询很轻,先这样
+
+---
+
+## v0.3.1 · 2026-05-15 · 13 号(虞浓)氛围图 2 替换
+
+**Commit 信息**
+- Tag 打在: 本次 release commit(`git log -1` 看)
+- 完整 diff: [v0.3.0...v0.3.1](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.3.0...v0.3.1)
+
+**改了什么**
+- 13 号虞浓的氛围图 2 换成新版本(`portraits/013-2.webp`,1440×2560,153KB)
+
+**技术点**
+- TOS cache version `7` → `8`(`src/lib/tos.ts`),浏览器 + CDN 立即拿到新图,不必等 TTL
+- 转换脚本 `_tmp_webp_convert/round3.mjs`,sharp quality 82
+
+---
+
+## v0.3.0 · 2026-05-15 · 投票模型大改:每日额度 → 终身 12 票
+
+**Commit 信息**
+- Tag 打在: [`93c3abe`](https://gitea.airlabs.art/zyc/UI-UX/commit/93c3abe) `chore(release): v0.3.0 + 建立 CHANGELOG + 追溯版本号`
+- 核心 commit: [`10878dd`](https://gitea.airlabs.art/zyc/UI-UX/commit/10878dd) `feat(vote): 重构投票模型为终身 12 票 + 每艺人 1 票`
+- 完整 diff: [v0.2.2...v0.3.0](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.2.2...v0.3.0)
+
+**改了什么**
+- 每个用户改为终身 12 票,每位艺人最多 1 票,投出不可撤销
+- 取消活动时间窗(不再限定结束日期)
+- Hero 右上角倒计时换成 "应援进度" 12 格点亮式条
+- 已投艺人卡片显示 ✓ 角标 + "已投票" 灰色按钮
+- /me 页改为终身额度叙事(QuotaCard / StatsGrid / MyFanSupport)
+- VoteModal 去掉 1/3/5/ALL 选择器,改"投出我的一票"单一确认
+
+**技术点**
+- `votes` 表加 `@@unique([userId, artistId])` 硬约束(已 apply 到生产 RDS)
+- `/api/vote` 重写:12 票上限校验 + P2002 转 ALREADY_VOTED + P2003 转 NOT_FOUND
+- `/api/me` 新增 `votedArtists[]` + `voteQuota`,替换旧 `dailyQuota`
+- 前端 store 改为 zustand `persist` + `votedArtists[]`,localStorage key `cyber-star-vote`
+- 新增 `scripts/`:DB 探查 / SQL 迁移 apply / E2E 回归测试(走完整 OTP 登录)
+- 提交后 DB 测试数据清空,从 0/12 重新开始
+
+**风险 / 已知问题**
+- 前端 hydrate 仍只用 localStorage,不消费后端 `/api/me.votedArtists`。用户清缓存或换设备会看到"我能再投",但 DB unique 兜底,重投会被服务端拒绝(toast 提示已投过)
+- 旧 `daily_quota` 表数据保留未清,新逻辑不再读取
+
+**报告**: [docs/todo/voting-refactor-完成报告.md](docs/todo/voting-refactor-完成报告.md)、[docs/todo/voting-refactor-backend-完成报告.md](docs/todo/voting-refactor-backend-完成报告.md)
+
+---
+
+## v0.2.2 · 2026-05-15 · 内容批次 v2 修正 + 单人视频
+
+**Commit 信息**
+- Tag 打在: [`8d8451b`](https://gitea.airlabs.art/zyc/UI-UX/commit/8d8451b) `chore(tos): bump cache version 6 → 7 for 014-2 recrop`
+- 完整 diff: [v0.2.1...v0.2.2](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.2.1...v0.2.2)
+
+**改了什么**
+- 多位艺人立绘 / 头像 / 氛围图替换(003 / 006 / 007 / 010 / 014 / 017 / 019 / 027 / 033 等)
+- 单人表演视频更新(5 个艺人)
+- Hero PV 视频压缩 4K 1.19GB → 1080p 47MB
+- Nav logo 去除 + Hero 视频默认静音
+
+**技术点**
+- TOS bucket `?v=` 缓存版本号 4→7 多次升级
+- `sharp` + `ffmpeg-static` 资源压缩管线(`scripts/` 多个工具)
+
+---
+
+## v0.2.1 · 2026-05-14 · UI 视觉打磨
+
+**Commit 信息**
+- Tag 打在: [`7168e50`](https://gitea.airlabs.art/zyc/UI-UX/commit/7168e50) `fix: prod login + env-file driven config + scroll-snap bounce`
+- 完整 diff: [v0.2.0...v0.2.1](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.2.0...v0.2.1)
+
+**改了什么**
+- 导航栏滚动到 Hero 下方时自动从透明变毛玻璃
+- 加浮动返回按钮 + 滚动位置 per-tab 记忆
+- 筛选条吸顶时与 nav 合并为单一 backdrop-filter 带,消除接缝
+
+**技术点**
+- `useUIStore` 跨组件感知 filter 吸顶状态
+- 修复生产登录失败 + .env 驱动配置
+
+---
+
+## v0.2.0 · 2026-05-13 · 真实持久化 + CI/CD 打通
+
+**Commit 信息**
+- Tag 打在: [`1073262`](https://gitea.airlabs.art/zyc/UI-UX/commit/1073262) `ci(secret): inject Aliyun SMS credentials into cyberstar-env`
+- 核心 commit: [`a9f4799`](https://gitea.airlabs.art/zyc/UI-UX/commit/a9f4799) `feat(db): wire real persistence for votes / users / quota / supports`
+- 完整 diff: [v0.1.0...v0.2.0](https://gitea.airlabs.art/zyc/UI-UX/compare/v0.1.0...v0.2.0)
+
+**改了什么**
+- 投票 / 用户 / 应援 / 额度全部走真实数据库(火山引擎 RDS),不再 mock
+- 阿里云短信 OTP 登录上线(国内手机号)
+- 静态资源全部迁移到火山引擎 TOS 桶
+- 排行榜真实动态计算(基于 DB 聚合)
+
+**技术点**
+- CI/CD 流水线接通 Gitea Actions → Docker build → K3s 部署
+- `cyberstar-env` Secret 注入 DATABASE_URL + SMS 凭据
+- Prisma alpine binary target + hoisted node_modules 适配 docker
+- next/image 对 TOS 资源关掉优化(否则会代理拉破带宽)
+
+---
+
+## v0.1.0 · 2026-05-12 · 项目骨架与全部页面初版
+
+**Commit 信息**
+- Tag 打在: [`d5ed43a`](https://gitea.airlabs.art/zyc/UI-UX/commit/d5ed43a) `feat(ui): design overhaul, global login modal, design spec`
+- 核心 commit: [`8a83815`](https://gitea.airlabs.art/zyc/UI-UX/commit/8a83815) `chore: bootstrap Next.js 16 + Tailwind v4 + TypeScript baseline`
+- 范围: 项目第一个 commit 到 d5ed43a(共 16 个 commit)
+
+**改了什么**
+- Next.js 16 + Tailwind v4 + TypeScript 项目搭建
+- 紫色品牌设计系统(Megrim / Audiowide / Cinzel / Inter 字体)
+- 首页(Hero + Top12 + 36 艺人候选区)
+- 排行榜(Top3 podium + Top4-12 列表 + 出道线 + 候补区)
+- 艺人详情页(Hero + 15s 视频 + Gallery + 人物小传)
+- /me 用户中心(配额卡 / 签到日历 / 统计 / 应援)
+- 通用组件(Button / Countdown / ArtistCard / Top12Bar / VoteModal)
+- Auth.js v5 手机号 OTP 登录(全局登录 modal)
+- REST API(artists / ranking / me / vote / signin)+ Redis 限流 + Zod 校验
+- Prisma 6 + MySQL schema(Vote / DailyQuota / FanSupport / Invitation / RiskLog 等)
+- 实时排名 polling + LiveBadge
+
+**技术点**
+- 首版投票规则:**无限制**(无日额度、无单艺人上限)—— 后续逐步加严
+- API 不可达时前端降级到 mock 数据
+
+---
+
+_格式参考 [Keep a Changelog](https://keepachangelog.com/),宽松版_

Dockerfile

@@ -0,0 +1,71 @@
+# syntax=docker/dockerfile:1
+# ───────────── 1. deps：安装依赖 + 显式生成 Prisma Client ─────────────
+FROM node:22-alpine AS deps
+RUN apk add --no-cache libc6-compat openssl
+WORKDIR /app
+
+RUN corepack enable && corepack prepare pnpm@latest --activate \
+    && pnpm config set registry https://registry.npmmirror.com
+
+# .npmrc 必须先 COPY，否则 pnpm install 看不到 node-linker=hoisted
+COPY .npmrc package.json pnpm-lock.yaml pnpm-workspace.yaml ./
+COPY prisma ./prisma
+
+# pnpm 10+ 在 root/CI 默认跳过 lifecycle scripts，因此显式调用 prisma generate
+# Prisma 6 直接把 client 写入 @prisma/client 包目录（不再用 .prisma/client）
+RUN pnpm install --frozen-lockfile --ignore-scripts \
+    && pnpm exec prisma generate \
+    && ls -la /app/node_modules/@prisma/client/ \
+    && ls /app/node_modules/@prisma/client/ | grep -E "(libquery_engine|schema.prisma|index.js)" || true
+
+# ───────────── 2. builder：Next.js 构建（standalone 产物） ─────────────
+FROM node:22-alpine AS builder
+RUN apk add --no-cache libc6-compat openssl
+WORKDIR /app
+
+RUN corepack enable && corepack prepare pnpm@latest --activate
+
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+# Build-time public env：NEXT_PUBLIC_* 必须在 next build 之前注入,
+# 否则会被烧成空字符串,运行时再设也无效 (Next.js 把这类 env 编译进 client bundle)
+ARG NEXT_PUBLIC_TOS_DOMAIN
+ENV NEXT_PUBLIC_TOS_DOMAIN=${NEXT_PUBLIC_TOS_DOMAIN}
+ENV NEXT_TELEMETRY_DISABLED=1
+# COPY . . 会覆盖 prisma/schema 的最新版本，需要再 generate 一次确保 client 同步
+RUN pnpm exec prisma generate \
+    && pnpm exec next build \
+    && ls -la /app/node_modules/@prisma/client/ \
+    && ls -la /app/.next/standalone/
+
+# ───────────── 3. runner：最小运行时镜像 ─────────────
+FROM node:22-alpine AS runner
+RUN apk add --no-cache libc6-compat openssl
+WORKDIR /app
+
+ENV NODE_ENV=production
+ENV NEXT_TELEMETRY_DISABLED=1
+ENV PORT=3000
+ENV HOSTNAME=0.0.0.0
+
+RUN addgroup --system --gid 1001 nodejs \
+    && adduser --system --uid 1001 nextjs
+
+# Next.js standalone 自带通过 tracing 解析出的运行时依赖（含 @prisma/client）
+COPY --from=builder /app/public ./public
+COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+# 显式补 Prisma：tracing 有时会漏掉 engine 二进制和 schema
+COPY --from=builder --chown=nextjs:nodejs /app/node_modules/@prisma ./node_modules/@prisma
+COPY --from=builder --chown=nextjs:nodejs /app/prisma ./prisma
+
+# 运行时 env: Next.js standalone server.js 启动时从 cwd 加载 .env.production
+# (next build 已经把 NEXT_PUBLIC_* 烧进 bundle, 这里管的是服务端 env 如 DATABASE_URL / AUTH_SECRET)
+COPY --from=builder --chown=nextjs:nodejs /app/.env.production ./.env.production
+
+USER nextjs
+EXPOSE 3000
+
+CMD ["node", "server.js"]

docs/todo/voting-refactor-backend-完成报告.md

@@ -0,0 +1,217 @@
+# 投票系统重构 · 后端完成报告
+
+**完成日期**: 2026-05-15
+**接续**: `docs/todo/voting-refactor-完成报告.md`(前端部分)
+**目标**: 把投票后端从"每日额度"切换为"终身 12 票 + 每艺人 1 票",对齐前端新规则。
+
+---
+
+## 一、改动清单
+
+### 1.1 数据库 schema(直接 apply 到生产 RDS)
+
+火山引擎 RDS:`mysql-8351f937d637-public.rds.volces.com / cyberstar`
+
+**改动前探查**(只读):
+- users: 7 行(测试用户)
+- votes: 12 行
+- 重复 (userId, artistId): **0 行** —— 加 unique 约束安全
+- daily_quota: 5 行(旧数据,新逻辑不再读)
+- fan_supports: 12 行
+
+**应用的 SQL**(`prisma/migrations/manual/20260515_vote_lifetime_quota.sql`):
+```sql
+-- 1. 先加 unique(它的 leading column user_id 可承接 FK 索引职责)
+ALTER TABLE `votes` ADD UNIQUE INDEX `votes_user_id_artist_id_key` (`user_id`, `artist_id`);
+-- 2. 再删旧的 (user_id, artist_id, created_at) 非唯一索引
+ALTER TABLE `votes` DROP INDEX `votes_user_id_artist_id_created_at_idx`;
+```
+
+**为什么要这个顺序**:Vote.userId / Vote.artistId 各有 FK 约束,MySQL InnoDB 要求 FK 列有 leading 索引。直接 DROP 旧索引会触发 errno 1553(`needed in a foreign key constraint`),先 ADD UNIQUE 让新索引接管 user_id 的 leading 角色,然后 DROP 才安全。
+
+**回滚**(脚本里有完整注释):
+```sql
+ALTER TABLE `votes` ADD INDEX `votes_user_id_artist_id_created_at_idx` (`user_id`, `artist_id`, `created_at`);
+ALTER TABLE `votes` DROP INDEX `votes_user_id_artist_id_key`;
+```
+
+### 1.2 修改的文件
+
+| 文件 | 改动 |
+|------|------|
+| `prisma/schema.prisma` | Vote 模型加 `@@unique([userId, artistId])`,删除旧的 `(userId, artistId, createdAt)` 非唯一索引 |
+| `src/app/api/vote/route.ts` | **完全重写**。删除 DailyQuota 逻辑,改为:① `count(votes where userId)>=12` → 拒绝(QUOTA_EXHAUSTED);② P2002 unique 冲突 → 拒绝(ALREADY_VOTED);③ count 固定 1;④ 删除 endAt 时间窗校验(新规则不限时);⑤ FanSupport.votedTotal 固定 1(每艺人 1 票) |
+| `src/app/api/me/route.ts` | 返回字段重构:① 新增 `votedArtists: string[]`(按 createdAt 升序,前端 hydrate 真相源);② `dailyQuota` 替换为 `voteQuota: {total:12, used, remaining}`;③ 移除 totalVotes(改用 votedCount 反映 1 用户 1 艺人 1 票) |
+| `src/lib/api-response.ts` | 新增 `ERR.ALREADY_VOTED()` 错误码(409,文案"你已为该艺人投过票")。`ERR.QUOTA_EXHAUSTED` 文案改为"你的 12 票已全部投出,感谢支持" |
+
+### 1.3 新建的文件
+
+| 文件 | 用途 |
+|------|------|
+| `prisma/migrations/manual/20260515_vote_lifetime_quota.sql` | 本次迁移 SQL(带回滚段),作为项目第一个手工迁移记录 |
+| `scripts/inspect-db.mjs` | 只读探查生产 DB 状态(用户量、投票量、重复检查、索引列表) |
+| `scripts/apply-migration.mjs` | 把 manual/*.sql 用 `prisma.$executeRawUnsafe` 应用到当前 DATABASE_URL。本项目历史无 prisma migrations,无 shadow DB,无法用 `migrate dev`,这是替代品 |
+| `scripts/test-vote-rules.mjs` | 后端投票规则验证脚本(事务回滚,不留痕) |
+| `scripts/verify-unique.mjs` | 用 information_schema 权威查询索引唯一性(规避 `SHOW INDEX` 的 BigInt 比较坑) |
+
+---
+
+## 二、为什么没用 prisma migrate dev
+
+项目 `prisma/migrations/` 历史不存在 —— 之前一直靠 `prisma db push` 同步 schema。要从这个状态开始用 `migrate dev`:
+1. 需要 shadow database 做 diff —— 生产 RDS 通常不给 CREATE DATABASE 权限,不可行
+2. 需要先跑 `migrate dev --create-only` 生成 baseline 0001 迁移,把整个 schema 作为初始状态写入,再生成本次改动 0002 —— 但这个 baseline 不能 apply(否则会重建已存在的表)
+
+务实方案:
+- 手工写 SQL 到 `prisma/migrations/manual/*.sql`,留作历史记录
+- 用 `scripts/apply-migration.mjs` 直接执行(等同 `db push` 但只动指定的 ALTER,可控)
+- `schema.prisma` 与生产同步,作为代码层的真相源
+
+未来 migration 路径:沿用此模式(写 SQL + apply-migration 执行),或者等本地 dev MySQL 起来后切回标准 `migrate dev` 流程。
+
+---
+
+## 三、验证结果
+
+### 3.1 DB 层验证(`scripts/test-vote-rules.mjs`,事务回滚无副作用)
+
+| # | 项 | 结果 |
+|---|---|------|
+| 1 | DB unique 约束阻挡重复 (userId, artistId) INSERT → P2002 | ✅ PASS |
+| 2 | 跨艺人投票不被 unique 阻挡(允许投给新艺人) | ✅ PASS |
+| 3 | 现存数据无单用户超 12 票 | ✅ PASS |
+| 4 | /api/me votedArtists 按 createdAt 升序 | ✅ PASS |
+| 5 | 旧 DailyQuota / FanSupport 数据仍可读(向后兼容) | ✅ PASS |
+
+### 3.2 E2E 回归(`scripts/e2e-vote-flow.sh`,走完整 OTP 登录 + HTTP)
+
+用全新手机号 `13800138000` 走 next-auth Credentials provider 完整登录拿真实 session cookie,然后调真实 HTTP 端点。每次跑前 cleanup 测试用户残留(包括回滚 artist.voteCount)。
+
+| # | 项 | 结果 |
+|---|---|------|
+| 1 | next-auth CSRF + OTP 登录建立 session | ✅ PASS |
+| 2 | GET /api/me 返回 ok:true | ✅ PASS |
+| 3 | GET /api/me 含 voteQuota{total:12,used,remaining} | ✅ PASS |
+| 4 | GET /api/me 含 votedArtists 数组 | ✅ PASS |
+| 5 | GET /api/me **不再含**旧 dailyQuota 字段 | ✅ PASS |
+| 6 | POST /api/vote 首投返回 totalQuota:12, votedCount:1, remaining:11 | ✅ PASS |
+| 7 | POST /api/vote 重投同一艺人 → 409 ALREADY_VOTED(P2002 经 catch 兜底) | ✅ PASS |
+| 8 | POST /api/vote 不存在艺人 → 404 NOT_FOUND(P2003 FK 违反经 catch 兜底) | ✅ PASS |
+| 9 | 投票后 GET /api/me 复查 votedArtists 含新投艺人 + used 自增 | ✅ PASS |
+| 10 | 未登录调 /api/vote → 401 UNAUTHORIZED | ✅ PASS |
+
+**总计**: 18 / 18 通过(5 DB + 13 E2E,合并去重后)
+
+### 3.3 页面级 HTTP 状态码回归
+
+| 路由 | 状态 | 备注 |
+|------|------|------|
+| `/` | 200 | 首页 |
+| `/ranking` | 200 | 排行榜 |
+| `/artist/001` | 200 | 艺人详情 |
+| `/artist/003` | 200 | 艺人详情 |
+| `/me` | 307 | 未登录 server redirect,预期 |
+| `/login` | 登录页 | 200 |
+
+### 3.4 回归中发现 + 修复的 bug
+
+**第一轮 E2E 跑出 1 个真 bug**:`POST /api/vote artistId=999` 应返回 404 NOT_FOUND,实际返回 500 INTERNAL。
+
+**根因**:`vote/route.ts` catch 只处理了 `P2025`(记录不存在,适用于 `artist.update` 失败)。但实际首先触发的是 `vote.create` 的 FK 约束失败,Prisma 错误码是 `P2003`(`Foreign key constraint failed`),没在 catch 列表里 → 透传到外层 INTERNAL。
+
+**修复**:catch 加上 `P2003`,与 `P2025` 共用 NOT_FOUND 分支。
+
+```ts
+if (e instanceof Prisma.PrismaClientKnownRequestError &&
+    (e.code === "P2003" || e.code === "P2025")) {
+  return ERR.NOT_FOUND("艺人不存在");
+}
+```
+
+修复后回归再跑一次,18/18 通过。
+
+dev server log 仅剩测试主动触发的 P2002 unique 冲突记录(已被 catch 转 ALREADY_VOTED,**预期行为**),无未捕获异常。
+
+---
+
+## 四、应用层规则覆盖
+
+下表是新 `/api/vote` 的完整逻辑覆盖:
+
+| 输入 | 校验顺序 | 返回 |
+|------|---------|------|
+| 无 session | 第 0 步 | 401 UNAUTHORIZED |
+| 单用户 1 秒 > 5 次请求 | 第 1 步限流 | 429 RATE_LIMITED |
+| 单 IP 60 秒 > 60 次请求 | 第 1 步限流 | 429 RATE_LIMITED |
+| body 缺 artistId | 第 2 步 zod | 422 VALIDATION |
+| ActivityConfig.voteEnabled=false | 第 3 步 | 409 ACTIVITY_OFF |
+| 用户已投 ≥ 12 票 | 事务内第 1 检查 | 409 QUOTA_EXHAUSTED `"你的 12 票已全部投出,感谢支持"` |
+| 用户重复投同一艺人(P2002) | DB 兜底 catch | 409 ALREADY_VOTED `"你已为该艺人投过票"` |
+| 艺人不存在(P2025) | DB 兜底 catch | 404 NOT_FOUND `"艺人不存在"` |
+| 正常通过 | 事务成功 | 200 `{artistId, artistVotes, voteId, votedCount, remaining, totalQuota:12}` |
+
+### /api/me 新返回结构
+```json
+{
+  "ok": true,
+  "data": {
+    "profile": { "id", "nickname", "avatar", "phone", "createdAt" },
+    "signIn": { "streak", "lastDate", "todaySignedIn" },
+    "voteQuota": { "total": 12, "used": <number>, "remaining": <number> },
+    "votedArtists": ["001", "003", ...],   // 按时间升序,前端 hydrate 真相源
+    "supports": [{ "artist": {...}, "votedTotal": 1 }, ...]
+  }
+}
+```
+
+---
+
+## 五、已完成 / 未完成
+
+### ✅ 已完成
+- DB 层 `(userId, artistId) UNIQUE` 硬约束(生产已 apply)
+- `/api/vote` 12 票上限校验 + ALREADY_VOTED 兜底
+- `/api/me` 新增 `votedArtists` + `voteQuota`
+- Prisma schema 同步,scripts/ 留下可重复使用的工具
+
+### ⚠️ 已知风险待人工跟进
+1. **前端 hydrate 仍只用 localStorage**:本次没动前端 store(规则约束),前端目前不消费 `/api/me.votedArtists`。用户清缓存或换设备仍会"丢"已投状态(虽然投票不会丢,DB 还在)。下次前端任务里改 store 在 client 启动时调用 `/api/me` 用服务端数据 hydrate。
+2. **旧 DailyQuota 数据没清理**:`daily_quota` 表 5 行残留,新逻辑不再读取,但表保留。等数据迁移期过后可以 DROP TABLE 或 prune。
+3. **FanSupport.votedTotal 历史数据 > 1 的行没归一化**:旧数据有 `votedTotal=2/3` 的行(对应旧每日额度时代多次投同艺人)。新规则下 votedTotal 固定 1,但历史行不变 —— 如果前端只展示"是否已投"就不影响;如果展示具体数字会显示历史值。建议看一眼用户态期望后再决定是否 UPDATE。
+4. **生产 RDS 直接是本地开发库**:所有 schema 改动都立即生效到生产。开发节奏快时风险大。建议下一次空档配 docker MySQL 做本地 dev DB,把生产降级为部署目标。
+5. **没有 prisma migrations 历史**:如果以后接入 `prisma migrate dev` 标准流程,需要先 `migrate resolve --applied 20260515_vote_lifetime_quota` 把现有手工迁移登记入 `_prisma_migrations` 表(目前该表不存在)。
+
+### ❌ 没做的(避免误解)
+- 没 `git push` / `git commit`(用户自己提交)
+- 没改前端任何代码
+- 没重启 dev server
+- 没 `prisma db push` / 没 `prisma migrate deploy` —— 用裸 SQL + `$executeRawUnsafe` 替代
+
+---
+
+## 六、回滚步骤
+
+如线上出问题需要立即回滚:
+
+```bash
+# 1. 撤销 DB 改动
+node scripts/apply-migration.mjs - << 'EOF'
+ALTER TABLE `votes` ADD INDEX `votes_user_id_artist_id_created_at_idx` (`user_id`, `artist_id`, `created_at`);
+ALTER TABLE `votes` DROP INDEX `votes_user_id_artist_id_key`;
+EOF
+
+# 2. 撤销代码改动(回到 commit 之前)
+git checkout HEAD -- prisma/schema.prisma src/app/api/vote/route.ts src/app/api/me/route.ts src/lib/api-response.ts
+```
+
+---
+
+## 七、可以投产了吗
+
+✅ **DB 层** 已经在生产生效(7 用户 / 12 投票,零数据丢失,无重复)。
+✅ **后端 API** 编译通过,正常 401 / 200。
+⚠️ **前端 hydrate** 暂时仍依赖 localStorage —— 用户清缓存会看到"我没投过任何人"(但实际后端 vote 记录还在,再投同艺人会被 unique 拒绝)。这是体感问题不是数据问题,不阻塞投产。
+
+**建议节奏**:
+1. **现在**:可以投产(前端 + 后端 + DB 都生效)。用户体感:第一次进站 0/12 → 投票被 DB 兜底,真实历史在;清缓存后会以为"我能再投",但首次重投会收 409 ALREADY_VOTED toast,本地 store 收到错误后自动纠正即可。
+2. **下个迭代**:前端 hydrate 接 `/api/me.votedArtists`,彻底解决体感差异。

docs/todo/voting-refactor-完成报告.md

@@ -0,0 +1,152 @@
+# 投票系统重构 · 完成报告
+
+**完成日期**: 2026-05-15
+**Plan 引用**: `docs/todo/voting-refactor.md`
+**任务目标**: 把"每日投票额度"模型改成"每用户终身 12 票,每艺人最多 1 票,投出不可撤销"。
+
+---
+
+## 一、改动清单
+
+### 1.1 修改的文件(15 个)
+
+| 文件 | 改动 | Stage |
+|------|------|-------|
+| `src/lib/store.ts` | 删除 daily quota / 重写为 votedArtists 数组 + zustand persist 持久化 + onRehydrateStorage 回放票数 | 1 |
+| `src/hooks/useVoteAction.ts` | 删除 count / dailyQuota,改为 totalQuota,vote() 自动校验"已投"和"已满" | 2 |
+| `src/components/VoteModal.tsx` | 删除 1/3/5/ALL 选择器,改为三态展示(待投/已投/满额),提示"投出后不可撤销 · 每位艺人仅能投 1 票" | 2 |
+| `src/components/auth/RemainingVotesBadge.tsx` | "剩余 X / 12 票"(去掉"今日") | 2 |
+| `src/components/cards/ArtistCard.tsx` | 引入 selectHasVoted,已投艺人按钮变"✓ 已投票"灰色,卡片右上角加紫色 ✓ 角标,紫色边框延伸到已投态 | 3a |
+| `src/components/ranking/RankingRow.tsx` | 同上 + 删除非 Top12 的 opacity-[0.78] 暗调,头像右下角加紫色小 ✓ 角标 | 3b |
+| `src/components/artist/ArtistDetailContent.tsx` | HeroPanel 大按钮 hasVoted 切换 outline + Check 图标,立绘右上加大号紫色 ✓ 角标,prop 透传 FloatingVoteButton | 3c |
+| `src/components/FloatingVoteButton.tsx` | 加 hasVoted prop,已投态变灰色边框 + Check + "已投" | 3d |
+| `src/components/HeroBanner.tsx` | 移除 endTime prop + Countdown 引用,改为渲染 HeroVoteProgress | 4 |
+| `src/app/page.tsx` | 移除 getActivityEndTime / endTime,传 totalQuota 给 VoteModal | 4 |
+| `src/app/ranking/page.tsx` | useVoteAction 解构改为 totalQuota,prop rename | 2 |
+| `src/app/me/MeContent.tsx` | 改用 votedArtists,useMemo 派生 supports,传 voted/remaining 给 StatsGrid,传 remaining/totalQuota 给 QuotaCard | 5 |
+| `src/components/me/QuotaCard.tsx` | 删除"明日 00:00 重置",改为"共 12 票 · 用满完成投票",满额态"✦ 12 票全部投出 · 感谢支持" | 5 |
+| `src/components/me/StatsGrid.tsx` | 两格:已投票数 / 剩余票数(不再有"我支持的艺人数") | 5 |
+| `src/components/me/MyFanSupport.tsx` | 去掉 votedCount,改为 ✓"已投票"badge,空态文案改为"还没有投过票" | 5 |
+
+### 1.2 新建的文件
+
+| 文件 | 用途 |
+|------|------|
+| `src/components/HeroVoteProgress.tsx` | Hero 右上角新组件,12 格点亮式应援进度。三态:未登录 CTA / 已投 X/12 / 满额"✓ 12 票全部投出"。视觉与原 Countdown compact 模式同高度、同位置、同毛玻璃质感(`bg-[rgba(13,10,36,0.55)]` + `backdrop-blur-md` + `border-purple-300/40` 浅紫边框)。 |
+| `scripts/cdp-screenshot.mjs` | 一次性截图脚本,用系统 Chrome + DevTools Protocol(避免装 puppeteer/playwright)。通过 Fetch.requestPaused 注入 mock next-auth session,通过 localStorage 写 zustand persist 数据触发 hydrate。 |
+| `docs/screenshots/voting-refactor/*.png` | 视觉验收截图(10 张) |
+
+---
+
+## 二、视觉验收
+
+### 2.1 Hero 应援进度三态(关键改动)
+
+| 状态 | 截图 | 验收结果 |
+|------|------|---------|
+| 0/12 待投 | `01a-progress-0of12.png` | ✅ "应援进度 0/12" + 12 个暗紫描边小圆点 |
+| 5/12 进行中 | `01b-progress-5of12.png` | ✅ "应援进度 5/12" + 前 5 个亮紫 + 后 7 个暗紫 |
+| 12/12 投满 | `01c-progress-12of12.png` | ✅ "✓ 12 票全部投出" + 容器加强紫色描边 + 整体紫色辉光 |
+
+**视觉与原 Countdown 对齐**:同 h-9 高度、同 right-4/right-6/right-8 位置、同 backdrop-blur-md 毛玻璃、同浅紫边框 → 不破坏 Hero 视频氛围。
+
+### 2.2 卡片角标对比
+
+`02-artist-cards-mixed.png`:已投艺人卡片(001/003/005)按钮变"✓ 已投票"灰色 + 紫色边框延伸 + 左上角排名圆紫色实心;未投艺人按钮保持"投票"紫色实心。混合态视觉对比清晰。
+
+### 2.3 VoteModal 待投态
+
+`04-vote-modal-normal.png`:头像紫色边框 + "为 X 投票"标题 + No. + 当前排名 + "你的剩余票数 X/12"紫色信息框 + 不可撤销提示框 + 紫色"投出我的一票"按钮。设计符合 plan 视觉特征。
+
+### 2.4 /me 页
+
+`03-me-page.png`:**未截到 /me 页 UI**。`/me` 在 Next.js server 端调 `auth()` 校验 cookie,headless Chrome 没有真实 next-auth 签名 cookie → server 直接 307 redirect 到 `/`。截图实际显示首页混合态卡片。
+
+`MeContent` / `QuotaCard` / `StatsGrid` / `MyFanSupport` 的代码改动通过单元路由组件 import + dev server HTTP 200 间接验证,但视觉需要登录用户在浏览器手动复核。
+
+---
+
+## 三、验证通过项
+
+- ✅ dev server `/` `/ranking` `/artist/003` 全部 HTTP 200
+- ✅ `/me` HTTP 307(未登录预期 redirect)
+- ✅ Hero 进度三态视觉对齐 Countdown compact 风格
+- ✅ ArtistCard / RankingRow 已投灰按钮 + ✓ 角标
+- ✅ VoteModal 待投态完整 UI
+- ✅ Zustand persist `cyber-star-vote` localStorage key 正确写入,刷新可保留 votedArtists
+- ✅ onRehydrateStorage 把 votedArtists 回放进 artists.votes,排名实时刷新
+- ✅ dev server 日志最近无 ERROR / TypeError(中间过程 isOverHero 已经修复,当前 src 无引用)
+
+---
+
+## 四、未测边界
+
+| 边界 | 原因 |
+|------|------|
+| /me 页登录态 UI 渲染 | headless Chrome 无 next-auth 签名 cookie,server 直接 redirect。**需登录用户在浏览器实测** QuotaCard / StatsGrid / MyFanSupport 视觉。 |
+| VoteModal 已投态 / 满额态弹窗 | useVoteAction.openVote() 在已投/满额时是 toast 提示,不再弹 modal。Modal 三态的代码逻辑作为防御性渲染保留(直接传 prop 时可触发),实际生产路径走不到。 |
+| 真实下单后 /api/vote 调用 | hooks 里 fire-and-forget,失败静默忽略。后端 schema 尚未加 unique 约束,可能重复写入(下文待办)。 |
+| 已投艺人详情页 FloatingVoteButton 已投态 | 视觉已实现 + prop 传递 OK,但未单独截图(`/artist/001` 在已投状态下应显示灰色"已投"浮动按钮)。 |
+
+---
+
+## 五、后端待办清单
+
+新规则需要后端配合,但本次 /loop 不动 `src/app/api/*` 和 `prisma/schema.prisma`。**以下事项必须在前端发布前完成**,否则前端 store 防护可被绕过(清 localStorage 再投):
+
+| 待办 | 文件 | 说明 |
+|------|------|------|
+| Vote 表加唯一约束 | `prisma/schema.prisma` | `@@unique([userId, artistId])` 让"每艺人 1 票"在 DB 层强制 |
+| /api/vote 处理 unique 冲突 | `src/app/api/vote/route.ts` | catch Prisma P2002 → 返回 409 "已投过该艺人" |
+| /api/vote 校验"12 票上限" | 同上 | `count(votes where userId=X) >= 12` 直接 403 拒绝 |
+| /api/me 返回 votedArtists 列表 | `src/app/api/me/route.ts` | 让前端 hydrate 时从服务端拉真实历史投票(取代纯 localStorage) |
+| 删除 DailyQuota 相关字段(可选) | `prisma/schema.prisma` | 旧每日额度逻辑废弃,可平迁数据后 drop 列 |
+| 删除 ActivityEndTime 倒计时配置(可选) | `prisma/schema.prisma` | Hero 不再用倒计时,新规则不限时 |
+
+---
+
+## 六、已知风险
+
+1. **localStorage 可清除绕过前端校验**:用户开 devtools 清 `cyber-star-vote` 后能再次投票。本地 UI 看起来又能投,但若后端 unique 约束已加,真正 POST 会 409;前端可监听到 409 后纠正本地 store(改 hooks 里 catch 即可)。**临时风险窗口在 后端未加 unique 之前**。
+
+2. **/me 页 server-only 渲染依赖 next-auth cookie**:headless 测试不便。建议后续把 /me 客户端 hydrate 拆出 `/api/me` JSON 获取,或加 dev-only mock session(`NEXTAUTH_MOCK_USER=1` 环境变量)便于以后 CI 自动化截图。
+
+3. **VoteModal 已投态/满额态在生产路径走不到**:用户实际操作不会看到这两态(useVoteAction.openVote() 已 toast 屏蔽)。代码层面保留是为了防止父组件忘传防护时仍能优雅展示。
+
+4. **artist.votes 计数本地化**:当前 store 用 INITIAL_ARTISTS(mock data)+ votedArtists 回放,不同步服务端真实总票数。Top12 排名是基于"我自己投过的票数"。**正式生产前必须接入 /api/artists/list 获取实时聚合票数**。
+
+5. **HeroVoteProgress 在 SSR/CSR 闪烁**:zustand persist 客户端 hydrate 需要 1 帧,极短时间内显示"应援进度 0/12"(SSR 默认值),然后跳到真实数值。当前用 useSession status 加默认 0 兜底,影响在低端机上可能可见。如需消除,可在 Provider 加 onFinishHydration 后再渲染 children。
+
+---
+
+## 七、回滚预案
+
+如果上线后出问题需要快速回滚:
+
+```bash
+# 撤销所有改动(本次 commit 之前的状态)
+git checkout <previous-commit> -- \
+  src/lib/store.ts src/hooks/useVoteAction.ts src/components/VoteModal.tsx \
+  src/components/HeroBanner.tsx src/app/page.tsx src/app/me/MeContent.tsx \
+  src/components/me/QuotaCard.tsx src/components/me/StatsGrid.tsx \
+  src/components/me/MyFanSupport.tsx src/components/auth/RemainingVotesBadge.tsx \
+  src/components/cards/ArtistCard.tsx src/components/ranking/RankingRow.tsx \
+  src/components/artist/ArtistDetailContent.tsx src/components/FloatingVoteButton.tsx \
+  src/app/ranking/page.tsx
+
+# 删除新增文件
+rm src/components/HeroVoteProgress.tsx
+```
+
+旧版 `Countdown` 仍在 `src/components/ui/Countdown.tsx`,未删除,回滚后可继续用。
+
+---
+
+## 八、未做的事(避免误解)
+
+- ❌ 没有 `git push`,没有 `git commit`(用户规则要求)
+- ❌ 没有改 `src/app/api/*` 任何 route
+- ❌ 没有改 `prisma/schema.prisma`
+- ❌ 没有改 `package.json` / `next.config.js`(尝试装 puppeteer 被 pnpm store 拒绝,改为系统 Chrome + 手写 CDP 客户端,不留下任何依赖污染)
+- ❌ 没有重启 dev server
+- ❌ 没有动 TOS 上的视频/图片

docs/todo/voting-refactor.md

@@ -0,0 +1,221 @@
+# 投票系统重构 · 完整方案
+
+## 核心规则变更
+
+| 维度 | 旧 | 新 |
+|---|---|---|
+| 单用户额度 | 每日 10/12 票(跨日重置) | **终身 12 票**(永不重置) |
+| 单艺人上限 | 不限 | **每位艺人最多 1 票** |
+| 单次投票数 | 可选 1/3/5/ALL | **固定 1 票** |
+| 时间窗 | 有 startAt/endAt 倒计时 | **无时间限制** |
+| 用户最终行为 | 累积投出 N 票 | **必须选出 12 个不同艺人** |
+| 可撤销 | — | **不可撤销** |
+
+## 设计决策(已拍板默认值)
+
+- **A. Hero 进度条**: 12 格点亮式(已投亮紫, 未投暗紫边框, 横向排开)
+- **B. VoteModal 确认按钮文案**: `投出我的一票`
+- **C. 已投艺人卡片角标**: 右上角紫色 ✓ 圆角标(20px), 阴影柔和
+- **D. 持久化**: zustand persist + localStorage(仅 `votedArtists` 字段)
+
+## 本 loop 执行范围
+
+**只动前端**(Store + Hooks + 组件 + 新组件)。
+**后端 API/Schema 不动** —— 风险大需要单独迁移, 留给后续 commit。
+前端 Store 强制阻止重复投票, API 即使旧的也能正常工作。
+
+---
+
+## 阶段 1 · Store 重构(单文件改重)
+
+### `src/lib/store.ts`
+
+- 删 `DAILY_VOTE_QUOTA = 10` 常量
+- 新增 `export const TOTAL_VOTE_QUOTA = 12` 常量
+- 删 `usedToday`, `quotaDate` 字段
+- `myVotesByArtist: Record<string, number>` → `votedArtists: string[]`
+- `MySupport` 接口删 `votedCount` 字段, 只留 `artist`
+- `vote(id, count)` → `vote(id): { ok: boolean; reason?: "already" | "exhausted" }`
+- `selectRemaining` = `TOTAL_VOTE_QUOTA - votedArtists.length`
+- 新增 `selectHasVoted(id)` 高阶函数, 返回 `(s: VoteStore) => boolean`
+- 新增 `selectIsExhausted(s) => votedArtists.length >= 12`
+- 删 `todayKey()` 函数
+- 重写 `selectMySupports` 基于 `votedArtists` 派生
+- **加 persist 中间件**:
+  - `import { persist } from "zustand/middleware"`
+  - 仅持久化 `votedArtists`(partialize)
+  - storage key: `cyber-star-vote`
+
+---
+
+## 阶段 2 · 交互闭环
+
+### `src/hooks/useVoteAction.ts`
+
+- import 改用 `TOTAL_VOTE_QUOTA` + `selectHasVoted`
+- 接口 `confirmVote(artist, count)` → `confirmVote(artist)`(去 count)
+- `openVote` 新增检查: `selectHasVoted(artist.id)` → toast `"你已为 ${artist.name} 投过票"` + abort
+- `openVote` `remaining <= 0` 时 toast 改 `"你的 12 票已用完, 感谢支持"`
+- `confirmVote` 调用 store.vote 不传 count
+- API POST body 去掉 count(`{ artistId }`)
+- 成功 toast: `"已为 ${artist.name} 投票 · 剩余 X 票"`
+- 第 12 票投完瞬间额外 toast: `"完成!你的 12 票已全部投出"`(里程碑)
+
+### `src/components/VoteModal.tsx`
+
+- 删 `VOTE_OPTIONS` 数组 / `defaultOption` / `resolveCount` / `selected` state
+- 删 1/3/5/ALL 选择 grid 整块
+- props 去掉 `remaining` 依赖(保留显示用), `dailyQuota` 字段名保留语义改为 totalQuota
+- 标题保留 "为 X 投票"
+- 副标题保留 `No.${no} · Current Rank #${rank}`
+- **新增警示文案**: `"投出后不可撤销, 每位艺人仅能投 1 票"`
+- 显示 "剩余 X / 12 票"
+- 确认按钮: **`投出我的一票`** (loading 时显示 spinner)
+- 已投态(打开时若 hasVoted=true): 标题改 "你已为 TA 投过票了" + 关闭按钮唯一
+- 用完态(remaining=0): 标题改 "12 票已用完 · 感谢支持"
+
+---
+
+## 阶段 3 · 已投态 UI(可 sub-agent 并行 3-4 个文件)
+
+### `src/components/cards/ArtistCard.tsx`
+
+- import `selectHasVoted`
+- `const hasVoted = useVoteStore(selectHasVoted(artist.id))`
+- 投票按钮已投态: `✓ 已投票`, 灰禁用 (`bg-elevated text-white/45 border border-white/10`)
+- 卡片右上角加紫色 ✓ 角标(20×20px, `bg-purple-500 rounded-full shadow-purple-glow`), `absolute top-2 right-2 z-10`
+
+### `src/components/ranking/RankingRow.tsx`
+
+- import `selectHasVoted`
+- 同样的 hasVoted 判断
+- 按钮已投态: `✓ 已投`, 灰禁用
+- **顺便修复**: 移除非 Top12 的 `opacity-[0.78]` 暗化(用户已要求过)
+
+### `src/components/artist/ArtistDetailContent.tsx`
+
+- HeroPanel 内的投票按钮: hasVoted → 文案 `✓ 已投票`, `disabled` prop, 紫色淡化
+- 头像下方加 ✓ 角标(同 ArtistCard 风格)
+
+### `src/components/FloatingVoteButton.tsx`
+
+- props 新增 `disabled?: boolean`
+- disabled=true: Heart 改 Check, 文案改 `已投`, 样式灰
+- 调用方 ArtistDetailContent: 透传 `disabled={hasVoted}`
+
+---
+
+## 阶段 4 · 新建 HeroVoteProgress 替换倒计时
+
+### 新建 `src/components/HeroVoteProgress.tsx`
+
+视觉: 12 个小圆点 / 方块横排, 已投亮紫(`bg-purple-500 shadow-purple-glow`), 未投暗紫(`bg-purple-500/15 border border-purple-500/40`)。
+
+```
+你的投票  ·  5 / 12
+● ● ● ● ● ○ ○ ○ ○ ○ ○ ○
+```
+
+状态机:
+- 未登录: `登录后开始投票` + 点击触发 LoginModal(用 useLoginModalStore)
+- 已投 0/12: 显示标题 "你的投票 · 0 / 12" + 12 格全暗
+- 投票中(1-11): 标题 + 进度格子 + 副文案 "还可投 X 位艺人"
+- 已投满 12/12: 标题 + 12 格全亮 + ✓ 图标 + 文案 "12 票全部投出 · 感谢支持"
+
+样式约束:
+- 紧凑模式, 高度 ≤ 80px(替换原 Countdown 位置)
+- 半透明背景 + backdrop-blur(与原 Countdown 视觉一致)
+- 文字白色, 进度紫色
+
+### `src/components/HeroBanner.tsx`
+
+- 删 `endTime` prop 和接口字段
+- 删 `import Countdown`
+- 删右上角倒计时整块
+- 替换为 `<HeroVoteProgress />` (位置不变, 右上角)
+- 不要删 Countdown.tsx 文件(可能其他场景用)
+
+### `src/app/page.tsx`
+
+- 删 `import { getActivityEndTime }` 和 `const endTime` 行
+- `<HeroBanner>` 调用去掉 `endTime` 属性
+
+---
+
+## 阶段 5 · /me 页 + Badge
+
+### `src/components/auth/RemainingVotesBadge.tsx`
+
+- 文案 `今日剩余 X / 10` → `剩余 X / 12`
+- 注释 "今日剩余票数" → "剩余票数"
+- 未登录显示 `0 / 12`
+
+### `src/components/me/QuotaCard.tsx`
+
+- 标题 `今日剩余票数` → `剩余票数`
+- 删 `明日 00:00 重置为 X 票` 整行
+- 副文案改 `共 12 票 · 用满完成投票`(已投完则 `12 票全部投出 · 感谢支持`)
+- props `dailyQuota` 保留(语义改为 totalQuota, 不重命名避免大面积改动)
+
+### `src/components/me/StatsGrid.tsx`
+
+- 新规则下 "累计投票" 和 "应援艺人" 永远相等 → 删一个
+- 改为单 stat 组合: `已投 X / 12 票` + `剩余 12-X 票`(两格)
+- 图标 Sparkles → Check(已投), Star → Heart(剩余)
+
+### `src/components/me/MyFanSupport.tsx`
+
+- 移除 `votedCount` 引用
+- "已投 X 票" → 紫色 ✓ 徽章 + 文案 "已投票"
+- 空态文案: `还没有应援的艺人` → `还没有投过票 · 去为你喜欢的艺人投出第一票`
+
+### `src/app/me/MeContent.tsx`
+
+- `myVotesByArtist` 引用全改 `votedArtists`
+- supports useMemo 派生逻辑改为遍历 `votedArtists`
+- `myTotalVotes` 改 `votedArtists.length` 或直接删, 用 `.length`
+- 传 StatsGrid 的 props 改: `voted={N}` `remaining={12-N}`
+
+---
+
+## 阶段 6 · 验证
+
+### 浏览器手动验证
+
+1. 首页 Hero 区域显示 HeroVoteProgress, 12 格状态正确
+2. 点首页某艺人 "投票" → 弹窗显示新文案, 点 "投出我的一票" → toast 成功 + Hero 进度 +1
+3. 再点同一艺人 → toast "你已为 TA 投过票", 弹窗不打开
+4. 进入 /me 页 → QuotaCard 不显示 "明日重置", StatsGrid 显示新统计, MyFanSupport 显示 ✓ 徽章
+5. 投满 12 票 → 触发里程碑 toast, 所有未投艺人按钮变灰禁用
+6. 浏览器硬刷新 → votedArtists 从 localStorage 恢复, 已投态保持
+7. 排行榜页 → 已投艺人按钮变灰, 未投可点
+8. 详情页 HeroPanel 按钮 + FloatingVoteButton 都正确响应 hasVoted
+
+### 编译验证
+
+- dev server 已在 3000 跑着, 改一个文件就 hot-reload 一次, 不要重启
+- 检查 dev server log 没有红色 ERROR
+- 没有任何 TypeScript 错误(`grep -E "Type error|TS\d+" dev-server.log`)
+
+---
+
+## 阶段 7 · 收尾报告
+
+完成后写报告 `docs/todo/voting-refactor-完成报告.md`, 列:
+
+1. 改了哪些文件(完整列表)
+2. 新建了哪些文件
+3. 哪些功能验证通过, 哪些边界没测
+4. 后续 backend 改动清单(schema unique 约束 / API 检查重投 / API 检查总额度)
+5. 已知风险或 TODO
+
+---
+
+## 硬禁区(loop 必须遵守)
+
+- 不要 git push 任何分支
+- 不要动 `src/app/api/*` 任何 API route
+- 不要动 `prisma/schema.prisma`
+- 不要重启 dev server(3000 已经在跑, hot-reload 就行)
+- 不要动 TOS 上传 / 视频文件 / 任何资源文件
+- 不要碰 `package.json` / `next.config.js`

docs/团队对接-TOS与短信登录.md

@@ -0,0 +1,247 @@
+# 团队对接 · TOS 资源桶 + 阿里云短信登录
+
+> 这是给后端 / 运维同学的对接清单。把每一项的「需要回填」补齐后，原文回给前端（Claude）就能直接接入。
+> 文件里所有变量名都跟 `.env.example` 对齐，回填时直接写值即可。
+
+---
+
+## A. 火山引擎 TOS · 静态资源
+
+### A.1 目标
+
+把 36 位艺人的立绘 / 氛围图 / 三视图 / 表演视频 + Hero PV 全部走 TOS + CDN 引用。
+当前本地 ~1GB 资源已 `.gitignore`，**不入 git**。
+
+### A.2 桶配置建议
+
+| 项 | 建议值 | 备注 |
+|---|---|---|
+| 桶名 | `cyber-star` | 名字仅用于服务端 SDK，前端只看域名 |
+| 区域 | `cn-beijing` 或就近 | 跟用户群体所在区域一致 |
+| 读权限 | **公共读 (Public Read)** | 投票网站资源全部对外可访问，不需要签名 URL |
+| 写权限 | 私有 | 仅服务端 / 运维通过 AK/SK 写入 |
+| CDN 加速 | **强烈建议开启** | 火山 TOS 可直接挂火山 CDN，全国边缘加速；不开 CDN 时直接走桶域名也行，只是速度差一些 |
+| 防盗链 | 可选 | 起步阶段不限制；后期可加 Referer 白名单 `*.airlabs.art` |
+| HTTPS | **必须** | 网站走 HTTPS，资源也必须是 HTTPS，否则浏览器拦截 |
+
+### A.3 桶内目录结构（请保持一致）
+
+```
+cyber-star/
+├── portraits/
+│   ├── 001.png         # 立绘（卡片用，半身）
+│   ├── 001-2.png       # 氛围图 2
+│   ├── 001-3.png       # 氛围图 3
+│   ├── 001-view.png    # 三视图（详情页备用，可暂不上传）
+│   ├── 002.png
+│   ├── ...
+│   └── 036-3.png
+└── videos/
+    ├── hero-pv.mp4         # 首页 Hero 背景 PV
+    └── artists/
+        ├── 001.mp4
+        ├── 002.mp4
+        ├── 004.mp4         # 003 / 010 / 017 / 027 暂时缺，先不传
+        └── ...
+```
+
+> 路径与本地 `public/portraits/` `public/videos/` 完全对齐。前端代码里只需要把 `/portraits/...` 替换为 `${TOS_DOMAIN}/portraits/...`。
+
+### A.4 前端要的信息（**必填**）
+
+```yaml
+# ── 公共域名（前端代码引用资源用，必须公网 HTTPS 可达）──
+NEXT_PUBLIC_TOS_DOMAIN: ""    # 例：https://cyber-star.tos-cn-beijing.volces.com
+                              # 或挂 CDN 后：https://cdn.cyber-star.airlabs.art
+
+# ── 是否启用公共读 ──
+PUBLIC_READ: ""               # yes / no（若 no 请说明签名策略）
+
+# ── CDN 是否启用 + 加速域名 ──
+CDN_ENABLED: ""               # yes / no
+CDN_DOMAIN: ""                # 启用 CDN 时填这个，前端用这个域名而不是桶原域名
+```
+
+### A.5 服务端要的信息（**仅当后端要写桶 / 头像直传时需要**，前端暂时不需要）
+
+> ⚠️ AK/SK 是高敏感信息，**不要发到聊天里**。请用密钥管理工具同步给运维 / CI 环境变量，或者通过加密渠道（飞书加密文件 / 1Password）给。下面只是占位提醒。
+
+```yaml
+TOS_ENDPOINT: ""              # tos-cn-beijing.volces.com
+TOS_REGION: ""                # cn-beijing
+TOS_BUCKET: ""                # cyber-star
+TOS_ACCESS_KEY: ""            # 走密钥管理，不写明文
+TOS_SECRET_KEY: ""            # 走密钥管理，不写明文
+```
+
+### A.6 上传分工
+
+- [ ] **前端**（Claude）负责压缩。把 `public/portraits/` 和 `public/videos/` 用 sharp + ffmpeg 批量转换，输出到 `assets-compressed/`，保持 A.3 的目录结构。压缩目标：
+  - 立绘 PNG → WebP，目标单张 ≤ 800KB（卡片清晰度足够）
+  - 三视图 PNG → WebP，目标单张 ≤ 1.5MB
+  - Hero PV mp4 → H.264 1080p，目标 ≤ 15MB
+  - 单人 solo mp4 → H.264 1080p，目标单条 ≤ 3MB
+- [ ] **运维 / 后端** 拿到 `assets-compressed/` 后用 `tosutil` 整目录上传到桶根：
+  ```bash
+  tosutil cp -r -f assets-compressed/* tos://cyber-star/
+  ```
+- [ ] **前端**（Claude）回填 `NEXT_PUBLIC_TOS_DOMAIN` 进 `.env`，封装 `tosUrl(path)` 工具函数，把代码里所有 `/portraits/...` `/videos/...` 改成走该函数。
+
+### A.7 验收
+
+- [ ] 浏览器直接打开 `${NEXT_PUBLIC_TOS_DOMAIN}/portraits/001.png` 能看到图
+- [ ] 同样地址在 https 下不报 mixed-content
+- [ ] 网站首页加载，Network 面板看到立绘从 TOS 域名下载，状态 200
+
+---
+
+## B. 阿里云短信服务 · 手机号 OTP 登录
+
+### B.1 目标
+
+`/api/auth/send-otp` 现在只在控制台打 log，需要接真实短信通道，给用户发 6 位验证码完成手机号登录。
+全国大陆手机号，5 分钟内有效，单号码 60 秒限频（前端已做）。
+
+### B.2 阿里云控制台需要申请的东西
+
+按这个顺序在阿里云控制台 → **短信服务** 申请：
+
+#### B.2.1 短信签名
+
+- **签名内容**：`Cyber Star` 或 `虚拟偶像出道企划` 或公司主体相关
+- **签名类型**：通用
+- **使用场景**：验证码（推荐）/ 网站会员注册
+- **审核材料**：网站备案截图 / 公司营业执照（看运营那边怎么对接）
+- **审核时长**：1-2 工作日
+
+#### B.2.2 短信模板
+
+- **模板类型**：验证码
+- **模板内容**（必须严格使用 `${code}` 占位符）：
+  ```
+  您的验证码是 ${code}，5 分钟内有效，请勿泄露。
+  ```
+- **审核时长**：1-2 工作日
+- 申请通过后会拿到一个 `SMS_xxxxxxxx` 的模板 Code
+
+#### B.2.3 RAM 子账号 + AccessKey
+
+- 在阿里云 RAM 创建子账号 `cyber-star-sms`，授予 `AliyunDysmsFullAccess` 权限
+- 生成 AccessKey ID + Secret（一次性显示，存好）
+
+### B.3 前端要的信息（**必填**）
+
+```yaml
+# ── 短信签名与模板（公开信息，可以聊天里给）──
+SMS_SIGN_NAME: ""             # 例：Cyber Star
+SMS_TEMPLATE_CODE: ""         # 例：SMS_298765432
+
+# ── 接入信息（敏感，走密钥管理）──
+SMS_ACCESS_KEY: ""            # 阿里云 RAM 子账号 AK
+SMS_SECRET_KEY: ""            # 阿里云 RAM 子账号 SK
+SMS_REGION: ""                # 默认 cn-hangzhou，国内一般不变
+```
+
+### B.4 上下游依赖（**必填，缺一个都跑不起来**）
+
+#### B.4.1 Redis
+
+```yaml
+REDIS_URL: ""                 # redis://default:PASSWORD@host:port
+                              # 用途：① OTP 验证码 5min TTL 存储 ② 限流计数（手机号 60s/IP 5min 等）
+```
+
+如果还没有 Redis 实例，可以先用火山 Redis（同地域低延迟）或自建。**最低规格够用**，QPS 不大。
+
+#### B.4.2 MySQL
+
+```yaml
+DATABASE_URL: ""              # mysql://user:pwd@host:port/db?charset=utf8mb4
+                              # 用途：用户表 / 投票记录 / 应援关系 / 每日额度
+```
+
+- 火山 RDS for MySQL 8 或自建均可
+- 第一次部署需要跑：
+  ```bash
+  npx prisma migrate deploy
+  npx prisma db seed   # 灌 36 位艺人 + ActivityConfig（活动开关 / 起止时间 / 每日额度）
+  ```
+
+#### B.4.3 NextAuth
+
+```yaml
+AUTH_SECRET: ""               # openssl rand -base64 32 生成
+AUTH_URL: ""                  # 例：https://cyber-star.airlabs.art（生产域名，不含末尾斜杠）
+```
+
+### B.5 后端要做的代码改动（仅 1 处，~10 行）
+
+`src/app/api/auth/send-otp/route.ts` 第 41-53 行现在长这样：
+
+```ts
+const redis = getRedis();
+if (redis) {
+  await redis.set(`sms:otp:${phone}`, code, "EX", 300);
+}
+
+// TODO[团队]: 接入真实短信服务（阿里云 / 火山引擎 SMS）
+if (process.env.NODE_ENV !== "production") {
+  console.log(`[dev-otp] 发送给 ${phone}: ${code}`);
+}
+```
+
+要改成调阿里云 SDK 真实发短信。**这一步前端（Claude）可以代写**，需要后端确认接 SDK 用 `@alicloud/dysmsapi20170525` 还是 `@alicloud/pop-core`，或者后端自己写也行。
+
+### B.6 验收
+
+- [ ] 真实手机号点「获取验证码」，30 秒内收到短信，内容包含 6 位数字
+- [ ] 验证码填回去能登录成功，导航栏显示头像
+- [ ] 60 秒内对同一手机号再次请求，接口返回 429（限流生效）
+- [ ] OTP 5 分钟后失效
+
+---
+
+## C. 回填模板（**直接复制这一块改值，整段返回给前端**）
+
+```yaml
+# ───── A. TOS 资源桶 ─────
+NEXT_PUBLIC_TOS_DOMAIN: ""
+PUBLIC_READ: ""
+CDN_ENABLED: ""
+CDN_DOMAIN: ""
+
+# ───── B. 阿里云短信 ─────
+SMS_SIGN_NAME: ""
+SMS_TEMPLATE_CODE: ""
+SMS_REGION: ""
+
+# ───── B.4 基础依赖 ─────
+REDIS_URL: ""
+DATABASE_URL: ""
+AUTH_SECRET: ""
+AUTH_URL: ""
+
+# ───── 备注（其他需要前端知道的事情）─────
+# 例如：访问令牌怎么续期、桶有没有 Referer 白名单、SMS 模板审核状态等
+NOTES: |
+
+```
+
+**敏感信息（AK/SK）请单独走密钥管理或加密渠道，不要写在这个文件里。**
+
+---
+
+## D. 时间线建议
+
+```
+Day 0 (今天)         ─ 后端 / 运维拿到这份文档，开始走流程
+Day 1                ─ 阿里云提交签名 / 模板审核（等 1-2 天）
+                     ─ 创建 TOS 桶 + CDN 域名
+                     ─ 部署 MySQL / Redis 实例
+Day 1-3              ─ 前端这边：本地压缩 1GB 资源 → 输出到 assets-compressed/
+                     ─ 前端代码适配 NEXT_PUBLIC_TOS_DOMAIN 占位
+Day 2-3              ─ 短信审核通过 → 回填模板 + AK
+                     ─ 资源上传到 TOS
+Day 3                ─ 联调：真实手机号收验证码，登录，投票，资源走 CDN
+Day 4                ─ 上线
+```

k8s/ingress.yaml

@@ -0,0 +1,23 @@
+apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  name: cyberstar-ingress
+  annotations:
+    kubernetes.io/ingress.class: "traefik"
+    cert-manager.io/cluster-issuer: "letsencrypt-prod"
+spec:
+  tls:
+  - hosts:
+    - cyberstar.airlabs.art
+    secretName: cyberstar-tls
+  rules:
+  - host: cyberstar.airlabs.art
+    http:
+      paths:
+      - path: /
+        pathType: Prefix
+        backend:
+          service:
+            name: cyberstar-web
+            port:
+              number: 80

k8s/web-deployment.yaml

@@ -0,0 +1,75 @@
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: cyberstar-web
+  labels:
+    app: cyberstar-web
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      app: cyberstar-web
+  template:
+    metadata:
+      labels:
+        app: cyberstar-web
+    spec:
+      imagePullSecrets:
+      - name: cr-pull-secret
+      containers:
+      - name: cyberstar-web
+        image: ${CI_REGISTRY_IMAGE}/cyberstar-web:latest
+        imagePullPolicy: Always
+        ports:
+        - containerPort: 3000
+        env:
+        - name: NODE_ENV
+          value: "production"
+        - name: PORT
+          value: "3000"
+        - name: HOSTNAME
+          value: "0.0.0.0"
+        - name: AUTH_URL
+          value: "https://cyberstar.airlabs.art"
+        - name: AUTH_TRUST_HOST
+          value: "true"
+        # 敏感配置 / 第三方凭据从 Secret 注入（部署前需 kubectl create secret generic cyberstar-env --from-env-file=.env）
+        envFrom:
+        - secretRef:
+            name: cyberstar-env
+            optional: true
+        livenessProbe:
+          httpGet:
+            path: /
+            port: 3000
+          initialDelaySeconds: 30
+          periodSeconds: 10
+          timeoutSeconds: 5
+          failureThreshold: 3
+        readinessProbe:
+          httpGet:
+            path: /
+            port: 3000
+          initialDelaySeconds: 10
+          periodSeconds: 5
+          timeoutSeconds: 3
+          failureThreshold: 3
+        resources:
+          requests:
+            memory: "256Mi"
+            cpu: "200m"
+          limits:
+            memory: "1024Mi"
+            cpu: "1000m"
+---
+apiVersion: v1
+kind: Service
+metadata:
+  name: cyberstar-web
+spec:
+  selector:
+    app: cyberstar-web
+  ports:
+    - protocol: TCP
+      port: 80
+      targetPort: 3000

next.config.ts

@@ -3,6 +3,21 @@ import type { NextConfig } from "next";
 const nextConfig: NextConfig = {
   // 关闭左下角的开发指示器（dev overlay 角标）
   devIndicators: false,
+  // 容器化部署：产出精简的 standalone 包（node server.js 启动）
+  output: "standalone",
+  // next/image 配置
+  //  - unoptimized: 关闭服务端 image 优化代理。资源已在 TOS 桶里是 WebP + 适配尺寸,
+  //    走 CDN,无需 Next.js 再编码一次。还能绕过 dev 时 fake-IP 代理(Clash/V2Ray TUN
+  //    返回 198.18.x.x)被 Next 16 拒绝 fetch 的问题。
+  //  - remotePatterns: 即便不优化,Next 16 仍会校验远程域名白名单,保留 TOS + CDN 域名。
+  images: {
+    unoptimized: true,
+    remotePatterns: [
+      { protocol: "https", hostname: "*.tos-cn-shanghai.volces.com" },
+      { protocol: "https", hostname: "*.tos-cn-beijing.volces.com" },
+      { protocol: "https", hostname: "*.volccdn.com" },
+    ],
+  },
 };
 
 export default nextConfig;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cyber-star",
-  "version": "0.1.0",
+  "version": "0.3.4",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -14,6 +14,9 @@
     "db:seed": "tsx prisma/seed.ts"
   },
   "dependencies": {
+    "@alicloud/dysmsapi20170525": "^4.5.1",
+    "@alicloud/openapi-client": "^0.4.15",
+    "@alicloud/tea-util": "^1.4.11",
     "@auth/prisma-adapter": "^2.11.2",
     "@prisma/client": "^6.19.3",
     "clsx": "^2.1.1",

pnpm-lock.yaml

@@ -8,6 +8,15 @@ importers:
 
   .:
     dependencies:
+      '@alicloud/dysmsapi20170525':
+        specifier: ^4.5.1
+        version: 4.5.1
+      '@alicloud/openapi-client':
+        specifier: ^0.4.15
+        version: 0.4.15
+      '@alicloud/tea-util':
+        specifier: ^1.4.11
+        version: 1.4.11
       '@auth/prisma-adapter':
         specifier: ^2.11.2
         version: 2.11.2(@prisma/client@6.19.3(prisma@6.19.3(typescript@6.0.3))(typescript@6.0.3))
@@ -84,6 +93,60 @@ importers:
 
 packages:
 
+  '@alicloud/credentials@2.4.4':
+    resolution: {integrity: sha512-/eRAGSKcniLIFQ1UCpDhB/IrHUZisQ1sc65ws/c2avxUMpXwH1rWAohb76SVAUJhiF4mwvLzLJM1Mn1XL4Xe/Q==}
+
+  '@alicloud/darabonba-array@0.1.2':
+    resolution: {integrity: sha512-ZPuQ+bJyjrd8XVVm55kl+ypk7OQoi1ZH/DiToaAEQaGvgEjrTcvQkg71//vUX/6cvbLIF5piQDvhrLb+lUEIPQ==}
+
+  '@alicloud/darabonba-encode-util@0.0.1':
+    resolution: {integrity: sha512-Sl5vCRVAYMqwmvXpJLM9hYoCHOMsQlGxaWSGhGWulpKk/NaUBArtoO1B0yHruJf1C5uHhEJIaylYcM48icFHgw==}
+
+  '@alicloud/darabonba-encode-util@0.0.2':
+    resolution: {integrity: sha512-mlsNctkeqmR0RtgE1Rngyeadi5snLOAHBCWEtYf68d7tyKskosXDTNeZ6VCD/UfrUu4N51ItO8zlpfXiOgeg3A==}
+
+  '@alicloud/darabonba-map@0.0.1':
+    resolution: {integrity: sha512-2ep+G3YDvuI+dRYVlmER1LVUQDhf9kEItmVB/bbEu1pgKzelcocCwAc79XZQjTcQGFgjDycf3vH87WLDGLFMlw==}
+
+  '@alicloud/darabonba-signature-util@0.0.4':
+    resolution: {integrity: sha512-I1TtwtAnzLamgqnAaOkN0IGjwkiti//0a7/auyVThdqiC/3kyafSAn6znysWOmzub4mrzac2WiqblZKFcN5NWg==}
+
+  '@alicloud/darabonba-string@1.0.3':
+    resolution: {integrity: sha512-NyWwrU8cAIesWk3uHL1Q7pTDTqLkCI/0PmJXC4/4A0MFNAZ9Ouq0iFBsRqvfyUujSSM+WhYLuTfakQXiVLkTMA==}
+
+  '@alicloud/dysmsapi20170525@4.5.1':
+    resolution: {integrity: sha512-6l0N6M+uV2l+KxF5XOiZ3DZoDlrZ2ZxFDKkr424KJm0A6kSsQlRNV5eiJoMkB6h11KYf0BD5/0lXzW8SkPtGMA==}
+
+  '@alicloud/endpoint-util@0.0.1':
+    resolution: {integrity: sha512-+pH7/KEXup84cHzIL6UJAaPqETvln4yXlD9JzlrqioyCSaWxbug5FUobsiI6fuUOpw5WwoB3fWAtGbFnJ1K3Yg==}
+
+  '@alicloud/gateway-pop@0.0.6':
+    resolution: {integrity: sha512-KF4I+JvfYuLKc3fWeWYIZ7lOVJ9jRW0sQXdXidZn1DKZ978ncfGf7i0LBfONGk4OxvNb/HD3/0yYhkgZgPbKtA==}
+
+  '@alicloud/gateway-spi@0.0.8':
+    resolution: {integrity: sha512-KM7fu5asjxZPmrz9sJGHJeSU+cNQNOxW+SFmgmAIrITui5hXL2LB+KNRuzWmlwPjnuA2X3/keq9h6++S9jcV5g==}
+
+  '@alicloud/openapi-client@0.4.15':
+    resolution: {integrity: sha512-4VE0/k5ZdQbAhOSTqniVhuX1k5DUeUMZv74degn3wIWjLY6Bq+hxjaGsaHYlLZ2gA5wUrs8NcI5TE+lIQS3iiA==}
+
+  '@alicloud/openapi-core@1.0.7':
+    resolution: {integrity: sha512-I80PQVfmlzRiXGHwutMp2zTpiqUVv8ts30nWAfksfHUSTIapk3nj9IXaPbULMPGNV6xqEyshO2bj2a+pmwc2tQ==}
+
+  '@alicloud/openapi-util@0.3.3':
+    resolution: {integrity: sha512-vf0cQ/q8R2U7ZO88X5hDiu1yV3t/WexRj+YycWxRutkH/xVXfkmpRgps8lmNEk7Ar+0xnY8+daN2T+2OyB9F4A==}
+
+  '@alicloud/tea-typescript@1.8.0':
+    resolution: {integrity: sha512-CWXWaquauJf0sW30mgJRVu9aaXyBth5uMBCUc+5vKTK1zlgf3hIqRUjJZbjlwHwQ5y9anwcu18r48nOZb7l2QQ==}
+
+  '@alicloud/tea-util@1.4.11':
+    resolution: {integrity: sha512-HyPEEQ8F0WoZegiCp7sVdrdm6eBOB+GCvGl4182u69LDFktxfirGLcAx3WExUr1zFWkq2OSmBroTwKQ4w/+Yww==}
+
+  '@alicloud/tea-util@1.4.9':
+    resolution: {integrity: sha512-S0wz76rGtoPKskQtRTGqeuqBHFj8BqUn0Vh+glXKun2/9UpaaaWmuJwcmtImk6bJZfLYEShDF/kxDmDJoNYiTw==}
+
+  '@alicloud/tea-xml@0.0.3':
+    resolution: {integrity: sha512-+/9GliugjrLglsXVrd1D80EqqKgGpyA0eQ6+1ZdUOYCaRguaSwz44trX3PaxPu/HhIPJg9PsGQQ3cSLXWZjbAA==}
+
   '@alloc/quick-lru@5.2.0':
     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
     engines: {node: '>=10'}
@@ -174,6 +237,9 @@ packages:
     resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
     engines: {node: '>=6.9.0'}
 
+  '@darabonba/typescript@1.0.4':
+    resolution: {integrity: sha512-icl8RGTw4DiWRpco6dVh21RS0IqrH4s/eEV36TZvz/e1+paogSZjaAgox7ByrlEuvG+bo5d8miq/dRlqiUaL/w==}
+
   '@emnapi/core@1.10.0':
     resolution: {integrity: sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==}
 
@@ -800,9 +866,15 @@ packages:
   '@types/json5@0.0.29':
     resolution: {integrity: sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==}
 
+  '@types/node@12.0.2':
+    resolution: {integrity: sha512-5tabW/i+9mhrfEOUcLDu2xBPsHJ+X5Orqy9FKpale3SjDA17j5AEpYq5vfy3oAeAHGcvANRCO3NV3d2D6q3NiA==}
+
   '@types/node@20.19.40':
     resolution: {integrity: sha512-xxx6M2IpSTnnKcR0cMvIiohkiCx20/oRPtWGbenFygKCGl3zqUzdNjQ/1V4solq1LU+dgv0nQzeGOuqkqZGg0Q==}
 
+  '@types/node@22.19.19':
+    resolution: {integrity: sha512-dyh/xO2Fh5bYrfWaaqGrRQQGkNdmYw6AmaAUvYeUMNTWQtvb796ikLdmTchRmOlOiIJ1TDXfWgVx1QkUlQ6Hew==}
+
   '@types/react-dom@19.2.3':
     resolution: {integrity: sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==}
     peerDependencies:
@@ -811,6 +883,9 @@ packages:
   '@types/react@19.2.14':
     resolution: {integrity: sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==}
 
+  '@types/xml2js@0.4.14':
+    resolution: {integrity: sha512-4YnrRemBShWRO2QjvUin8ESA41rH+9nQGLUGZV/1IDhi3SL9OhdpNC/MrulTWuptXKwhx/aDxE7toV0f/ypIXQ==}
+
   '@typescript-eslint/eslint-plugin@8.59.2':
     resolution: {integrity: sha512-j/bwmkBvHUtPNxzuWe5z6BEk3q54YRyGlBXkSsmfoih7zNrBvl5A9A98anlp/7JbyZcWIJ8KXo/3Tq/DjFLtuQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
@@ -1616,6 +1691,9 @@ packages:
   hermes-parser@0.25.1:
     resolution: {integrity: sha512-6pEjquH3rqaI6cYAXYPcz9MS4rY6R4ngRgrgfDshRptUZIc3lw0MCIJIGDj9++mfySOuPTHB4nrSW99BCvOPIA==}
 
+  httpx@2.3.3:
+    resolution: {integrity: sha512-k1qv94u1b6e+XKCxVbLgYlOypVP9MPGpnN5G/vxFf6tDO4V3xpz3d6FUOY/s8NtPgaq5RBVVgSB+7IHpVxMYzw==}
+
   ignore@5.3.2:
     resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==}
     engines: {node: '>= 4'}
@@ -1632,6 +1710,10 @@ packages:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
     engines: {node: '>=0.8.19'}
 
+  ini@1.3.5:
+    resolution: {integrity: sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==}
+    deprecated: Please update to ini >=1.3.6 to avoid a prototype pollution issue
+
   internal-slot@1.1.0:
     resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
     engines: {node: '>= 0.4'}
@@ -1808,6 +1890,9 @@ packages:
   keyv@4.5.4:
     resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
 
+  kitx@2.2.0:
+    resolution: {integrity: sha512-tBMwe6AALTBQJb0woQDD40734NKzb0Kzi3k7wQj9ar3AbP9oqhoVrdXPh7rk2r00/glIgd0YbToIUJsnxWMiIg==}
+
   language-subtag-registry@0.3.20:
     resolution: {integrity: sha512-KPMwROklF4tEx283Xw0pNKtfTj1gZ4UByp4EsIFWLgBavJltF4TiYPc39k06zSTsLzxTVXXDSpbwaQXaFB4Qeg==}
 
@@ -1906,6 +1991,9 @@ packages:
   lodash.merge@4.6.2:
     resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
 
+  lodash@4.18.1:
+    resolution: {integrity: sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==}
+
   loose-envify@1.4.0:
     resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
     hasBin: true
@@ -1955,6 +2043,12 @@ packages:
     resolution: {integrity: sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==}
     engines: {node: '>=16 || 14 >=14.17'}
 
+  moment-timezone@0.5.45:
+    resolution: {integrity: sha512-HIWmqA86KcmCAhnMAN0wuDOARV/525R2+lOLotuGFzn4HO+FH+/645z2wx0Dt3iDv6/p61SIvKnDstISainhLQ==}
+
+  moment@2.30.1:
+    resolution: {integrity: sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==}
+
   motion-dom@12.38.0:
     resolution: {integrity: sha512-pdkHLD8QYRp8VfiNLb8xIBJis1byQ9gPT3Jnh2jqfFtAsWUA3dEepDlsWe/xMpO8McV+VdpKVcp+E+TGJEtOoA==}
 
@@ -2254,6 +2348,10 @@ packages:
     resolution: {integrity: sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==}
     engines: {node: '>= 0.4'}
 
+  sax@1.6.0:
+    resolution: {integrity: sha512-6R3J5M4AcbtLUdZmRv2SygeVaM7IhrLXu9BmnOGmmACak8fiUtOsYNWUS4uK7upbmHIBbLBeFeI//477BKLBzA==}
+    engines: {node: '>=11.0.0'}
+
   scheduler@0.27.0:
     resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==}
 
@@ -2310,6 +2408,9 @@ packages:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
 
+  sm3@1.0.3:
+    resolution: {integrity: sha512-KyFkIfr8QBlFG3uc3NaljaXdYcsbRy1KrSfc4tsQV8jW68jAktGeOcifu530Vx/5LC+PULHT0Rv8LiI8Gw+c1g==}
+
   source-map-js@1.2.1:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
     engines: {node: '>=0.10.0'}
@@ -2515,6 +2616,14 @@ packages:
     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
     engines: {node: '>=12'}
 
+  xml2js@0.6.2:
+    resolution: {integrity: sha512-T4rieHaC1EXcES0Kxxj4JWgaUQHDk+qwHcYOCFHfiwKz7tOVPLq7Hjq9dM1WCMhylqMEfP7hMcOIChvotiZegA==}
+    engines: {node: '>=4.0.0'}
+
+  xmlbuilder@11.0.1:
+    resolution: {integrity: sha512-fDlsI/kFEx7gLvbecc0/ohLG50fugQp8ryHzMTuW9vSa1GJ0XYWKnhsUx7oie3G98+r56aTQIUB4kht42R3JvA==}
+    engines: {node: '>=4.0'}
+
   yallist@3.1.1:
     resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
 
@@ -2547,6 +2656,146 @@ packages:
 
 snapshots:
 
+  '@alicloud/credentials@2.4.4':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      httpx: 2.3.3
+      ini: 1.3.5
+      kitx: 2.2.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/darabonba-array@0.1.2':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/darabonba-encode-util@0.0.1':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      moment: 2.30.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/darabonba-encode-util@0.0.2':
+    dependencies:
+      moment: 2.30.1
+
+  '@alicloud/darabonba-map@0.0.1':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/darabonba-signature-util@0.0.4':
+    dependencies:
+      '@alicloud/darabonba-encode-util': 0.0.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/darabonba-string@1.0.3':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/dysmsapi20170525@4.5.1':
+    dependencies:
+      '@alicloud/openapi-core': 1.0.7
+      '@darabonba/typescript': 1.0.4
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/endpoint-util@0.0.1':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      kitx: 2.2.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/gateway-pop@0.0.6':
+    dependencies:
+      '@alicloud/credentials': 2.4.4
+      '@alicloud/darabonba-array': 0.1.2
+      '@alicloud/darabonba-encode-util': 0.0.2
+      '@alicloud/darabonba-map': 0.0.1
+      '@alicloud/darabonba-signature-util': 0.0.4
+      '@alicloud/darabonba-string': 1.0.3
+      '@alicloud/endpoint-util': 0.0.1
+      '@alicloud/gateway-spi': 0.0.8
+      '@alicloud/openapi-util': 0.3.3
+      '@alicloud/tea-typescript': 1.8.0
+      '@alicloud/tea-util': 1.4.11
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/gateway-spi@0.0.8':
+    dependencies:
+      '@alicloud/credentials': 2.4.4
+      '@alicloud/tea-typescript': 1.8.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/openapi-client@0.4.15':
+    dependencies:
+      '@alicloud/credentials': 2.4.4
+      '@alicloud/gateway-spi': 0.0.8
+      '@alicloud/openapi-util': 0.3.3
+      '@alicloud/tea-typescript': 1.8.0
+      '@alicloud/tea-util': 1.4.9
+      '@alicloud/tea-xml': 0.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/openapi-core@1.0.7':
+    dependencies:
+      '@alicloud/credentials': 2.4.4
+      '@alicloud/gateway-pop': 0.0.6
+      '@alicloud/gateway-spi': 0.0.8
+      '@darabonba/typescript': 1.0.4
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/openapi-util@0.3.3':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      '@alicloud/tea-util': 1.4.11
+      kitx: 2.2.0
+      sm3: 1.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/tea-typescript@1.8.0':
+    dependencies:
+      '@types/node': 12.0.2
+      httpx: 2.3.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/tea-util@1.4.11':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      '@darabonba/typescript': 1.0.4
+      kitx: 2.2.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/tea-util@1.4.9':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      kitx: 2.2.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@alicloud/tea-xml@0.0.3':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      '@types/xml2js': 0.4.14
+      xml2js: 0.6.2
+    transitivePeerDependencies:
+      - supports-color
+
   '@alloc/quick-lru@5.2.0': {}
 
   '@auth/core@0.41.2':
@@ -2666,6 +2915,17 @@ snapshots:
       '@babel/helper-string-parser': 7.27.1
       '@babel/helper-validator-identifier': 7.28.5
 
+  '@darabonba/typescript@1.0.4':
+    dependencies:
+      '@alicloud/tea-typescript': 1.8.0
+      httpx: 2.3.3
+      lodash: 4.18.1
+      moment: 2.30.1
+      moment-timezone: 0.5.45
+      xml2js: 0.6.2
+    transitivePeerDependencies:
+      - supports-color
+
   '@emnapi/core@1.10.0':
     dependencies:
       '@emnapi/wasi-threads': 1.2.1
@@ -3128,10 +3388,16 @@ snapshots:
 
   '@types/json5@0.0.29': {}
 
+  '@types/node@12.0.2': {}
+
   '@types/node@20.19.40':
     dependencies:
       undici-types: 6.21.0
 
+  '@types/node@22.19.19':
+    dependencies:
+      undici-types: 6.21.0
+
   '@types/react-dom@19.2.3(@types/react@19.2.14)':
     dependencies:
       '@types/react': 19.2.14
@@ -3140,6 +3406,10 @@ snapshots:
     dependencies:
       csstype: 3.2.3
 
+  '@types/xml2js@0.4.14':
+    dependencies:
+      '@types/node': 20.19.40
+
   '@typescript-eslint/eslint-plugin@8.59.2(@typescript-eslint/parser@8.59.2(eslint@9.39.4(jiti@2.7.0))(typescript@6.0.3))(eslint@9.39.4(jiti@2.7.0))(typescript@6.0.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.2
@@ -4115,6 +4385,13 @@ snapshots:
     dependencies:
       hermes-estree: 0.25.1
 
+  httpx@2.3.3:
+    dependencies:
+      '@types/node': 20.19.40
+      debug: 4.4.3
+    transitivePeerDependencies:
+      - supports-color
+
   ignore@5.3.2: {}
 
   ignore@7.0.5: {}
@@ -4126,6 +4403,8 @@ snapshots:
 
   imurmurhash@0.1.4: {}
 
+  ini@1.3.5: {}
+
   internal-slot@1.1.0:
     dependencies:
       es-errors: 1.3.0
@@ -4316,6 +4595,10 @@ snapshots:
     dependencies:
       json-buffer: 3.0.1
 
+  kitx@2.2.0:
+    dependencies:
+      '@types/node': 22.19.19
+
   language-subtag-registry@0.3.20: {}
 
   language-tags@1.0.9:
@@ -4386,6 +4669,8 @@ snapshots:
 
   lodash.merge@4.6.2: {}
 
+  lodash@4.18.1: {}
+
   loose-envify@1.4.0:
     dependencies:
       js-tokens: 3.0.0
@@ -4429,6 +4714,12 @@ snapshots:
 
   minipass@7.1.3: {}
 
+  moment-timezone@0.5.45:
+    dependencies:
+      moment: 2.30.1
+
+  moment@2.30.1: {}
+
   motion-dom@12.38.0:
     dependencies:
       motion-utils: 12.36.0
@@ -4728,6 +5019,8 @@ snapshots:
       es-errors: 1.3.0
       is-regex: 1.2.1
 
+  sax@1.6.0: {}
+
   scheduler@0.27.0: {}
 
   semver@6.3.1: {}
@@ -4824,6 +5117,8 @@ snapshots:
 
   signal-exit@4.1.0: {}
 
+  sm3@1.0.3: {}
+
   source-map-js@1.2.1: {}
 
   stable-hash@0.0.5: {}
@@ -5111,6 +5406,13 @@ snapshots:
       string-width: 5.1.2
       strip-ansi: 7.2.0
 
+  xml2js@0.6.2:
+    dependencies:
+      sax: 1.6.0
+      xmlbuilder: 11.0.1
+
+  xmlbuilder@11.0.1: {}
+
   yallist@3.1.1: {}
 
   zod-validation-error@4.0.2(zod@4.4.3):

pnpm-workspace.yaml

@@ -1,4 +1,5 @@
 allowBuilds:
+  '@alicloud/openapi-core': false
   '@prisma/client': true
   '@prisma/engines': true
   esbuild: true

prisma/migrations/manual/20260515_vote_lifetime_quota.sql

@@ -0,0 +1,20 @@
+-- =====================================================
+-- 投票模型从"每日额度"切换为"终身 12 票 + 每艺人 1 票"
+-- 生成时间: 2026-05-15
+-- 影响: votes 表
+-- =====================================================
+
+-- 1. 先加唯一约束:每个用户对每个艺人最多 1 票(DB 层硬约束)
+--    生产探查确认零重复 (userId, artistId),加约束不会失败
+--    leading column 是 user_id,可作为 FK(votes.user_id → users.id)的索引基础
+ALTER TABLE `votes` ADD UNIQUE INDEX `votes_user_id_artist_id_key` (`user_id`, `artist_id`);
+
+-- 2. 删除旧的非唯一复合索引(userId, artistId, createdAt)
+--    新 unique 索引以 user_id 开头,已经能满足 FK 约束的 leading 索引要求
+ALTER TABLE `votes` DROP INDEX `votes_user_id_artist_id_created_at_idx`;
+
+-- =====================================================
+-- 回滚 SQL(如需撤销)
+-- ALTER TABLE `votes` ADD INDEX `votes_user_id_artist_id_created_at_idx` (`user_id`, `artist_id`, `created_at`);
+-- ALTER TABLE `votes` DROP INDEX `votes_user_id_artist_id_key`;
+-- =====================================================

prisma/schema.prisma

@@ -5,6 +5,9 @@
 
 generator client {
   provider      = "prisma-client-js"
+  // native：本地开发（macOS / linux-glibc）
+  // linux-musl-openssl-3.0.x：容器运行时（node:22-alpine）
+  binaryTargets = ["native", "linux-musl-openssl-3.0.x"]
 }
 
 datasource db {
@@ -16,25 +19,39 @@ datasource db {
 // 艺人 · 候选偶像
 // =============================================================
 model Artist {
-  id          String   @id @db.VarChar(8) // 编号 001 ~ 035
+  id          String   @id @db.VarChar(8) // 编号 001 ~ 036
   no          String   @unique @db.VarChar(8) // 展示用编号（带前置零）
   name        String   @db.VarChar(50) // 中文名
   enName      String   @map("en_name") @db.VarChar(50) // 英文名
-  slogan      String   @db.VarChar(120) // 短宣传语
+  bio         String   @db.Text // 详细简介 / 人物小传
-  bio         String   @db.Text // 详细简介
-  birthday    String   @db.VarChar(8) // MM-DD
   height      Int      @db.SmallInt // cm
-  cv          String?  @db.VarChar(80) // CV 配音
+
-  themeColor  String   @map("theme_color") @db.VarChar(10) // 应援色 hex
+  // 人物小传字段（从《36 位虚拟艺人人物小传.docx》提取）
-  portrait    String?  @db.VarChar(500) // 立绘主图 URL
+  age         Int?     @db.SmallInt // 年龄
-  avatar      String?  @db.VarChar(500) // 圆形头像 URL
+  gender      String?  @db.VarChar(1) // 'M' / 'F' / 'N'
-  videoUrl    String?  @map("video_url") @db.VarChar(500) // 15s 表演视频
+  motto       String?  @db.VarChar(200) // 座右铭
-  videoPoster String?  @map("video_poster") @db.VarChar(500) // 视频封面
+  personality String?  @db.Text // 性格描述
-  tags        Json     @db.Json // string[] 标签数组
+  catchphrase String?  @db.VarChar(200) // 口头禅
+  skills      String?  @db.VarChar(200) // 核心技能（顿号分隔）
+  track       String?  @db.VarChar(200) // 核心赛道（顿号分隔）
+
+  // 媒体资源（URL 走 TOS 桶 + CDN）
+  portrait    String?  @db.VarChar(500)
+  avatar      String?  @db.VarChar(500)
+  videoUrl    String?  @map("video_url") @db.VarChar(500)
+  videoPoster String?  @map("video_poster") @db.VarChar(500)
+
+  // 历史遗留字段（前端已不再使用，保留为可选避免破坏既有数据）
+  slogan      String?  @db.VarChar(120)
+  birthday    String?  @db.VarChar(8) // MM-DD
+  cv          String?  @db.VarChar(80)
+  themeColor  String?  @map("theme_color") @db.VarChar(10)
+
+  tags        Json     @db.Json // ArtistTag[] · 现在是音乐流派 (rock/pop/chinese/hiphop/folk/jazz)
   status      ArtistStatus @default(ACTIVE)
   /// 缓存字段：当前票数。定期由后台聚合任务更新，避免实时 SUM(votes)。
   voteCount   Int      @default(0) @map("vote_count")
-  /// 缓存字段：当前排名（1 ~ 35）。同上由后台计算。
+  /// 缓存字段：当前排名。同上由后台计算。
   currentRank Int?     @map("current_rank")
   createdAt   DateTime @default(now()) @map("created_at")
   updatedAt   DateTime @updatedAt @map("updated_at")
@@ -132,8 +149,9 @@ model Vote {
   artist Artist @relation(fields: [artistId], references: [id], onDelete: Cascade)
 
   @@map("votes")
-  // 关键索引：用户每日单艺人查询、艺人聚合
+  // 投票规则:每用户对每艺人仅可投 1 票 —— DB 硬约束,防止并发绕过前端
-  @@index([userId, artistId, createdAt])
+  @@unique([userId, artistId])
+  // 关键索引:艺人聚合 / 时序查询
   @@index([artistId, createdAt])
   @@index([createdAt])
 }

prisma/seed.ts

@@ -1,70 +1,28 @@
 /**
- * Prisma 种子脚本 · 用于初始化 35 位艺人 + 活动配置
+ * Prisma 种子脚本 · 把 36 位真实艺人 + 活动配置写入 DB
+ *
+ * 数据来源：src/lib/artist-bios.ts (从《36 位虚拟艺人人物小传.docx》提取)
+ * 这份文件同时是前端 SSG 的静态源 + DB 的 seed 源,双写但单一来源,
+ * 改人物字段时只需要改 artist-bios.ts,然后重跑 seed。
  *
  * 运行：pnpm db:seed
+ *
+ * 注意：portrait / videoUrl 等 TOS URL 不写入 DB —— 前端从 NEXT_PUBLIC_TOS_DOMAIN
+ * 自动拼接,DB 字段保留为 NULL (灵活度高,换桶不需要重跑 seed)。
  */
 
-import { PrismaClient } from "@prisma/client";
+import { PrismaClient, Prisma } from "@prisma/client";
+import { ARTIST_SEEDS } from "../src/lib/artist-bios";
 
 const prisma = new PrismaClient();
 
-interface SeedArtist {
-  no: string;
-  name: string;
-  enName: string;
-  slogan: string;
-  themeColor: string;
-  birthday: string;
-  height: number;
-  tags: string[];
-  hasCV: boolean;
-}
-
-const STAGE_NAMES: SeedArtist[] = [
-  { no: "001", name: "艺奈", enName: "AURORA", slogan: "破晓极光", themeColor: "#8b5cf6", birthday: "01-15", height: 165, tags: ["vocal", "visual"], hasCV: true },
-  { no: "002", name: "路米", enName: "LUMI", slogan: "暖光治愈", themeColor: "#ec4899", birthday: "02-22", height: 163, tags: ["dance", "all-rounder"], hasCV: true },
-  { no: "003", name: "星澪", enName: "NEBULA", slogan: "星云吟唱", themeColor: "#06b6d4", birthday: "03-08", height: 167, tags: ["rap", "leader"], hasCV: true },
-  { no: "004", name: "凯", enName: "KAI", slogan: "海岸少年", themeColor: "#f59e0b", birthday: "04-12", height: 178, tags: ["all-rounder"], hasCV: true },
-  { no: "005", name: "回音", enName: "ECHO", slogan: "声波女王", themeColor: "#10b981", birthday: "05-30", height: 164, tags: ["vocal", "leader"], hasCV: true },
-  { no: "006", name: "薇尔", enName: "VEIL", slogan: "薄雾低语", themeColor: "#ef4444", birthday: "06-18", height: 162, tags: ["dance", "visual"], hasCV: true },
-  { no: "007", name: "艾莉雅", enName: "ARIA", slogan: "咏叹之声", themeColor: "#a78bfa", birthday: "07-25", height: 168, tags: ["vocal"], hasCV: true },
-  { no: "008", name: "怜", enName: "REN", slogan: "莲华少女", themeColor: "#f472b6", birthday: "08-09", height: 161, tags: ["rap", "all-rounder"], hasCV: true },
-  { no: "009", name: "米拉", enName: "MIRA", slogan: "镜面舞者", themeColor: "#38bdf8", birthday: "09-14", height: 166, tags: ["dance"], hasCV: true },
-  { no: "010", name: "诺娃", enName: "NOVA", slogan: "超新星", themeColor: "#fbbf24", birthday: "10-31", height: 165, tags: ["visual", "all-rounder"], hasCV: true },
-  { no: "011", name: "纪罗", enName: "KIRO", slogan: "Rap 制造机", themeColor: "#34d399", birthday: "11-11", height: 175, tags: ["rap"], hasCV: true },
-  { no: "012", name: "瑞", enName: "ZUI", slogan: "醉月夜", themeColor: "#fb7185", birthday: "12-24", height: 169, tags: ["vocal", "dance"], hasCV: true },
-  { no: "013", name: "阳", enName: "SOL", slogan: "阳光少年", themeColor: "#fcd34d", birthday: "01-08", height: 172, tags: ["all-rounder"], hasCV: false },
-  { no: "014", name: "凛", enName: "LIN", slogan: "学院偶像", themeColor: "#8b5cf6", birthday: "02-14", height: 168, tags: ["vocal"], hasCV: false },
-  { no: "015", name: "律", enName: "LYRA", slogan: "竖琴公主", themeColor: "#a78bfa", birthday: "03-22", height: 164, tags: ["vocal", "visual"], hasCV: false },
-  { no: "016", name: "昕", enName: "DAWN", slogan: "晨曦少女", themeColor: "#f472b6", birthday: "04-05", height: 166, tags: ["dance"], hasCV: false },
-  { no: "017", name: "天", enName: "SKY", slogan: "天空之翼", themeColor: "#38bdf8", birthday: "05-19", height: 170, tags: ["all-rounder"], hasCV: false },
-  { no: "018", name: "语", enName: "ARIE", slogan: "诗与远方", themeColor: "#10b981", birthday: "06-30", height: 163, tags: ["vocal"], hasCV: false },
-  { no: "019", name: "翼", enName: "WING", slogan: "飞翔之翼", themeColor: "#ef4444", birthday: "07-15", height: 174, tags: ["dance", "all-rounder"], hasCV: false },
-  { no: "020", name: "铃", enName: "CHIME", slogan: "风铃声", themeColor: "#fbbf24", birthday: "08-21", height: 162, tags: ["vocal"], hasCV: false },
-  { no: "021", name: "夜", enName: "NYX", slogan: "暗夜女神", themeColor: "#7c3aed", birthday: "09-28", height: 167, tags: ["visual", "rap"], hasCV: false },
-  { no: "022", name: "晴", enName: "SUNNY", slogan: "晴空万里", themeColor: "#facc15", birthday: "10-06", height: 165, tags: ["all-rounder"], hasCV: false },
-  { no: "023", name: "月", enName: "LUNA", slogan: "月光女神", themeColor: "#c4b5fd", birthday: "11-25", height: 168, tags: ["vocal", "visual"], hasCV: false },
-  { no: "024", name: "岚", enName: "STORM", slogan: "暴风之子", themeColor: "#0ea5e9", birthday: "12-13", height: 176, tags: ["rap"], hasCV: false },
-  { no: "025", name: "雷", enName: "BOLT", slogan: "雷霆速度", themeColor: "#eab308", birthday: "01-29", height: 173, tags: ["dance"], hasCV: false },
-  { no: "026", name: "焰", enName: "FLARE", slogan: "火焰之心", themeColor: "#dc2626", birthday: "02-08", height: 169, tags: ["all-rounder"], hasCV: false },
-  { no: "027", name: "雪", enName: "FROST", slogan: "霜花少女", themeColor: "#e0e7ff", birthday: "03-15", height: 161, tags: ["vocal"], hasCV: false },
-  { no: "028", name: "林", enName: "LEAF", slogan: "森林精灵", themeColor: "#22c55e", birthday: "04-22", height: 164, tags: ["dance", "all-rounder"], hasCV: false },
-  { no: "029", name: "渊", enName: "ABYSS", slogan: "深渊之声", themeColor: "#1e293b", birthday: "05-11", height: 171, tags: ["rap"], hasCV: false },
-  { no: "030", name: "瑶", enName: "JADE", slogan: "翡翠少女", themeColor: "#14b8a6", birthday: "06-27", height: 163, tags: ["visual"], hasCV: false },
-  { no: "031", name: "晨", enName: "AURIA", slogan: "金色晨光", themeColor: "#f59e0b", birthday: "07-04", height: 166, tags: ["all-rounder"], hasCV: false },
-  { no: "032", name: "岩", enName: "ROCK", slogan: "硬核摇滚", themeColor: "#78716c", birthday: "08-16", height: 177, tags: ["rap"], hasCV: false },
-  { no: "033", name: "翔", enName: "SOAR", slogan: "翱翔天际", themeColor: "#0284c7", birthday: "09-02", height: 175, tags: ["dance"], hasCV: false },
-  { no: "034", name: "茉", enName: "MOLLY", slogan: "茉莉芬芳", themeColor: "#fef3c7", birthday: "10-19", height: 162, tags: ["visual", "vocal"], hasCV: false },
-  { no: "035", name: "梓", enName: "AZUR", slogan: "蓝调诗人", themeColor: "#6366f1", birthday: "11-07", height: 165, tags: ["all-rounder"], hasCV: false },
-];
-
 async function main() {
   console.log("🌱 开始 seed 数据库...");
 
-  // 1. 创建活动配置
+  // 1. 活动配置 (upsert: 第一次创建, 后续仅延长 endAt)
   const now = new Date();
   const endAt = new Date(now);
-  endAt.setDate(endAt.getDate() + 12);
+  endAt.setDate(endAt.getDate() + 30); // 默认活动期 30 天
 
   await prisma.activityConfig.upsert({
     where: { id: 1 },
@@ -74,47 +32,71 @@ async function main() {
       endAt,
       voteEnabled: true,
       dailyQuota: 10,
-      perArtistLimit: 0,
+      perArtistLimit: 0, // 不限单艺人
       paidVoteEnabled: false,
     },
     update: {
       endAt,
       voteEnabled: true,
+      dailyQuota: 10,
+      perArtistLimit: 0,
     },
   });
-  console.log("  ✓ 活动配置已写入");
+  console.log("  ✓ 活动配置已写入 (dailyQuota=10, voteEnabled=true)");
 
-  // 2. 创建 35 位艺人
+  // 2. 36 位艺人 (upsert: 若 DB 里有旧 seed 的假数据, 覆盖为真实姓名/简介)
-  for (const a of STAGE_NAMES) {
+  let created = 0;
-    await prisma.artist.upsert({
+  let updated = 0;
-      where: { id: a.no },
+  for (const seed of ARTIST_SEEDS) {
-      create: {
+    const existing = await prisma.artist.findUnique({ where: { id: seed.no } });
-        id: a.no,
+
-        no: a.no,
+    const data = {
-        name: a.name,
+      no: seed.no,
-        enName: a.enName,
+      name: seed.name,
-        slogan: a.slogan,
+      enName: seed.enName,
-        bio: `来自虚拟星域的偶像候选人 ${a.enName}（${a.name}），从小热爱音乐与舞蹈。代表作《${a.enName} - ${a.slogan}》深受粉丝喜爱。立志成为 Top12 出道阵容的一员，用音乐传递梦想与力量。`,
+      bio: seed.bio,
-        birthday: a.birthday,
+      height: seed.height,
-        height: a.height,
+      age: seed.age,
-        cv: a.hasCV ? `CV 配音 #${a.no}` : null,
+      gender: seed.gender,
-        themeColor: a.themeColor,
+      motto: seed.motto ?? null,
-        tags: a.tags,
+      personality: seed.personality ?? null,
+      catchphrase: seed.catchphrase ?? null,
+      skills: seed.skills ?? null,
+      track: seed.track ?? null,
+      tags: seed.tags as unknown as Prisma.InputJsonValue,
+    };
+
+    if (existing) {
+      await prisma.artist.update({
+        where: { id: seed.no },
+        data,
+      });
+      updated++;
+    } else {
+      await prisma.artist.create({
+        data: {
+          id: seed.no,
+          ...data,
           status: "ACTIVE",
           voteCount: 0,
-        currentRank: parseInt(a.no, 10),
+          currentRank: parseInt(seed.no, 10),
-      },
-      update: {
-        name: a.name,
-        enName: a.enName,
-        slogan: a.slogan,
-        themeColor: a.themeColor,
-        tags: a.tags,
         },
       });
+      created++;
     }
-  console.log(`  ✓ 已写入 ${STAGE_NAMES.length} 位艺人`);
+  }
+  console.log(
+    `  ✓ 36 人 seed 完成 (新建 ${created}, 更新 ${updated})`,
+  );
 
+  // 3. 报告 DB 当前状态
+  const stats = {
+    artists: await prisma.artist.count({ where: { status: "ACTIVE" } }),
+    users: await prisma.user.count(),
+    votes: await prisma.vote.count(),
+    config: await prisma.activityConfig.count(),
+  };
+  console.log("📊 DB 当前状态:", stats);
   console.log("✅ Seed 完成");
 }
 

scripts/apply-migration.mjs

@@ -0,0 +1,50 @@
+// 把 prisma/migrations/manual/*.sql 直接 apply 到当前 DATABASE_URL
+// 不依赖 prisma migrate dev(项目无 migrations 历史 + 无 shadow DB)
+//
+// 用法: node scripts/apply-migration.mjs <sql-file>
+import { PrismaClient } from "@prisma/client";
+import { readFile } from "node:fs/promises";
+
+const prisma = new PrismaClient({ log: ["warn", "error"] });
+
+async function main() {
+  const file = process.argv[2];
+  if (!file) {
+    console.error("用法: node scripts/apply-migration.mjs <sql-file>");
+    process.exit(2);
+  }
+  const sql = await readFile(file, "utf-8");
+  // 先按行去掉所有 -- 注释行,再按 ; 切分,过滤空段
+  const cleaned = sql
+    .split("\n")
+    .filter((l) => !/^\s*--/.test(l))
+    .join("\n");
+  const statements = cleaned
+    .split(/;\s*(?:\n|$)/)
+    .map((s) => s.trim())
+    .filter(Boolean);
+
+  console.log(`将执行 ${statements.length} 条 SQL:\n`);
+  statements.forEach((s, i) => console.log(`  [${i + 1}] ${s.split("\n")[0]}...`));
+  console.log("");
+
+  for (const [i, stmt] of statements.entries()) {
+    console.log(`[${i + 1}/${statements.length}] 执行中...`);
+    try {
+      await prisma.$executeRawUnsafe(stmt);
+      console.log(`[${i + 1}] ✓ 成功`);
+    } catch (e) {
+      console.error(`[${i + 1}] ✗ 失败: ${e.message}`);
+      throw e;
+    }
+  }
+
+  console.log("\n=== 全部成功 ===");
+  await prisma.$disconnect();
+}
+
+main().catch(async (e) => {
+  console.error("\n[ABORT]", e.message);
+  await prisma.$disconnect();
+  process.exit(1);
+});

scripts/cdp-screenshot.mjs

@@ -0,0 +1,351 @@
+// 一次性截图脚本 —— 用系统 Chrome 的 remote debugging 协议直接通信,
+// 避免装 puppeteer/playwright(项目 pnpm store 状态不允许)。
+//
+// 通过 Fetch.requestPaused 拦截 /api/auth/session 注入 mock next-auth session,
+// 让客户端 useSession() 以为已登录,从而能触发 VoteModal / 进入 /me 页。
+import { spawn } from "node:child_process";
+import { writeFile, mkdir } from "node:fs/promises";
+import { setTimeout as wait } from "node:timers/promises";
+
+const CHROME = "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe";
+const PORT = 9333;
+const PROFILE = "C:\\Users\\10419\\AppData\\Local\\Temp\\cs-voting-shot";
+const OUT_DIR = "d:\\ClaudeProjects\\虚拟明星\\UI-UX\\docs\\screenshots\\voting-refactor";
+const ORIGIN = "http://localhost:3000";
+
+const MOCK_SESSION = {
+  user: { id: "mock-user", name: "测试用户" },
+  expires: new Date(Date.now() + 86400 * 1000).toISOString(),
+};
+
+async function launchChrome() {
+  const proc = spawn(
+    CHROME,
+    [
+      `--headless=new`,
+      `--disable-gpu`,
+      `--remote-debugging-port=${PORT}`,
+      `--user-data-dir=${PROFILE}`,
+      `--window-size=1500,900`,
+      `--hide-scrollbars`,
+      `--no-first-run`,
+      `--no-default-browser-check`,
+      `about:blank`,
+    ],
+    { stdio: "ignore", detached: true },
+  );
+  proc.unref();
+  for (let i = 0; i < 30; i++) {
+    try {
+      const r = await fetch(`http://127.0.0.1:${PORT}/json/version`);
+      if (r.ok) return proc.pid;
+    } catch (_e) {
+      void _e;
+    }
+    await wait(300);
+  }
+  throw new Error("Chrome remote debugging did not come up");
+}
+
+async function killChrome(pid) {
+  try {
+    process.kill(pid);
+  } catch {
+    /* */
+  }
+  spawn("taskkill", ["/F", "/PID", String(pid), "/T"], { stdio: "ignore" });
+}
+
+async function openPage() {
+  const r = await fetch(`http://127.0.0.1:${PORT}/json/new?about:blank`, {
+    method: "PUT",
+  });
+  return await r.json();
+}
+
+class CDP {
+  constructor(wsUrl) {
+    this.ws = null;
+    this.wsUrl = wsUrl;
+    this.id = 0;
+    this.pending = new Map();
+    this.listeners = new Set();
+  }
+  async connect() {
+    this.ws = new WebSocket(this.wsUrl);
+    await new Promise((res, rej) => {
+      this.ws.addEventListener("open", () => res(), { once: true });
+      this.ws.addEventListener("error", (e) => rej(e), { once: true });
+    });
+    this.ws.addEventListener("message", (ev) => {
+      const msg = JSON.parse(ev.data);
+      if (msg.id && this.pending.has(msg.id)) {
+        const { resolve, reject } = this.pending.get(msg.id);
+        this.pending.delete(msg.id);
+        if (msg.error) reject(new Error(msg.error.message));
+        else resolve(msg.result);
+      } else if (msg.method) {
+        for (const cb of this.listeners) cb(msg);
+      }
+    });
+  }
+  on(cb) {
+    this.listeners.add(cb);
+    return () => this.listeners.delete(cb);
+  }
+  send(method, params = {}) {
+    const id = ++this.id;
+    return new Promise((resolve, reject) => {
+      this.pending.set(id, { resolve, reject });
+      this.ws.send(JSON.stringify({ id, method, params }));
+    });
+  }
+  close() {
+    this.ws.close();
+  }
+}
+
+function b64(str) {
+  return Buffer.from(str).toString("base64");
+}
+
+/** 安装 /api/auth/session 拦截器 —— 返回 mock session 让 useSession 觉得已登录。
+ *  /me 路由会调用 next-auth/server,这个对客户端透明 —— 但 /me 页是 server component 包了
+ *  client MeContent,如果 server 端 redirect 我们抓 not handled。简单做法:直接 navigate
+ *  到 /me 仍可能 redirect,但 hero / 卡片 / vote modal 这些纯 client 用 useSession 都 OK。
+ */
+async function setupSessionMock(cdp) {
+  await cdp.send("Fetch.enable", {
+    patterns: [{ urlPattern: "*/api/auth/session*" }],
+  });
+  cdp.on(async (msg) => {
+    if (msg.method !== "Fetch.requestPaused") return;
+    const { requestId, request } = msg.params;
+    if (request.url.includes("/api/auth/session")) {
+      const body = b64(JSON.stringify(MOCK_SESSION));
+      await cdp.send("Fetch.fulfillRequest", {
+        requestId,
+        responseCode: 200,
+        responseHeaders: [
+          { name: "Content-Type", value: "application/json" },
+          { name: "Cache-Control", value: "no-store" },
+        ],
+        body,
+      });
+    } else {
+      await cdp.send("Fetch.continueRequest", { requestId });
+    }
+  });
+}
+
+async function waitForLoad(cdp, ms = 2000) {
+  await wait(ms);
+}
+
+async function setLocalStorage(cdp, items) {
+  for (const [key, value] of Object.entries(items)) {
+    await cdp.send("Runtime.evaluate", {
+      expression: `localStorage.setItem(${JSON.stringify(key)}, ${JSON.stringify(value)})`,
+    });
+  }
+}
+
+async function clearLocalStorage(cdp) {
+  await cdp.send("Runtime.evaluate", { expression: `localStorage.clear()` });
+}
+
+async function navigate(cdp, url, settleMs = 2500) {
+  await cdp.send("Page.navigate", { url });
+  await waitForLoad(cdp, settleMs);
+}
+
+async function pauseVideos(cdp) {
+  await cdp.send("Runtime.evaluate", {
+    expression: `document.querySelectorAll('video').forEach(v => { try { v.pause(); v.currentTime = 0.5; } catch{} });`,
+  });
+}
+
+async function screenshotFull(cdp, path) {
+  const r = await cdp.send("Page.captureScreenshot", { format: "png" });
+  await writeFile(path, Buffer.from(r.data, "base64"));
+  console.log(`[ok] ${path}`);
+}
+
+async function screenshotElement(cdp, selector, path, padding = 8) {
+  const r = await cdp.send("Runtime.evaluate", {
+    expression: `(() => {
+      const el = document.querySelector(${JSON.stringify(selector)});
+      if (!el) return null;
+      const r = el.getBoundingClientRect();
+      return { x: r.left, y: r.top, width: r.width, height: r.height };
+    })()`,
+    returnByValue: true,
+  });
+  if (!r.result || !r.result.value) {
+    console.log(`[skip] no element ${selector} for ${path}`);
+    return false;
+  }
+  const b = r.result.value;
+  const cap = await cdp.send("Page.captureScreenshot", {
+    format: "png",
+    clip: {
+      x: Math.max(0, b.x - padding),
+      y: Math.max(0, b.y - padding),
+      width: Math.max(1, b.width + padding * 2),
+      height: Math.max(1, b.height + padding * 2),
+      scale: 1,
+    },
+  });
+  await writeFile(path, Buffer.from(cap.data, "base64"));
+  console.log(`[ok] ${path}  (${selector})`);
+  return true;
+}
+
+function makeVoteState(ids) {
+  return JSON.stringify({ state: { votedArtists: ids }, version: 0 });
+}
+
+async function main() {
+  await mkdir(OUT_DIR, { recursive: true });
+  console.log("[boot] launching Chrome...");
+  const pid = await launchChrome();
+  console.log(`[boot] Chrome pid=${pid} port=${PORT}`);
+  try {
+    const target = await openPage();
+    const cdp = new CDP(target.webSocketDebuggerUrl);
+    await cdp.connect();
+    await cdp.send("Page.enable");
+    await cdp.send("Network.enable");
+    await cdp.send("Runtime.enable");
+    await cdp.send("Emulation.setDeviceMetricsOverride", {
+      width: 1500,
+      height: 900,
+      deviceScaleFactor: 1,
+      mobile: false,
+    });
+    await setupSessionMock(cdp);
+
+    // ===== 1. Hero 进度三态(裁切胶囊 + 整图各一份)=====
+    // 1a. 0/12 (已登录但未投)
+    // user-data-dir 复用会带上上次的 localStorage —— 必须先进 ORIGIN 上下文再 clear
+    await navigate(cdp, ORIGIN, 500);
+    await clearLocalStorage(cdp);
+    await navigate(cdp, ORIGIN);
+    await pauseVideos(cdp);
+    await wait(800);
+    await screenshotFull(cdp, `${OUT_DIR}\\01a-hero-0of12.png`);
+    await screenshotElement(
+      cdp,
+      "[data-hero-vote-progress]",
+      `${OUT_DIR}\\01a-progress-0of12.png`,
+      12,
+    );
+
+    // 1b. 5/12
+    await setLocalStorage(cdp, {
+      "cyber-star-vote": makeVoteState(["001", "002", "003", "004", "005"]),
+    });
+    await navigate(cdp, ORIGIN);
+    await pauseVideos(cdp);
+    await wait(800);
+    await screenshotFull(cdp, `${OUT_DIR}\\01b-hero-5of12.png`);
+    await screenshotElement(
+      cdp,
+      "[data-hero-vote-progress]",
+      `${OUT_DIR}\\01b-progress-5of12.png`,
+      12,
+    );
+
+    // 1c. 12/12
+    await setLocalStorage(cdp, {
+      "cyber-star-vote": makeVoteState([
+        "001", "002", "003", "004", "005", "006",
+        "007", "008", "009", "010", "011", "012",
+      ]),
+    });
+    await navigate(cdp, ORIGIN);
+    await pauseVideos(cdp);
+    await wait(800);
+    await screenshotFull(cdp, `${OUT_DIR}\\01c-hero-12of12.png`);
+    await screenshotElement(
+      cdp,
+      "[data-hero-vote-progress]",
+      `${OUT_DIR}\\01c-progress-12of12.png`,
+      12,
+    );
+
+    // ===== 2. 艺人卡片角标对比 =====
+    // 投了 1/3/5 — 卡片网格里能看到混合态(已投紫框✓ vs 未投灰框)
+    await setLocalStorage(cdp, {
+      "cyber-star-vote": makeVoteState(["001", "003", "005"]),
+    });
+    await navigate(cdp, ORIGIN);
+    await pauseVideos(cdp);
+    await cdp.send("Runtime.evaluate", {
+      expression: `document.getElementById('artists')?.scrollIntoView({behavior:'instant',block:'start'}); window.scrollBy(0, 100);`,
+    });
+    await wait(1000);
+    await screenshotFull(cdp, `${OUT_DIR}\\02-artist-cards-mixed.png`);
+
+    // ===== 3. /me 页 =====
+    // useSession returns mock session → MeContent 应该正常渲染
+    // 但 /me 是 server component:它在 server 端调 auth() — 我们 intercept 仅作用 client。
+    // 实际 server component 不会用到 fetch /api/auth/session,它用 cookies 直接验。
+    // 没有 next-auth cookie → server redirect。我们尝试,如果失败就截 redirect 后状态。
+    await navigate(cdp, `${ORIGIN}/me`, 1500);
+    // 检查是否被重定向
+    const urlInfo = await cdp.send("Runtime.evaluate", {
+      expression: "location.pathname",
+      returnByValue: true,
+    });
+    if (urlInfo.result.value !== "/me") {
+      console.log(
+        `[note] /me redirected to ${urlInfo.result.value} — server auth() not bypassed`,
+      );
+      // 在 hash 模式下不会 redirect; 强制 navigate 后端 client only render
+      // 退而求其次:直接构造一个空白 page 在客户端 render MeContent — 无法,跳过
+    }
+    await screenshotFull(cdp, `${OUT_DIR}\\03-me-page.png`);
+
+    // ===== 4. VoteModal 正常态(未投 + 未满) =====
+    await setLocalStorage(cdp, {
+      "cyber-star-vote": makeVoteState([]),
+    });
+    await navigate(cdp, ORIGIN);
+    await pauseVideos(cdp);
+    await wait(1200);
+    // 滚到卡片区点第一张卡的投票按钮
+    await cdp.send("Runtime.evaluate", {
+      expression: `document.getElementById('artists')?.scrollIntoView({behavior:'instant',block:'start'}); window.scrollBy(0, 100);`,
+    });
+    await wait(500);
+    const clicked = await cdp.send("Runtime.evaluate", {
+      expression: `(() => {
+        const btns = Array.from(document.querySelectorAll('button'));
+        const target = btns.find(b => (b.textContent || '').trim() === '投票');
+        if (target) { target.click(); return true; }
+        return false;
+      })()`,
+      returnByValue: true,
+    });
+    console.log(`[note] vote modal trigger: ${clicked.result.value}`);
+    await wait(1000);
+    await screenshotFull(cdp, `${OUT_DIR}\\04-vote-modal-normal.png`);
+    await screenshotElement(
+      cdp,
+      '[role="dialog"]',
+      `${OUT_DIR}\\04-vote-modal-cropped.png`,
+      24,
+    );
+
+    cdp.close();
+    console.log("[done]");
+  } finally {
+    await killChrome(pid);
+  }
+}
+
+main().catch((e) => {
+  console.error(e);
+  process.exit(1);
+});

scripts/cleanup-test-user.mjs

@@ -0,0 +1,47 @@
+// 删除测试用户 + 其所有 vote / fanSupport / signIn 数据,
+// 并把 artist.voteCount 回滚到投票前的值。
+//
+// 用法: node scripts/cleanup-test-user.mjs <phone>
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient({ log: ["error"] });
+
+const phone = process.argv[2];
+if (!phone) {
+  console.error("用法: node scripts/cleanup-test-user.mjs <phone>");
+  process.exit(2);
+}
+
+const user = await prisma.user.findUnique({
+  where: { phone },
+  select: { id: true, nickname: true },
+});
+if (!user) {
+  console.log(`[skip] 没有找到 phone=${phone} 的用户,无需 cleanup`);
+  await prisma.$disconnect();
+  process.exit(0);
+}
+
+console.log(`[cleanup] 用户 id=${user.id} (${user.nickname}) phone=${phone}`);
+
+// 1. 把该用户的投票回滚到 artist.voteCount
+const votes = await prisma.vote.findMany({
+  where: { userId: user.id },
+  select: { artistId: true, count: true },
+});
+console.log(`  待回滚 ${votes.length} 条投票`);
+
+await prisma.$transaction(async (tx) => {
+  // 1. 减回 artist.voteCount
+  for (const v of votes) {
+    await tx.artist.update({
+      where: { id: v.artistId },
+      data: { voteCount: { decrement: v.count } },
+    });
+  }
+  // 2. 删除 Vote / FanSupport / SignIn(都有 onDelete: Cascade,删 user 就够,但显式更清晰)
+  // 3. 删除 user 本身 —— cascade 会清掉关联表
+  await tx.user.delete({ where: { id: user.id } });
+});
+
+console.log("[cleanup] 完成");
+await prisma.$disconnect();

scripts/e2e-vote-flow.sh

@@ -0,0 +1,147 @@
+#!/usr/bin/env bash
+# 端到端回归测试:走完整 next-auth OTP 登录 → /api/me → /api/vote 4 种路径
+#
+# 测试用户:全新手机号 13800138000(测试结束 cleanup-test-user.mjs 删除)
+# dev OTP 万能码:123456
+# 实际命中 route handler,不绕过任何中间件。
+
+set -uo pipefail
+
+BASE="http://localhost:3000"
+PHONE="13800138000"
+CODE="123456"
+COOKIES=$(mktemp)
+trap 'rm -f "$COOKIES"' EXIT
+
+green() { echo -e "\033[32m$1\033[0m"; }
+red()   { echo -e "\033[31m$1\033[0m"; }
+yel()   { echo -e "\033[33m$1\033[0m"; }
+
+# 累计通过 / 失败
+PASS=0
+FAIL=0
+assert_eq() {
+  local name="$1" expected="$2" actual="$3"
+  if [[ "$actual" == "$expected" ]]; then
+    PASS=$((PASS+1)); green "  [PASS] $name"
+  else
+    FAIL=$((FAIL+1)); red "  [FAIL] $name -- expected=$expected actual=$actual"
+  fi
+}
+assert_contains() {
+  local name="$1" needle="$2" haystack="$3"
+  if echo "$haystack" | grep -q "$needle"; then
+    PASS=$((PASS+1)); green "  [PASS] $name"
+  else
+    FAIL=$((FAIL+1)); red "  [FAIL] $name -- did not find '$needle' in: $haystack"
+  fi
+}
+
+echo "=== 端到端回归测试 ==="
+echo "测试用户 phone=$PHONE"
+echo ""
+
+# ===== 0. cleanup 任何上次残留的测试数据(测试幂等) =====
+yel "[0] cleanup 上次测试残留"
+node scripts/cleanup-test-user.mjs "$PHONE" 2>&1 | sed 's/^/  /'
+
+# ===== 1. 取 CSRF token =====
+yel "[1] 获取 CSRF token"
+CSRF_RAW=$(curl -s -c "$COOKIES" "$BASE/api/auth/csrf")
+CSRF=$(echo "$CSRF_RAW" | sed -n 's/.*"csrfToken":"\([^"]*\)".*/\1/p')
+if [[ -z "$CSRF" ]]; then
+  red "无法获取 csrfToken,响应:$CSRF_RAW"
+  exit 1
+fi
+green "  csrfToken=${CSRF:0:20}..."
+
+# ===== 2. OTP 登录(Credentials provider 路径 /api/auth/callback/phone-otp) =====
+yel "[2] OTP 登录 phone=$PHONE code=$CODE"
+LOGIN_HTTP=$(curl -s -b "$COOKIES" -c "$COOKIES" -o /tmp/login.body -w "%{http_code}" \
+  -X POST "$BASE/api/auth/callback/phone-otp" \
+  -H "Content-Type: application/x-www-form-urlencoded" \
+  --data-urlencode "phone=$PHONE" \
+  --data-urlencode "code=$CODE" \
+  --data-urlencode "csrfToken=$CSRF" \
+  --data-urlencode "redirect=false" \
+  --data-urlencode "json=true")
+echo "  HTTP $LOGIN_HTTP"
+
+# ===== 3. 验证 session 已建立 =====
+yel "[3] 验证 session"
+SESSION=$(curl -s -b "$COOKIES" "$BASE/api/auth/session")
+echo "  session: $SESSION"
+assert_contains "session 包含 user.id" '"id"' "$SESSION"
+
+# ===== 4. GET /api/me 验返回结构 =====
+yel "[4] GET /api/me 验证新字段"
+ME=$(curl -s -b "$COOKIES" "$BASE/api/me")
+echo "  body 摘要: $(echo "$ME" | head -c 300)..."
+assert_contains "/api/me 返回 ok:true"          '"ok":true'           "$ME"
+assert_contains "/api/me 含 voteQuota 字段"     '"voteQuota"'         "$ME"
+assert_contains "/api/me voteQuota.total=12"   '"total":12'           "$ME"
+assert_contains "/api/me 含 votedArtists 字段" '"votedArtists"'      "$ME"
+if echo "$ME" | grep -q '"dailyQuota"'; then
+  FAIL=$((FAIL+1)); red "  [FAIL] /api/me 仍含 dailyQuota 字段(应已被 voteQuota 替换)"
+else
+  PASS=$((PASS+1)); green "  [PASS] /api/me 不再含旧 dailyQuota 字段"
+fi
+
+# ===== 5. POST /api/vote 投未投过的艺人(预期成功) =====
+TEST_ARTIST="001"
+yel "[5] POST /api/vote artistId=$TEST_ARTIST(首次投,预期 200)"
+V1=$(curl -s -b "$COOKIES" -X POST "$BASE/api/vote" \
+  -H "Content-Type: application/json" \
+  -d "{\"artistId\":\"$TEST_ARTIST\"}")
+echo "  body: $V1"
+assert_contains "首投返回 ok:true"          '"ok":true'      "$V1"
+assert_contains "首投返回 totalQuota:12"    '"totalQuota":12' "$V1"
+assert_contains "首投返回 votedCount=1"     '"votedCount":1'  "$V1"
+assert_contains "首投返回 remaining=11"     '"remaining":11'  "$V1"
+
+# ===== 6. POST /api/vote 同一艺人(预期 409 ALREADY_VOTED) =====
+yel "[6] POST /api/vote artistId=$TEST_ARTIST(重投,预期 409 ALREADY_VOTED)"
+V2=$(curl -s -b "$COOKIES" -X POST "$BASE/api/vote" \
+  -H "Content-Type: application/json" \
+  -d "{\"artistId\":\"$TEST_ARTIST\"}")
+echo "  body: $V2"
+assert_contains "重投返回 ok:false"          '"ok":false'           "$V2"
+assert_contains "重投返回 ALREADY_VOTED"     '"code":"ALREADY_VOTED"' "$V2"
+
+# ===== 7. POST /api/vote 不存在的艺人(预期 404 NOT_FOUND) =====
+yel "[7] POST /api/vote artistId=999(不存在,预期 404)"
+V3=$(curl -s -b "$COOKIES" -X POST "$BASE/api/vote" \
+  -H "Content-Type: application/json" \
+  -d '{"artistId":"999"}')
+echo "  body: $V3"
+assert_contains "无效艺人返回 ok:false"      '"ok":false'        "$V3"
+assert_contains "无效艺人返回 NOT_FOUND"     '"code":"NOT_FOUND"' "$V3"
+
+# ===== 8. 再次 GET /api/me 验 votedArtists 含新投艺人 =====
+yel "[8] GET /api/me 复查 votedArtists"
+ME2=$(curl -s -b "$COOKIES" "$BASE/api/me")
+assert_contains "复查 votedArtists 含 $TEST_ARTIST" "\"$TEST_ARTIST\"" "$ME2"
+assert_contains "复查 voteQuota.used=1"      '"used":1'     "$ME2"
+assert_contains "复查 voteQuota.remaining=11" '"remaining":11' "$ME2"
+
+# ===== 9. 验证未登录 → 401 =====
+yel "[9] 未登录调 /api/vote(预期 401)"
+V_NOAUTH=$(curl -s -X POST "$BASE/api/vote" \
+  -H "Content-Type: application/json" \
+  -d '{"artistId":"001"}')
+assert_contains "无 session 返回 UNAUTHORIZED" '"code":"UNAUTHORIZED"' "$V_NOAUTH"
+
+# ===== 10. 最终 cleanup =====
+yel "[10] 测试结束 cleanup"
+node scripts/cleanup-test-user.mjs "$PHONE" 2>&1 | sed 's/^/  /'
+
+# ===== 汇总 =====
+echo ""
+echo "=== 汇总 ==="
+echo "通过 $PASS · 失败 $FAIL"
+if [[ $FAIL -gt 0 ]]; then
+  red "回归测试有失败,详见上方"
+  exit 1
+else
+  green "全部通过"
+fi

scripts/find-test-user.mjs

@@ -0,0 +1,10 @@
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient({ log: ["error"] });
+const u = await prisma.user.findMany({
+  where: { phone: { not: null } },
+  select: { id: true, phone: true, nickname: true },
+  orderBy: { id: "asc" },
+});
+console.log("现有手机号用户:");
+for (const r of u) console.log(`  user_id=${r.id} phone=${r.phone} name=${r.nickname}`);
+await prisma.$disconnect();

scripts/inspect-db.mjs

@@ -0,0 +1,93 @@
+// 只读探查生产 DB 真实状态 —— 不写任何数据,不改任何 schema。
+// 用法:node scripts/inspect-db.mjs
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient({ log: ["error"] });
+
+async function main() {
+  console.log("=== 生产 DB 真实状态(只读)===\n");
+
+  // 1. 用户量级
+  const userCount = await prisma.user.count();
+  console.log(`users 总数: ${userCount}`);
+
+  // 2. 投票量级
+  const voteCount = await prisma.vote.count();
+  console.log(`votes 总数: ${voteCount}`);
+
+  // 3. 是否存在重复 (userId, artistId) — 加 unique 前必看
+  const dup = await prisma.$queryRaw`
+    SELECT user_id, artist_id, COUNT(*) AS cnt
+    FROM votes
+    GROUP BY user_id, artist_id
+    HAVING cnt > 1
+    ORDER BY cnt DESC
+    LIMIT 20
+  `;
+  console.log(`重复 (userId, artistId) 行数: ${dup.length}`);
+  if (dup.length > 0) {
+    console.log("Top 20 重复样本:");
+    for (const row of dup) {
+      console.log(`  user=${row.user_id} artist=${row.artist_id} 重复=${row.cnt}`);
+    }
+  }
+
+  // 4. 单用户最大投票数 — 看是否有人已超过 12 票
+  const topVoters = await prisma.$queryRaw`
+    SELECT user_id, COUNT(*) AS total_votes, COUNT(DISTINCT artist_id) AS unique_artists
+    FROM votes
+    GROUP BY user_id
+    ORDER BY total_votes DESC
+    LIMIT 10
+  `;
+  console.log(`\nTop 10 投票最多的用户:`);
+  for (const row of topVoters) {
+    console.log(
+      `  user=${row.user_id} total=${row.total_votes} 不同艺人=${row.unique_artists}`,
+    );
+  }
+
+  // 5. DailyQuota 状态
+  const dqCount = await prisma.dailyQuota.count();
+  console.log(`\ndaily_quota 总数: ${dqCount}`);
+
+  // 6. FanSupport 状态
+  const fsCount = await prisma.fanSupport.count();
+  console.log(`fan_supports 总数: ${fsCount}`);
+
+  // 7. ActivityConfig 配置
+  const config = await prisma.activityConfig.findUnique({ where: { id: 1 } });
+  console.log(`\nactivity_config:`);
+  if (config) {
+    console.log(`  voteEnabled=${config.voteEnabled}`);
+    console.log(`  dailyQuota=${config.dailyQuota}`);
+    console.log(`  perArtistLimit=${config.perArtistLimit}`);
+    console.log(`  startAt=${config.startAt.toISOString()}`);
+    console.log(`  endAt=${config.endAt.toISOString()}`);
+  } else {
+    console.log("  (空)");
+  }
+
+  // 8. Vote 表当前索引(原始 SQL 探)
+  const indexes = await prisma.$queryRaw`
+    SHOW INDEX FROM votes
+  `;
+  console.log(`\nvotes 当前索引:`);
+  for (const idx of indexes) {
+    console.log(
+      `  ${idx.Key_name}  col=${idx.Column_name}  seq=${idx.Seq_in_index}  unique=${idx.Non_unique === 0 ? "Y" : "N"}`,
+    );
+  }
+
+  // 9. 服务器版本
+  const ver = await prisma.$queryRaw`SELECT VERSION() AS v`;
+  console.log(`\nMySQL 版本: ${ver[0].v}`);
+
+  await prisma.$disconnect();
+}
+
+main().catch(async (e) => {
+  console.error(e);
+  await prisma.$disconnect();
+  process.exit(1);
+});

scripts/reset-vote-data.mjs

@@ -0,0 +1,59 @@
+// 清空投票相关测试数据,准备重新测试。
+//
+// 清:votes / fan_supports / daily_quota / sign_ins / risk_logs / ranking_snapshots
+// reset:artists.vote_count = 0, artists.current_rank = null
+// 保留:users / artists 配置 / activity_config / invitations
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient({ log: ["error"] });
+
+console.log("=== 清空投票测试数据 ===\n");
+
+// 跑前 snapshot
+const before = {
+  votes: await prisma.vote.count(),
+  fanSupports: await prisma.fanSupport.count(),
+  dailyQuotas: await prisma.dailyQuota.count(),
+  signIns: await prisma.signIn.count(),
+  riskLogs: await prisma.riskLog.count(),
+  snapshots: await prisma.rankingSnapshot.count(),
+  artistsWithVotes: await prisma.artist.count({ where: { voteCount: { gt: 0 } } }),
+};
+console.log("清前:", before);
+
+await prisma.$transaction(
+  async (tx) => {
+    await tx.vote.deleteMany({});
+    await tx.fanSupport.deleteMany({});
+    await tx.dailyQuota.deleteMany({});
+    await tx.signIn.deleteMany({});
+    await tx.riskLog.deleteMany({});
+    await tx.rankingSnapshot.deleteMany({});
+    // reset artists 缓存
+    await tx.artist.updateMany({
+      data: { voteCount: 0, currentRank: null },
+    });
+  },
+  { timeout: 30000 },
+);
+
+const after = {
+  votes: await prisma.vote.count(),
+  fanSupports: await prisma.fanSupport.count(),
+  dailyQuotas: await prisma.dailyQuota.count(),
+  signIns: await prisma.signIn.count(),
+  riskLogs: await prisma.riskLog.count(),
+  snapshots: await prisma.rankingSnapshot.count(),
+  artistsWithVotes: await prisma.artist.count({ where: { voteCount: { gt: 0 } } }),
+};
+console.log("\n清后:", after);
+
+// 同时确认保留了什么
+const preserved = {
+  users: await prisma.user.count(),
+  artists: await prisma.artist.count(),
+  activityConfig: await prisma.activityConfig.count(),
+};
+console.log("保留:", preserved);
+
+await prisma.$disconnect();
+console.log("\n✓ 完成");

scripts/screenshot-narrow.mjs

@@ -0,0 +1,86 @@
+import { spawn } from "node:child_process";
+import { writeFile } from "node:fs/promises";
+import { setTimeout as wait } from "node:timers/promises";
+
+const CHROME = "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe";
+const PORT = 9333;
+const PROFILE = "C:\\Users\\10419\\AppData\\Local\\Temp\\cs-narrow-shot";
+const OUT = process.env.SHOT_OUT || "d:/ClaudeProjects/虚拟明星/UI-UX/docs/screenshots/nav-overlap-narrow.png";
+const WIDTH = Number(process.env.SHOT_WIDTH || 740);
+const HEIGHT = Number(process.env.SHOT_HEIGHT || 1000);
+
+const proc = spawn(CHROME, [
+  `--headless=new`, `--disable-gpu`, `--remote-debugging-port=${PORT}`,
+  `--user-data-dir=${PROFILE}`, `--hide-scrollbars`, `--no-first-run`, `about:blank`,
+], { stdio: "ignore", detached: true });
+proc.unref();
+for (let i = 0; i < 30; i++) {
+  try { if ((await fetch(`http://127.0.0.1:${PORT}/json/version`)).ok) break; } catch {}
+  await wait(300);
+}
+const t = await (await fetch(`http://127.0.0.1:${PORT}/json/new?about:blank`, { method: "PUT" })).json();
+const ws = new WebSocket(t.webSocketDebuggerUrl);
+await new Promise(r => ws.addEventListener("open", () => r(), { once: true }));
+let id = 0; const pending = new Map();
+ws.addEventListener("message", (e) => {
+  const m = JSON.parse(e.data);
+  if (m.id && pending.has(m.id)) { const { resolve, reject } = pending.get(m.id); pending.delete(m.id);
+    if (m.error) reject(new Error(m.error.message)); else resolve(m.result); }
+});
+const cmd = (method, params = {}) => new Promise((resolve, reject) => {
+  pending.set(++id, { resolve, reject });
+  ws.send(JSON.stringify({ id, method, params }));
+});
+
+await cmd("Emulation.setDeviceMetricsOverride", {
+  width: WIDTH, height: HEIGHT, deviceScaleFactor: 1, mobile: false,
+});
+await cmd("Page.navigate", { url: "http://localhost:3000" });
+await wait(3500);
+await cmd("Runtime.evaluate", {
+  expression: `document.querySelectorAll('video').forEach(v => { try { v.pause(); } catch{} });`,
+});
+await wait(500);
+const r = await cmd("Page.captureScreenshot", { format: "png" });
+await writeFile(OUT, Buffer.from(r.data, "base64"));
+
+// 同时取关键元素的位置信息
+const layout = await cmd("Runtime.evaluate", {
+  returnByValue: true,
+  expression: `(() => {
+    const get = sel => {
+      const el = document.querySelector(sel);
+      if (!el) return null;
+      const r = el.getBoundingClientRect();
+      return { top: Math.round(r.top), left: Math.round(r.left), width: Math.round(r.width), height: Math.round(r.height), text: el.textContent?.trim().slice(0, 30) ?? '' };
+    };
+    return {
+      headerNav: get('header > nav'),
+      mobileNavLinks: get('header ul.md\\\\:hidden') || get('header [class*="md:hidden"] ul') || (() => {
+        // mobile NavLinks 在 header 下方第二行,找 header 内最后一个 ul
+        const uls = document.querySelectorAll('header ul');
+        const last = uls[uls.length - 1];
+        if (!last) return null;
+        const r = last.getBoundingClientRect();
+        return { top: Math.round(r.top), left: Math.round(r.left), width: Math.round(r.width), height: Math.round(r.height), text: last.textContent?.trim().slice(0, 30) ?? '' };
+      })(),
+      heroEyebrow: (() => {
+        const els = Array.from(document.querySelectorAll('p'));
+        const m = els.find(p => /Top 12.*Cyber Star/i.test(p.textContent || ''));
+        if (!m) return null;
+        const r = m.getBoundingClientRect();
+        return { top: Math.round(r.top), left: Math.round(r.left), width: Math.round(r.width), height: Math.round(r.height), text: m.textContent?.trim().slice(0, 40) ?? '' };
+      })(),
+      heroProgress: get('[data-hero-vote-progress]'),
+    };
+  })()`,
+});
+console.log("\n=== 关键元素位置(viewport 坐标)===");
+for (const [k, v] of Object.entries(layout.result.value)) {
+  if (v) console.log(`  ${k.padEnd(16)} top=${String(v.top).padStart(3)}px  left=${String(v.left).padStart(3)}px  w=${v.width}  h=${v.height}  "${v.text}"`);
+  else console.log(`  ${k.padEnd(16)} (未找到)`);
+}
+console.log(`\n✓ ${OUT}`);
+ws.close();
+try { process.kill(proc.pid); } catch {}
+spawn("taskkill", ["/F", "/PID", String(proc.pid), "/T"], { stdio: "ignore" });

scripts/test-vote-rules.mjs

@@ -0,0 +1,177 @@
+// 后端投票规则验证(不污染生产数据,所有写操作都在事务里 rollback)
+import { PrismaClient, Prisma } from "@prisma/client";
+const prisma = new PrismaClient({ log: ["error"] });
+
+const PASS = "\x1b[32mPASS\x1b[0m";
+const FAIL = "\x1b[31mFAIL\x1b[0m";
+
+let results = [];
+function record(name, ok, detail = "") {
+  results.push({ name, ok, detail });
+  console.log(`  [${ok ? PASS : FAIL}] ${name}${detail ? "  -- " + detail : ""}`);
+}
+
+async function main() {
+  console.log("=== 后端投票规则验证(事务回滚,不留痕)===\n");
+
+  // 取一个真实用户(测试数据中的最大投票用户)
+  const sample = await prisma.$queryRaw`
+    SELECT user_id, COUNT(*) AS c FROM votes GROUP BY user_id ORDER BY c DESC LIMIT 1
+  `;
+  if (sample.length === 0) {
+    console.log("[note] votes 表为空,跳过有交互的测试");
+    return;
+  }
+  const sampleUserId = BigInt(sample[0].user_id);
+  const sampleVotes = await prisma.vote.findMany({
+    where: { userId: sampleUserId },
+    select: { artistId: true },
+  });
+  const sampleArtist = sampleVotes[0].artistId;
+  console.log(
+    `测试样本:user=${sampleUserId} 已投艺人=[${sampleVotes
+      .map((v) => v.artistId)
+      .join(",")}]\n`,
+  );
+
+  // 测试 1:DB unique 约束生效 —— 重复 (userId, artistId) INSERT 应失败 P2002
+  console.log("[测试 1] DB unique 约束:重复 (userId, artistId) 必被拒");
+  try {
+    await prisma.$transaction(
+      async (tx) => {
+        await tx.vote.create({
+          data: {
+            userId: sampleUserId,
+            artistId: sampleArtist,
+            count: 1,
+            source: "QUOTA",
+          },
+        });
+        throw new Error("ROLLBACK_AFTER_TEST"); // 强制回滚
+      },
+      { timeout: 10000 },
+    );
+    record("unique 约束阻挡重复投票", false, "INSERT 居然成功了");
+  } catch (e) {
+    if (
+      e instanceof Prisma.PrismaClientKnownRequestError &&
+      e.code === "P2002"
+    ) {
+      record("unique 约束阻挡重复投票", true, "P2002 unique constraint");
+    } else if (e.message === "ROLLBACK_AFTER_TEST") {
+      record(
+        "unique 约束阻挡重复投票",
+        false,
+        "INSERT 居然成功 = 没有 unique 约束!",
+      );
+    } else {
+      record("unique 约束阻挡重复投票", false, `异常: ${e.message}`);
+    }
+  }
+
+  // 测试 2:不同艺人 INSERT 应该成功(在事务内回滚,不留痕)
+  console.log(
+    "\n[测试 2] 不同艺人投票不会被 unique 阻挡(事务内验证后回滚)",
+  );
+  const candidateArtist = await prisma.artist.findFirst({
+    where: {
+      id: { notIn: sampleVotes.map((v) => v.artistId) },
+      status: "ACTIVE",
+    },
+    select: { id: true },
+  });
+  if (!candidateArtist) {
+    record("跨艺人投票", false, "找不到该用户未投过的艺人样本");
+  } else {
+    try {
+      await prisma.$transaction(
+        async (tx) => {
+          await tx.vote.create({
+            data: {
+              userId: sampleUserId,
+              artistId: candidateArtist.id,
+              count: 1,
+              source: "QUOTA",
+            },
+          });
+          throw new Error("ROLLBACK_AFTER_TEST");
+        },
+        { timeout: 10000 },
+      );
+      record("跨艺人投票", false, "事务未回滚");
+    } catch (e) {
+      if (e.message === "ROLLBACK_AFTER_TEST") {
+        record(
+          "跨艺人投票",
+          true,
+          `允许投给新艺人 ${candidateArtist.id},事务已回滚`,
+        );
+      } else {
+        record("跨艺人投票", false, `异常: ${e.message}`);
+      }
+    }
+  }
+
+  // 测试 3:终身额度 12 票上限(由 /api/vote 应用层校验,DB 不强制)
+  //   验证:对所有用户跑 SELECT COUNT(*) < 12 是 true,确认目前没人超额
+  console.log("\n[测试 3] 终身额度上限 12 票 - 数据合规性");
+  const overflows = await prisma.$queryRaw`
+    SELECT user_id, COUNT(*) AS c FROM votes GROUP BY user_id HAVING c > 12
+  `;
+  if (overflows.length === 0) {
+    record(
+      "现存数据无超额用户",
+      true,
+      "12 票上限对所有现存用户都成立(应用层会兜底)",
+    );
+  } else {
+    record(
+      "现存数据无超额用户",
+      false,
+      `${overflows.length} 个用户已超过 12 票:${overflows
+        .map((r) => `user=${r.user_id} c=${r.c}`)
+        .join("; ")}`,
+    );
+  }
+
+  // 测试 4:回归确认 /api/me 用的 vote 关键查询能返回 votedArtists 列表
+  console.log("\n[测试 4] /api/me votedArtists 查询正确性");
+  const votedList = await prisma.vote.findMany({
+    where: { userId: sampleUserId },
+    select: { artistId: true, createdAt: true },
+    orderBy: { createdAt: "asc" },
+  });
+  const isAsc = votedList.every(
+    (v, i) =>
+      i === 0 || votedList[i - 1].createdAt.getTime() <= v.createdAt.getTime(),
+  );
+  record(
+    "votedArtists 按 createdAt 升序",
+    isAsc,
+    `共 ${votedList.length} 条`,
+  );
+
+  // 测试 5:旧 daily_quota / fan_supports 数据仍可读(向后兼容,不报错)
+  console.log("\n[测试 5] 旧数据兼容性");
+  try {
+    const dqCount = await prisma.dailyQuota.count();
+    const fsCount = await prisma.fanSupport.count();
+    record("旧 DailyQuota / FanSupport 仍可读", true, `dq=${dqCount} fs=${fsCount}`);
+  } catch (e) {
+    record("旧 DailyQuota / FanSupport 仍可读", false, e.message);
+  }
+
+  // 汇总
+  console.log("\n=== 汇总 ===");
+  const passed = results.filter((r) => r.ok).length;
+  const failed = results.length - passed;
+  console.log(`通过 ${passed} / 共 ${results.length}${failed ? `  失败 ${failed}` : ""}`);
+  await prisma.$disconnect();
+  if (failed) process.exit(1);
+}
+
+main().catch(async (e) => {
+  console.error("\n[ABORT]", e);
+  await prisma.$disconnect();
+  process.exit(1);
+});

scripts/verify-top12.mjs

@@ -0,0 +1,76 @@
+import { spawn } from "node:child_process";
+import { writeFile } from "node:fs/promises";
+import { setTimeout as wait } from "node:timers/promises";
+
+const CHROME = "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe";
+const PORT = 9333;
+const PROFILE = "C:\\Users\\10419\\AppData\\Local\\Temp\\cs-top12-verify";
+
+const proc = spawn(
+  CHROME,
+  [
+    `--headless=new`,
+    `--disable-gpu`,
+    `--remote-debugging-port=${PORT}`,
+    `--user-data-dir=${PROFILE}`,
+    `--window-size=1500,900`,
+    `--hide-scrollbars`,
+    `--no-first-run`,
+    `about:blank`,
+  ],
+  { stdio: "ignore", detached: true },
+);
+proc.unref();
+for (let i = 0; i < 30; i++) {
+  try {
+    const r = await fetch(`http://127.0.0.1:${PORT}/json/version`);
+    if (r.ok) break;
+  } catch {}
+  await wait(300);
+}
+
+const t = await (await fetch(`http://127.0.0.1:${PORT}/json/new?about:blank`, { method: "PUT" })).json();
+const ws = new WebSocket(t.webSocketDebuggerUrl);
+await new Promise((r) => ws.addEventListener("open", () => r(), { once: true }));
+let id = 0;
+const pending = new Map();
+ws.addEventListener("message", (e) => {
+  const m = JSON.parse(e.data);
+  if (m.id && pending.has(m.id)) {
+    const { resolve, reject } = pending.get(m.id);
+    pending.delete(m.id);
+    if (m.error) reject(new Error(m.error.message));
+    else resolve(m.result);
+  }
+});
+const cmd = (method, params = {}) =>
+  new Promise((resolve, reject) => {
+    pending.set(++id, { resolve, reject });
+    ws.send(JSON.stringify({ id, method, params }));
+  });
+
+await cmd("Emulation.setDeviceMetricsOverride", {
+  width: 1500, height: 900, deviceScaleFactor: 1, mobile: false,
+});
+await cmd("Page.navigate", { url: "http://localhost:3000" });
+await wait(3000);
+await cmd("Runtime.evaluate", {
+  expression: `document.querySelectorAll('video').forEach(v => { try { v.pause(); } catch{} });`,
+});
+// 滚到 Top12 区
+await cmd("Runtime.evaluate", {
+  expression: `window.scrollTo(0, window.innerHeight);`,
+});
+await wait(1500);
+// 多等一下 useRanking 拉到数据
+await wait(2500);
+
+const r = await cmd("Page.captureScreenshot", { format: "png" });
+await writeFile(
+  "d:/ClaudeProjects/虚拟明星/UI-UX/docs/screenshots/top12-fix-verify.png",
+  Buffer.from(r.data, "base64"),
+);
+console.log("✓ saved");
+ws.close();
+try { process.kill(proc.pid); } catch {}
+spawn("taskkill", ["/F", "/PID", String(proc.pid), "/T"], { stdio: "ignore" });

scripts/verify-unique.mjs

@@ -0,0 +1,14 @@
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient({ log: ["error"] });
+const rows = await prisma.$queryRaw`
+  SELECT INDEX_NAME, COLUMN_NAME, SEQ_IN_INDEX, NON_UNIQUE
+  FROM information_schema.STATISTICS
+  WHERE TABLE_SCHEMA = DATABASE() AND TABLE_NAME = 'votes'
+  ORDER BY INDEX_NAME, SEQ_IN_INDEX
+`;
+for (const r of rows) {
+  console.log(
+    `  ${r.INDEX_NAME}  col=${r.COLUMN_NAME}  seq=${r.SEQ_IN_INDEX}  unique=${r.NON_UNIQUE == 0 ? "Y" : "N"}`,
+  );
+}
+await prisma.$disconnect();

src/app/api/auth/send-otp/route.ts

@@ -2,7 +2,8 @@ import type { NextRequest } from "next/server";
 import { z } from "zod";
 import { rateLimit } from "@/lib/rate-limit";
 import { getClientIp } from "@/lib/current-user";
-import { getRedis } from "@/lib/redis";
+import { storeOtp } from "@/lib/otp-store";
+import { sendOtpSms } from "@/lib/sms";
 import { ok, ERR } from "@/lib/api-response";
 
 const Body = z.object({
@@ -13,7 +14,7 @@ const Body = z.object({
 
 /**
  * POST /api/auth/send-otp
- * 发送短信验证码 · 单手机号 60s 限频 / 单 IP 5 分钟 5 次
+ * 发送短信验证码 · 单手机号 60s 限频 / 单 IP 5 分钟 100 次
  */
 export async function POST(req: NextRequest) {
   try {
@@ -30,28 +31,47 @@ export async function POST(req: NextRequest) {
     }
     const ip = await getClientIp();
     if (ip) {
-      const ipRl = await rateLimit(`otp:ip:${ip}`, 300, 5);
+      const ipRl = await rateLimit(`otp:ip:${ip}`, 300, 100);
       if (!ipRl.allowed) return ERR.RATE_LIMITED();
     }
 
-    // 生成 6 位验证码
+    // 生成 6 位验证码 + 存储 (Redis 可用走 Redis, 否则走进程内 Map; 始终 5min TTL)
     const code = String(Math.floor(100000 + Math.random() * 900000));
+    await storeOtp(phone, code);
 
-    // 缓存到 Redis（5 分钟过期）
+    // 开发环境下把验证码打在终端, 方便本地 QA / 排错; 生产不打
-    const redis = getRedis();
-    if (redis) {
-      await redis.set(`sms:otp:${phone}`, code, "EX", 300);
-    }
-
-    // TODO[团队]: 接入真实短信服务（阿里云 / 火山引擎 SMS）
-    //   - 模板：${SMS_TEMPLATE_CODE}
-    //   - 签名：${SMS_SIGN_NAME}
-    //   - 参数：{ code, expireMin: 5 }
     if (process.env.NODE_ENV !== "production") {
-      console.log(`[dev-otp] 发送给 ${phone}: ${code}（开发环境也接受万能码 123456）`);
+      console.log(`[dev-otp] phone=${phone} code=${code} (dev 环境也接受 123456)`);
     }
 
+    // 调阿里云短信发送
+    const sms = await sendOtpSms(phone, code);
+
+    if (sms.ok) {
+      console.log(`[sms] sent phone=${phone} bizId=${sms.bizId}`);
       return ok({ message: "验证码已发送", expiresIn: 300 });
+    }
+
+    // 失败处理：
+    //  - SMS 未配置且非生产 → 控制台打 code, 仍返回成功（开发态联调）
+    //  - 阿里云明确返回参数 / 触发流控 → 422
+    //  - 其它 → 500
+    if (sms.errorCode === "SMS_NOT_CONFIGURED") {
+      if (process.env.NODE_ENV !== "production") {
+        console.log(`[dev-otp] SMS 未配置, 验证码 ${phone}: ${code}（也可用万能码 123456）`);
+        return ok({ message: "验证码已发送", expiresIn: 300 });
+      }
+      console.error("[sms] 生产环境短信未配置, 检查 SMS_* 环境变量");
+      return ERR.INTERNAL("短信服务未配置");
+    }
+
+    console.error(
+      `[sms] 发送失败 phone=${phone} code=${sms.errorCode} message=${sms.errorMessage}`,
+    );
+    if (sms.errorCode?.startsWith("isv.")) {
+      return ERR.VALIDATION(sms.errorMessage ?? "短信发送失败");
+    }
+    return ERR.INTERNAL("短信发送失败");
   } catch (e) {
     console.error("[POST /api/auth/send-otp]", e);
     return ERR.INTERNAL();

src/app/api/me/route.ts

@@ -1,17 +1,26 @@
 import { prisma } from "@/lib/prisma";
 import { getCurrentUser } from "@/lib/current-user";
+import { isSameUtcDay, startOfUtcDay } from "@/lib/date-utils";
 import { ok, ERR, sanitizeBigInt } from "@/lib/api-response";
 
+/**
+ * 终身投票总额度,与前端 src/lib/store.ts 的 TOTAL_VOTE_QUOTA 对齐。
+ */
+const TOTAL_VOTE_QUOTA = 12;
+
 /**
  * GET /api/me
- * 当前用户信息：基础资料、累计投票数、应援列表、签到状态、今日票数额度。
+ * 当前用户信息:基础资料、应援列表、签到状态、终身票数额度。
+ *
+ * 新增字段 votedArtists: string[] —— 按投票时间升序(最早投的在前),
+ * 供前端 hydrate 时取代纯 localStorage,跨设备/清缓存后仍可恢复。
  */
 export async function GET() {
   try {
     const user = await getCurrentUser();
     if (!user) return ERR.UNAUTHORIZED();
 
-    const today = startOfDay();
+    const today = startOfUtcDay();
 
     type SupportRow = Awaited<
       ReturnType<typeof prisma.fanSupport.findMany>
@@ -21,15 +30,12 @@ export async function GET() {
         no: string;
         name: string;
         enName: string;
-        slogan: string;
-        themeColor: string;
         voteCount: number;
         currentRank: number | null;
       };
     };
 
-    const [profile, signIn, supports, dailyQuotaRow, config] =
+    const [profile, signIn, supports, votedList] = (await Promise.all([
-      (await Promise.all([
       prisma.user.findUnique({
         where: { id: user.id },
         select: {
@@ -53,36 +59,31 @@ export async function GET() {
               no: true,
               name: true,
               enName: true,
-                slogan: true,
-                themeColor: true,
               voteCount: true,
               currentRank: true,
             },
           },
         },
-          orderBy: { votedTotal: "desc" },
+        orderBy: { createdAt: "asc" },
       }),
-        prisma.dailyQuota.findUnique({
+      // 按投票顺序拉 votedArtists —— 前端 store 用作 hydrate 真相源
-          where: { userId_date: { userId: user.id, date: today } },
+      prisma.vote.findMany({
+        where: { userId: user.id },
+        select: { artistId: true, createdAt: true },
+        orderBy: { createdAt: "asc" },
       }),
-        prisma.activityConfig.findUnique({ where: { id: 1 } }),
     ])) as [
       Awaited<ReturnType<typeof prisma.user.findUnique>>,
       Awaited<ReturnType<typeof prisma.signIn.findFirst>>,
       SupportRow[],
-        Awaited<ReturnType<typeof prisma.dailyQuota.findUnique>>,
+      { artistId: string; createdAt: Date }[],
-        Awaited<ReturnType<typeof prisma.activityConfig.findUnique>>,
     ];
 
     if (!profile) return ERR.NOT_FOUND("用户不存在");
 
-    const totalVotes = await prisma.vote.aggregate({
+    const votedArtists = votedList.map((v) => v.artistId);
-      where: { userId: user.id },
+    const votedCount = votedArtists.length;
-      _sum: { count: true },
+    const remaining = Math.max(0, TOTAL_VOTE_QUOTA - votedCount);
-    });
-
-    const dailyQuota = dailyQuotaRow?.totalQuota ?? config?.dailyQuota ?? 10;
-    const usedToday = dailyQuotaRow?.usedQuota ?? 0;
 
     return ok(
       sanitizeBigInt({
@@ -90,16 +91,19 @@ export async function GET() {
         signIn: {
           streak: signIn?.streak ?? 0,
           lastDate: signIn?.date ?? null,
-          todaySignedIn: signIn ? sameDay(signIn.date, today) : false,
+          todaySignedIn: signIn ? isSameUtcDay(signIn.date, today) : false,
         },
-        totalVotes: totalVotes._sum.count ?? 0,
+        // 终身票数视图 —— 替代旧的 dailyQuota
-        dailyQuota: {
+        voteQuota: {
-          total: dailyQuota,
+          total: TOTAL_VOTE_QUOTA,
-          used: usedToday,
+          used: votedCount,
-          remaining: Math.max(0, dailyQuota - usedToday),
+          remaining,
         },
+        // 已投艺人 ID 列表(按时间升序),前端 hydrate 时回放到 store
+        votedArtists,
         supports: supports.map((s: SupportRow) => ({
           artist: s.artist,
+          // 新规则下 votedTotal 固定 1;旧数据 votedTotal>1 仍真实反映历史
           votedTotal: s.votedTotal,
         })),
       }),
@@ -109,17 +113,3 @@ export async function GET() {
     return ERR.INTERNAL();
   }
 }
-
-function startOfDay(d = new Date()): Date {
-  const x = new Date(d);
-  x.setHours(0, 0, 0, 0);
-  return x;
-}
-
-function sameDay(a: Date, b: Date) {
-  return (
-    a.getFullYear() === b.getFullYear() &&
-    a.getMonth() === b.getMonth() &&
-    a.getDate() === b.getDate()
-  );
-}

src/app/api/me/signin/route.ts

@@ -1,5 +1,6 @@
 import { prisma } from "@/lib/prisma";
 import { getCurrentUser } from "@/lib/current-user";
+import { startOfUtcDay } from "@/lib/date-utils";
 import { ok, ERR, sanitizeBigInt } from "@/lib/api-response";
 
 /**
@@ -12,7 +13,7 @@ export async function POST() {
     const user = await getCurrentUser();
     if (!user) return ERR.UNAUTHORIZED();
 
-    const today = startOfDay();
+    const today = startOfUtcDay();
     const yesterday = new Date(today);
     yesterday.setDate(yesterday.getDate() - 1);
 
@@ -56,8 +57,3 @@ export async function POST() {
   }
 }
 
-function startOfDay(d = new Date()): Date {
-  const x = new Date(d);
-  x.setHours(0, 0, 0, 0);
-  return x;
-}

src/app/api/ranking/route.ts

@@ -3,7 +3,7 @@ import { ok, ERR } from "@/lib/api-response";
 
 /**
  * GET /api/ranking
- * 返回完整 35 人实时排名（按 voteCount 降序）。
+ * 返回完整 36 人实时排名（按 voteCount 降序）。
  *
  * 该接口适合每分钟轮询。生产环境会优先读 Redis 缓存（由后台聚合任务每分钟刷新）。
  */
@@ -17,8 +17,6 @@ export async function GET() {
         no: true,
         name: true,
         enName: true,
-        slogan: true,
-        themeColor: true,
         avatar: true,
         portrait: true,
         voteCount: true,

src/app/api/vote/route.ts

@@ -12,32 +12,46 @@ import { ok, ERR, sanitizeBigInt } from "@/lib/api-response";
 
 type TxClient = Prisma.TransactionClient;
 
+/**
+ * 终身投票额度:每个用户共 12 票,每位艺人最多 1 票。
+ * 用 const 而非读 DB,避免每次请求多一次查询。前端 store 同名常量保持一致。
+ */
+const TOTAL_VOTE_QUOTA = 12;
+
 const VoteBody = z.object({
   artistId: z.string().min(1).max(8),
-  count: z.number().int().min(1).max(99_999),
+  // 旧前端仍可能传 count 字段(>=1),后端一律视为 1 票
+  count: z.number().int().min(1).max(99_999).optional(),
 });
 
-/** 内部抛错用，事务捕获后转为业务错误响应 */
+/** 内部抛错用,事务捕获后转业务错误响应 */
 class QuotaExhaustedError extends Error {
-  constructor(public remaining: number) {
+  constructor() {
     super("QUOTA_EXHAUSTED");
   }
 }
+class AlreadyVotedError extends Error {
+  constructor() {
+    super("ALREADY_VOTED");
+  }
+}
 
 /**
  * POST /api/vote
- * 投票接口。
  *
- * 规则：
+ * 新规则:
- *  - 每日总额度：ActivityConfig.dailyQuota（默认 10）
+ *  - 每用户终身 12 票
- *  - 无单艺人上限（perArtistLimit 字段保留但不强制）
+ *  - 每艺人 1 票(DB 层 @@unique([userId, artistId]) 兜底)
- *  - 单用户限流：1 秒 5 次；单 IP 限流：60 秒 60 次
+ *  - 不可撤销,不限时
+ *  - 单用户限流:1 秒 5 次;单 IP 限流:60 秒 60 次
  *
- * 流程：
+ * 流程:
  *  1. 鉴权 + 反作弊限流
- *  2. 校验活动开关 + 时间窗
+ *  2. 校验活动开关(voteEnabled)
- *  3. 事务：当日额度检查 → 写投票 → 累加艺人票数 → 更新应援 → 扣减额度
+ *  3. 事务:已投艺人计数 >= 12 → QUOTA_EXHAUSTED;否则写票
- *  4. 返回最新票数 + 当日剩余
+ *     - DB unique 冲突 (P2002) → ALREADY_VOTED
+ *  4. 累加 artist.voteCount;upsert FanSupport(votedTotal=1)
+ *  5. 返回最新票数 + 剩余票数
  */
 export async function POST(req: NextRequest) {
   try {
@@ -58,41 +72,29 @@ export async function POST(req: NextRequest) {
     if (!parsed.success) {
       return ERR.VALIDATION(parsed.error.issues[0]?.message ?? "参数错误");
     }
-    const { artistId, count } = parsed.data;
+    const { artistId } = parsed.data;
 
     const config = await prisma.activityConfig.findUnique({ where: { id: 1 } });
     if (!config?.voteEnabled) return ERR.ACTIVITY_OFF();
-    const now = new Date();
+    // 新规则不限时,移除 startAt/endAt 校验
-    if (now < config.startAt || now > config.endAt) return ERR.ACTIVITY_OFF();
 
     const ua = await getUserAgent();
-    const today = startOfDay();
-    const dailyQuota = config.dailyQuota;
 
     try {
       const result = await prisma.$transaction(async (tx: TxClient) => {
-        // 1. 当日额度（不存在则按 config 创建）
+        // 1. 终身额度校验:已投艺人数 >= 12 → 拒
-        const dq = await tx.dailyQuota.upsert({
+        const votedSoFar = await tx.vote.count({ where: { userId: user.id } });
-          where: { userId_date: { userId: user.id, date: today } },
+        if (votedSoFar >= TOTAL_VOTE_QUOTA) {
-          create: {
+          throw new QuotaExhaustedError();
-            userId: user.id,
-            date: today,
-            totalQuota: dailyQuota,
-            usedQuota: 0,
-          },
-          update: {},
-        });
-        const remaining = dq.totalQuota - dq.usedQuota;
-        if (count > remaining) {
-          throw new QuotaExhaustedError(remaining);
         }
 
         // 2. 写入投票
+        //    DB unique (userId, artistId) 在 catch 里转 ALREADY_VOTED
         const vote = await tx.vote.create({
           data: {
             userId: user.id,
             artistId,
-            count,
+            count: 1,
             source: "QUOTA",
             ip: ip ?? undefined,
             ua: ua ?? undefined,
@@ -102,27 +104,23 @@ export async function POST(req: NextRequest) {
         // 3. 累加艺人票数
         const artist = await tx.artist.update({
           where: { id: artistId },
-          data: { voteCount: { increment: count } },
+          data: { voteCount: { increment: 1 } },
           select: { id: true, voteCount: true, name: true },
         });
 
-        // 4. 应援关系
+        // 4. 应援关系 —— 每艺人 1 票,votedTotal 固定 1
         await tx.fanSupport.upsert({
           where: { userId_artistId: { userId: user.id, artistId } },
-          create: { userId: user.id, artistId, votedTotal: count },
+          create: { userId: user.id, artistId, votedTotal: 1 },
-          update: { votedTotal: { increment: count } },
+          update: { votedTotal: 1 },
-        });
-
-        // 5. 扣减当日额度
-        const updatedDq = await tx.dailyQuota.update({
-          where: { userId_date: { userId: user.id, date: today } },
-          data: { usedQuota: { increment: count } },
         });
 
+        const votedAfter = votedSoFar + 1;
         return {
           vote,
           artist,
-          remaining: updatedDq.totalQuota - updatedDq.usedQuota,
+          votedCount: votedAfter,
+          remaining: TOTAL_VOTE_QUOTA - votedAfter,
         };
       });
 
@@ -131,15 +129,33 @@ export async function POST(req: NextRequest) {
           artistId: result.artist.id,
           artistVotes: result.artist.voteCount,
           voteId: result.vote.id,
+          votedCount: result.votedCount,
           remaining: result.remaining,
-          dailyQuota,
+          totalQuota: TOTAL_VOTE_QUOTA,
         }),
       );
     } catch (e) {
       if (e instanceof QuotaExhaustedError) {
-        return ERR.QUOTA_EXHAUSTED(
+        return ERR.QUOTA_EXHAUSTED();
-          `今日票数仅剩 ${e.remaining} 票，无法一次投出 ${count} 票`,
+      }
-        );
+      if (e instanceof AlreadyVotedError) {
+        return ERR.ALREADY_VOTED();
+      }
+      // Prisma unique 冲突 → ALREADY_VOTED
+      if (
+        e instanceof Prisma.PrismaClientKnownRequestError &&
+        e.code === "P2002"
+      ) {
+        return ERR.ALREADY_VOTED();
+      }
+      // 艺人不存在:
+      // - P2003: FK 违反(vote.create 时 artistId 外键约束失败)
+      // - P2025: 记录不存在(artist.update 找不到目标)
+      if (
+        e instanceof Prisma.PrismaClientKnownRequestError &&
+        (e.code === "P2003" || e.code === "P2025")
+      ) {
+        return ERR.NOT_FOUND("艺人不存在");
       }
       throw e;
     }
@@ -148,9 +164,3 @@ export async function POST(req: NextRequest) {
     return ERR.INTERNAL();
   }
 }
-
-function startOfDay(d = new Date()): Date {
-  const x = new Date(d);
-  x.setHours(0, 0, 0, 0);
-  return x;
-}

src/app/artist/[id]/page.tsx

@@ -16,10 +16,10 @@ export async function generateMetadata({
 }: ArtistPageProps): Promise<Metadata> {
   const { id } = await params;
   const artist = getArtist(id);
-  if (!artist) return { title: "艺人不存在 · CYBER STAR" };
+  if (!artist) return { title: "艺人不存在 · 银河初星计划 C . S . G" };
 
   return {
-    title: `${artist.name} · ${artist.enName} · CYBER STAR`,
+    title: `${artist.name} · ${artist.enName} · 银河初星计划 C . S . G`,
     description: artist.bio.slice(0, 120),
   };
 }

src/app/layout.tsx

@@ -33,15 +33,27 @@ const inter = Inter({
 });
 
 export const metadata: Metadata = {
-  title: "CYBER ✦ STAR · 虚拟偶像 Top12 出道企划",
+  title: "银河初星计划 C . S . G",
   description:
-    "35 位虚拟偶像候选人，由你投票决出最终出道 Top12。Cyber Star · Virtual Idol Debut Project.",
+    "36 位虚拟偶像候选人，由你投票决出最终出道 Top12。银河初星计划 C . S . G。",
-  keywords: ["虚拟偶像", "出道", "投票", "Top12", "Cyber Star", "Virtual Idol"],
+  keywords: [
+    "银河初星计划",
+    "C . S . G",
+    "虚拟偶像",
+    "出道",
+    "投票",
+    "Top12",
+    "Virtual Idol",
+  ],
   openGraph: {
-    title: "CYBER ✦ STAR",
+    title: "银河初星计划 C . S . G",
     description: "虚拟偶像 Top12 出道企划",
     type: "website",
   },
+  icons: {
+    icon: "/favicon.ico?v=4",
+    shortcut: "/favicon.ico?v=4",
+  },
 };
 
 export default function RootLayout({
@@ -57,7 +69,7 @@ export default function RootLayout({
       <body className="min-h-full flex flex-col">
         <Providers>
           <Navigation />
-          <main className="flex-1">{children}</main>
+          <main className="flex-1 pt-20">{children}</main>
           <Footer />
         </Providers>
       </body>

src/app/login/LoginForm.tsx

@@ -5,7 +5,6 @@ import { useRouter, useSearchParams } from "next/navigation";
 import Link from "next/link";
 import { signIn } from "next-auth/react";
 import { Phone, KeyRound, Loader2 } from "lucide-react";
-import Logo from "@/components/Logo";
 import Button from "@/components/ui/Button";
 import { cn } from "@/lib/cn";
 
@@ -71,7 +70,12 @@ export default function LoginForm() {
         redirect: false,
       });
       if (result?.error) {
-        setError("验证码错误或已失效");
+        console.error("[login] signIn 返回错误:", result);
+        setError(
+          result.error === "CredentialsSignin"
+            ? "验证码错误或已失效"
+            : `登录失败：${result.error}`,
+        );
       } else {
         router.push(callbackUrl);
         router.refresh();
@@ -87,8 +91,15 @@ export default function LoginForm() {
     <div className="min-h-[calc(100vh-128px)] flex items-center justify-center px-4 py-10">
       <div className="w-full max-w-md">
         {/* Logo */}
-        <div className="text-center mb-8">
+        <div className="flex flex-col items-center mb-8">
-          <Logo size="lg" href={null} />
+          <img
+            src="/logo-v4.png?v=4"
+            alt="银河初星计划 C . S . G"
+            decoding="async"
+            draggable={false}
+            className="block select-none h-20 sm:h-24 w-auto"
+            style={{ background: "transparent" }}
+          />
           <p className="font-label text-[10px] tracking-[0.4em] uppercase text-purple-300/80 mt-3">
             Sign in to Vote
           </p>

src/app/login/page.tsx

@@ -2,7 +2,7 @@ import { Suspense } from "react";
 import LoginForm from "./LoginForm";
 
 export const metadata = {
-  title: "登录 · CYBER STAR",
+  title: "登录 · 银河初星计划 C . S . G",
 };
 
 export default function LoginPage() {

src/app/me/MeContent.tsx

@@ -1,18 +1,17 @@
 "use client";
 
-import { useState } from "react";
+import { useMemo } from "react";
 import { signOut } from "next-auth/react";
 import toast from "react-hot-toast";
 import UserHeader from "@/components/me/UserHeader";
 import QuotaCard from "@/components/me/QuotaCard";
 import StatsGrid from "@/components/me/StatsGrid";
-import SignInCalendar from "@/components/me/SignInCalendar";
 import MyFanSupport from "@/components/me/MyFanSupport";
-import { MOCK_USER, getFanSupports, type MockUser } from "@/lib/mock-user";
 import {
   useVoteStore,
   selectRemaining,
-  DAILY_VOTE_QUOTA,
+  TOTAL_VOTE_QUOTA,
+  type MySupport,
 } from "@/lib/store";
 
 interface MeContentProps {
@@ -23,69 +22,21 @@ interface MeContentProps {
 }
 
 export default function MeContent({ session }: MeContentProps) {
-  const myTotalVotes = useVoteStore((s) => s.myTotalVotes);
+  // 订阅 store 原始引用(稳定,仅在 set() 时变更),组件内 useMemo 派生 supports,
+  // 避免 Zustand v5 + useSyncExternalStore 对"selector 返回新引用"报 infinite-loop 错。
+  const votedArtists = useVoteStore((s) => s.votedArtists);
   const storeArtists = useVoteStore((s) => s.artists);
   const remaining = useVoteStore(selectRemaining);
+  const votedCount = votedArtists.length;
 
-  const [signedInToday, setSignedInToday] = useState(MOCK_USER.todaySignedIn);
+  const supports = useMemo<MySupport[]>(() => {
-  const [weeklySignIn, setWeeklySignIn] = useState(MOCK_USER.weeklySignIn);
+    const list: MySupport[] = [];
-
+    for (const id of votedArtists) {
-  const user: MockUser = {
+      const artist = storeArtists.find((a) => a.id === id);
-    ...MOCK_USER,
+      if (artist) list.push({ artist });
-    id: session.id,
-    nickname: session.nickname,
-    todaySignedIn: signedInToday,
-    weeklySignIn,
-    totalVotes: MOCK_USER.totalVotes + myTotalVotes,
-  };
-
-  // 用 store 里最新的艺人排名重算"我的应援"当前排名
-  const supports = getFanSupports().map((s) => {
-    const fresh = storeArtists.find((a) => a.id === s.artist.id);
-    return fresh ? { ...s, artist: fresh } : s;
-  });
-
-  const handleInvite = async () => {
-    const url =
-      typeof window !== "undefined"
-        ? `${window.location.origin}?invite=${session.id}`
-        : "";
-    if (typeof navigator !== "undefined" && navigator.share) {
-      try {
-        await navigator.share({
-          title: "CYBER STAR · 一起为偶像应援",
-          text: "邀请你加入虚拟偶像 Top12 出道企划！",
-          url,
-        });
-        return;
-      } catch {
-        return;
     }
-    }
+    return list;
-    try {
+  }, [votedArtists, storeArtists]);
-      await navigator.clipboard.writeText(url);
-      toast.success("邀请链接已复制 · 快去喊朋友一起来");
-    } catch {
-      toast.error("复制失败，请手动复制地址");
-    }
-  };
-
-  const handleSignIn = () => {
-    if (signedInToday) {
-      toast("今日已签到", { icon: "✓" });
-      return;
-    }
-    const idx = weeklySignIn.findIndex((v) => !v);
-    if (idx === -1) {
-      toast("本周已全部签到");
-      return;
-    }
-    const next = [...weeklySignIn];
-    next[idx] = true;
-    setWeeklySignIn(next);
-    setSignedInToday(true);
-    toast.success("签到成功");
-  };
 
   const handleLogout = () => {
     toast("正在退出登录…");
@@ -94,26 +45,15 @@ export default function MeContent({ session }: MeContentProps) {
 
   return (
     <div className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 py-8 sm:py-10 space-y-8">
-      <UserHeader user={user} onLogout={handleLogout} />
+      <UserHeader
-
+        nickname={session.nickname}
-      <QuotaCard
+        userId={session.id}
-        remaining={remaining}
+        onLogout={handleLogout}
-        dailyQuota={DAILY_VOTE_QUOTA}
-        cumulative={user.totalVotes}
-        onInvite={handleInvite}
       />
 
-      <StatsGrid user={user} />
+      <QuotaCard remaining={remaining} totalQuota={TOTAL_VOTE_QUOTA} />
 
-      <section>
+      <StatsGrid voted={votedCount} remaining={remaining} />
-        <SectionTitle label="每日签到" />
-        <SignInCalendar
-          weekly={user.weeklySignIn}
-          todaySigned={user.todaySignedIn}
-          streak={user.signInStreak}
-          onSignIn={handleSignIn}
-        />
-      </section>
 
       <section>
         <SectionTitle label="我的应援" />

src/app/me/page.tsx

@@ -4,7 +4,7 @@ import { auth } from "@/lib/auth";
 import MeContent from "./MeContent";
 
 export const metadata: Metadata = {
-  title: "个人中心 · CYBER STAR",
+  title: "个人中心 · 银河初星计划 C . S . G",
 };
 
 export default async function MePage() {

src/app/page.tsx

@@ -7,36 +7,65 @@ import Top12Bar from "@/components/Top12Bar";
 import ArtistCard from "@/components/cards/ArtistCard";
 import ArtistFilters, { type TagFilter } from "@/components/ArtistFilters";
 import VoteModal from "@/components/VoteModal";
-import { getActivityEndTime, sortArtists } from "@/lib/mock-data";
+import { sortArtists, type SortKey } from "@/lib/mock-data";
 import { useVoteStore } from "@/lib/store";
 import { useVoteAction } from "@/hooks/useVoteAction";
+import { useRanking } from "@/hooks/useRanking";
+import { useScrollRestore } from "@/hooks/useScrollRestore";
+import { useUIStore } from "@/lib/ui-store";
 import { cn } from "@/lib/cn";
+import { tosUrl } from "@/lib/tos";
+import type { Artist } from "@/types/artist";
 
 export default function Home() {
-  const artists = useVoteStore((s) => s.artists);
+  const storeArtists = useVoteStore((s) => s.artists);
-  const { target, remaining, dailyQuota, openVote, closeVote, confirmVote } =
+
-    useVoteAction();
+  // 30s 轮询 /api/ranking 拿服务端真实票数
+  const live = useRanking({ pollInterval: 30_000 });
+
+  // 投票成功后立即 refresh 排名,不等下次轮询(解决"票数 +1 / Top12 排位延迟"问题)
+  const { target, remaining, totalQuota, openVote, closeVote, confirmVote } =
+    useVoteAction({ onVoteSuccess: live.refresh });
 
   const [tagFilter, setTagFilter] = useState<TagFilter>("all");
+  const [sortKey, setSortKey] = useState<SortKey>("votes");
   const [filterStuck, setFilterStuck] = useState(false);
   const filterSentinelRef = useRef<HTMLDivElement>(null);
+  const setStoreFilterStuck = useUIStore((s) => s.setFilterStuck);
 
-  const endTime = useMemo(() => getActivityEndTime(), []);
+  // 首页滚动位置 per-tab 记忆:从艺人详情点 ← 返回时恢复到上次浏览位置
+  useScrollRestore("home");
+
+  // 数据同步:本地乐观投票 + 服务端票数取 max,避免本地 store 只看到自己投的票。
+  // 与 /ranking 页面同一策略,首页 Top12 + 候选区都基于这份合并数据。
+  const artists = useMemo<Artist[]>(() => {
+    const apiVotes = new Map<string, number>();
+    if (live.data?.list) {
+      for (const row of live.data.list) apiVotes.set(row.id, row.voteCount);
+    }
+    const merged = storeArtists.map((a) => {
+      const apiV = apiVotes.get(a.id) ?? 0;
+      return apiV > a.votes ? { ...a, votes: apiV } : a;
+    });
+    const ranked = sortArtists(merged, "votes");
+    return ranked.map((a, i) => ({ ...a, rank: i + 1 }));
+  }, [storeArtists, live.data]);
 
   const visibleArtists = useMemo(() => {
     let list = [...artists];
     if (tagFilter !== "all") {
       list = list.filter((a) => a.tags.includes(tagFilter));
     }
-    return sortArtists(list, "votes");
+    return sortArtists(list, sortKey);
-  }, [artists, tagFilter]);
+  }, [artists, tagFilter, sortKey]);
 
-  // 仅在首页启用 scroll-snap mandatory：用户下滑就立即切换到下一个 snap 点
+  // 仅在首页启用 scroll-snap：用户接近 Hero/Top12/候选区时自然吸附。
-  // (Hero → Top12 → 候选区)。卸载时还原。
+  // 用 proximity 而不是 mandatory —— mandatory 会把"滚到底部"强制吸回到最后一个
+  // snap 点的 start（候选区顶部），表现为回弹；proximity 只在靠近时吸，远离不干预。
   useEffect(() => {
     const root = document.documentElement;
     const prev = root.style.scrollSnapType;
-    root.style.scrollSnapType = "y mandatory";
+    root.style.scrollSnapType = "y proximity";
     return () => {
       root.style.scrollSnapType = prev;
     };
@@ -60,16 +89,24 @@ export default function Home() {
     };
   }, []);
 
+  // 把 filterStuck 同步到全局 UI store —— 让导航栏感知,在吸顶时关掉自己的玻璃,
+  // 让筛选条延伸出的"共享玻璃带"成为唯一的 backdrop-filter,消除接缝
+  useEffect(() => {
+    setStoreFilterStuck(filterStuck);
+    return () => setStoreFilterStuck(false);
+  }, [filterStuck, setStoreFilterStuck]);
+
   return (
     <>
-      {/* Hero · 全屏沉浸式视频 · 作为第一个 snap 点 */}
+      {/* Hero · 全屏沉浸式视频 · 作为第一个 snap 点
+          -mt-20 把 Hero 拉到 main 顶部 padding 之上，让视频铺到导航后面（与毛玻璃导航重叠） */}
       <div
+        className="-mt-20"
         style={{
           scrollSnapAlign: "start",
-          scrollMarginTop: "80px",
         }}
       >
-        <HeroBanner endTime={endTime} />
+        <HeroBanner videoSrc={tosUrl("videos/hero-pv.mp4")} />
       </div>
 
       {/* Top12 出道位 · 作为第二个 snap 点：滚动结束后自然落到这里，标题贴近顶部 */}
@@ -97,7 +134,7 @@ export default function Home() {
           <div className="flex items-end justify-between mb-3 px-1">
             <h2 className="font-display text-base sm:text-lg tracking-[0.2em] text-white inline-flex items-center gap-2">
               <Users size={16} className="text-purple-300" />
-              35 位候选人
+              {artists.length} 位候选人
             </h2>
             <p className="font-label text-[11px] tracking-widest text-white/45 uppercase">
               当前显示{" "}
@@ -112,17 +149,31 @@ export default function Home() {
         {/* 哨兵：用于检测筛选条是否吸顶 */}
         <div ref={filterSentinelRef} aria-hidden style={{ height: 0 }} />
 
-        {/* 筛选条 · 外层铺满（与导航栏同宽），吸顶后启用毛玻璃；内层版心承载文案 */}
+        {/* 筛选条 · 外层铺满,内层版心承载文案。
+            吸顶时,absolute 子层把玻璃从 -top-20 一路扩到容器底部 ——
+            这是一个单一元素的 backdrop-filter,横跨 nav 区域 + filter 区域,
+            消除两块独立玻璃在 y=80 接缝处的视觉割裂。导航栏同步关掉自己的玻璃。 */}
         <div
-          className={cn(
+          className="sticky z-30 transition-colors duration-200"
-            "sticky z-30 transition-colors duration-200",
-            filterStuck &&
-              "backdrop-blur-xl bg-[rgba(13,10,36,0.85)] border-b border-white/[0.08]",
-          )}
           style={{ top: "80px" }}
         >
-          <div className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8">
+          {/* 共享玻璃带:absolute,吸顶时延伸到 nav 顶部,opacity 平滑过渡 */}
-            <ArtistFilters tagFilter={tagFilter} onTagChange={setTagFilter} />
+          <div
+            aria-hidden
+            className={cn(
+              "absolute inset-x-0 -top-20 bottom-0 pointer-events-none",
+              "bg-surface/40 backdrop-blur-xl backdrop-saturate-150 border-b border-white/[0.06]",
+              "transition-opacity duration-300",
+              filterStuck ? "opacity-100" : "opacity-0",
+            )}
+          />
+          <div className="relative max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8">
+            <ArtistFilters
+              tagFilter={tagFilter}
+              onTagChange={setTagFilter}
+              sort={sortKey}
+              onSortChange={setSortKey}
+            />
           </div>
         </div>
 
@@ -143,7 +194,7 @@ export default function Home() {
       <VoteModal
         artist={target}
         remaining={remaining}
-        dailyQuota={dailyQuota}
+        totalQuota={totalQuota}
         onClose={closeVote}
         onConfirm={confirmVote}
       />

src/app/ranking/page.tsx

@@ -14,27 +14,55 @@ import type { Artist } from "@/types/artist";
 
 export default function RankingPage() {
   const storeArtists = useVoteStore((s) => s.artists);
-  const { target, remaining, dailyQuota, openVote, closeVote, confirmVote } =
-    useVoteAction();
 
   const live = useRanking({ pollInterval: 30_000 });
 
+  // 投票成功后立即 refresh 排名,不等下次轮询
+  const { target, remaining, totalQuota, openVote, closeVote, confirmVote } =
+    useVoteAction({ onVoteSuccess: live.refresh });
+
+  // 数据同步：本地乐观投票 + 服务端最新票数取 max（避免 API 落后覆盖本地新票，
+  // 也避免本地缺其他用户的票数）。合并后按 votes desc + no asc 重新排序并赋 rank。
   const sorted = useMemo<Artist[]>(() => {
-    if (live.data?.list && live.data.list.length > 0) {
+    const apiVotes = new Map<string, number>();
-      return live.data.list.map((row) => {
+    if (live.data?.list) {
-        const base = storeArtists.find((a) => a.id === row.id);
+      for (const row of live.data.list) apiVotes.set(row.id, row.voteCount);
-        if (!base) return row as unknown as Artist;
-        return { ...base, votes: row.voteCount, rank: row.rank };
-      });
     }
-    return sortArtists(storeArtists, "votes");
+    const merged = storeArtists.map((a) => {
+      const apiV = apiVotes.get(a.id) ?? 0;
+      return apiV > a.votes ? { ...a, votes: apiV } : a;
+    });
+    const ranked = sortArtists(merged, "votes");
+    // 重新按合并后的排名赋 rank（store 自带的 rank 仅来自本地 vote 后的 rank()）
+    return ranked.map((a, i) => ({ ...a, rank: i + 1 }));
   }, [storeArtists, live.data]);
 
-  const top3 = sorted.slice(0, 3);
+  // 仅有票的人能"进榜单"，0 票不参与排名兜底
-  const top4to12 = sorted.slice(3, 12);
+  const ranked = sorted.filter((a) => a.votes > 0);
-  const candidates = sorted.slice(12);
+  const zeros = sorted.filter((a) => a.votes === 0);
+  // 只要有 1 人有票就显示领奖台（#2/#3 缺位会自动以"虚位以待"占位）；
+  // 至少 12 人有票才有"出道线 / 复活位"概念
+  const podiumReady = ranked.length >= 1;
+  const debutReady = ranked.length >= 12;
 
-  const debutCutoff = sorted[11]?.votes ?? 0;
+  const top3 = podiumReady ? ranked.slice(0, 3) : [];
+
+  // 出道线上方（top3 之后到出道线之间）
+  // - Top12 满员：经典 9 位（rank 4-12）
+  // - 已有领奖台但 Top12 未满：podium 之后的所有有票
+  // - 连领奖台都没满：所有有票的人都从这里开始
+  const aboveLine = debutReady
+    ? ranked.slice(3, 12)
+    : podiumReady
+      ? ranked.slice(3)
+      : ranked;
+
+  // 出道线下方
+  // - Top12 满员：ranked[12..] + 全部 0 票
+  // - 否则：仅 0 票
+  const belowLine = debutReady ? [...ranked.slice(12), ...zeros] : zeros;
+
+  const debutCutoff = debutReady ? ranked[11].votes : 0;
 
   return (
     <>
@@ -59,8 +87,13 @@ export default function RankingPage() {
           </div>
 
           <div>
-            {top4to12.map((a, idx) => {
+            {aboveLine.map((a, idx) => {
-              const prev = idx === 0 ? top3[2] : top4to12[idx - 1];
+              const prev =
+                idx === 0
+                  ? podiumReady
+                    ? top3[2]
+                    : undefined
+                  : aboveLine[idx - 1];
               const gap = prev ? prev.votes - a.votes : undefined;
               return (
                 <RankingRow
@@ -73,14 +106,16 @@ export default function RankingPage() {
             })}
           </div>
 
-          <DebutLineDivider />
+          {/* 仅 Top12 满员才显示"出道线"分隔 */}
+          {debutReady && <DebutLineDivider />}
 
           <div>
-            {candidates.map((a, idx) => {
+            {belowLine.map((a, idx) => {
               const prev =
-                idx === 0 ? top4to12[top4to12.length - 1] : candidates[idx - 1];
+                idx === 0 ? aboveLine[aboveLine.length - 1] : belowLine[idx - 1];
               const gap = prev ? prev.votes - a.votes : undefined;
-              const isRescue = idx === 0;
+              // 仅 Top12 满员时第一位才是"复活位"
+              const isRescue = debutReady && idx === 0;
               const gapToDebut = isRescue ? debutCutoff - a.votes + 1 : undefined;
               return (
                 <RankingRow
@@ -101,7 +136,7 @@ export default function RankingPage() {
       <VoteModal
         artist={target}
         remaining={remaining}
-        dailyQuota={dailyQuota}
+        totalQuota={totalQuota}
         onClose={closeVote}
         onConfirm={confirmVote}
       />

src/components/ArtistFilters.tsx

@@ -2,29 +2,42 @@
 
 import { cn } from "@/lib/cn";
 import type { ArtistTag } from "@/types/artist";
+import type { SortKey } from "@/lib/mock-data";
 
-export type ViewMode = "grid" | "list";
 export type TagFilter = ArtistTag | "all";
 
 interface ArtistFiltersProps {
   tagFilter: TagFilter;
   onTagChange: (tag: TagFilter) => void;
+  sort: SortKey;
+  onSortChange: (sort: SortKey) => void;
 }
 
 const TAG_OPTIONS: { key: TagFilter; label: string }[] = [
   { key: "all", label: "全部" },
-  { key: "dance", label: "舞蹈担当" },
+  { key: "rock", label: "摇滚" },
-  { key: "vocal", label: "声乐担当" },
+  { key: "pop", label: "流行" },
-  { key: "rap", label: "rap担当" },
+  { key: "chinese", label: "国风" },
-  { key: "all-rounder", label: "全能型" },
+  { key: "hiphop", label: "嘻哈说唱" },
+  { key: "folk", label: "民谣治愈" },
+  { key: "jazz", label: "爵士" },
+];
+
+const SORT_OPTIONS: { key: SortKey; label: string }[] = [
+  { key: "votes", label: "实时排名" },
+  { key: "no", label: "编号顺序" },
 ];
 
 export default function ArtistFilters({
   tagFilter,
   onTagChange,
+  sort,
+  onSortChange,
 }: ArtistFiltersProps) {
   return (
-    <div className="flex items-center gap-1 py-3 border-b border-white/[0.06] overflow-x-auto">
+    <div className="flex items-center gap-3 py-3 border-b border-white/[0.06]">
+      {/* 左:标签筛选 · 隐藏横向滚动条 thumb,避免在毛玻璃栏里出现深色小矩形 */}
+      <div className="flex items-center gap-1 overflow-x-auto flex-1 min-w-0 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden">
         {TAG_OPTIONS.map((opt) => (
           <TagPill
             key={opt.key}
@@ -35,6 +48,30 @@ export default function ArtistFilters({
           </TagPill>
         ))}
       </div>
+
+      {/* 右:排序切换(segmented control 胶囊) */}
+      <div className="flex-shrink-0 inline-flex rounded-full bg-white/[0.04] border border-white/10 p-0.5 text-xs">
+        {SORT_OPTIONS.map((opt) => {
+          const active = sort === opt.key;
+          return (
+            <button
+              key={opt.key}
+              type="button"
+              onClick={() => onSortChange(opt.key)}
+              aria-pressed={active}
+              className={cn(
+                "px-3 sm:px-3.5 h-7 rounded-full transition-colors whitespace-nowrap",
+                active
+                  ? "bg-purple-500/25 text-purple-100 shadow-[0_0_10px_rgba(139,92,246,0.35)]"
+                  : "text-white/55 hover:text-white/85",
+              )}
+            >
+              {opt.label}
+            </button>
+          );
+        })}
+      </div>
+    </div>
   );
 }
 

src/components/FloatingBackButton.tsx

@@ -0,0 +1,80 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
+import { ChevronLeft } from "lucide-react";
+import { cn } from "@/lib/cn";
+import { useFooterPush } from "@/hooks/useFooterPush";
+
+interface FloatingBackButtonProps {
+  /** 显示前的滚动阈值(px),默认 300 与投票按钮一致 */
+  threshold?: number;
+  /** 备用 href:历史栈为空时(直接进入详情页)回退到该地址 */
+  fallbackHref?: string;
+  className?: string;
+}
+
+/**
+ * 左下角浮动返回按钮。
+ * - 用户滚到第一屏以下才显示,避免与顶部面包屑视觉冗余
+ * - 优先用 router.back() 回到浏览器历史的上一页(会触发上页 scroll restore)
+ * - 检测 sessionStorage 标记:如果是直接打开/刷新本页,history.back() 不安全,改用 fallbackHref
+ * - 玻璃化样式,与导航栏吸顶后的玻璃配方对齐
+ */
+export default function FloatingBackButton({
+  threshold = 300,
+  fallbackHref = "/",
+  className,
+}: FloatingBackButtonProps) {
+  const router = useRouter();
+  const [visible, setVisible] = useState(false);
+  const [hasInternalHistory, setHasInternalHistory] = useState(false);
+  // footer 进视口时按钮向上平移,始终漂浮在 footer 顶部上方
+  const footerPush = useFooterPush();
+
+  useEffect(() => {
+    // Navigation 组件每次路由变化会把 nav:count +1。
+    // count > 1 → 当前会话内已经经过至少一次跳转,router.back() 安全。
+    // count <= 1 → 直接打开/刷新本页,history 栈外是站外,改用 fallbackHref。
+    const count = parseInt(sessionStorage.getItem("nav:count") || "0", 10);
+    setHasInternalHistory(count > 1);
+
+    const handler = () => setVisible(window.scrollY > threshold);
+    handler();
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, [threshold]);
+
+  const goBack = () => {
+    if (hasInternalHistory) {
+      router.back();
+    } else {
+      router.push(fallbackHref);
+    }
+  };
+
+  return (
+    <button
+      type="button"
+      onClick={goBack}
+      aria-label="返回上一页"
+      style={{
+        // 隐藏态:下移 12px;显示态:基础位置 - footerPush(避让 footer)
+        transform: visible
+          ? `translateY(-${footerPush}px)`
+          : "translateY(12px)",
+      }}
+      className={cn(
+        "fixed bottom-6 left-6 sm:bottom-8 sm:left-8 z-40 w-14 h-14 rounded-full",
+        "bg-surface/55 backdrop-blur-xl backdrop-saturate-150 border border-white/[0.08]",
+        "shadow-[0_8px_28px_rgba(0,0,0,0.55)] text-white/85 hover:text-white hover:bg-surface/75",
+        "flex items-center justify-center transition-all duration-300",
+        visible ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none",
+        "hover:scale-105 active:scale-95",
+        className,
+      )}
+    >
+      <ChevronLeft size={22} strokeWidth={2.2} />
+    </button>
+  );
+}

src/components/FloatingVoteButton.tsx

@@ -1,22 +1,27 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import { Heart } from "lucide-react";
+import { Heart, Check } from "lucide-react";
 import { cn } from "@/lib/cn";
+import { useFooterPush } from "@/hooks/useFooterPush";
 
 interface FloatingVoteButtonProps {
   onClick: () => void;
   /** 显示前的滚动阈值（px） */
   threshold?: number;
   className?: string;
+  hasVoted?: boolean;
 }
 
 export default function FloatingVoteButton({
   onClick,
   threshold = 300,
   className,
+  hasVoted = false,
 }: FloatingVoteButtonProps) {
   const [visible, setVisible] = useState(false);
+  // footer 进视口时按钮向上平移,始终漂浮在 footer 顶部上方
+  const footerPush = useFooterPush();
 
   useEffect(() => {
     const handler = () => setVisible(window.scrollY > threshold);
@@ -29,18 +34,34 @@ export default function FloatingVoteButton({
     <button
       type="button"
       onClick={onClick}
-      aria-label="立即投票"
+      aria-label={hasVoted ? "已投票" : "立即投票"}
+      style={{
+        // 隐藏态:下移 12px;显示态:基础位置 - footerPush(避让 footer)
+        transform: visible
+          ? `translateY(-${footerPush}px)`
+          : "translateY(12px)",
+      }}
       className={cn(
-        "fixed bottom-6 right-6 sm:bottom-8 sm:right-8 z-40 w-14 h-14 rounded-full bg-grad-purple text-white flex flex-col items-center justify-center font-display text-[9px] tracking-widest shadow-purple-glow animate-pulse-glow transition-all",
+        "fixed bottom-6 right-6 sm:bottom-8 sm:right-8 z-40 w-14 h-14 rounded-full flex flex-col items-center justify-center font-display text-[9px] tracking-widest transition-all duration-300",
-        visible
+        hasVoted
-          ? "opacity-100 translate-y-0 pointer-events-auto"
+          ? "bg-white/12 border border-white/15 text-white/65"
-          : "opacity-0 translate-y-3 pointer-events-none",
+          : "bg-grad-purple text-white shadow-purple-glow animate-pulse-glow",
+        visible ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none",
         "hover:scale-105",
         className,
       )}
     >
+      {hasVoted ? (
+        <>
+          <Check size={16} strokeWidth={3} className="mb-0.5" />
+          <span>已投</span>
+        </>
+      ) : (
+        <>
           <Heart size={16} fill="white" className="mb-0.5" />
           <span>投票</span>
+        </>
+      )}
     </button>
   );
 }

src/components/Footer.tsx

@@ -1,13 +1,10 @@
-import Logo from "./Logo";
-
 export default function Footer() {
   const year = new Date().getFullYear();
   return (
     <footer className="border-t border-white/[0.06] bg-deep mt-16">
-      <div className="max-w-[1500px] mx-auto px-6 sm:px-8 h-16 flex flex-col sm:flex-row items-center justify-center gap-3 sm:gap-6 text-center">
+      <div className="max-w-[1500px] mx-auto px-6 sm:px-8 h-16 flex items-center justify-center text-center">
-        <Logo size="sm" href={null} />
         <p className="text-[11px] text-white/35 tracking-[0.05em]">
-          © {year} CYBER STAR · All Rights Reserved
+          © {year} 银河初星计划 C . S . G · All Rights Reserved
         </p>
       </div>
     </footer>

src/components/HeroBanner.tsx

@@ -2,7 +2,7 @@
 
 import { useEffect, useRef, useState } from "react";
 import { Volume2, VolumeX } from "lucide-react";
-import Countdown from "./ui/Countdown";
+import HeroVoteProgress from "./HeroVoteProgress";
 import { cn } from "@/lib/cn";
 
 interface HeroBannerProps {
@@ -10,8 +10,6 @@ interface HeroBannerProps {
   videoSrc?: string;
   /** 视频封面图 */
   poster?: string;
-  /** 活动结束时间 */
-  endTime: Date | string | number;
   className?: string;
 }
 
@@ -19,12 +17,12 @@ interface HeroBannerProps {
  * 全屏沉浸式 Hero：
  * - 容器宽度铺满视口（视频背景），但内部文案在 1500 版心内
  * - 高度 = 100svh - 80px 导航
+ * - 右上角的"应援进度"组件替代原倒计时,体现 12 票终身额度玩法
  * - 声音按钮在右下角，即使视频未加载也能切换图标状态（视觉即时反馈）
  */
 export default function HeroBanner({
   videoSrc,
   poster,
-  endTime,
   className,
 }: HeroBannerProps) {
   const videoRef = useRef<HTMLVideoElement>(null);
@@ -35,7 +33,7 @@ export default function HeroBanner({
     if (!v || !videoSrc) return;
     v.muted = isMuted;
     v.play().catch(() => {});
-    // 仅在 videoSrc 变化时执行 · 不依赖 isMuted（mute 切换由按钮处理）
+    // 仅在 videoSrc 变化时执行 · 不依赖 isMuted(mute 切换由按钮处理)
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [videoSrc]);
 
@@ -50,13 +48,14 @@ export default function HeroBanner({
 
   return (
     <section
+      data-hero-banner
       className={cn(
         "relative w-full overflow-hidden bg-deepest",
         "min-h-[560px]",
         className,
       )}
       style={{
-        height: "calc(100svh - 80px)",
+        height: "100svh",
         minHeight: "560px",
       }}
     >
@@ -83,36 +82,22 @@ export default function HeroBanner({
         className="absolute inset-0 pointer-events-none"
         style={{
           background:
-            "linear-gradient(180deg, rgba(8,5,26,0.45) 0%, rgba(8,5,26,0.12) 40%, rgba(8,5,26,0.85) 100%)",
+            "linear-gradient(180deg, rgba(8,5,26,0.45) 0%, rgba(8,5,26,0.12) 40%, rgba(8,5,26,0.08) 100%)",
         }}
       />
 
       {/* 版心容器：1500px max-width，所有文案 / 倒计时 / 声音按钮全部在内 */}
       <div className="absolute inset-0 max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8">
-        {/* Eyebrow 左上 */}
+        {/* Eyebrow 左上 · 紧贴导航下方 */}
-        <div className="absolute top-6 sm:top-10 left-4 sm:left-6 lg:left-8 z-10">
+        <div className="absolute top-[6.5rem] sm:top-[7.5rem] left-4 sm:left-6 lg:left-8 z-10">
-          <p className="font-label text-[10px] sm:text-xs tracking-[0.4em] uppercase text-purple-200/90">
+          <p className="font-label text-[10px] sm:text-xs tracking-[0.28em] uppercase text-purple-200/90">
-            Top 12 · Virtual Idol Debut Project
+            银河初星计划 C . S . G
           </p>
         </div>
 
-        {/* 浅紫边框倒计时 右上 */}
+        {/* 应援进度 右上 · 紧贴导航下方 · 与左侧 Eyebrow 同高对齐 */}
-        <div className="absolute top-5 sm:top-8 right-4 sm:right-6 lg:right-8 z-10">
+        <div className="absolute top-[6.25rem] sm:top-[7rem] right-4 sm:right-6 lg:right-8 z-10">
-          <Countdown endTime={endTime} compact />
+          <HeroVoteProgress />
-        </div>
-
-        {/* 中央 CYBER ✦ STAR */}
-        <div className="absolute inset-0 flex flex-col items-center justify-center z-10 px-6 text-center">
-          <h1 className="font-logo text-6xl sm:text-8xl lg:text-9xl tracking-[0.2em] glow-text-purple inline-flex items-baseline text-white">
-            CYBER
-            <span className="text-purple-300 mx-2 sm:mx-4 text-4xl sm:text-6xl lg:text-7xl">
-              ✦
-            </span>
-            STAR
-          </h1>
-          <p className="mt-6 text-white/80 text-base sm:text-lg tracking-[0.4em]">
-            虚 拟 偶 像 出 道 企 划
-          </p>
         </div>
 
         {/* 声音按钮 右下 */}
@@ -130,7 +115,7 @@ export default function HeroBanner({
       {/* 底部渐隐 */}
       <div
         aria-hidden
-        className="absolute inset-x-0 bottom-0 h-24 pointer-events-none"
+        className="absolute inset-x-0 bottom-0 h-16 pointer-events-none"
         style={{
           background:
             "linear-gradient(180deg, transparent 0%, var(--color-deepest) 100%)",

src/components/HeroVoteProgress.tsx

@@ -0,0 +1,115 @@
+"use client";
+
+import { useSession } from "next-auth/react";
+import { Check, LogIn } from "lucide-react";
+import { useVoteStore, TOTAL_VOTE_QUOTA } from "@/lib/store";
+import { useLoginModalStore } from "@/lib/login-modal-store";
+import { cn } from "@/lib/cn";
+
+/**
+ * Hero 区域右上角的"应援进度"小组件,替代原 Countdown。
+ * 视觉对齐 Countdown compact 模式:同高度 h-9、同位置、同毛玻璃质感(深底 + backdrop-blur + 浅紫边框)。
+ *
+ * 三态:
+ * 1. 未登录 → "登录后开始投票" 可点击 CTA · 12 格全暗
+ * 2. 已登录,未投满 → "应援进度 X/12" · 已投点亮、未投暗紫描边
+ * 3. 投满 12 票 → "✓ 12 票全部投出" · 12 格全亮 · 紫色强辉光
+ */
+export default function HeroVoteProgress({ className }: { className?: string }) {
+  const { status } = useSession();
+  const votedCount = useVoteStore((s) => s.votedArtists.length);
+  const openLogin = useLoginModalStore((s) => s.show);
+
+  const authed = status === "authenticated";
+  const filled = authed ? votedCount : 0;
+  const exhausted = authed && votedCount >= TOTAL_VOTE_QUOTA;
+
+  // 未登录 → 可点击 CTA;其它态 → 普通信息容器
+  const isClickable = !authed;
+
+  const containerCls = cn(
+    "inline-flex items-center gap-2.5 h-9 px-4 rounded-full",
+    "bg-[rgba(13,10,36,0.55)] backdrop-blur-md",
+    "border transition-colors",
+    exhausted
+      ? "border-purple-300/70 shadow-[0_0_18px_rgba(139,92,246,0.45)]"
+      : "border-purple-300/40",
+    isClickable && "cursor-pointer hover:bg-[rgba(13,10,36,0.7)] hover:border-purple-300/60",
+    className,
+  );
+
+  const content = (
+    <>
+      {/* 左侧文字状态 */}
+      {!authed ? (
+        <span className="inline-flex items-center gap-1.5 text-white/85 text-xs leading-none">
+          <LogIn size={11} className="text-purple-300" />
+          登录后开始投票
+        </span>
+      ) : exhausted ? (
+        <span className="inline-flex items-center gap-1.5 text-purple-200 text-xs leading-none font-medium">
+          <Check size={12} strokeWidth={3} />
+          12 票全部投出
+        </span>
+      ) : (
+        <span className="inline-flex items-center gap-1.5 text-white/85 text-xs leading-none">
+          应援进度
+          <span className="font-display text-purple-300 tabular-nums tracking-wider">
+            {filled}/{TOTAL_VOTE_QUOTA}
+          </span>
+        </span>
+      )}
+
+      {/* 12 格点亮式进度条 —— 窄屏隐藏,避免与左侧 Eyebrow 横向挤撞;>= md 才显示 */}
+      <span
+        aria-hidden
+        className="hidden md:inline-flex items-center gap-[3px] ml-0.5"
+      >
+        {Array.from({ length: TOTAL_VOTE_QUOTA }).map((_, i) => {
+          const lit = i < filled;
+          return (
+            <span
+              key={i}
+              className={cn(
+                "w-1.5 h-1.5 rounded-full transition-all duration-300",
+                lit
+                  ? exhausted
+                    ? "bg-purple-200 shadow-[0_0_6px_rgba(196,181,253,0.95)]"
+                    : "bg-purple-400 shadow-[0_0_4px_rgba(167,139,250,0.85)]"
+                  : "bg-purple-500/15 border border-purple-300/25",
+              )}
+            />
+          );
+        })}
+      </span>
+    </>
+  );
+
+  if (isClickable) {
+    return (
+      <button
+        type="button"
+        onClick={() => openLogin()}
+        aria-label="登录后开始投票"
+        data-hero-vote-progress
+        className={containerCls}
+      >
+        {content}
+      </button>
+    );
+  }
+
+  return (
+    <div
+      className={containerCls}
+      data-hero-vote-progress
+      aria-label={
+        exhausted
+          ? "12 票已全部投出"
+          : `应援进度 ${filled} 票 / 共 ${TOTAL_VOTE_QUOTA} 票`
+      }
+    >
+      {content}
+    </div>
+  );
+}

src/components/Logo.tsx

@@ -8,7 +8,7 @@ interface LogoProps {
   className?: string;
 }
 
-// 高度由 size 控制，宽度按 logo.png 实际比例（约 5.41:1，单行 CYBER STAR + 星环）自适应
+// 高度由 size 控制，宽度按 logo-v4.png 实际比例自适应
 const HEIGHT_PX: Record<LogoSize, number> = {
   sm: 24,
   md: 44,
@@ -25,18 +25,17 @@ export default function Logo({
 
   // 用原生 <img> 绕开 Next/Image 的格式转换 —— 某些环境下 sharp 把透明 PNG
   // 转 webp/avif 时会铺白底，导致 logo 在深色 nav 上出现白色矩形。
+  // ?v=4 缓存破坏:logo 改版时 +1,浏览器立刻拉新版而不读老缓存。
   const inner = (
     <img
-      src="/logo.png"
+      src="/logo-v4.png?v=4"
-      alt="CYBER STAR"
+      alt="银河初星计划 C . S . G"
       decoding="async"
       draggable={false}
       style={{
         height: `${h}px`,
         width: "auto",
         background: "transparent",
-        // 保留紫色辉光，但 drop-shadow 不会引入白底
-        filter: "drop-shadow(0 0 14px rgba(139,92,246,0.4))",
       }}
       className={`block select-none ${className}`}
     />
@@ -47,7 +46,7 @@ export default function Logo({
     <Link
       href={href}
       className="inline-flex items-center hover:opacity-90 transition-opacity"
-      aria-label="CYBER STAR · 首页"
+      aria-label="银河初星计划 C . S . G · 首页"
       style={{ background: "transparent" }}
     >
       {inner}

src/components/NavLinks.tsx

@@ -19,10 +19,9 @@ const NAV_ITEMS: Array<{
 
 interface NavLinksProps {
   className?: string;
-  mobile?: boolean;
 }
 
-export default function NavLinks({ className, mobile = false }: NavLinksProps) {
+export default function NavLinks({ className }: NavLinksProps) {
   const pathname = usePathname();
   const { status } = useSession();
   const openLogin = useLoginModalStore((s) => s.show);
@@ -43,39 +42,11 @@ export default function NavLinks({ className, mobile = false }: NavLinksProps) {
     }
   };
 
-  if (mobile) {
   return (
     <ul
       className={cn(
-          "flex items-center gap-6 px-6 py-2.5 text-[13px] tracking-[0.1em] whitespace-nowrap",
+        // 单一布局:窄屏 gap-5 text-[13px],sm 以上 gap-8 text-sm,装饰一致
-          className,
+        "flex items-center gap-5 sm:gap-8 text-[13px] sm:text-sm tracking-[0.1em] whitespace-nowrap",
-        )}
-      >
-        {NAV_ITEMS.map((item) => {
-          const active = isActive(item.href);
-          return (
-            <li key={item.href}>
-              <Link
-                href={item.href}
-                onClick={(e) => handleClick(e, item)}
-                className={cn(
-                  "transition-colors",
-                  active ? "text-purple-300" : "text-white/55",
-                )}
-              >
-                {item.label}
-              </Link>
-            </li>
-          );
-        })}
-      </ul>
-    );
-  }
-
-  return (
-    <ul
-      className={cn(
-        "items-center gap-8 text-sm tracking-[0.1em]",
         className,
       )}
     >

src/components/Navigation.tsx

@@ -1,31 +1,107 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { usePathname } from "next/navigation";
 import Logo from "./Logo";
 import NavLinks from "./NavLinks";
 import SearchTrigger from "./SearchTrigger";
 import AuthMenu from "./auth/AuthMenu";
 import RemainingVotesBadge from "./auth/RemainingVotesBadge";
+import { cn } from "@/lib/cn";
+import { useUIStore } from "@/lib/ui-store";
 
+/**
+ * 导航栏 · 上下文敏感的玻璃态切换
+ * - 顶部/盖在 Hero 之上时:完全透明,只有内容(无玻璃层、无分割线)
+ * - 内容滚到 nav 下方时:渐显为毛玻璃(blur + saturate + surface 微着色),与下方筛选条无缝连接
+ * - 玻璃层用独立 absolute 子层 + opacity 过渡,避免直接切 backdrop-filter class 的硬切
+ *
+ * 检测策略:
+ * - 路由存在 [data-hero-banner] → IntersectionObserver 观察 Hero(首页)
+ * - 否则 → 滚动监听,scrollY <= 0 时透明,任意向下滚动即玻璃
+ */
 export default function Navigation() {
+  const pathname = usePathname();
+  // 初始乐观:任何页面首屏都假设在顶部/Hero 上,透明。effect 挂载后会立刻校正。
+  const [isTransparent, setIsTransparent] = useState(true);
+  // 筛选条吸顶时,nav 也变透明 —— 此时筛选条的"共享玻璃带"已延伸到 nav 顶部,
+  // nav 关掉自己的玻璃,避免双重 backdrop-filter 在 y=80 处出现拼接线。
+  const filterStuck = useUIStore((s) => s.filterStuck);
+  const glassOff = isTransparent || filterStuck;
+  const showLogo = pathname !== "/";
+
+  // 维护一个站内导航计数器(per-tab),供 FloatingBackButton 判断 router.back() 是否安全
+  useEffect(() => {
+    const prev = parseInt(sessionStorage.getItem("nav:count") || "0", 10);
+    sessionStorage.setItem("nav:count", String(prev + 1));
+  }, [pathname]);
+
+  useEffect(() => {
+    const heroEl = document.querySelector("[data-hero-banner]");
+
+    // 1) 有 Hero 的页面:观察 Hero 是否还在视口顶部下方
+    if (heroEl) {
+      setIsTransparent(true);
+      const observer = new IntersectionObserver(
+        ([entry]) => setIsTransparent(entry.isIntersecting),
+        {
+          // 视口顶部下移 80px(导航高度),让 Hero 完全滚出 nav 下方时触发
+          rootMargin: "-80px 0px 0px 0px",
+          threshold: 0,
+        },
+      );
+      observer.observe(heroEl);
+      return () => observer.disconnect();
+    }
+
+    // 2) 无 Hero 的页面:scrollY === 0 时透明,任何向下滚动即玻璃
+    const onScroll = () => setIsTransparent(window.scrollY <= 0);
+    onScroll();
+    window.addEventListener("scroll", onScroll, { passive: true });
+    return () => window.removeEventListener("scroll", onScroll);
+  }, [pathname]);
+
   return (
-    <header className="sticky top-0 z-50 backdrop-blur-xl bg-[rgba(13,10,36,0.85)] border-b border-white/[0.08]">
+    <header className="fixed top-0 inset-x-0 z-50">
-      <nav className="max-w-[1500px] mx-auto h-20 px-4 sm:px-6 lg:px-8 flex items-center gap-8">
+      {/* 玻璃层 · 通过 opacity 渐显渐隐 · bg-surface 与全站卡片同色
-        <Logo size="md" />
+          glassOff = isTransparent || filterStuck:
+          - isTransparent: Hero / 页顶,本来就要透明
+          - filterStuck: 筛选条已伸出共享玻璃,nav 关掉自己的玻璃避免接缝 */}
+      <div
+        aria-hidden
+        className={cn(
+          "absolute inset-0 bg-surface/40 backdrop-blur-xl backdrop-saturate-150 transition-opacity duration-300",
+          glassOff ? "opacity-0" : "opacity-100",
+        )}
+      />
+      {/* 顶部 1px 高光 · 仅玻璃态下显示 */}
+      <div
+        aria-hidden
+        className={cn(
+          "absolute inset-x-0 top-0 h-px bg-white/[0.06] transition-opacity duration-300",
+          glassOff ? "opacity-0" : "opacity-100",
+        )}
+      />
+      <nav className="relative max-w-[1500px] mx-auto h-20 px-4 sm:px-6 lg:px-8 flex items-center gap-4 sm:gap-8">
+        {showLogo && (
+          <div className="hidden sm:flex shrink-0 items-center">
+            <Logo
+              size="md"
+              className="drop-shadow-[0_0_14px_rgba(139,92,246,0.55)]"
+            />
+          </div>
+        )}
 
-        {/* 中部：首页 / 排行榜 / 我的 */}
+        {/* 左侧:首页 / 排行榜 / 我的 */}
-        <NavLinks className="hidden md:flex" />
+        <NavLinks />
 
-        {/* 右侧：搜索 + 今日余票 + 登录/注册 (或 头像+下拉) */}
+        {/* 右侧:搜索 + 今日余票 + 登录/注册 (或 头像+下拉) */}
-        <div className="ml-auto flex items-center gap-3">
+        <div className="ml-auto flex items-center gap-2 sm:gap-3">
           <SearchTrigger />
           <RemainingVotesBadge />
           <AuthMenu />
         </div>
       </nav>
-
-      {/* 移动端：单独一行 nav links */}
-      <NavLinks
-        className="md:hidden border-t border-white/[0.05] overflow-x-auto"
-        mobile
-      />
     </header>
   );
 }

src/components/Providers.tsx

@@ -3,15 +3,27 @@
 import { SessionProvider } from "next-auth/react";
 import { Toaster } from "react-hot-toast";
 import GlobalLoginModal from "@/components/auth/GlobalLoginModal";
+import { useSyncMe } from "@/hooks/useSyncMe";
+
+/**
+ * 登录后把服务端 /api/me 同步到本地 vote store 的隐形组件。
+ * 必须放在 SessionProvider 内部才能拿到 useSession。
+ */
+function SyncMeBridge() {
+  useSyncMe();
+  return null;
+}
 
 /**
  * 客户端全局 Provider 集合
  * - SessionProvider: 让 client 组件能用 useSession()
+ * - SyncMeBridge: 登录后用 /api/me 覆盖本地票数态(跨设备同步关键)
  * - Toaster: 全站 toast 容器（紫调样式，自动叠加）
  */
 export default function Providers({ children }: { children: React.ReactNode }) {
   return (
     <SessionProvider>
+      <SyncMeBridge />
       {children}
       <GlobalLoginModal />
       <Toaster

src/components/SearchModal.tsx

@@ -6,8 +6,13 @@ import { AnimatePresence, motion } from "framer-motion";
 import { Search, X } from "lucide-react";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
-import { ARTISTS } from "@/lib/mock-data";
+import { useVoteStore } from "@/lib/store";
 import { TAG_LABEL, type Artist } from "@/types/artist";
+
+function formatVotes(v: number): string {
+  if (v >= 10_000) return `${(v / 10_000).toFixed(1)}w`;
+  return v.toLocaleString();
+}
 import ArtistPortrait from "./cards/ArtistPortrait";
 import { cn } from "@/lib/cn";
 
@@ -40,21 +45,30 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
     };
   }, [open]);
 
-  // 过滤艺人：名字 / 编号 / slogan / 标签
+  // 订阅 store 拿活的票数 / rank（投票后立即反映）
+  const storeArtists = useVoteStore((s) => s.artists);
+
+  // 过滤艺人：名字 / 编号 / 座右铭 / 标签。默认显示真实 Top12（有票才上榜）
   const results = useMemo<Artist[]>(() => {
     const q = query.trim().toLowerCase();
-    if (!q) return ARTISTS.slice(0, 12); // 默认显示前 12 名
+    if (!q) {
-    return ARTISTS.filter((a) => {
+      const top12 = storeArtists.filter((a) => a.votes > 0).slice(0, 12);
+      // 还没产生 Top12 时退回到默认 12 位（按编号），保持空态可浏览
+      return top12.length > 0 ? top12 : storeArtists.slice(0, 12);
+    }
+    return storeArtists
+      .filter((a) => {
         const tagText = a.tags.map((t) => TAG_LABEL[t]).join("");
         return (
           a.name.toLowerCase().includes(q) ||
           a.enName.toLowerCase().includes(q) ||
           a.no.includes(q) ||
-        a.slogan.toLowerCase().includes(q) ||
+          (a.motto?.toLowerCase().includes(q) ?? false) ||
           tagText.includes(q)
         );
-    }).slice(0, 20);
+      })
-  }, [query]);
+      .slice(0, 20);
+  }, [query, storeArtists]);
 
   // 键盘导航
   useEffect(() => {
@@ -162,7 +176,9 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
                   {!query && (
                     <div className="px-5 pt-1 pb-2">
                       <p className="font-label text-[10px] tracking-widest uppercase text-purple-300/70">
-                        热门艺人 · TOP 12
+                        {results.some((a) => a.votes > 0)
+                          ? "热门艺人 · TOP 12"
+                          : "推荐艺人 · 编号顺序"}
                       </p>
                     </div>
                   )}
@@ -205,7 +221,7 @@ function ResultRow({
   onHover: () => void;
   onClick: () => void;
 }) {
-  const inTop12 = artist.rank <= 12;
+  const inTop12 = artist.rank <= 12 && artist.votes > 0;
   return (
     <Link
       data-index={index}
@@ -237,9 +253,11 @@ function ResultRow({
             · {artist.enName}
           </span>
         </div>
-        <div className="text-[11px] text-white/45 truncate">
+        {artist.motto && (
-          {artist.slogan}
+          <div className="text-[11px] text-white/45 truncate italic">
+            “{artist.motto}”
           </div>
+        )}
       </div>
 
       <div className="flex-shrink-0 text-right">
@@ -252,7 +270,7 @@ function ResultRow({
           #{artist.rank}
         </div>
         <div className="text-[10px] text-white/35 tabular-nums">
-          {(artist.votes / 10000).toFixed(1)}w 票
+          {formatVotes(artist.votes)} 票
         </div>
       </div>
     </Link>

src/components/Top12Bar.tsx

@@ -18,7 +18,8 @@ function formatVotes(v: number): string {
 }
 
 export default function Top12Bar({ artists, showHeader = true }: Top12BarProps) {
-  const top12 = artists.slice(0, 12);
+  // Top12 出道位 只看「真正有票」的人 —— 0 票时不靠编号兜底占位
+  const top12 = artists.filter((a) => a.votes > 0).slice(0, 12);
   return (
     <div className="w-full">
       {showHeader && (
@@ -37,7 +38,10 @@ export default function Top12Bar({ artists, showHeader = true }: Top12BarProps)
         </div>
       )}
 
-      {/* 12 张胶囊卡片 · grid 等分铺满，无滚动 · 无外边框无背景 */}
+      {top12.length === 0 ? (
+        <Top12Empty />
+      ) : (
+        // 12 张胶囊卡片 · grid 等分铺满，无滚动 · 无外边框无背景
         <div
           className={cn(
             "grid grid-cols-6 sm:grid-cols-12 gap-2 sm:gap-3 py-2",
@@ -47,6 +51,18 @@ export default function Top12Bar({ artists, showHeader = true }: Top12BarProps)
             <Top12Card key={artist.id} artist={artist} />
           ))}
         </div>
+      )}
+    </div>
+  );
+}
+
+function Top12Empty() {
+  return (
+    <div className="py-10 sm:py-12 px-6 text-center border border-dashed border-white/10 rounded-2xl bg-white/[0.02]">
+      <p className="font-label text-[11px] tracking-widest uppercase text-purple-300 mb-2">
+        Awaiting Votes
+      </p>
+      <p className="text-sm text-white/70">出道位尚未产生 · 等你为 ta 投下第一票</p>
     </div>
   );
 }

src/components/VoteModal.tsx

@@ -3,60 +3,47 @@
 import { useEffect, useState, useCallback } from "react";
 import { createPortal } from "react-dom";
 import { AnimatePresence, motion } from "framer-motion";
-import { X, Heart } from "lucide-react";
+import { X, Heart, AlertCircle, Check } from "lucide-react";
 import type { Artist } from "@/types/artist";
 import { cn } from "@/lib/cn";
+import { useVoteStore, selectHasVoted } from "@/lib/store";
 import Button from "./ui/Button";
 import ArtistPortrait from "./cards/ArtistPortrait";
 
-type VoteOption = number | "ALL";
-
 interface VoteModalProps {
-  /** 当前要投票的艺人，传 null 关闭弹窗 */
+  /** 当前要投票的艺人,传 null 关闭弹窗 */
   artist: Artist | null;
-  /** 今日剩余票数（ALL 即投出该数值） */
+  /** 剩余可投票数(终身 12 - 已投) */
   remaining: number;
-  /** 每日总额度（用于副文案展示） */
+  /** 总额度常量 12(用于文案 "X / 12") */
-  dailyQuota: number;
+  totalQuota: number;
   /** 关闭弹窗 */
   onClose: () => void;
-  /** 确认投票（count 为最终实际投票数，ALL 会被解析为 remaining） */
+  /** 确认投票(无 count 参数,固定 1 票) */
-  onConfirm: (artist: Artist, count: number) => void | Promise<void>;
+  onConfirm: (artist: Artist) => void | Promise<void>;
-}
-
-const VOTE_OPTIONS: VoteOption[] = [1, 3, 5, "ALL"];
-
-function defaultOption(remaining: number): VoteOption {
-  if (remaining >= 3) return 3;
-  if (remaining >= 1) return remaining as VoteOption;
-  return "ALL";
-}
-
-function resolveCount(opt: VoteOption, remaining: number): number {
-  return opt === "ALL" ? remaining : opt;
 }
 
 export default function VoteModal({
   artist,
   remaining,
-  dailyQuota,
+  totalQuota,
   onClose,
   onConfirm,
 }: VoteModalProps) {
   const open = artist != null;
-  const [selected, setSelected] = useState<VoteOption>(defaultOption(remaining));
   const [loading, setLoading] = useState(false);
   const [mounted, setMounted] = useState(false);
 
+  // 即时判断当前艺人是否已被投过(避免父组件忘传防护)
+  const hasVotedSelector = artist ? selectHasVoted(artist.id) : () => false;
+  const hasVoted = useVoteStore(hasVotedSelector);
+
   useEffect(() => setMounted(true), []);
 
-  // 打开时重置默认选择
+  // 打开时重置 loading 态
   useEffect(() => {
-    if (open) {
+    if (open) setLoading(false);
-      setSelected(defaultOption(remaining));
+  }, [open]);
-      setLoading(false);
-    }
-  }, [open, remaining]);
 
   // ESC 关闭 + body 锁滚
   useEffect(() => {
@@ -73,18 +60,18 @@ export default function VoteModal({
     };
   }, [open, onClose]);
 
-  const actualCount = resolveCount(selected, remaining);
+  const exhausted = remaining <= 0;
-  const canSubmit = remaining > 0 && actualCount > 0 && actualCount <= remaining;
+  const canSubmit = !exhausted && !hasVoted && !loading;
 
   const handleConfirm = useCallback(async () => {
-    if (!artist || loading || !canSubmit) return;
+    if (!artist || !canSubmit) return;
     setLoading(true);
     try {
-      await onConfirm(artist, actualCount);
+      await onConfirm(artist);
     } finally {
       setLoading(false);
     }
-  }, [artist, actualCount, canSubmit, loading, onConfirm]);
+  }, [artist, canSubmit, onConfirm]);
 
   if (!mounted) return null;
 
@@ -107,7 +94,7 @@ export default function VoteModal({
             className="absolute inset-0 bg-black/75 backdrop-blur-md cursor-default"
           />
 
-          {/* 弹窗主体（已去除顶部紫色横条） */}
+          {/* 弹窗主体 */}
           <motion.div
             role="dialog"
             aria-modal="true"
@@ -129,81 +116,86 @@ export default function VoteModal({
             </button>
 
             {/* 头像 */}
-            <div className="w-20 h-20 mx-auto mb-3.5 rounded-full overflow-hidden border-2 border-purple-500 shadow-[0_0_16px_rgba(139,92,246,0.4)]">
+            <div className="w-20 h-20 mx-auto mb-3.5 rounded-full overflow-hidden border-2 border-purple-500 shadow-[0_0_16px_rgba(139,92,246,0.4)] relative">
               <ArtistPortrait
                 artist={artist}
                 rounded="rounded-full"
                 className="w-full h-full"
               />
+              {hasVoted && (
+                <div className="absolute inset-0 bg-black/55 flex items-center justify-center">
+                  <Check size={28} className="text-purple-300" strokeWidth={3} />
+                </div>
+              )}
             </div>
 
             {/* 标题 */}
-            <div className="text-center mb-4">
+            <div className="text-center mb-3.5">
               <div
                 id="vote-modal-title"
                 className="text-lg font-bold text-white mb-1"
               >
-                为 {artist.name} 投票
+                {hasVoted
+                  ? `已为 ${artist.name} 投过票`
+                  : exhausted
+                    ? "12 票已用完"
+                    : `为 ${artist.name} 投票`}
               </div>
               <div className="font-label text-[11px] tracking-widest text-white/45 uppercase">
                 No.{artist.no} · Current Rank #{artist.rank}
               </div>
             </div>
 
-            {/* 剩余票数提示 */}
+            {/* 剩余票数显示 */}
-            <div className="flex items-center justify-between text-xs mb-2.5">
+            <div
-              <span className="text-white/55">选择投票数：</span>
+              className={cn(
-              <span className="text-purple-300 tabular-nums">
+                "flex items-center justify-between text-xs mb-4 px-3 py-2.5 rounded-lg border",
-                今日剩余 {remaining} / {dailyQuota}
+                exhausted
+                  ? "border-pink-400/30 bg-pink-400/[0.05]"
+                  : "border-purple-500/25 bg-purple-500/[0.06]",
+              )}
+            >
+              <span className="text-white/65">你的剩余票数</span>
+              <span
+                className={cn(
+                  "font-display tabular-nums text-base",
+                  exhausted ? "text-pink-300" : "text-purple-300",
+                )}
+              >
+                {remaining}{" "}
+                <span className="text-white/40 text-xs">/ {totalQuota}</span>
               </span>
             </div>
 
-            {/* 票数选择 */}
+            {/* 规则提示 · 不可撤销警示(仅在可投态显示) */}
-            <div className="flex gap-2.5 justify-center mb-5">
+            {!hasVoted && !exhausted && (
-              {VOTE_OPTIONS.map((opt) => {
+              <div className="flex items-start gap-2 mb-5 px-3 py-2.5 rounded-lg bg-white/[0.03] border border-white/[0.06]">
-                const active = selected === opt;
+                <AlertCircle
-                const optValue = resolveCount(opt, remaining);
+                  size={14}
-                const disabled =
+                  className="text-purple-300/80 mt-0.5 flex-shrink-0"
-                  remaining === 0 ||
+                />
-                  optValue === 0 ||
+                <p className="text-[11px] leading-relaxed text-white/65">
-                  optValue > remaining ||
+                  投出后不可撤销 · 每位艺人仅能投 1 票
-                  (opt === "ALL" && remaining === 0);
+                </p>
-                return (
-                  <button
-                    type="button"
-                    key={String(opt)}
-                    onClick={() => !disabled && setSelected(opt)}
-                    disabled={disabled}
-                    className={cn(
-                      "rounded-lg font-display text-base flex items-center justify-center transition-all w-14 h-13 py-3.5 px-3",
-                      disabled &&
-                        "bg-surface/40 border border-white/8 text-white/25 cursor-not-allowed",
-                      !disabled &&
-                        !active &&
-                        "bg-surface border border-white/14 text-white/65 hover:border-white/30",
-                      !disabled &&
-                        active &&
-                        "bg-purple-500/12 border border-purple-500 text-purple-300 shadow-[0_0_16px_rgba(139,92,246,0.35)]",
-                    )}
-                  >
-                    {opt}
-                  </button>
-                );
-              })}
               </div>
+            )}
 
             {/* 确认按钮 */}
             <Button
               variant="primary"
               className="w-full h-12 text-sm"
-              onClick={handleConfirm}
+              onClick={hasVoted || exhausted ? onClose : handleConfirm}
               loading={loading}
-              disabled={!canSubmit}
+              disabled={loading}
-              leftIcon={<Heart size={14} />}
+              leftIcon={
+                hasVoted || exhausted ? undefined : <Heart size={14} />
+              }
             >
-              {remaining === 0
+              {hasVoted
-                ? "今日票数已用完"
+                ? "好的"
-                : `确认投出 ${actualCount} 票`}
+                : exhausted
+                  ? "感谢支持"
+                  : "投出我的一票"}
             </Button>
           </motion.div>
         </motion.div>

src/components/artist/ArtistDetailContent.tsx

@@ -1,8 +1,19 @@
 "use client";
 
 import Link from "next/link";
-import { ChevronLeft, Heart, Share2 } from "lucide-react";
+import {
-import toast from "react-hot-toast";
+  ChevronLeft,
+  Heart,
+  Check,
+  Quote as QuoteIcon,
+  Sparkles,
+  Compass,
+  MessageCircle,
+  User,
+  Ruler,
+  Calendar,
+  BookOpen,
+} from "lucide-react";
 import type { Artist } from "@/types/artist";
 import { TAG_LABEL } from "@/types/artist";
 import ArtistPortrait from "@/components/cards/ArtistPortrait";
@@ -12,61 +23,43 @@ import RankCard from "./RankCard";
 import PerformanceVideo from "./PerformanceVideo";
 import PerformanceGallery from "./PerformanceGallery";
 import FloatingVoteButton from "@/components/FloatingVoteButton";
-import { useVoteStore, selectArtist } from "@/lib/store";
+import FloatingBackButton from "@/components/FloatingBackButton";
+import { useVoteStore, selectArtist, selectHasVoted } from "@/lib/store";
 import { useVoteAction } from "@/hooks/useVoteAction";
+import { cn } from "@/lib/cn";
 
 interface ArtistDetailContentProps {
   artist: Artist;
   allArtists: Artist[];
 }
 
+/** 把 "、 / , ，" 分隔的串切成 chip 数组 */
+function parseChips(text?: string): string[] {
+  if (!text) return [];
+  return text
+    .split(/[、，,/]/)
+    .map((s) => s.trim())
+    .filter(Boolean);
+}
+
 export default function ArtistDetailContent({
   artist: initialArtist,
   allArtists: initialAll,
 }: ArtistDetailContentProps) {
-  // 用 store 数据覆盖（这样投票后票数能马上变）
+  // 用 store 数据覆盖（投票后票数能马上变）
   const storeArtist = useVoteStore(selectArtist(initialArtist.id));
   const storeAll = useVoteStore((s) => s.artists);
+  const hasVoted = useVoteStore(selectHasVoted(initialArtist.id));
 
   const artist = storeArtist ?? initialArtist;
   const allArtists = storeAll.length ? storeAll : initialAll;
 
-  const { target, remaining, dailyQuota, openVote, closeVote, confirmVote } =
+  const { target, remaining, totalQuota, openVote, closeVote, confirmVote } =
     useVoteAction();
 
-  const handleShare = async () => {
-    const url =
-      typeof window !== "undefined"
-        ? `${window.location.origin}/artist/${artist.id}`
-        : `/artist/${artist.id}`;
-    const shareData = {
-      title: `${artist.name} · CYBER STAR`,
-      text: `为 ${artist.name}（${artist.enName}）打 Call！${artist.slogan}`,
-      url,
-    };
-
-    // 优先用 Web Share API（移动端 / Safari 支持）
-    if (typeof navigator !== "undefined" && navigator.share) {
-      try {
-        await navigator.share(shareData);
-        return;
-      } catch {
-        // 用户取消分享：不报错
-        return;
-      }
-    }
-
-    // 兜底：复制到剪贴板
-    try {
-      await navigator.clipboard.writeText(url);
-      toast.success("链接已复制，去粘贴给朋友吧～");
-    } catch {
-      toast.error("复制失败，请手动复制地址栏");
-    }
-  };
-
   return (
     <>
+      {/* 面包屑 */}
       <div className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pt-4">
         <div className="h-12 flex items-center gap-3 text-sm">
           <Link
@@ -77,59 +70,150 @@ export default function ArtistDetailContent({
             全部艺人
           </Link>
           <span className="text-white/30">/</span>
-          <span className="text-white/85">艺人详情</span>
+          <span className="text-white/85 truncate">{artist.name}</span>
-          <button
-            type="button"
-            onClick={handleShare}
-            className="ml-auto inline-flex items-center gap-1.5 text-purple-300 hover:text-purple-200 text-xs"
-          >
-            <Share2 size={14} />
-            <span className="hidden sm:inline">分享</span>
-          </button>
         </div>
       </div>
 
+      {/* HERO · 立绘 + 身份信息 */}
+      <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-10">
+        <HeroPanel
+          artist={artist}
+          allArtists={allArtists}
+          onVote={() => openVote(artist)}
+          hasVoted={hasVoted}
+        />
+      </section>
+
+      {/* 性格 · 口头禅 */}
+      {(artist.personality || artist.catchphrase) && (
+        <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-10">
+          <div className="grid lg:grid-cols-[1.5fr_1fr] gap-4">
+            {artist.personality && <PersonalityCard text={artist.personality} />}
+            {artist.catchphrase && <CatchphraseCard text={artist.catchphrase} />}
+          </div>
+        </section>
+      )}
+
+      {/* 核心技能 · 核心赛道 */}
+      {(artist.skills || artist.track) && (
+        <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-10">
+          <div className="grid md:grid-cols-2 gap-4">
+            {artist.skills && (
+              <ChipCard
+                label="核心技能"
+                subtitle="Core Skills"
+                icon={<Sparkles size={14} />}
+                chips={parseChips(artist.skills)}
+              />
+            )}
+            {artist.track && (
+              <ChipCard
+                label="核心赛道"
+                subtitle="Career Track"
+                icon={<Compass size={14} />}
+                chips={parseChips(artist.track)}
+              />
+            )}
+          </div>
+        </section>
+      )}
+
+      {/* 人物小传 · 长简介 */}
+      {artist.bio && (
         <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-12">
+          <BiographyCard bio={artist.bio} />
+        </section>
+      )}
+
+      {/* 表演视频 · 与版心同宽,首帧自动作为封面,整个视频区域可点击播放/暂停 */}
+      {artist.videoUrl && (
+        <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-12">
+          <SectionHeading title="表演视频" subtitle="Solo Performance" />
+          <div className="mt-4">
+            <PerformanceVideo src={artist.videoUrl} poster={artist.videoPoster} />
+          </div>
+          <p className="text-xs text-white/40 mt-3">
+            视频不会自动播放，避免流量浪费
+          </p>
+        </section>
+      )}
+
+      {/* 表演图片 · 三张氛围图,左对齐,竖向 3:4 */}
+      {artist.gallery && artist.gallery.filter(Boolean).length > 0 && (
+        <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-20">
+          <SectionHeading title="表演图片" subtitle="Performance Gallery" />
+          <div className="mt-4">
+            <PerformanceGallery images={artist.gallery} />
+          </div>
+        </section>
+      )}
+
+      <FloatingBackButton fallbackHref="/" />
+      <FloatingVoteButton onClick={() => openVote(artist)} hasVoted={hasVoted} />
+
+      <VoteModal
+        artist={target}
+        remaining={remaining}
+        totalQuota={totalQuota}
+        onClose={closeVote}
+        onConfirm={confirmVote}
+      />
+    </>
+  );
+}
+
+/* ============================================================
+ * 子组件 · 统一品牌紫色，无 per-artist themeColor
+ * ============================================================ */
+
+interface HeroPanelProps {
+  artist: Artist;
+  allArtists: Artist[];
+  onVote: () => void;
+  hasVoted: boolean;
+}
+
+function HeroPanel({ artist, allArtists, onVote, hasVoted }: HeroPanelProps) {
+  return (
+    <div className="relative rounded-2xl border border-purple-500/20 overflow-hidden grid gap-6 lg:grid-cols-[420px_1fr] lg:gap-8 p-5 sm:p-8 bg-[linear-gradient(135deg,rgba(139,92,246,0.10)_0%,rgba(13,10,36,0.6)_100%)]">
+      {/* 装饰光晕 */}
       <div
-          className="rounded-2xl border border-white/[0.06] overflow-hidden p-5 sm:p-8 grid gap-6 lg:grid-cols-[340px_1fr] lg:gap-8"
+        aria-hidden
-          style={{
+        className="absolute -top-24 -right-16 w-[420px] h-[420px] pointer-events-none bg-[radial-gradient(circle,rgba(139,92,246,0.22)_0%,transparent_60%)]"
-            background:
+      />
-              "linear-gradient(135deg, rgba(139,92,246,0.06) 0%, rgba(13,10,36,0.6) 100%)",
+
-          }}
+      {/* 立绘 */}
-        >
       <div className="relative">
         <ArtistPortrait
           artist={artist}
           rounded="rounded-xl"
-              className="w-full aspect-[4/5] shadow-card"
+          className="w-full aspect-[4/5]"
         />
-            <div className="mt-3 flex items-center gap-2 px-3 py-2 rounded-lg bg-black/35 border border-white/10">
+        {hasVoted && (
-              <span
+          <div className="absolute top-3 right-3 w-9 h-9 rounded-full bg-purple-500 shadow-[0_0_16px_rgba(139,92,246,0.8)] flex items-center justify-center border-2 border-white/30">
-                className="w-4 h-4 rounded-full ring-2 ring-white/20"
+            <Check size={20} strokeWidth={3} className="text-white" />
-                style={{ background: artist.themeColor }}
-              />
-              <span className="font-label text-[10px] tracking-widest uppercase text-white/55">
-                应援色
-              </span>
-              <span className="font-mono text-[10px] text-white/45 ml-auto">
-                {artist.themeColor}
-              </span>
           </div>
+        )}
       </div>
 
-          <div className="flex flex-col gap-4">
+      {/* 身份信息 */}
-            <div>
+      <div className="relative flex flex-col gap-4">
-              <div className="font-label text-[10px] tracking-[0.3em] uppercase text-purple-300/80 mb-2">
+        {/* 编号 */}
+        <div className="font-label text-[10px] tracking-[0.3em] uppercase text-purple-300/80">
           No.{artist.no}
         </div>
-              <h1 className="text-3xl sm:text-4xl font-bold text-white tracking-tight mb-1">
+
+        {/* 中文名 / 英文名 */}
+        <div>
+          <h1 className="text-4xl sm:text-5xl font-bold text-white tracking-tight mb-1">
             {artist.name}
           </h1>
-              <p className="font-display text-lg tracking-[0.2em] uppercase text-purple-300 glow-text-purple">
+          <p className="font-display text-xl sm:text-2xl tracking-[0.22em] uppercase text-purple-300 glow-text-purple">
             {artist.enName}
           </p>
         </div>
 
+        {/* 实力标签 */}
         <div className="flex gap-2 flex-wrap">
           {artist.tags.map((t) => (
             <span
@@ -141,103 +225,207 @@ export default function ArtistDetailContent({
           ))}
         </div>
 
+        {/* 年龄 / 身高 / 性别 */}
         <div className="grid grid-cols-3 gap-2">
-              <MetaCell label="生日" value={artist.birthday} />
+          <MetaCell
-              <MetaCell label="身高" value={`${artist.height} cm`} />
+            icon={<Calendar size={13} />}
-              <MetaCell label="CV" value={artist.cv ?? "未公开"} />
+            label="年龄"
+            value={artist.age != null ? `${artist.age} 岁` : "未公开"}
+          />
+          <MetaCell
+            icon={<Ruler size={13} />}
+            label="身高"
+            value={`${artist.height} cm`}
+          />
+          <MetaCell
+            icon={<User size={13} />}
+            label="性别"
+            value={
+              artist.gender === "M"
+                ? "男生"
+                : artist.gender === "F"
+                  ? "女生"
+                  : "未公开"
+            }
+          />
         </div>
 
+        {/* 座右铭 · 品牌紫引文,保持与全站视觉一致 */}
+        {artist.motto && (
+          <div className="relative pl-6 pr-4 py-3.5 rounded-r-lg bg-[linear-gradient(90deg,rgba(139,92,246,0.10)_0%,transparent_100%)] border-l-[3px] border-purple-400">
+            <QuoteIcon size={14} className="absolute top-3 left-2 text-purple-400/50" />
+            <p className="text-base sm:text-lg italic font-medium text-white/95 leading-snug">
+              {artist.motto}
+            </p>
+            <p className="mt-1.5 font-label text-[10px] tracking-[0.25em] uppercase text-purple-300/70">
+              Motto · 座右铭
+            </p>
+          </div>
+        )}
+
+        {/* 排名卡片 */}
         <RankCard artist={artist} allArtists={allArtists} />
 
-            <div className="flex gap-3 pt-1">
+        {/* 操作按钮 · 仅投票 */}
+        <div className="pt-1">
           <Button
-                variant="primary"
+            variant={hasVoted ? "outline" : "primary"}
             size="lg"
-                pulse
+            pulse={!hasVoted}
-                className="flex-1"
+            className={cn("w-full", hasVoted && "cursor-not-allowed opacity-80")}
-                leftIcon={<Heart size={16} fill="currentColor" />}
+            leftIcon={
-                onClick={() => openVote(artist)}
+              hasVoted ? (
+                <Check size={16} strokeWidth={3} />
+              ) : (
+                <Heart size={16} fill="currentColor" />
+              )
+            }
+            onClick={onVote}
           >
-                投票
+            {hasVoted ? "已投票" : "投票"}
-              </Button>
-              <Button
-                variant="outline"
-                size="lg"
-                leftIcon={<Share2 size={14} />}
-                aria-label="分享"
-                onClick={handleShare}
-              >
-                <span className="hidden sm:inline">关注</span>
           </Button>
         </div>
       </div>
     </div>
-      </section>
-
-      <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-12">
-        <SectionHeading title="表演视频" subtitle="15s Performance" />
-        <PerformanceVideo themeColor={artist.themeColor} duration="00:15" />
-        <p className="text-xs text-white/40 mt-3">
-          视频不会自动播放，避免流量浪费
-        </p>
-      </section>
-
-      <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-12">
-        <SectionHeading title="表演图片" subtitle="Performance Gallery" />
-        <PerformanceGallery
-          images={artist.gallery}
-          themeColor={artist.themeColor}
-        />
-      </section>
-
-      <section className="max-w-[1500px] mx-auto px-4 sm:px-6 lg:px-8 pb-20">
-        <SectionHeading title="艺人简介" subtitle="Biography" />
-        <div className="bg-surface/50 backdrop-blur-md border border-white/[0.08] rounded-xl p-5 sm:p-7">
-          <p className="text-sm sm:text-base text-white/75 leading-[1.85]">
-            {artist.bio}
-          </p>
-          <div className="mt-5 pt-5 border-t border-white/[0.06] grid grid-cols-1 sm:grid-cols-3 gap-3 text-sm">
-            <BioMeta label="性格关键词" value={artist.slogan} />
-            <BioMeta label="主推楼曲" value={`《${artist.enName}'s Song》`} />
-            <BioMeta
-              label="训练经历"
-              value={`${Math.floor(artist.height / 30)} 年声乐 + 舞台`}
-            />
-          </div>
-        </div>
-      </section>
-
-      <FloatingVoteButton onClick={() => openVote(artist)} />
-
-      <VoteModal
-        artist={target}
-        remaining={remaining}
-        dailyQuota={dailyQuota}
-        onClose={closeVote}
-        onConfirm={confirmVote}
-      />
-    </>
   );
 }
 
-function MetaCell({ label, value }: { label: string; value: string }) {
+function MetaCell({
+  icon,
+  label,
+  value,
+}: {
+  icon: React.ReactNode;
+  label: string;
+  value: string;
+}) {
   return (
-    <div className="bg-deep/60 border border-white/[0.06] rounded-lg px-3 py-2">
+    <div className="bg-deep/60 border border-white/[0.06] rounded-lg px-3 py-2.5">
-      <div className="font-label text-[9px] tracking-widest uppercase text-white/40 mb-0.5">
+      <div className="flex items-center gap-1.5 text-purple-300/60 mb-0.5">
-        {label}
+        {icon}
-      </div>
+        <span className="font-label text-[9px] tracking-widest uppercase">
-      <div className="text-sm text-white/85 truncate">{value}</div>
-    </div>
-  );
-}
-
-function BioMeta({ label, value }: { label: string; value: string }) {
-  return (
-    <div>
-      <span className="font-label text-[10px] tracking-widest uppercase text-purple-300/70 block mb-1">
           {label}
         </span>
-      <span className="text-white/85">{value}</span>
+      </div>
+      <div className="text-sm text-white/90 truncate">{value}</div>
+    </div>
+  );
+}
+
+/**
+ * 性格 / 口头禅 双卡使用完全相同的容器规范：
+ *   - 圆角 2xl + 玻璃化 surface 背景 + 同样的 border / padding
+ *   - 左上角同样的紫色装饰条
+ *   - 同款 SectionHeading
+ * 唯一差异:内容呈现 —— 性格是段落正文，口头禅是大字引号。
+ */
+function ProfileInfoCard({
+  title,
+  subtitle,
+  children,
+}: {
+  title: string;
+  subtitle: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="relative rounded-2xl border border-white/[0.08] bg-surface/50 backdrop-blur-md p-6 sm:p-8 overflow-hidden min-h-[200px]">
+      <div
+        aria-hidden
+        className="absolute top-0 left-0 w-1 h-16 rounded-r bg-[linear-gradient(180deg,#a78bfa_0%,transparent_100%)]"
+      />
+      <SectionHeading title={title} subtitle={subtitle} />
+      <div className="mt-5">{children}</div>
+    </div>
+  );
+}
+
+function PersonalityCard({ text }: { text: string }) {
+  return (
+    <ProfileInfoCard title="性格" subtitle="Personality">
+      <p
+        className="text-sm sm:text-base leading-relaxed"
+        style={{ color: "rgba(255,255,255,0.95)" }}
+      >
+        {text}
+      </p>
+    </ProfileInfoCard>
+  );
+}
+
+function CatchphraseCard({ text }: { text: string }) {
+  return (
+    <ProfileInfoCard title="口头禅" subtitle="Catchphrase">
+      <div className="flex items-start gap-3 h-full">
+        <MessageCircle
+          size={22}
+          className="flex-shrink-0 mt-1 text-purple-400/70"
+        />
+        <p className="text-lg sm:text-xl font-semibold text-white/95 leading-snug tracking-wide italic">
+          “{text}”
+        </p>
+      </div>
+    </ProfileInfoCard>
+  );
+}
+
+function ChipCard({
+  label,
+  subtitle,
+  icon,
+  chips,
+}: {
+  label: string;
+  subtitle: string;
+  icon: React.ReactNode;
+  chips: string[];
+}) {
+  return (
+    <div className="rounded-2xl border border-white/[0.08] bg-surface/40 backdrop-blur-md p-5 sm:p-6">
+      <div className="flex items-center justify-between">
+        <SectionHeading title={label} subtitle={subtitle} />
+        <span className="text-purple-300/60">{icon}</span>
+      </div>
+      {chips.length > 0 ? (
+        <div className="flex flex-wrap gap-2 mt-5">
+          {chips.map((c, i) => (
+            <span
+              key={`${c}-${i}`}
+              className={cn(
+                "px-3 py-1.5 rounded-full border text-xs whitespace-nowrap",
+                "bg-purple-500/12 border-purple-400/30 text-purple-200",
+              )}
+            >
+              {c}
+            </span>
+          ))}
+        </div>
+      ) : (
+        <p className="mt-4 text-sm text-white/45">未公开</p>
+      )}
+    </div>
+  );
+}
+
+function BiographyCard({ bio }: { bio: string }) {
+  return (
+    <div className="rounded-2xl border border-white/[0.08] bg-surface/50 backdrop-blur-md p-6 sm:p-10">
+      <div className="flex items-baseline justify-between mb-2">
+        <SectionHeading title="人物小传" subtitle="Biography" />
+        <span className="text-purple-300/60">
+          <BookOpen size={14} />
+        </span>
+      </div>
+      <p
+        className={cn(
+          "mt-5 text-base sm:text-lg text-white/85 leading-[2.05]",
+          // 首字下沉
+          "first-letter:text-4xl sm:first-letter:text-5xl first-letter:font-display first-letter:text-purple-300",
+          "first-letter:mr-2 first-letter:float-left first-letter:leading-none first-letter:mt-1",
+        )}
+      >
+        {bio}
+      </p>
     </div>
   );
 }
@@ -250,8 +438,11 @@ function SectionHeading({
   subtitle: string;
 }) {
   return (
-    <div className="mb-4 flex items-baseline gap-3">
+    <div className="inline-flex items-baseline gap-3">
-      <span aria-hidden className="w-1 h-4 rounded-full bg-purple-400 shadow-[0_0_8px_rgba(167,139,250,0.7)]" />
+      <span
+        aria-hidden
+        className="w-1 h-4 rounded-full bg-purple-400 shadow-[0_0_8px_rgba(167,139,250,0.7)]"
+      />
       <h2 className="font-display text-base sm:text-lg text-white tracking-[0.2em]">
         {title}
       </h2>

src/components/artist/PerformanceGallery.tsx

@@ -5,23 +5,14 @@ import { createPortal } from "react-dom";
 import { X, ChevronLeft, ChevronRight } from "lucide-react";
 import { AnimatePresence, motion } from "framer-motion";
 import Image from "next/image";
-import { cn } from "@/lib/cn";
 
 interface PerformanceGalleryProps {
   images: string[];
-  /** 当无真实图时，用此颜色生成占位 */
-  themeColor?: string;
-  /** 占位标签（如 "定妆照"、"表演中"） */
-  placeholderLabels?: string[];
 }
 
-const DEFAULT_LABELS = ["定妆照", "表演中", "幕后花絮", "舞台 1", "舞台 2", "未公开"];
+export default function PerformanceGallery({ images }: PerformanceGalleryProps) {
-
+  // 过滤掉空字符串，只渲染真实路径
-export default function PerformanceGallery({
+  images = images.filter(Boolean);
-  images,
-  themeColor = "#8b5cf6",
-  placeholderLabels = DEFAULT_LABELS,
-}: PerformanceGalleryProps) {
   const [lightboxIndex, setLightboxIndex] = useState<number | null>(null);
   const [mounted, setMounted] = useState(false);
 
@@ -46,39 +37,31 @@ export default function PerformanceGallery({
     };
   }, [lightboxIndex, images.length]);
 
+  if (images.length === 0) {
+    return (
+      <div className="rounded-xl border border-dashed border-white/10 p-10 text-center text-white/45 text-sm">
+        暂无表演图片
+      </div>
+    );
+  }
+
   return (
     <>
-      <div className="grid grid-cols-3 sm:grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-3">
+      <div className="grid grid-cols-2 md:grid-cols-3 gap-3 sm:gap-4">
         {images.map((src, i) => (
           <button
             type="button"
-            key={i}
+            key={src}
             onClick={() => setLightboxIndex(i)}
-            className="group relative aspect-[4/3] rounded-lg overflow-hidden border border-white/[0.08] hover:border-purple-500/50 hover:shadow-[0_0_16px_rgba(139,92,246,0.25)] transition-all"
+            className="group relative aspect-[3/4] rounded-xl overflow-hidden border border-white/[0.08] hover:border-purple-500/50 hover:shadow-[0_0_16px_rgba(139,92,246,0.25)] transition-all"
           >
-            {src ? (
             <Image
               src={src}
               alt={`表演图 ${i + 1}`}
               fill
-                sizes="(max-width: 768px) 33vw, 200px"
+              sizes="(max-width: 768px) 50vw, 320px"
-                className="object-cover group-hover:scale-105 transition-transform duration-500"
+              className="object-cover object-top group-hover:scale-105 transition-transform duration-500"
             />
-            ) : (
-              <div
-                className="absolute inset-0 flex items-center justify-center text-white/55 text-[11px]"
-                style={{
-                  background: `linear-gradient(135deg, ${themeColor}25 0%, #1a1638 70%)`,
-                }}
-              >
-                <span className="font-label tracking-widest uppercase text-[10px]">
-                  {placeholderLabels[i] || `Image ${i + 1}`}
-                </span>
-                <span className="absolute top-1.5 right-1.5 text-white/15 text-[10px]">
-                  ✦
-                </span>
-              </div>
-            )}
           </button>
         ))}
       </div>
@@ -153,7 +136,6 @@ export default function PerformanceGallery({
                   transition={{ duration: 0.25 }}
                   className="relative max-w-5xl w-full mx-6 max-h-[85vh] aspect-[4/3] z-10"
                 >
-                  {images[lightboxIndex] ? (
                   <Image
                     src={images[lightboxIndex]!}
                     alt={`表演图 ${lightboxIndex + 1}`}
@@ -161,27 +143,6 @@ export default function PerformanceGallery({
                     sizes="100vw"
                     className="object-contain"
                   />
-                  ) : (
-                    <div
-                      className={cn(
-                        "absolute inset-0 rounded-xl flex items-center justify-center",
-                        "border border-white/10",
-                      )}
-                      style={{
-                        background: `linear-gradient(135deg, ${themeColor}30 0%, #1a1638 70%)`,
-                      }}
-                    >
-                      <div className="text-center">
-                        <span className="font-logo text-6xl text-white/30 tracking-widest">
-                          ✦
-                        </span>
-                        <p className="font-label text-xs tracking-widest text-white/55 uppercase mt-3">
-                          {placeholderLabels[lightboxIndex] ||
-                            `Image ${lightboxIndex + 1}`}
-                        </p>
-                      </div>
-                    </div>
-                  )}
                 </motion.div>
 
                 {/* 索引 */}

src/components/artist/PerformanceVideo.tsx

@@ -1,27 +1,66 @@
 "use client";
 
-import { useRef, useState } from "react";
+import {
+  MouseEvent as ReactMouseEvent,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
 import { Play, Pause, Volume2, VolumeX, Maximize2 } from "lucide-react";
 import { cn } from "@/lib/cn";
 
 interface PerformanceVideoProps {
   src?: string;
   poster?: string;
-  duration?: string;
-  themeColor?: string;
   className?: string;
 }
 
+function fmtTime(s: number): string {
+  if (!isFinite(s) || s < 0) return "00:00";
+  const m = Math.floor(s / 60);
+  const sec = Math.floor(s % 60);
+  return `${String(m).padStart(2, "0")}:${String(sec).padStart(2, "0")}`;
+}
+
 export default function PerformanceVideo({
   src,
   poster,
-  duration = "00:15",
-  themeColor = "#8b5cf6",
   className,
 }: PerformanceVideoProps) {
   const videoRef = useRef<HTMLVideoElement>(null);
+  const progressRef = useRef<HTMLDivElement>(null);
   const [playing, setPlaying] = useState(false);
   const [muted, setMuted] = useState(false);
+  const [current, setCurrent] = useState(0);
+  const [duration, setDuration] = useState(0);
+  const [seeking, setSeeking] = useState(false);
+
+  // 视频时间事件 + 首帧封面（loadedmetadata 后 seek 0.001s 让浏览器渲染首帧）
+  useEffect(() => {
+    const v = videoRef.current;
+    if (!v) return;
+    const onTime = () => !seeking && setCurrent(v.currentTime);
+    const onMeta = () => {
+      setDuration(v.duration);
+      // 没有 poster 时强制渲染首帧
+      if (!poster && v.currentTime === 0) {
+        try {
+          v.currentTime = 0.001;
+        } catch {
+          /* noop */
+        }
+      }
+    };
+    const onEnd = () => setPlaying(false);
+    v.addEventListener("timeupdate", onTime);
+    v.addEventListener("loadedmetadata", onMeta);
+    v.addEventListener("ended", onEnd);
+    return () => {
+      v.removeEventListener("timeupdate", onTime);
+      v.removeEventListener("loadedmetadata", onMeta);
+      v.removeEventListener("ended", onEnd);
+    };
+  }, [seeking, poster]);
 
   const togglePlay = () => {
     const v = videoRef.current;
@@ -46,101 +85,166 @@ export default function PerformanceVideo({
     videoRef.current?.requestFullscreen?.();
   };
 
+  // 进度条:点击 / 拖拽 seek
+  const seekTo = (clientX: number) => {
+    const bar = progressRef.current;
+    const v = videoRef.current;
+    if (!bar || !v || !duration) return;
+    const rect = bar.getBoundingClientRect();
+    const ratio = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width));
+    const t = ratio * duration;
+    v.currentTime = t;
+    setCurrent(t);
+  };
+
+  const handleBarMouseDown = (e: ReactMouseEvent<HTMLDivElement>) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setSeeking(true);
+    seekTo(e.clientX);
+    const onMove = (ev: MouseEvent) => seekTo(ev.clientX);
+    const onUp = () => {
+      setSeeking(false);
+      window.removeEventListener("mousemove", onMove);
+      window.removeEventListener("mouseup", onUp);
+    };
+    window.addEventListener("mousemove", onMove);
+    window.addEventListener("mouseup", onUp);
+  };
+
+  const handleBarTouchStart = (e: React.TouchEvent<HTMLDivElement>) => {
+    e.stopPropagation();
+    setSeeking(true);
+    const t = e.touches[0];
+    if (t) seekTo(t.clientX);
+    const onMove = (ev: TouchEvent) => {
+      const tt = ev.touches[0];
+      if (tt) seekTo(tt.clientX);
+    };
+    const onEnd = () => {
+      setSeeking(false);
+      window.removeEventListener("touchmove", onMove);
+      window.removeEventListener("touchend", onEnd);
+    };
+    window.addEventListener("touchmove", onMove, { passive: true });
+    window.addEventListener("touchend", onEnd);
+  };
+
+  const progress = duration > 0 ? (current / duration) * 100 : 0;
+
   return (
     <div
       className={cn(
-        "relative w-full aspect-video bg-deep rounded-xl overflow-hidden border border-white/[0.08] group",
+        "relative w-full bg-black rounded-xl overflow-hidden border border-white/[0.08] group",
+        // 16:9 比例 + 高度封顶 85svh:在小屏(笔记本)上等比缩窄宽度,确保视频可全显
+        "aspect-video max-w-[calc(85svh*16/9)] mx-auto",
         className,
       )}
+      onClick={src ? togglePlay : undefined}
+      role={src ? "button" : undefined}
+      aria-label={src ? (playing ? "暂停" : "播放") : undefined}
     >
       {src ? (
         <video
           ref={videoRef}
           src={src}
-          poster={poster}
+          poster={poster || undefined}
           playsInline
-          onEnded={() => setPlaying(false)}
+          preload="metadata"
-          className="absolute inset-0 w-full h-full object-cover"
+          className="absolute inset-0 w-full h-full object-contain"
         />
       ) : (
-        <div
+        <div className="absolute inset-0 flex items-center justify-center bg-[radial-gradient(circle_at_50%_40%,rgba(139,92,246,0.30)_0%,#1a1638_55%,#08051a_100%)]">
-          className="absolute inset-0"
+          <p className="font-label text-[10px] tracking-[0.3em] uppercase text-white/40">
-          style={{
+            视频暂未上线
-            background: `radial-gradient(circle at 50% 40%, ${themeColor}55 0%, #1a1638 55%, #08051a 100%)`,
+          </p>
-          }}
-        >
-          {/* 装饰星点 */}
-          <div className="absolute inset-0 opacity-50">
-            <span className="absolute top-[15%] left-[20%] text-white text-xs">
-              ✦
-            </span>
-            <span className="absolute top-[70%] left-[80%] text-purple-300 text-sm">
-              ✧
-            </span>
-            <span className="absolute top-[30%] left-[70%] text-white/60 text-[10px]">
-              ✦
-            </span>
-          </div>
         </div>
       )}
 
-      {/* 顶部 15s 标签 */}
+      {/* 中央播放提示(未播放时) · 仅作视觉提示,真正的点击区是整个容器 */}
-      <div className="absolute top-3 left-3 inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full bg-purple-600/90 backdrop-blur-md text-white text-[10px] font-display tracking-widest uppercase shadow-purple-glow z-10">
+      {!playing && src && (
-        ▶ 15s Performance
+        <div className="pointer-events-none absolute inset-0 flex items-center justify-center z-10">
-      </div>
+          <span className="w-16 h-16 rounded-full bg-white/15 backdrop-blur-md border-2 border-white/40 flex items-center justify-center text-white transition-transform group-hover:scale-110">
-
-      {/* 时长徽章 */}
-      <div className="absolute bottom-3 right-3 px-2 py-0.5 rounded bg-black/65 backdrop-blur-md text-white text-[10px] font-display tracking-wider tabular-nums z-10">
-        {duration}
-      </div>
-
-      {/* 中央播放按钮（未播放时） */}
-      {!playing && (
-        <button
-          type="button"
-          onClick={togglePlay}
-          className="absolute inset-0 flex items-center justify-center z-10 group/play"
-          aria-label="播放视频"
-        >
-          <span className="w-16 h-16 rounded-full bg-white/15 backdrop-blur-md border-2 border-white/40 flex items-center justify-center text-white group-hover/play:scale-110 transition-transform">
             <Play size={22} fill="white" />
           </span>
-        </button>
-      )}
-
-      {/* 暂停按钮 + 控制条（播放中） */}
-      {playing && (
-        <div className="absolute inset-0 flex items-center justify-center z-10 opacity-0 group-hover:opacity-100 transition-opacity bg-black/30">
-          <button
-            type="button"
-            onClick={togglePlay}
-            className="w-14 h-14 rounded-full bg-white/15 backdrop-blur-md border-2 border-white/40 flex items-center justify-center text-white hover:scale-105 transition-transform"
-            aria-label="暂停"
-          >
-            <Pause size={20} />
-          </button>
         </div>
       )}
 
-      {/* 右下：音量 / 全屏 */}
+      {/* 播放中 hover 中央暂停提示 */}
-      <div className="absolute bottom-3 left-3 flex items-center gap-1.5 z-10 opacity-0 group-hover:opacity-100 transition-opacity">
+      {playing && (
+        <div className="pointer-events-none absolute inset-0 flex items-center justify-center z-10 opacity-0 group-hover:opacity-100 transition-opacity bg-black/30">
+          <span className="w-14 h-14 rounded-full bg-white/15 backdrop-blur-md border-2 border-white/40 flex items-center justify-center text-white">
+            <Pause size={20} />
+          </span>
+        </div>
+      )}
+
+      {/* 底部控制条 · 进度 + 时间 + 音量 + 全屏。点击控件不触发外层播放/暂停 */}
+      {src && (
+        <div
+          className={cn(
+            "absolute inset-x-0 bottom-0 z-20 px-3 pt-10 pb-3 bg-gradient-to-t from-black/85 via-black/35 to-transparent transition-opacity",
+            playing && !seeking
+              ? "opacity-0 group-hover:opacity-100"
+              : "opacity-100",
+          )}
+          onClick={(e) => e.stopPropagation()}
+        >
+          {/* 进度条 · 可点击 / 拖拽 */}
+          <div
+            ref={progressRef}
+            onMouseDown={handleBarMouseDown}
+            onTouchStart={handleBarTouchStart}
+            className="relative h-1.5 rounded-full bg-white/15 cursor-pointer group/bar"
+            role="slider"
+            aria-label="视频进度"
+            aria-valuemin={0}
+            aria-valuemax={duration || 0}
+            aria-valuenow={current}
+          >
+            <div
+              className="absolute inset-y-0 left-0 rounded-full bg-purple-400 shadow-[0_0_10px_rgba(167,139,250,0.6)]"
+              style={{ width: `${progress}%` }}
+            />
+            <div
+              className="absolute top-1/2 -translate-y-1/2 -translate-x-1/2 w-3.5 h-3.5 rounded-full bg-white shadow-[0_0_8px_rgba(255,255,255,0.7)] opacity-0 group-hover/bar:opacity-100 transition-opacity"
+              style={{ left: `${progress}%` }}
+            />
+          </div>
+
+          <div className="mt-2.5 flex items-center gap-3">
+            <button
+              type="button"
+              onClick={togglePlay}
+              aria-label={playing ? "暂停" : "播放"}
+              className="text-white/85 hover:text-white"
+            >
+              {playing ? <Pause size={16} /> : <Play size={16} fill="currentColor" />}
+            </button>
+            <span className="font-display text-[11px] text-white/75 tabular-nums">
+              {fmtTime(current)} / {fmtTime(duration)}
+            </span>
+            <div className="ml-auto flex items-center gap-2">
               <button
                 type="button"
                 onClick={toggleMute}
                 aria-label={muted ? "取消静音" : "静音"}
-          className="w-7 h-7 rounded-full bg-black/55 backdrop-blur-md flex items-center justify-center text-white/85 hover:text-white"
+                className="text-white/85 hover:text-white"
               >
-          {muted ? <VolumeX size={12} /> : <Volume2 size={12} />}
+                {muted ? <VolumeX size={14} /> : <Volume2 size={14} />}
               </button>
               <button
                 type="button"
                 onClick={goFullscreen}
                 aria-label="全屏"
-          className="w-7 h-7 rounded-full bg-black/55 backdrop-blur-md flex items-center justify-center text-white/85 hover:text-white"
+                className="text-white/85 hover:text-white"
               >
-          <Maximize2 size={12} />
+                <Maximize2 size={14} />
               </button>
             </div>
           </div>
+        </div>
+      )}
+    </div>
   );
 }

src/components/artist/RankCard.tsx

@@ -1,6 +1,11 @@
 import type { Artist } from "@/types/artist";
 import { cn } from "@/lib/cn";
 
+function formatVotes(v: number): string {
+  if (v >= 10_000) return `${(v / 10_000).toFixed(1)}w`;
+  return v.toLocaleString();
+}
+
 interface RankCardProps {
   artist: Artist;
   /** 全榜单（用于计算与上下名的差距） */
@@ -18,8 +23,9 @@ export default function RankCard({ artist, allArtists, className }: RankCardProp
   const leadOver = next ? artist.votes - next.votes : null;
   const trailBehind = prev ? prev.votes - artist.votes : null;
 
-  const isFirst = artist.rank === 1;
+  // 0 票时即便 rank=1 也不是真的"冠军"，按编号兜底而已
-  const inTop12 = artist.rank <= 12;
+  const isFirst = artist.rank === 1 && artist.votes > 0;
+  const inTop12 = artist.rank <= 12 && artist.votes > 0;
 
   return (
     <div
@@ -43,7 +49,7 @@ export default function RankCard({ artist, allArtists, className }: RankCardProp
             #{artist.rank}
           </span>
           <span className="text-xs text-white/45 pb-1 tabular-nums">
-            {(artist.votes / 10000).toFixed(1)}w 票
+            {formatVotes(artist.votes)} 票
           </span>
         </div>
         {inTop12 && (
@@ -53,9 +59,9 @@ export default function RankCard({ artist, allArtists, className }: RankCardProp
         )}
       </div>
 
-      {/* 差距信息 */}
+      {/* 差距信息 · 仅在艺人本身有票时显示 */}
       <div className="text-right">
-        {isFirst && leadOver != null ? (
+        {artist.votes > 0 && isFirst && leadOver != null ? (
           <>
             <div className="font-label text-[10px] tracking-widest uppercase text-white/40 mb-1">
               领先第二名
@@ -65,7 +71,7 @@ export default function RankCard({ artist, allArtists, className }: RankCardProp
             </div>
             <div className="text-[10px] text-white/40">票</div>
           </>
-        ) : trailBehind != null ? (
+        ) : artist.votes > 0 && trailBehind != null ? (
           <>
             <div className="font-label text-[10px] tracking-widest uppercase text-white/40 mb-1">
               距上一名

src/components/auth/AuthMenu.tsx

@@ -39,13 +39,13 @@ export default function AuthMenu() {
   const user = session?.user;
   const initial = user?.name?.charAt(0).toUpperCase() ?? "?";
 
-  // 未登录态：紫色描边胶囊按钮
+  // 未登录态：与登录后保持一致的紫色实心胶囊
   if (status !== "authenticated") {
     return (
       <button
         type="button"
         onClick={() => status !== "loading" && openLogin()}
-        className="font-display text-[10px] sm:text-xs tracking-[0.2em] uppercase px-4 sm:px-5 h-9 inline-flex items-center justify-center rounded-full border border-[var(--border-purple)] text-purple-300 hover:bg-purple-500/10 hover:shadow-[0_0_20px_rgba(139,92,246,0.3)] transition-all"
+        className="font-display text-[10px] sm:text-xs tracking-[0.2em] uppercase px-4 sm:px-5 h-9 inline-flex items-center justify-center rounded-full bg-grad-purple text-white shadow-[0_0_14px_rgba(139,92,246,0.45)] ring-1 ring-inset ring-white/15 hover:brightness-110 active:brightness-95 transition-all"
       >
         登录 / 注册
       </button>

src/components/auth/LoginModal.tsx

@@ -6,7 +6,6 @@ import { AnimatePresence, motion } from "framer-motion";
 import { signIn } from "next-auth/react";
 import { X, Phone, KeyRound, Loader2 } from "lucide-react";
 import Button from "@/components/ui/Button";
-import Logo from "@/components/Logo";
 import { cn } from "@/lib/cn";
 
 interface LoginModalProps {
@@ -109,7 +108,14 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
           redirect: false,
         });
         if (result?.error) {
-          setError("验证码错误或已失效");
+          console.error("[login] signIn 返回错误:", result);
+          // 把 NextAuth 真实错误透出来,避免被"验证码错误或已失效"一刀切掩盖
+          // (例如 server config 错误时,会显示 Configuration 而不是误导成验证码问题)
+          setError(
+            result.error === "CredentialsSignin"
+              ? "验证码错误或已失效"
+              : `登录失败：${result.error}`,
+          );
         } else {
           onClose();
           if (onSuccess) onSuccess();
@@ -165,10 +171,15 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
               <X size={18} />
             </button>
 
-            <div className="text-center mb-6">
+            <div className="flex flex-col items-center mb-6">
-              <div className="inline-block">
+              <img
-                <Logo size="md" href={null} />
+                src="/logo-v4.png?v=4"
-              </div>
+                alt="银河初星计划 C . S . G"
+                decoding="async"
+                draggable={false}
+                className="block select-none h-16 sm:h-20 w-auto"
+                style={{ background: "transparent" }}
+              />
               <p
                 id="login-modal-title"
                 className="font-label text-[10px] tracking-[0.4em] uppercase text-purple-300/80 mt-3"

src/components/auth/RemainingVotesBadge.tsx

@@ -1,33 +1,35 @@
 "use client";
 
 import { useSession } from "next-auth/react";
-import { useVoteStore, selectRemaining, DAILY_VOTE_QUOTA } from "@/lib/store";
+import { useVoteStore, selectRemaining, TOTAL_VOTE_QUOTA } from "@/lib/store";
 
 /**
- * 导航栏右侧的"今日剩余票数"徽章。
+ * 导航栏的"剩余票数"徽章。
- * - 仅登录态显示
+ * - 始终显示(位于 AuthMenu 左侧)
- * - 实时从 vote store 取剩余票
+ * - 未登录:数值固定为 0
- * - 视觉上是 **填充紫渐变胶囊**，与 AuthMenu 的描边/头像胶囊明显区分（信息 vs 操作）
+ * - 已登录:实时从 vote store 取剩余票
+ * - 视觉为中性轻盈胶囊,与 AuthMenu 的紫色实心胶囊明显区分(信息 vs 操作)
  */
 export default function RemainingVotesBadge() {
   const { status } = useSession();
-  const remaining = useVoteStore(selectRemaining);
+  const storeRemaining = useVoteStore(selectRemaining);
-
+  const authed = status === "authenticated";
-  if (status !== "authenticated") return null;
+  // 未登录显示 0 / 12 引导登录后投票;登录后实时剩余
+  const remaining = authed ? storeRemaining : 0;
 
   return (
     <div
       className="hidden md:inline-flex items-center gap-1.5 h-9 px-4 rounded-full bg-white/[0.04] border border-white/10"
-      aria-label={`今日剩余 ${remaining} 票`}
+      aria-label={`剩余 ${remaining} 票`}
     >
       <span className="text-[11px] text-white/75 leading-none tracking-wide">
-        今日剩余
+        剩余
       </span>
       <span className="font-display text-sm text-purple-300 tabular-nums leading-none">
         {remaining}
       </span>
       <span className="text-[11px] text-white/45 leading-none">
-        / {DAILY_VOTE_QUOTA}
+        / {TOTAL_VOTE_QUOTA}
       </span>
     </div>
   );

src/components/cards/ArtistCard.tsx

@@ -1,7 +1,8 @@
 import Link from "next/link";
-import { Heart } from "lucide-react";
+import { Heart, Check } from "lucide-react";
 import type { Artist } from "@/types/artist";
 import { cn } from "@/lib/cn";
+import { useVoteStore, selectHasVoted } from "@/lib/store";
 import ArtistPortrait from "./ArtistPortrait";
 
 interface ArtistCardProps {
@@ -21,13 +22,15 @@ export default function ArtistCard({
   onVote,
   className,
 }: ArtistCardProps) {
-  const inTop12 = artist.rank <= 12;
+  // 「真正进 Top12」必须有票 —— 0 票时编号兜底排出来的前 12 不算
+  const inTop12 = artist.rank <= 12 && artist.votes > 0;
+  const hasVoted = useVoteStore(selectHasVoted(artist.id));
 
   return (
     <div
       className={cn(
         "group relative rounded-xl overflow-hidden bg-grad-card border transition-all",
-        inTop12
+        (hasVoted || inTop12)
           ? "border-purple-500/55 shadow-[0_8px_32px_rgba(0,0,0,0.65),0_0_24px_rgba(139,92,246,0.25)]"
           : "border-white/[0.10] shadow-[0_8px_32px_rgba(0,0,0,0.65)]",
         "hover:-translate-y-1 hover:shadow-[0_12px_36px_rgba(0,0,0,0.7),0_0_24px_rgba(139,92,246,0.25)]",
@@ -39,8 +42,8 @@ export default function ArtistCard({
         className="block"
         aria-label={`查看 ${artist.name} 详情`}
       >
-        {/* 立绘区（13+ 卡片轻度暗化） */}
+        {/* 立绘区 · Top12 区分仅靠紫色边框 + 辉光,不再降低非 Top12 卡片亮度 */}
-        <div className={cn("relative aspect-[4/5]", !inTop12 && "opacity-[0.78]")}>
+        <div className="relative aspect-[4/5]">
           <ArtistPortrait
             artist={artist}
             rounded="rounded-none"
@@ -59,8 +62,12 @@ export default function ArtistCard({
             {artist.rank}
           </div>
 
-          {/* 顶部轻微渐变蒙层 */}
+          {/* 已投票角标（右上紫色 ✓） */}
-          <div className="absolute inset-x-0 top-0 h-12 bg-gradient-to-b from-black/40 to-transparent pointer-events-none" />
+          {hasVoted && (
+            <div className="absolute top-2 right-2 w-6 h-6 rounded-full bg-purple-500 shadow-[0_0_12px_rgba(139,92,246,0.7)] flex items-center justify-center">
+              <Check size={14} strokeWidth={3} className="text-white" />
+            </div>
+          )}
         </div>
 
         {/* 信息区（黑色背景明显分隔） */}
@@ -72,7 +79,7 @@ export default function ArtistCard({
             {artist.name}
           </div>
           <div className="text-[11px] text-white/55 truncate mt-0.5">
-            {artist.slogan}
+            {artist.enName}
           </div>
           <div
             className={cn(
@@ -86,7 +93,7 @@ export default function ArtistCard({
         </div>
       </Link>
 
-      {/* 投票按钮（所有排名统一样式 · 紫色实心） */}
+      {/* 投票按钮（hasVoted 时灰化为「已投票」） */}
       <div className="px-3 pb-3 bg-black/40">
         <button
           type="button"
@@ -96,11 +103,12 @@ export default function ArtistCard({
           }}
           className={cn(
             "w-full h-9 rounded-lg font-body font-semibold text-sm transition-all",
-            "bg-grad-purple text-white shadow-[0_0_12px_rgba(139,92,246,0.35)]",
+            hasVoted
-            "hover:brightness-110 active:brightness-95",
+              ? "bg-white/10 text-white/55 cursor-not-allowed border border-white/15"
+              : "bg-grad-purple text-white shadow-[0_0_12px_rgba(139,92,246,0.35)] hover:brightness-110 active:brightness-95",
           )}
         >
-          投票
+          {hasVoted ? "✓ 已投票" : "投票"}
         </button>
       </div>
     </div>

src/components/cards/ArtistPortrait.tsx

@@ -11,7 +11,7 @@ interface ArtistPortraitProps {
 
 /**
  * 艺人立绘容器。
- * 有真实图时显示 Image；否则渲染基于 themeColor 的渐变占位（带首字母）。
+ * 有真实图时显示 Image；否则渲染统一品牌紫渐变占位（带英文首字母）。
  */
 export default function ArtistPortrait({
   artist,
@@ -26,45 +26,35 @@ export default function ArtistPortrait({
   if (artist.portrait) {
     return (
       <div
-        className={cn(
+        className={cn("relative overflow-hidden bg-deep", rounded, className)}
-          "relative overflow-hidden bg-deep",
-          rounded,
-          className,
-        )}
       >
         <Image
           src={artist.portrait}
           alt={`${artist.name} · ${artist.enName}`}
           fill
-          sizes="(max-width: 768px) 50vw, 240px"
+          sizes="(max-width: 768px) 50vw, 360px"
-          className="object-cover"
+          // 氛围图大多为全身竖向构图，用 object-cover + object-top
+          // 让头部 + 上半身保留在画面里，下半身（腿/脚）自然超出底边被剪裁
+          className="object-cover object-top"
         />
       </div>
     );
   }
 
+  // 无立绘 fallback：品牌紫渐变 + 字母占位
   return (
     <div
       className={cn(
         "relative overflow-hidden flex items-center justify-center",
+        "bg-[linear-gradient(155deg,rgba(139,92,246,0.20)_0%,#1a1638_60%,#0d0a24_100%)]",
         rounded,
         className,
       )}
-      style={{
-        background: `linear-gradient(155deg, ${artist.themeColor}33 0%, #1a1638 60%, #0d0a24 100%)`,
-      }}
     >
-      {/* 装饰光晕 */}
       <div
-        className="absolute inset-0"
+        aria-hidden
-        style={{
+        className="absolute inset-0 bg-[radial-gradient(circle_at_50%_30%,rgba(139,92,246,0.35)_0%,transparent_55%)]"
-          background: `radial-gradient(circle at 50% 30%, ${artist.themeColor}55 0%, transparent 55%)`,
-        }}
       />
-      {/* 装饰星标 */}
-      <span className="absolute top-2 right-2 text-white/15 text-sm">✦</span>
-      <span className="absolute bottom-3 left-3 text-white/10 text-xs">✧</span>
-      {/* 首字母 */}
       <span
         className="font-logo text-5xl text-white/85 glow-text-purple tracking-wider relative z-10"
         aria-hidden

src/components/me/MyFanSupport.tsx

@@ -1,16 +1,16 @@
 import Link from "next/link";
-import { Heart, AlertTriangle } from "lucide-react";
+import { Check, AlertTriangle } from "lucide-react";
-import type { FanSupport } from "@/lib/mock-user";
+import type { MySupport } from "@/lib/store";
 import ArtistPortrait from "@/components/cards/ArtistPortrait";
 import { cn } from "@/lib/cn";
 
-export default function MyFanSupport({ supports }: { supports: FanSupport[] }) {
+export default function MyFanSupport({ supports }: { supports: MySupport[] }) {
   if (supports.length === 0) {
     return (
       <div className="rounded-xl border border-dashed border-white/10 p-8 text-center text-white/45 text-sm">
-        还没有应援的艺人 ·{" "}
+        还没有投过票 ·{" "}
         <Link href="/" className="text-purple-300 hover:underline">
-          去发现
+          去为你喜欢的艺人投出第一票
         </Link>
       </div>
     );
@@ -18,8 +18,8 @@ export default function MyFanSupport({ supports }: { supports: FanSupport[] }) {
 
   return (
     <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
-      {supports.map(({ artist, votedCount }) => {
+      {supports.map(({ artist }) => {
-        const inTop12 = artist.rank <= 12;
+        const inTop12 = artist.rank <= 12 && artist.votes > 0;
         return (
           <Link
             key={artist.id}
@@ -46,9 +46,9 @@ export default function MyFanSupport({ supports }: { supports: FanSupport[] }) {
               <div className="text-sm font-semibold text-white truncate">
                 {artist.name}
               </div>
-              <div className="inline-flex items-center gap-1 text-[11px] text-purple-300 mt-0.5 font-display tabular-nums">
+              <div className="inline-flex items-center gap-1 text-[11px] text-purple-300 mt-0.5 font-display">
-                <Heart size={10} fill="currentColor" />
+                <Check size={11} strokeWidth={2.5} />
-                已投 {votedCount} 票
+                已投票
               </div>
               <div
                 className={cn(

src/components/me/QuotaCard.tsx

@@ -1,25 +1,18 @@
 "use client";
 
-import { UserPlus } from "lucide-react";
-
 interface QuotaCardProps {
-  /** 今日剩余票数 */
+  /** 剩余票数 */
   remaining: number;
-  /** 每日总额度（用于「重置为 X 票」展示） */
+  /** 总额度 12(用于"X / 12 票" 展示) */
-  dailyQuota: number;
+  totalQuota: number;
-  /** 我累计投出的票数（保留 prop 以兼容现有调用方，组件内不直接展示） */
-  cumulative?: number;
-  onInvite?: () => void;
 }
 
-export default function QuotaCard({
+export default function QuotaCard({ remaining, totalQuota }: QuotaCardProps) {
-  remaining,
+  const exhausted = remaining === 0;
-  dailyQuota,
+
-  onInvite,
-}: QuotaCardProps) {
   return (
     <div className="relative overflow-hidden rounded-2xl border border-purple-500/30 bg-gradient-to-br from-purple-500/[0.12] via-purple-500/[0.04] to-transparent shadow-[0_8px_32px_rgba(0,0,0,0.55),0_0_28px_rgba(139,92,246,0.2)]">
-      {/* 装饰：右侧紫色光晕 */}
+      {/* 装饰:右侧紫色光晕 */}
       <div
         aria-hidden
         className="absolute right-0 top-0 bottom-0 w-1/2 pointer-events-none"
@@ -28,46 +21,27 @@ export default function QuotaCard({
             "radial-gradient(circle at 70% 50%, rgba(139,92,246,0.45) 0%, transparent 60%)",
         }}
       />
-      {/* 装饰：右侧"水晶"占位（无素材时用 CSS 渲染的辉光六边形） */}
       <CrystalDecoration />
 
-      <div className="relative p-6 sm:p-8 grid grid-cols-[1fr_auto] gap-4 items-center">
+      <div className="relative p-6 sm:p-8">
-        <div>
+        <p className="text-xs text-white/70 tracking-wider">剩余票数</p>
-          <p className="text-xs text-white/70 tracking-wider">今日剩余票数</p>
         <div className="mt-2 flex items-baseline gap-1">
           <span className="font-display text-5xl sm:text-6xl text-white tabular-nums leading-none">
             {remaining}
           </span>
-            <span className="text-xl text-white/85 ml-1">票</span>
+          <span className="text-xl text-white/85 ml-1">/ {totalQuota} 票</span>
         </div>
         <p className="text-[11px] text-white/55 mt-3">
-            明日 00:00 重置为{" "}
+          {exhausted
-            <span className="text-purple-300 font-display tabular-nums">
+            ? "✦ 12 票全部投出 · 感谢支持"
-              {dailyQuota}
+            : `共 ${totalQuota} 票 · 用满完成投票`}
-            </span>{" "}
-            票
         </p>
       </div>
-
-        <div className="flex flex-col items-end gap-2">
-          <span className="font-label text-[10px] tracking-widest uppercase text-white/55">
-            获取更多票数
-          </span>
-          <button
-            type="button"
-            onClick={onInvite}
-            className="inline-flex items-center gap-2 px-4 sm:px-5 h-10 rounded-full bg-grad-purple text-white font-body text-sm shadow-[0_0_14px_rgba(139,92,246,0.45)] hover:brightness-110 transition-all"
-          >
-            <UserPlus size={14} />
-            邀请好友得票
-          </button>
-        </div>
-      </div>
     </div>
   );
 }
 
-/** 右侧装饰：用 CSS 渲染的简易"紫色水晶"效果，作为 3D 素材到位前的占位。 */
+/** 右侧装饰:用 CSS 渲染的简易"紫色水晶"效果,作为 3D 素材到位前的占位。 */
 function CrystalDecoration() {
   return (
     <div

src/components/me/StatsGrid.tsx

@@ -1,38 +1,30 @@
-import { Sparkles, Star, Calendar, UserPlus } from "lucide-react";
+import { Check, Heart } from "lucide-react";
-import type { MockUser } from "@/lib/mock-user";
 
-const ICON_MAP = {
+interface StatsGridProps {
-  votes: <Sparkles size={14} />,
+  /** 已投艺人数 */
-  fan: <Star size={14} />,
+  voted: number;
-  signin: <Calendar size={14} />,
+  /** 剩余票数 */
-  invite: <UserPlus size={14} />,
+  remaining: number;
-};
+}
 
-export default function StatsGrid({ user }: { user: MockUser }) {
+export default function StatsGrid({ voted, remaining }: StatsGridProps) {
-  const stats = [
+  const stats: { key: string; label: string; value: number; icon: React.ReactNode }[] = [
-    { key: "votes", label: "累计投票", value: user.totalVotes, icon: ICON_MAP.votes },
     {
-      key: "fan",
+      key: "voted",
-      label: "应援艺人",
+      label: "已投票数",
-      value: user.supportingIds.length,
+      value: voted,
-      icon: ICON_MAP.fan,
+      icon: <Check size={14} strokeWidth={2.5} />,
     },
     {
-      key: "signin",
+      key: "remaining",
-      label: "签到天数",
+      label: "剩余票数",
-      value: user.signInStreak,
+      value: remaining,
-      icon: ICON_MAP.signin,
+      icon: <Heart size={14} fill="currentColor" />,
-    },
-    {
-      key: "invite",
-      label: "邀请好友",
-      value: user.invitedCount,
-      icon: ICON_MAP.invite,
     },
   ];
 
   return (
-    <div className="grid grid-cols-2 sm:grid-cols-4 gap-2 sm:gap-3">
+    <div className="grid grid-cols-2 gap-2 sm:gap-3">
       {stats.map((s) => (
         <div
           key={s.key}

src/components/me/UserHeader.tsx

@@ -1,20 +1,24 @@
-import { Pencil, Star, LogOut } from "lucide-react";
+import { LogOut } from "lucide-react";
-import type { MockUser } from "@/lib/mock-user";
 
 interface UserHeaderProps {
-  user: MockUser;
+  /** 用户昵称（来自 session） */
+  nickname: string;
+  /** 用户 ID（来自 session） */
+  userId: string;
   onLogout?: () => void;
 }
 
-export default function UserHeader({ user, onLogout }: UserHeaderProps) {
+export default function UserHeader({
-  const initial = user.nickname.charAt(0).toUpperCase();
+  nickname,
-  // 简单的等级算法：每 50 票升 1 级，从 1 起步
+  userId,
-  const level = Math.max(1, Math.floor(user.totalVotes / 50) + 1);
+  onLogout,
+}: UserHeaderProps) {
+  const initial = nickname.charAt(0).toUpperCase();
 
   return (
     <div className="flex items-center gap-4">
-      {/* 头像 + 等级角标 */}
+      {/* 头像 */}
-      <div className="relative flex-shrink-0">
+      <div className="flex-shrink-0">
         <div className="w-16 h-16 sm:w-20 sm:h-20 rounded-full overflow-hidden border-2 border-purple-500/60 shadow-[0_0_16px_rgba(139,92,246,0.4)]">
           <div
             className="w-full h-full flex items-center justify-center font-logo text-2xl text-white"
@@ -26,46 +30,27 @@ export default function UserHeader({ user, onLogout }: UserHeaderProps) {
             {initial}
           </div>
         </div>
-        <span className="absolute -bottom-1 -right-1 inline-flex items-center gap-0.5 px-1.5 h-5 rounded-full bg-purple-500 text-white text-[10px] font-display border-2 border-deep">
-          <Star size={9} fill="currentColor" />
-          Lv.{level}
-        </span>
       </div>
 
       <div className="flex-1 min-w-0">
         <div className="text-lg sm:text-xl font-bold text-white truncate">
-          {user.nickname}
+          {nickname}
-        </div>
-        <div className="text-xs text-white/55 mt-1.5">
-          ID: {user.id}
-          <span className="mx-2 text-white/25">·</span>
-          已连续签到{" "}
-          <span className="text-purple-300 font-display tabular-nums">
-            {user.signInStreak}
-          </span>{" "}
-          天
         </div>
+        <div className="text-xs text-white/55 mt-1.5">ID: {userId}</div>
       </div>
 
-      <div className="hidden sm:flex flex-col items-stretch gap-2">
+      {/* 退出登录 · 粉色危险态描边（移动端 = icon-only 圆按钮，桌面端 = 带文案胶囊） */}
-        <button
-          type="button"
-          className="inline-flex items-center justify-center gap-1.5 px-3 h-9 rounded-full bg-white/[0.04] border border-white/15 text-white/75 hover:bg-white/10 text-xs transition-colors"
-        >
-          <Pencil size={12} />
-          编辑资料
-        </button>
       {onLogout && (
         <button
           type="button"
           onClick={onLogout}
-            className="inline-flex items-center justify-center gap-1.5 px-3 h-9 rounded-full bg-white/[0.04] border border-white/10 text-white/55 hover:text-pink-400 hover:border-pink-500/40 text-xs transition-colors"
+          aria-label="退出登录"
+          className="inline-flex items-center justify-center gap-1.5 h-9 rounded-full bg-transparent border border-pink-500/40 text-pink-300 hover:bg-pink-500/[0.08] hover:text-pink-200 hover:border-pink-500/60 text-xs transition-colors w-9 sm:w-auto sm:px-3"
         >
           <LogOut size={12} />
-            退出登录
+          <span className="hidden sm:inline">退出登录</span>
         </button>
       )}
     </div>
-    </div>
   );
 }

src/components/ranking/RankingRow.tsx

@@ -1,10 +1,11 @@
 "use client";
 
 import Link from "next/link";
-import { TrendingUp, AlertTriangle } from "lucide-react";
+import { TrendingUp, AlertTriangle, Check } from "lucide-react";
 import type { Artist } from "@/types/artist";
 import ArtistPortrait from "@/components/cards/ArtistPortrait";
 import { cn } from "@/lib/cn";
+import { useVoteStore, selectHasVoted } from "@/lib/store";
 
 interface RankingRowProps {
   artist: Artist;
@@ -29,7 +30,9 @@ export default function RankingRow({
   isRescue = false,
   onVote,
 }: RankingRowProps) {
-  const inTop12 = artist.rank <= 12;
+  const hasVoted = useVoteStore(selectHasVoted(artist.id));
+  // 「真正进 Top12」必须有票 —— 0 票时编号兜底不算
+  const inTop12 = artist.rank <= 12 && artist.votes > 0;
 
   return (
     <div
@@ -37,7 +40,7 @@ export default function RankingRow({
         "grid grid-cols-[56px_48px_1fr_72px_96px_72px] sm:grid-cols-[72px_56px_1fr_96px_120px_88px] items-center gap-2 sm:gap-4 px-3 sm:px-4 py-2.5 border-b border-white/[0.05] transition-all",
         inTop12
           ? "bg-white/[0.02] hover:bg-purple-500/[0.06]"
-          : "opacity-[0.78] hover:opacity-100 hover:bg-white/[0.03]",
+          : "hover:bg-white/[0.03]",
       )}
     >
       {/* 排名 */}
@@ -51,11 +54,11 @@ export default function RankingRow({
       </div>
 
       {/* 头像 */}
-      <Link href={`/artist/${artist.id}`} className="block">
+      <Link href={`/artist/${artist.id}`} className="block relative">
         <div
           className={cn(
             "w-10 h-10 sm:w-12 sm:h-12 rounded-full overflow-hidden border-2",
-            inTop12 ? "border-purple-500/70" : "border-white/15",
+            (hasVoted || inTop12) ? "border-purple-500/70" : "border-white/15",
           )}
         >
           <ArtistPortrait
@@ -64,6 +67,11 @@ export default function RankingRow({
             className="w-full h-full"
           />
         </div>
+        {hasVoted && (
+          <div className="absolute -bottom-0.5 -right-0.5 w-4 h-4 sm:w-5 sm:h-5 rounded-full bg-purple-500 border-2 border-deepest shadow-[0_0_8px_rgba(139,92,246,0.7)] flex items-center justify-center">
+            <Check size={10} strokeWidth={3} className="text-white" />
+          </div>
+        )}
       </Link>
 
       {/* 姓名 + slogan */}
@@ -74,7 +82,7 @@ export default function RankingRow({
         <div className="text-sm text-white font-semibold truncate">
           {artist.name}
           <span className="ml-2 text-white/45 font-normal text-[11px]">
-            · {artist.slogan}
+            · {artist.enName}
           </span>
         </div>
       </Link>
@@ -112,9 +120,14 @@ export default function RankingRow({
       <button
         type="button"
         onClick={() => onVote(artist)}
-        className="h-8 rounded-lg font-body font-semibold text-xs bg-grad-purple text-white shadow-[0_0_12px_rgba(139,92,246,0.35)] hover:brightness-110"
+        className={cn(
+          "h-8 rounded-lg font-body font-semibold text-xs transition-all",
+          hasVoted
+            ? "bg-white/10 text-white/55 border border-white/15 cursor-not-allowed"
+            : "bg-grad-purple text-white shadow-[0_0_12px_rgba(139,92,246,0.35)] hover:brightness-110"
+        )}
       >
-        投票
+        {hasVoted ? "✓ 已投票" : "投票"}
       </button>
     </div>
   );

src/components/ranking/Top3Podium.tsx

@@ -1,5 +1,4 @@
 import Link from "next/link";
-import { Crown } from "lucide-react";
 import type { Artist } from "@/types/artist";
 import ArtistPortrait from "@/components/cards/ArtistPortrait";
 import { cn } from "@/lib/cn";
@@ -15,73 +14,101 @@ function formatVotes(v: number): string {
 
 export default function Top3Podium({ top3 }: Top3PodiumProps) {
   const [first, second, third] = top3;
-  if (!first || !second || !third) return null;
 
-  // 视觉排序：第二 / 第一(中央) / 第三
+  // 0 票时按编号兜底排出来的"伪冠军"不算 —— 这些位置当作缺位处理
-  const order: Array<{ artist: Artist; rank: 1 | 2 | 3 }> = [
+  const champ = first && first.votes > 0 ? first : undefined;
-    { artist: second, rank: 2 },
+  const runnerUp = second && second.votes > 0 ? second : undefined;
-    { artist: first, rank: 1 },
+  const thirdPlace = third && third.votes > 0 ? third : undefined;
-    { artist: third, rank: 3 },
+
+  // 视觉顺序：第二 / 第一(中央) / 第三 · 缺位 = 虚位以待
+  const order: Array<{ artist: Artist | undefined; rank: 1 | 2 | 3 }> = [
+    { artist: runnerUp, rank: 2 },
+    { artist: champ, rank: 1 },
+    { artist: thirdPlace, rank: 3 },
   ];
 
+  const lead = champ && runnerUp ? champ.votes - runnerUp.votes : null;
+
   return (
-    <div className="grid grid-cols-3 gap-3 sm:gap-5 items-end">
+    // 冠军卡片更宽更高（1.3fr），亚季军等宽（1fr），三张底部对齐；
+    // 整个组合最大宽度受限并横向居中，避免在 1500 版心下占满铺张。
+    <div className="grid grid-cols-[1fr_1.3fr_1fr] items-end gap-8 sm:gap-12 pt-12 sm:pt-14 max-w-[860px] mx-auto">
       {order.map(({ artist, rank }) => {
+        if (!artist) {
+          return <EmptySlot key={`empty-${rank}`} rank={rank} />;
+        }
         const isFirst = rank === 1;
+
         return (
           <Link
             key={artist.id}
             href={`/artist/${artist.id}`}
-            className={cn(
+            className="group relative block"
-              "group relative flex flex-col items-center rounded-2xl border transition-all overflow-hidden",
-              "bg-gradient-to-b from-purple-500/[0.12] via-purple-500/[0.04] to-transparent",
-              "border-purple-500/40 hover:border-purple-400/60",
-              "shadow-[0_8px_32px_rgba(0,0,0,0.55),0_0_28px_rgba(139,92,246,0.25)]",
-              isFirst && "shadow-[0_8px_36px_rgba(0,0,0,0.65),0_0_42px_rgba(196,181,253,0.35)]",
-              isFirst ? "py-8 px-3 -translate-y-3" : "py-6 px-3",
-            )}
           >
-            {/* 顶部小皇冠（仅第一名） */}
+            {/* 顶部奖牌 SVG · 悬浮在卡片顶边上方 */}
-            {isFirst && (
+            {/* eslint-disable-next-line @next/next/no-img-element */}
-              <div className="absolute -top-2 left-1/2 -translate-x-1/2 text-purple-300">
+            <img
-                <Crown size={20} fill="currentColor" />
+              src={`/rank-${rank}.svg`}
-              </div>
+              alt={`第 ${rank} 名`}
+              className={cn(
+                "absolute left-1/2 -translate-x-1/2 z-20 select-none pointer-events-none drop-shadow-[0_4px_12px_rgba(0,0,0,0.5)]",
+                isFirst
+                  ? "w-16 sm:w-20 -top-9 sm:-top-11"
+                  : "w-14 sm:w-16 -top-7 sm:-top-9",
               )}
+              draggable={false}
+            />
 
-            {/* 头像（圆形 + 紫色环） */}
+            {/* 卡片容器（3:4 比例） · #1 金色渐变描边 + 金色辉光；#2 #3 紫色描边 */}
             <div
               className={cn(
-                "rounded-full overflow-hidden border-2 mb-3",
+                "relative aspect-[3/4] rounded-xl overflow-hidden transition-all",
-                "border-purple-500 shadow-[0_0_18px_rgba(139,92,246,0.55)]",
+                isFirst
-                isFirst ? "w-24 h-24 sm:w-28 sm:h-28" : "w-20 h-20 sm:w-24 sm:h-24",
+                  ? "p-[2px] shadow-[0_8px_36px_rgba(0,0,0,0.55),0_0_36px_rgba(255,200,120,0.20)]"
+                  : "border border-purple-500/40 shadow-[0_8px_32px_rgba(0,0,0,0.55),0_0_24px_rgba(139,92,246,0.18)] hover:border-purple-400/60",
+              )}
+              style={
+                isFirst
+                  ? {
+                      background:
+                        "linear-gradient(180deg, #FFDAA8 0%, #A88351 100%)",
+                    }
+                  : undefined
+              }
+            >
+              {/* 内层 · #1 用 2px 内填让金色渐变作为描边露出 */}
+              <div
+                className={cn(
+                  "relative w-full h-full overflow-hidden bg-deepest",
+                  isFirst ? "rounded-[10px]" : "rounded-[11px]",
                 )}
               >
+                {/* 立绘填满卡片 */}
                 <ArtistPortrait
                   artist={artist}
-                rounded="rounded-full"
+                  rounded="rounded-none"
-                className="w-full h-full"
+                  className="absolute inset-0"
                 />
-            </div>
 
-            {/* 名字 */}
+                {/* 底部渐隐 + 信息层 */}
-            <div className={cn("font-semibold text-white truncate max-w-full", isFirst ? "text-base sm:text-lg" : "text-sm")}>
+                <div className="absolute inset-x-0 bottom-0 px-3 pb-3 pt-10 bg-gradient-to-t from-black/90 via-black/65 to-transparent text-center">
+                  <div
+                    className="text-sm sm:text-base font-semibold truncate"
+                    style={{ color: "#ffffff" }}
+                  >
                     {artist.name}
                   </div>
-
+                  <div className="mt-0.5 font-display tabular-nums text-base sm:text-lg text-pink-400">
-            {/* 票数 */}
-            <div
-              className={cn(
-                "mt-1 font-display tabular-nums",
-                isFirst ? "text-lg sm:text-xl text-purple-200" : "text-base text-purple-300",
-              )}
-            >
                     {formatVotes(artist.votes)}{" "}
-              <span className="text-xs opacity-70">票</span>
+                    <span className="text-xs text-pink-300/80">票</span>
+                  </div>
+                  {isFirst && lead != null && lead > 0 && (
+                    <div className="mt-1 text-[11px] text-white/60 tabular-nums">
+                      领先 +{lead.toLocaleString()}
+                    </div>
+                  )}
+                </div>
               </div>
-
-            {/* 当前排名徽章 */}
-            <div className="mt-2 inline-flex items-center gap-1 px-2.5 py-0.5 rounded-full bg-purple-500/15 border border-purple-400/40 text-[10px] text-purple-200">
-              当前 #{artist.rank}
             </div>
           </Link>
         );
@@ -89,3 +116,32 @@ export default function Top3Podium({ top3 }: Top3PodiumProps) {
     </div>
   );
 }
+
+/** 虚位以待 · 任意 rank 缺位时的占位卡片，与正式卡片同 3:4 比例对齐底边 */
+function EmptySlot({ rank }: { rank: 1 | 2 | 3 }) {
+  const isFirst = rank === 1;
+  return (
+    <div className="relative">
+      {/* eslint-disable-next-line @next/next/no-img-element */}
+      <img
+        src={`/rank-${rank}.svg`}
+        alt={`第 ${rank} 名`}
+        className={cn(
+          "absolute left-1/2 -translate-x-1/2 z-20 select-none pointer-events-none opacity-40 drop-shadow-[0_4px_12px_rgba(0,0,0,0.5)]",
+          isFirst
+            ? "w-16 sm:w-20 -top-9 sm:-top-11"
+            : "w-14 sm:w-16 -top-7 sm:-top-9",
+        )}
+        draggable={false}
+      />
+      <div className="relative aspect-[3/4] rounded-xl border border-dashed border-white/12 bg-white/[0.02] flex items-center justify-center">
+        <div className="text-center px-3">
+          <p className="font-label text-[10px] tracking-widest uppercase text-white/35">
+            Vacant
+          </p>
+          <p className="mt-1 text-xs text-white/55">虚位以待</p>
+        </div>
+      </div>
+    </div>
+  );
+}

src/hooks/useFooterPush.ts

@@ -0,0 +1,54 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+/**
+ * 计算浮动按钮为避让 <footer> 需要额外上推的像素数。
+ *
+ * 返回值 push (px):
+ * - footer 未进视口 → 0,按钮保持原位
+ * - footer 部分/完全在视口 → 等于 footer 顶部进入视口的深度 + gap,
+ *   让按钮始终漂浮在 footer 顶部上方 gap 像素处
+ *
+ * 用法:
+ *   const push = useFooterPush();
+ *   <button style={{ transform: `translateY(-${push}px)` }} ... />
+ *
+ * 实现:scroll + resize 事件 + rAF 节流;比 IntersectionObserver 灵敏,
+ * 能给出连续的 push 数值(IO 只能给二值)。
+ */
+export function useFooterPush(gap = 16): number {
+  const [push, setPush] = useState(0);
+
+  useEffect(() => {
+    const footer = document.querySelector("footer");
+    if (!footer) return;
+
+    let raf = 0;
+    const update = () => {
+      const rect = footer.getBoundingClientRect();
+      // overlap = footer 顶部进入视口的深度。footer 未入视口时为负数,clamp 到 0
+      const overlap = window.innerHeight - rect.top + gap;
+      setPush(Math.max(0, overlap));
+    };
+
+    const schedule = () => {
+      if (raf) return;
+      raf = requestAnimationFrame(() => {
+        update();
+        raf = 0;
+      });
+    };
+
+    update();
+    window.addEventListener("scroll", schedule, { passive: true });
+    window.addEventListener("resize", schedule);
+    return () => {
+      window.removeEventListener("scroll", schedule);
+      window.removeEventListener("resize", schedule);
+      if (raf) cancelAnimationFrame(raf);
+    };
+  }, [gap]);
+
+  return push;
+}

src/hooks/useRanking.ts

@@ -7,8 +7,6 @@ export interface RankedArtist {
   no: string;
   name: string;
   enName: string;
-  slogan: string;
-  themeColor: string;
   avatar: string | null;
   portrait: string | null;
   voteCount: number;

src/hooks/useScrollRestore.ts

@@ -0,0 +1,63 @@
+"use client";
+
+import { useEffect } from "react";
+
+/**
+ * 用 sessionStorage 在同一标签页内保存/恢复滚动位置。
+ *
+ * 用法:在希望被记忆的页面顶层 useScrollRestore("home")。
+ * - mount 时,如果有保存值,把 window 滚动到对应 y 并清除标记
+ * - 用户滚动时,节流写入当前 scrollY
+ * - 切到其他路由后再回来 → mount 重跑 → 恢复
+ *
+ * 注意:
+ * - sessionStorage 跨标签页隔离,所以不会跨窗口"漏读"
+ * - 用 rAF 节流,避免每帧写入卡顿
+ * - 用 requestAnimationFrame 在下一帧恢复,确保 DOM 已经渲染出真实高度
+ */
+export function useScrollRestore(key: string) {
+  useEffect(() => {
+    const storageKey = `scroll:${key}`;
+
+    // 恢复 · 用 rAF 等 DOM 真正布局完成后再滚
+    const saved = sessionStorage.getItem(storageKey);
+    if (saved) {
+      const y = parseInt(saved, 10);
+      if (!Number.isNaN(y) && y > 0) {
+        // 两次 rAF 跨过 next.js hydration/挂载首帧,DOM 高度才稳定
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            // 临时禁用 scroll-snap-type:首页用 "y mandatory",
+            // 直接 scrollTo 到 snap 点之外的位置会被浏览器强制吸到最近 snap 点。
+            const html = document.documentElement;
+            const prevSnap = html.style.scrollSnapType;
+            html.style.scrollSnapType = "none";
+            window.scrollTo({ top: y, behavior: "auto" });
+            // 多等一帧让 scrollTo 落定再恢复 snap
+            requestAnimationFrame(() => {
+              html.style.scrollSnapType = prevSnap;
+            });
+          });
+        });
+      }
+    }
+
+    // 保存 · scroll 事件高频,用 rAF 合并
+    let raf = 0;
+    const onScroll = () => {
+      if (raf) return;
+      raf = requestAnimationFrame(() => {
+        sessionStorage.setItem(storageKey, String(window.scrollY));
+        raf = 0;
+      });
+    };
+    window.addEventListener("scroll", onScroll, { passive: true });
+
+    return () => {
+      window.removeEventListener("scroll", onScroll);
+      if (raf) cancelAnimationFrame(raf);
+      // unmount 时再保存一次最终值
+      sessionStorage.setItem(storageKey, String(window.scrollY));
+    };
+  }, [key]);
+}

src/hooks/useSyncMe.ts

@@ -0,0 +1,82 @@
+"use client";
+
+import { useEffect, useRef } from "react";
+import { useSession, signOut } from "next-auth/react";
+import { useVoteStore } from "@/lib/store";
+
+/**
+ * 把服务端 /api/me 的真相态同步进本地 vote store。
+ *
+ * - status === "authenticated" → 拉一次 /api/me,用 votedArtists 覆盖本地
+ * - status === "unauthenticated" → 清本地(避免上一个用户的票残留给下一个登录者)
+ * - 切换用户(uid 变化) → 重新拉一次
+ *
+ * 僵尸 session 兜底:NextAuth 用 JWT 策略,cookie 不会因 DB user 被删而失效。
+ * 当 /api/me 返回 401(签名失效) 或 NOT_FOUND(DB 里 user 已不存在) 时,
+ * 自动 signOut() 清 cookie —— 避免页面"假登录"假象(显示已登录但拉不到数据)。
+ *
+ * localStorage 仅作为本设备的缓存加速首屏渲染,服务端永远是唯一真相源。
+ */
+export function useSyncMe() {
+  const { data, status } = useSession();
+  const hydrateFromServer = useVoteStore((s) => s.hydrateFromServer);
+  const reset = useVoteStore((s) => s.reset);
+  const lastSyncedUidRef = useRef<string | null>(null);
+
+  const sessionUser = data?.user as { id?: string } | undefined;
+  const uid = sessionUser?.id ?? null;
+
+  useEffect(() => {
+    if (status === "loading") return;
+
+    if (status === "unauthenticated") {
+      if (lastSyncedUidRef.current !== null) {
+        reset();
+        lastSyncedUidRef.current = null;
+      }
+      return;
+    }
+
+    // authenticated
+    if (!uid) return;
+    if (lastSyncedUidRef.current === uid) return;
+
+    let cancelled = false;
+    const ctrl = new AbortController();
+    const timer = setTimeout(() => ctrl.abort(), 8000);
+
+    fetch("/api/me", {
+      credentials: "include",
+      signal: ctrl.signal,
+    })
+      .then(async (r) => {
+        if (cancelled) return;
+        const res = await r.json().catch(() => null);
+
+        if (r.ok && res?.ok && Array.isArray(res.data?.votedArtists)) {
+          hydrateFromServer(res.data.votedArtists as string[]);
+          lastSyncedUidRef.current = uid;
+          return;
+        }
+
+        // 僵尸 session:JWT 还有效,但 DB 里 user 已不存在(或鉴权失效)。
+        // 直接登出清 cookie,UI 状态切换为未登录,避免"显示已登录但拉不到数据"。
+        const code: string | undefined = res?.error?.code;
+        if (r.status === 401 || code === "UNAUTHORIZED" || code === "NOT_FOUND") {
+          signOut({ redirect: false });
+          reset();
+          lastSyncedUidRef.current = null;
+        }
+      })
+      .catch(() => {
+        // 网络失败容忍 —— 下次 status 变化或手动刷新会再试
+      })
+      .finally(() => clearTimeout(timer));
+
+    return () => {
+      cancelled = true;
+      ctrl.abort();
+      clearTimeout(timer);
+    };
+  }, [status, uid, hydrateFromServer, reset]);
+}

src/hooks/useVoteAction.ts

@@ -6,39 +6,70 @@ import toast from "react-hot-toast";
 import {
   useVoteStore,
   selectRemaining,
-  DAILY_VOTE_QUOTA,
+  TOTAL_VOTE_QUOTA,
 } from "@/lib/store";
 import { useLoginModalStore } from "@/lib/login-modal-store";
 import type { Artist } from "@/types/artist";
 
 interface UseVoteActionResult {
-  /** 当前投票目标艺人（null 时弹窗关闭） */
+  /** 当前投票目标艺人(null 时弹窗关闭) */
   target: Artist | null;
-  /** 今日剩余票数 */
+  /** 剩余可投票数(终身 12 票 - 已投艺人数) */
   remaining: number;
-  /** 每日总额度（常量，供 UI 文案展示） */
+  /** 总额度常量 12(供 UI 文案展示) */
-  dailyQuota: number;
+  totalQuota: number;
-  /** 触发投票（自动检查登录态 + 额度） */
+  /** 触发投票(自动检查登录态 / 已投态 / 额度) */
   openVote: (artist: Artist) => void;
   /** 关闭投票弹窗 */
   closeVote: () => void;
-  /** 确认投票（已登录态下调用） */
+  /** 确认投票(已登录态下调用,固定投 1 票) */
-  confirmVote: (artist: Artist, count: number) => Promise<void>;
+  confirmVote: (artist: Artist) => Promise<void>;
+}
+
+interface UseVoteActionOpts {
+  /**
+   * 投票成功且服务端 200 写入后回调 —— 调用方在此触发 useRanking.refresh(),
+   * 让 Top12 / 排行榜立即拉到新票数,而不是等 30s 下次轮询。
+   * 不传则不做任何额外刷新(适合详情页等不显示排名的场景)。
+   */
+  onVoteSuccess?: () => void;
+}
+
+/** 服务端拉一次 /api/me,把权威态灌进本地 store。用于跨设备状态对齐。 */
+async function refetchMe(
+  hydrateFromServer: (ids: string[]) => void,
+): Promise<void> {
+  try {
+    const res = await fetch("/api/me", { credentials: "include" });
+    const data = await res.json();
+    if (data?.ok && Array.isArray(data.data?.votedArtists)) {
+      hydrateFromServer(data.data.votedArtists as string[]);
+    }
+  } catch {
+    // 失败容忍 —— 下次页面交互或登录态变化会再同步
+  }
 }
 
 /**
  * 投票交互统一入口。
  *
- * 规则：
+ * 新规则:
- *  - 每用户每日总额度 = 10 票，跨艺人共享。无单艺人上限。
+ *  - 每用户终身 12 票,每位艺人最多 1 票,不限时,不可撤销
- *  - 未登录 → toast 提示并跳登录页
+ *  - 未登录 → toast 提示并跳登录弹窗
- *  - 已登录但当日票数已用完 → toast 提示，不打开弹窗
+ *  - 已投过该艺人 → toast 提示,不打开弹窗
- *  - 弹窗确认后：本地 store 立即扣减 + 调用后端 API（fire-and-forget）
+ *  - 12 票已用完 → toast 提示,不打开弹窗
+ *  - 弹窗确认后:乐观更新本地 + await 服务端写入
+ *  - 服务端拒绝 → 回滚本地 + 用 /api/me 重新对齐(跨设备真相源)
+ *  - API 200 后触发 opts.onVoteSuccess() —— 让排名相关页面立即 refresh,
+ *    解决"票数 +1 / Top12 排位要等 30s"的体感问题
  */
-export function useVoteAction(): UseVoteActionResult {
+export function useVoteAction(opts: UseVoteActionOpts = {}): UseVoteActionResult {
   const { status } = useSession();
   const recordVote = useVoteStore((s) => s.vote);
+  const rollbackVote = useVoteStore((s) => s.rollbackVote);
+  const hydrateFromServer = useVoteStore((s) => s.hydrateFromServer);
   const remaining = useVoteStore(selectRemaining);
+  const votedArtists = useVoteStore((s) => s.votedArtists);
   const openLogin = useLoginModalStore((s) => s.show);
   const [target, setTarget] = useState<Artist | null>(null);
 
@@ -50,48 +81,102 @@ export function useVoteAction(): UseVoteActionResult {
         setTimeout(openLogin, 350);
         return;
       }
+      if (votedArtists.includes(artist.id)) {
+        toast(`你已为 ${artist.name} 投过票了`);
+        return;
+      }
       if (remaining <= 0) {
-        toast("今日票数已用完，明天再来吧");
+        toast("你的 12 票已用完,感谢支持");
         return;
       }
       setTarget(artist);
     },
-    [status, openLogin, remaining],
+    [status, openLogin, remaining, votedArtists],
   );
 
   const closeVote = useCallback(() => setTarget(null), []);
 
   const confirmVote = useCallback(
-    async (artist: Artist, count: number) => {
+    async (artist: Artist) => {
-      // 1. 本地 store 立即扣减（包含额度校验）
+      // 1. 乐观更新本地(含已投/已满兜底校验)
-      const success = recordVote(artist.id, count);
+      const result = recordVote(artist.id);
-      if (!success) {
+      if (!result.ok) {
-        toast.error("今日票数不足");
+        if (result.reason === "already") {
+          toast.error(`你已为 ${artist.name} 投过票了`);
+        } else {
+          toast.error("你的 12 票已用完,感谢支持");
+        }
         setTarget(null);
         return;
       }
-      toast.success(`已为 ${artist.name} 投出 ${count} 票`);
+
+      // 乐观成功提示;若服务端拒绝再 dismiss + 报错
+      const remainingAfter = remaining - 1;
+      const successMsg =
+        remainingAfter === 0
+          ? `完成!你的 12 票已全部投出 ✦`
+          : `已为 ${artist.name} 投票 · 剩余 ${remainingAfter} 票`;
+      const successToastId = toast.success(successMsg, {
+        duration: remainingAfter === 0 ? 4000 : 2800,
+      });
       setTarget(null);
 
-      // 2. 后台 fire-and-forget 调用真实 API（5 秒超时，失败静默忽略）
+      // 2. await 服务端真实写入。失败 → 回滚 + 用 /api/me 对齐
       const ctrl = new AbortController();
-      const timer = setTimeout(() => ctrl.abort(), 5000);
+      const timer = setTimeout(() => ctrl.abort(), 8000);
-      fetch("/api/vote", {
+      try {
+        const res = await fetch("/api/vote", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ artistId: artist.id, count }),
+          body: JSON.stringify({ artistId: artist.id, count: 1 }),
           signal: ctrl.signal,
-      })
+          credentials: "include",
-        .catch(() => {})
+        });
-        .finally(() => clearTimeout(timer));
+        const data = await res.json().catch(() => null);
+
+        if (res.ok && data?.ok) {
+          // API 200 → 通知调用方(如首页)立即 refresh 排名,不等 30s 轮询
+          opts.onVoteSuccess?.();
+          return;
+        }
+
+        // 服务端拒绝 → 回滚乐观更新
+        rollbackVote(artist.id);
+        toast.dismiss(successToastId);
+
+        const code: string | undefined = data?.error?.code;
+        if (code === "ALREADY_VOTED") {
+          toast.error("你已在其他设备为该艺人投过票");
+        } else if (code === "QUOTA_EXHAUSTED") {
+          toast.error("你的 12 票已在其他设备投完");
+        } else if (code === "UNAUTHORIZED") {
+          toast.error("登录已失效,请重新登录");
+        } else if (code === "ACTIVITY_OFF") {
+          toast.error("投票活动暂未开放");
+        } else if (code === "RATE_LIMITED") {
+          toast.error("操作太快了,请稍后再试");
+        } else {
+          toast.error(data?.error?.message ?? "投票失败,请重试");
+        }
+
+        // 跨设备状态对齐:服务端永远是真相源
+        await refetchMe(hydrateFromServer);
+      } catch {
+        // 网络错误 / 超时 → 回滚 + 不强拉 /api/me(网络问题大概率也拉不到)
+        rollbackVote(artist.id);
+        toast.dismiss(successToastId);
+        toast.error("网络异常,投票未生效");
+      } finally {
+        clearTimeout(timer);
+      }
     },
-    [recordVote],
+    [recordVote, rollbackVote, hydrateFromServer, remaining, opts],
   );
 
   return {
     target,
     remaining,
-    dailyQuota: DAILY_VOTE_QUOTA,
+    totalQuota: TOTAL_VOTE_QUOTA,
     openVote,
     closeVote,
     confirmVote,

src/lib/api-response.ts

@@ -30,8 +30,10 @@ export const ERR = {
   VALIDATION: (msg: string) => err("VALIDATION", msg, 422),
   INTERNAL: (msg = "服务器错误") => err("INTERNAL", msg, 500),
   ACTIVITY_OFF: () => err("ACTIVITY_OFF", "投票活动暂未开放", 409),
-  QUOTA_EXHAUSTED: (msg = "今日票数已用完") =>
+  QUOTA_EXHAUSTED: (msg = "你的 12 票已全部投出,感谢支持") =>
     err("QUOTA_EXHAUSTED", msg, 409),
+  ALREADY_VOTED: (msg = "你已为该艺人投过票") =>
+    err("ALREADY_VOTED", msg, 409),
 };
 
 /**

src/lib/artist-bios.ts

@@ -0,0 +1,564 @@
+import type { ArtistTag } from "@/types/artist";
+
+/**
+ * 36 位真实艺人种子数据 · 来源：人物小传.docx
+ * 字段全部从 docx 提取；tags 是筛选用的运行时分类（非小传内容）。
+ */
+export interface ArtistSeed {
+  no: string;
+  name: string;
+  enName: string;
+  age: number;
+  gender: "M" | "F";
+  height: number;
+  tags: ArtistTag[];
+  motto?: string;
+  personality?: string;
+  catchphrase?: string;
+  skills?: string;
+  track?: string;
+  bio: string;
+}
+
+export const ARTIST_SEEDS: ArtistSeed[] = [
+  {
+    no: `001`,
+    name: `陈默`,
+    enName: `SIREN`,
+    age: 25,
+    gender: `M`,
+    height: 184,
+    tags: [`rock`] as ArtistTag[],
+    motto: `沉默蓄力，舞台绽放。`,
+    personality: `清冷寡言、内敛克制，不喜喧闹与无效社交，待人谦和温柔、分寸感十足。舞台上沉稳凌厉、爆发力拉满，全程沉浸音乐，用专业演绎传递摇滚态度`,
+    catchphrase: `嗯，知道了。`,
+    skills: `电吉他演奏、摇滚副唱、即兴 solo`,
+    track: `主音电吉他手、摇滚赛道`,
+    bio: `陈默天生不喜喧闹，习惯独处观察生活，久而久之便成了旁人眼中沉默寡言的少年。这份内敛让他拥有了远超同龄人的细腻洞察力，也让他习惯性将所有情绪藏于心底，不轻易外露。十七岁的盛夏，是他人生的重要转折点，一次偶然的街边演出，让他第一次听见重金属摇滚的炸裂音浪，激昂的电吉他旋律瞬间击穿了他平淡压抑的青春。自此，他彻底爱上了摇滚，开启了日复一日的练琴时光，没人知晓他独处时的拼命打磨，只看到他日渐精湛的琴技。为了诠释这份极致的音乐吸引力，他为自己取名 “SIREN”，以此致敬摇滚音乐自带的致命魅力。怀揣着对摇滚的赤诚，他带着专属电吉他扎根地下摇滚赛道，在无数次小型演出中积累舞台经验、打磨即兴 solo 能力。台下的他，始终保持着温柔克制的本性，待人细腻温和、低调内敛；可只要舞台灯光亮起，他便会彻底卸下沉静伪装，以极致炸裂的舞台爆发力掌控全场。`,
+  },
+  {
+    no: `002`,
+    name: `许则`,
+    enName: `ETHAN`,
+    age: 21,
+    gender: `M`,
+    height: 181,
+    tags: [`rock`] as ArtistTag[],
+    motto: `藏于人海，忠于舞台。`,
+    personality: `内向腼腆、安静疏离，极度不善社交，偏爱独处与二次元世界，心性敏感纯粹。舞台上野性张扬、气场凌厉，对节奏把控极致，爆发力拉满，全然释放压抑情绪`,
+    catchphrase: `别吵，练鼓。`,
+    skills: `架子鼓演奏、重型音乐演绎、双踩即兴`,
+    track: `架子鼓手、重型摇滚赛道`,
+    bio: `许则成长于书香门第，父母深耕学术领域，从小到大，他始终活在 “优秀学子” 的标签之下，被迫循规蹈矩，几乎没有自我表达的空间。性格内向的他不善社交，畏惧人群与热闹，习惯性避开所有人的目光，孤独成了他青春的常态。而二次元世界，是他唯一的避风港。高二那年，一次偶然的机会，他走进街边地下琴行，第一次握住鼓棒、触碰架子鼓，厚重炸裂的节奏瞬间击碎了他长久以来的压抑。他终于找到专属自己的宣泄方式，那些无法言说的委屈、压抑与不甘，都能通过鼓点肆意释放。自此，他彻底沉迷重型摇滚，每日放学后坚守琴行苦练，日复一日打磨双踩技巧、钻研重型音乐节奏，哪怕手指磨破、虎口反复结痂，也从未停歇，凭借极致的毅力练就了扎实的鼓技与超强的即兴能力。如今的他，拥有极致的双面人生：日常里，是戴着降噪耳机、沉默寡言的清冷大学生，低调内敛、不善交际；站上舞台，便会彻底挣脱束缚，化身野性张扬的舞台强者，狂暴有力的鼓点、极具张力的舞台状态，将积压多年的情绪尽数释放。于他而言，鼓声是救赎，是重生，让沉寂的灵魂得以热烈生长。`,
+  },
+  {
+    no: `003`,
+    name: `夏致`,
+    enName: `SUNNY`,
+    age: 22,
+    gender: `M`,
+    height: 183,
+    tags: [`pop`] as ArtistTag[],
+    motto: `心怀热忱，不负热爱。`,
+    personality: `阳光热忱、坦荡纯粹，元气开朗、待人亲和，是靠谱的邻家哥哥。舞台上松弛舒展、活力满满，感染力极强，用干净律动与温柔唱腔传递青春温度`,
+    catchphrase: `没问题，交给我！`,
+    skills: `木吉他弹唱、和声、唱跳`,
+    track: `节奏吉他手、校园流行赛道`,
+    bio: `夏致从小在体育大院长大，父亲是专业篮球教练，母亲是小学音乐老师，在这样的环境里，他既练就了一身运动细胞，也早早接触到了音乐。他曾是校篮球队的绝对主力，带领球队拿下过三次市级联赛冠军，是学校里小有名气的篮球校草。他的 “走红” 纯属意外，在校赛夺冠后的庆功宴上，穿着被汗水打湿的球衣、随手抱起队友的木吉他为大家弹唱了一首自己改编的民谣，被路人拍下上传到社交平台，收获了不少关注。视频中他那张自带盐系少年感的校草脸，配合毫无偶像包袱的灿烂笑容，瞬间治愈了很多人的夏天。作为典型的运动达人，夏致身上有着一种难得的纯粹。他拒绝了多家经纪公司的流水线包装和单独出道的邀约，坚持留在乐队担任节奏吉他手，只为守住那份最热血的校园流行情怀。他习惯在球场挥汗如雨后，背起吉他钻进排练室，用最干净的和声回应每一份期待。对他而言，生活从不是刻意经营的舞台，而是一场永远保持热忱、无距离感的邻家冒险。现在，这位元气满满的节奏掌控者，正带着他的阳光与律动，向更多人发出入场邀约。`,
+  },
+  {
+    no: `004`,
+    name: `陆友祁`,
+    enName: `WIFI`,
+    age: 20,
+    gender: `M`,
+    height: 174,
+    tags: [`hiphop`] as ArtistTag[],
+    motto: `随性而活，清醒自持。`,
+    personality: `活泼跳脱、鬼马通透，幽默随性、自带综艺感，看似玩世不恭实则清醒有分寸。舞台上灵动百变、松弛有度，节奏把控精准，风格多元不被定义，感染力十足`,
+    catchphrase: `笑死，这也太离谱了。`,
+    skills: `Rap 演唱、综艺控场、节奏吉他、大提琴`,
+    track: `鬼马主持担当、嘻哈融合赛道`,
+    bio: `陆友祁出身于正统的音乐世家，祖父是国内知名的大提琴演奏家，父母均是国家级交响乐团的成员，他从三岁起就被家人逼着学习大提琴，本该是穿着定制西装在音乐厅拉大提琴的贵公子，可他偏偏有一身 “反骨”。在枯燥的练琴时光里，他偷偷迷上了嘻哈音乐和脱口秀，常常躲在琴房里跟着视频学 Rap、练段子。在某次正儿八经的家族晚宴上，因为嫌弃背景音乐太催眠，他穿着一身挺括的西服，当众抄起一把破旧的贝斯，对着那群非富即贵的亲戚来了段极其松弛的 Rap 演唱，甚至还当场接梗造梗，把严肃的晚宴变成了大型脱口秀现场。这段反差感拉满的短视频被亲戚随手发到网上，让他在网络上收获了不少关注，被网友称为 “互联网嘴替”。作为搞笑担当，陆友祁在嘻哈融合赛道里完全是野蛮生长。他既能用大提琴拉出高级的音色，也能在后台一边吃着几块钱的冰棒一边跟粉丝直播唠嗑。对他而言，搞音乐不是为了 “起范儿”，纯粹是因为这儿能让他大声说话、自由蹦迪。这位活得通透的跳脱少年，正用他那毫无距离感的魅力，活得真实又自在。`,
+  },
+  {
+    no: `005`,
+    name: `苏恋和`,
+    enName: `LEON`,
+    age: 19,
+    gender: `M`,
+    height: 178,
+    tags: [`pop`] as ArtistTag[],
+    motto: `以温柔渡岁月，以初心赴长路。`,
+    personality: `温柔腼腆、干净纯粹，安静内敛、心思细腻，共情力极强。舞台上温柔且有力量，唱腔细腻走心、情绪饱满，沉浸式演绎安静却撼动人心`,
+    catchphrase: `谢谢你们呀。`,
+    skills: `流行演唱、吉他弹唱、流行曲创作`,
+    track: `主唱、日系抒情流行赛道、粉丝陪伴向内容`,
+    bio: `苏恋和成长于单亲家庭，母亲是一名急诊科护士，常年忙于工作，他从小就学会了独立照顾自己，也养成了温柔腼腆、心思细腻的性格。他的被发现，始于高二那年一个雨天，他在学校天台练习吉他弹唱的视频被同学偶然拍下。作为典型的 “日系初恋脸”，他总是带着几分腼腆与细腻，那种干净清澈的少年感，让他即便只是安静地坐着，也像是一封还未拆开的情书。为了和粉丝建立更紧密的连接，他在网络上坚持分享了 365 天的 “粉丝陪伴向” 弹唱记录，每一首歌都精准记录了当下的心情起伏，从考试失利的沮丧到吃到好吃甜品的开心，都毫无保留地分享给大家。这种真诚让他在粉丝眼中成为了无可替代的 “治愈系” 存在。虽然外表温润，但他极强的逻辑思维与专业创作力，让他不仅是一位歌者，更是灵魂创作者。如今，这位习惯用音乐传递细腻情感的少年，正带着他特有的抒情律动，从屏幕后走向聚光灯下。`,
+  },
+  {
+    no: `006`,
+    name: `傅希文`,
+    enName: `RYAN`,
+    age: 20,
+    gender: `M`,
+    height: 180,
+    tags: [`pop`] as ArtistTag[],
+    motto: `理性编曲，真诚赴乐。`,
+    personality: `清冷克制、沉稳自律，严肃理性、不喜客套，逻辑思维缜密，专注自我深耕。舞台上极致严谨、精准专业，摒弃情绪化表达，用理性逻辑承载细腻情绪，质感高级。`,
+    catchphrase: `逻辑上是这样的。`,
+    skills: undefined,
+    track: `键盘 / 编曲、智性向内容赛道`,
+    bio: `傅希文出生在一个理工科世家，父母都是大学的物理学教授，在家庭环境的熏陶下，他从小就展现出惊人的逻辑思维和数学天赋，是别人口中 “别人家的孩子”。他从小学开始学习钢琴，和其他孩子不同，他并不把音乐当成感性的艺术，而是将其视为一门严谨的科学。他在音乐圈的初次露面，源于一段在大学图书馆角落戴着耳机、用平板电脑推导复杂音程规律的侧拍视频。这种 “高智性学霸” 的清冷感，配合他键盘前修长而精准的手指，让他迅速在校园中走红，受到很多智性恋偏好者的喜爱。作为键盘手兼编曲者，他并不相信虚无缥缈的灵感，而更倾向于将情感拆解为严密的数学逻辑，通过精准的音程组合和节奏编排来表达情绪。在采访中，他那种自律克制、条理缜密的说话方式，总能让人感受到逻辑思维的魅力。对他而言，作曲是一场音符的推导，而舞台是唯一不需要证明的公理。`,
+  },
+  {
+    no: `007`,
+    name: `林星`,
+    enName: `STARRY`,
+    age: 24,
+    gender: `F`,
+    height: 171,
+    tags: [`rock`] as ArtistTag[],
+    motto: `于独处中沉淀，于舞台上生长。`,
+    personality: `外表疏离，慢热且极度社恐，不爱社交与客套。舞台上酷飒拽气场全开，私下敏感柔软，只对音乐与信任的人敞开心扉。`,
+    catchphrase: `别管我。`,
+    skills: `贝斯演奏、摇滚副唱、和声编写`,
+    track: `贝斯手、摇滚赛道`,
+    bio: `林星成长于规矩森严、管教严苛的传统家庭，父母秉持传统固化的教育理念，逼着她常年深耕古典乐器，日复一日的枯燥练习、条条框框的规矩束缚，压抑了她所有的天性与情绪，也让她养成了疏离寡言的性格，心底悄悄埋下了叛逆的种子。漫长压抑的青春里，她始终活在他人的期待里，习惯性封闭自我，对外始终保持着拒人千里的冷淡姿态。高中时期，是她人生的重要转折点，一次偶然的机会，她接触到摇滚音乐与贝斯乐器，乐器低沉厚重、充满力量的音色，瞬间击穿了她多年的压抑与桎梏，让她终于找到专属自己的情绪出口。自此，她开启了偷偷练琴、私下写和声的日子，避开家人的管控与反对，在无人知晓的角落深耕摇滚，用琴弦倾诉所有无法言说的情绪与不甘。成年后的她，彻底挣脱了家庭的固化安排，毅然独自闯荡，坚定奔赴热爱的摇滚舞台。平日里的她，极度慢热社恐，沉默寡言，习惯性与人保持距离，敏感柔软的内心只对音乐和极少数信任的人敞开。可一旦站上舞台，她便会彻底切换状态，褪去内敛怯懦，化身气场全开的酷飒贝斯手，她用炸裂的舞台表现力、极具态度的旋律，对抗过往的束缚与规训。于林星而言，贝斯不是简单的乐器，摇滚不是刻意的人设，而是她挣脱桎梏、表达自我、释放本心的唯一方式，是一个叛逆少女与世界温柔对抗的底气。`,
+  },
+  {
+    no: `008`,
+    name: `田糯`,
+    enName: `NORI`,
+    age: 18,
+    gender: `F`,
+    height: 165,
+    tags: [`pop`] as ArtistTag[],
+    motto: `心怀赤诚，向阳而生。`,
+    personality: `元气纯粹、热忱真诚，开朗灵动、笑容甜美，心性简单无城府，踏实努力上进。舞台上鲜活灵动、甜度满分，兼具温柔质感与高音爆发力，自带阳光治愈氛围感。`,
+    catchphrase: `哇，好棒！`,
+    skills: `流行唱跳、高音爆发、吉他弹唱`,
+    track: `乐队主唱 / 偶像、流行赛道`,
+    bio: `18 岁的田糯，出生在南方一个宁静的小镇，父母在镇上开了一家小卖部，家境普通但温馨和睦。她从小就展现出过人的音乐天赋，喜欢跟着电视里的歌曲哼唱，邻居们都叫她 “小百灵”。为了实现音乐梦想，她用攒了好几年的压岁钱买了一把二手吉他，每天放学写完作业后，就对着镜子练习弹唱和舞蹈。她曾是那个在南方小镇巷口，背着比自己还大的吉他盒赶车的普通女孩，周末会去镇上的集市表演，赚点零花钱补贴家用。一个在小镇集市举办的简陋歌唱比赛，她凭着 “灵动甜美” 的气质以及惊人的高音爆发力，演唱片段被传到网上后迅速走红。她身上那种接地气无距离感以及满满的元气，源于最真实的追梦热血。作为偶像主唱，田糯不仅拥有绝佳的舞台表现力，更有着一种能让观众 “多云转晴” 的治愈感染力。从宁静小镇到万众瞩目的舞台，不变的是那颗真诚感恩的初心。`,
+  },
+  {
+    no: `009`,
+    name: `蒋莎莎`,
+    enName: `SASA`,
+    age: 21,
+    gender: `F`,
+    height: 168,
+    tags: [`pop`] as ArtistTag[],
+    motto: `以实力立身，以专业立舞台。`,
+    personality: `飒爽直爽、干练果决，独立强势、自带拽姐气场，对待专业极致严谨自律。舞台上气场全开、掌控力拉满，唱功扎实爆发力强，临场应变顶尖，用实力锁定全场。`,
+    catchphrase: `再来一遍。`,
+    skills: `实力唱跳、高音演绎、欧美流行演唱`,
+    track: `主唱 / 高音担当、欧美流行赛道`,
+    bio: `蒋莎莎 16 岁时独自一人远赴韩国成为练习生，在严苛的训练体系下度过了整整五年。这五年里，她每天练习超过 12 个小时，经历过三次出道机会的落空，也曾因为高强度的训练累到晕倒在练习室，但她从未想过放弃。这段经历不仅练就了她过硬的唱跳实力，也塑造了她飒爽自信、永不言败的性格。她的出现，是音乐节现场一次令人印象深刻的 “意外补位”。在音响设备突发故障的极端环境下，凭借一副富有磁性的 “欧美大烟嗓” 直接清唱全场，极具穿透力的高音瞬间撕裂了嘈杂。那种飒爽自信、专业强势的临场感，让台下观众亲眼见证了她扎实的唱跳实力。她天生自带一种 “拽姐气场”，性格直爽、从不拖泥带水。作为主唱，她不仅是团队中的高音担当，更是舞台上的精神领袖。现在，这位性格火辣、实力硬核的舞台新人已准备就绪，即将用最直接的方式，定义属于她的黄金时代。`,
+  },
+  {
+    no: `010`,
+    name: `凌桀`,
+    enName: `AVRIL`,
+    age: 22,
+    gender: `F`,
+    height: 166,
+    tags: [`rock`] as ArtistTag[],
+    motto: `不被定义，不受束缚。`,
+    personality: `叛逆随性、个性鲜明，清冷不羁、不迎合世俗，自带朋克内核，拒绝循规蹈矩。舞台上野性张扬、张力拉满，风格锐利态度鲜明，用极具破坏性的演绎诠释摇滚精神。`,
+    catchphrase: `随便，无所谓。`,
+    skills: `朋克摇滚演唱、架子鼓手、电吉他演奏、词曲创作`,
+    track: `朋克摇滚主唱、欧美摇滚赛道`,
+    bio: `凌桀是中英混血，父亲是英国的摇滚乐队贝斯手，母亲是中国的美术老师，她从小在英国伦敦长大，在父亲的影响下，三岁就开始接触摇滚音乐，七岁学习电吉他，十岁就能独立创作简单的歌曲。她骨子里带着朋克摇滚的叛逆精神，不喜欢循规蹈矩的生活，16 岁时不顾家人反对，独自一人回到中国，在上海组建了自己的第一支地下朋克乐队。她第一次出现在大众视野是因一段在雨中废弃工厂进行的地下 live 路透。镜头里的她画着凌厉的眼线，手持电吉他，在简陋的架子鼓节奏中疯狂扫弦，那种 “混血甜酷感” 配合极具破坏性的舞台张力，瞬间点燃了评论区。生而叛逆、个性鲜明的她不仅是乐队的灵魂主唱，更是拥有极强词曲创作能力的先锋玩家。她拒绝被定义，更拒绝平庸的温和，所有的创作都带着一种撕裂空气的野性美。对凌桀而言，摇滚不是表演，而是她与生俱来的呼吸方式。`,
+  },
+  {
+    no: `011`,
+    name: `苏清沅`,
+    enName: `JANE`,
+    age: 20,
+    gender: `F`,
+    height: 168,
+    tags: [`chinese`, `pop`] as ArtistTag[],
+    motto: `以细节筑精品，以初心承国风。`,
+    personality: `温柔内向、细腻敏感，安静温婉、恬淡素雅，自带江南书香门第的古典气韵。舞台上极致严谨、精益求精，自带轻微舞台强迫症，用细腻国风旋律营造温柔氛围。`,
+    catchphrase: `麻烦你了。`,
+    skills: `钢琴演奏、古风演奏、国风编曲、抒情演唱`,
+    track: `键盘 / 和声、民乐担当、抒情流行赛道、国风赛道`,
+    bio: `苏清沅出生在江南苏州的书香门第，爷爷是著名的国画家，她从小在墨香与琴声中长大，四岁开始学习钢琴，六岁学习古筝，深受中国传统文化的熏陶，身上自带一种与生俱来的古典韵味。她的 “出圈”，源于一场民乐系毕业晚会的侧拍。20 岁的她一袭素衣坐在钢琴前，清冷易碎的 “淡颜小白花” 气质与指尖流淌出的古风编曲完美融合，被网友盛赞为 “校园清冷白月光”。虽然外表温柔内向，但苏清沅在专业上有着近乎偏执的 “舞台强迫症”：每一个音符的力度、每一次国风元素的切入、每一个舞台动作的细节，她都要求达到极致的精准。作为乐队的键盘与民乐担当，她不仅擅长钢琴，更能将古筝、竹笛等多种民乐元素巧妙融入现代编曲中。对她而言，音乐是她安静构建世界的砖瓦，每一个音符都承载着她细腻敏感的内心。`,
+  },
+  {
+    no: `012`,
+    name: `夏晚`,
+    enName: `WENDY`,
+    age: 30,
+    gender: `F`,
+    height: 173,
+    tags: [`jazz`] as ArtistTag[],
+    motto: `岁月沉淀温柔，旋律治愈人心。`,
+    personality: `松弛慵懒、温柔知性，成熟通透、从容淡然，历经岁月沉淀自带温润治愈质感。舞台上舒展随性、松弛自然，摒弃炫技与浮夸，用旋律叙事抒情，氛围感极致拉满。`,
+    catchphrase: `慢慢来，不着急。`,
+    skills: `萨克斯演奏、爵士演唱、即兴编曲`,
+    track: `萨克斯手、爵士 / 流行融合赛道`,
+    bio: `夏晚从小在香港的老街区长大，父亲是一名爵士乐手，在当地的酒吧驻唱多年，她从小听着港乐和爵士乐长大，耳濡目染之下爱上了这种充满故事感的音乐。大学时，她考入香港演艺学院主修爵士乐，专攻萨克斯演奏。毕业后，她没有进入主流乐坛，而是留在香港的爵士酒吧驻唱，这一唱就是八年。八年的驻唱生涯，让她积累了丰富的舞台经验，也形成了她松弛慵懒、娓娓道来的演唱风格。她的被关注，源于一段在深夜老街长镜头下的即兴萨克斯演奏。30 岁的她，身上有着一种岁月沉淀后的松弛慵懒，举手投足间尽是港风电影里的复古氛围感，被网友称赞为氛围感十足。夏晚并不追求炫技，她更擅长用萨克斯的叙事感填充音乐里的留白，将爵士与流行完美融合。她大气专业的舞台状态，从不是刻意表演，而是与听众分享岁月里的遗憾与和解。对夏晚而言，舞台不需要喧嚣，只需一盏暖光。`,
+  },
+  {
+    no: `013`,
+    name: `虞浓`,
+    enName: `LYDIA`,
+    age: 28,
+    gender: `F`,
+    height: 172,
+    tags: [`rock`] as ArtistTag[],
+    motto: `以锋芒立舞台，以真诚待世人。`,
+    personality: `明艳大气、爽朗通透，可盐可甜、坦荡豁达，待人真诚大方，自带异域氛围感。舞台上掌控力十足、表现力超强，气场张扬自带焦点，既能驾驭摇滚也能演绎温柔。`,
+    catchphrase: `放心，交给我。`,
+    skills: `摇滚主唱、贝斯演奏、舞台门面把控`,
+    track: `颜值赛道/摇滚主唱、流行摇滚赛道`,
+    bio: `虞浓是来自新疆乌鲁木齐的维吾尔族姑娘，从小在能歌善舞的民族氛围中长大，天生拥有过人的艺术天赋和舞台表现力。18 岁独自远赴北京闯荡，凭借优越的浓颜五官和高挑身材成为平面模特，深耕时尚杂志与广告拍摄，积累了极强的镜头感和时尚气场。但她始终怀揣着音乐梦想，尤其痴迷硬核流行摇滚，偶然一次地下 live 演出彻底坚定了她转型的决心。她从零开始深耕贝斯与声乐，日复一日泡在排练室打磨技艺，摒弃模特光环潜心深耕音乐领域。她因一组音乐节雨后后台生图在网络上收获了大量关注，明艳浓烈的异域五官、大气张扬的气质，瞬间俘获了很多人的目光。看似惊艳的颜值是她的舞台门面，扎实的摇滚功底才是她的核心底气。站上舞台的她掌控力十足，拨动琴弦、开嗓演唱的瞬间便能锁定全场视线，可盐可甜的性格反差，让她既能驾驭炸裂的摇滚舞台，也能温柔亲和地与粉丝互动。对虞浓而言，异域风情只是她的点缀，深耕热爱、肆意发光的摇滚灵魂，才是她征服舞台的终极底气。`,
+  },
+  {
+    no: `014`,
+    name: `温知予`,
+    enName: `YUKI`,
+    age: 23,
+    gender: `F`,
+    height: 166,
+    tags: [`chinese`] as ArtistTag[],
+    motto: `静水流深，初心不改。`,
+    personality: `清冷温婉、安静纯粹，恬淡内敛、温润素雅，自带江南古韵仙气，不慕浮华喧嚣。舞台上沉稳从容、气韵独特，摒弃浮夸动作，用古典底蕴碰撞流行，故事感十足。`,
+    catchphrase: `好，知道了。`,
+    skills: `大提琴演奏、竖琴演奏、抒情演唱`,
+    track: `大提琴手 / 抒情主唱、古典跨界赛道`,
+    bio: `温知予出生在浙江杭州的艺术世家，长辈深耕昆曲与古典音乐领域，自幼浸润在江南古韵与优雅旋律之中，三岁习竖琴，五岁练大提琴，多年的深耕沉淀出一身温润清冷的古典气质。她毕业于中央音乐学院大提琴专业，科班功底扎实，却不局限于古典音乐的固有框架。一段江南古桥细雨中的大提琴即兴演奏视频，让她意外出圈，温柔温婉的姿态、仙气十足的气质，搭配悠扬治愈的旋律，成为很多人心中的清冷白月光。她始终低调纯粹，拒绝流水线影视邀约与商业包装，一心深耕古典与现代音乐的跨界融合。在乐队中，她以大提琴的深沉搭配竖琴的灵动，中和现代旋律的凌厉，用温柔细腻的唱腔赋予歌曲别样的故事感。她的舞台从不用夸张的动作博眼球，仅凭音符与气质便能治愈人心，用古典底蕴碰撞现代流行，走出独属于自己的长线音乐之路。`,
+  },
+  {
+    no: `015`,
+    name: `韩臻臻`,
+    enName: `JOJO`,
+    age: 30,
+    gender: `F`,
+    height: 169,
+    tags: [`pop`] as ArtistTag[],
+    motto: `实力为基，坚持为翼。`,
+    personality: `飒爽沉稳、低调务实，成熟干练、内敛谦和，对待音乐极致严谨，坚守初心。舞台上专业度拉满、气场稳重从容，唱功全能发挥稳定，兼具力量感与共情力。`,
+    catchphrase: `我们可以的。`,
+    skills: `流行主唱、高音演唱、词曲创作`,
+    track: `实力主唱、流行赛道`,
+    bio: `韩臻臻自幼展露极致声乐天赋，六岁接受专业声乐训练，十岁便能轻松驾驭高音 C，被业内导师誉为极具潜力的声乐奇才。16 岁登台参加全国青年歌手大奖赛，凭借原创高难度曲目一举夺冠，年少成名。她对待音乐极致严谨，每一首作品都反复打磨、精修细节，绝不敷衍流水线创作。多年舞台历练，让她拥有极强的临场应变能力和舞台掌控力，高音通透有力、共情细腻，既能驾驭大气恢弘的曲风，也能演绎温柔细腻的抒情旋律。她以初心坚守音乐本心，持续用极具穿透力的嗓音，书写属于实力派歌手的音乐之路。`,
+  },
+  {
+    no: `016`,
+    name: `黎抒`,
+    enName: `LEE`,
+    age: 28,
+    gender: `F`,
+    height: 170,
+    tags: [`folk`] as ArtistTag[],
+    motto: `随心而往，随乐而行。`,
+    personality: `独立通透、随性淡然，安静文艺、清冷松弛，待人真诚坦荡，不刻意迎合世俗。舞台上温柔有力量、叙事感十足，嗓音独特辨识度高，用纯粹民谣治愈人心。`,
+    catchphrase: `ok，都一样。`,
+    skills: `民谣 / 流行演唱、词曲创作、吉他演奏`,
+    track: `创作主唱、独立民谣赛道`,
+    bio: `黎抒是中文系出身，毕业后入职出版社担任文学编辑，过着安稳规整的朝九晚五生活。但骨子里热爱自由、偏爱文字与旋律的她，始终不甘于被平淡的生活束缚。25 岁那年，她毅然辞去稳定工作，背着一把木吉他开启流浪之旅，走遍南方大小城市，在街边酒馆、小众清吧驻唱，把沿途的烟火人间、离别重逢、细碎情绪全部写进歌词。广州小酒馆的一次突发停电，黑暗之中她淡然落座，一把木吉他、一副独特沙哑的嗓音，清唱原创民谣，温柔又清冷的氛围感打动了很多网友。深耕独立民谣赛道的她，拒绝迎合主流市场，不做流水线情歌，只唱真实生活、真心感悟。作为乐队创作主唱，她包揽大量词曲创作，文字功底加持下的歌词细腻有深度，独特声线极具辨识度，安静温柔却充满力量，用最纯粹的民谣旋律，治愈每一个向往自由、心怀故事的听众。`,
+  },
+  {
+    no: `017`,
+    name: `楚瑶瑶`,
+    enName: `CRYSTAL`,
+    age: 26,
+    gender: `F`,
+    height: 164,
+    tags: [`folk`] as ArtistTag[],
+    motto: `以温柔治愈世界，以善意温暖岁月。`,
+    personality: `温柔暖心、耐心纯粹，温和柔软、接地气，共情力极强，自带邻家姐姐治愈气场。舞台上舒缓温柔、治愈感拉满，用轻柔琴声与温润和声抚平情绪，氛围松弛温暖。`,
+    catchphrase: `没事的，都会好的。`,
+    skills: `键盘演奏、和声、粉丝陪伴向内容`,
+    track: `键盘 / 和声、治愈系流行赛道`,
+    bio: `楚瑶瑶毕业于师范大学音乐系，毕业后成为一名小学音乐代课老师，长期陪伴孩子成长的经历，让她始终保持温柔纯粹、耐心治愈的性格。任教期间，她发现很多学生因学业压力陷入焦虑、情绪低落，便开始尝试创作舒缓温暖的原创旋律，在课堂上教孩子们演唱，用音乐治愈少年心事。后来她将自己的原创弹唱、温柔和声片段发布在网络平台，慢慢积累人气。她没有炸裂的舞台噱头，没有华丽的包装，仅凭长达一年的深夜直播陪伴、温柔细腻的琴声与歌声，陪伴和治愈了很多熬夜、焦虑、内耗的网友。自带邻家姐姐的亲和力，接地气、无距离感，是粉丝心中最温暖的情绪港湾。她擅长键盘演奏与和声编写，用温柔的旋律中和歌曲的凌厉感，为每一首作品注入温暖底色，坚守治愈系音乐赛道，用音乐传递温柔与力量。`,
+  },
+  {
+    no: `018`,
+    name: `仇甯`,
+    enName: `LYNN`,
+    age: 27,
+    gender: `F`,
+    height: 171,
+    tags: [`rock`] as ArtistTag[],
+    motto: `严于律己，温柔待人。`,
+    personality: `外冷内热、严谨自律，清冷寡言、低调内敛，对专业极致严苛，责任心极强。舞台上甜酷反差、张力十足，将舞蹈功底融入摇滚，唱跳编排质感拉满，表现力出彩。`,
+    catchphrase: `别偷懒，认真点。`,
+    skills: `架子鼓演奏、贝斯演奏、舞台编舞、唱跳演绎`,
+    track: `贝斯手、唱跳摇滚赛道`,
+    bio: `仇甯自幼深耕舞蹈领域，12 岁考入北京舞蹈学院附中专修现代舞，18 岁成为国内顶尖职业舞团的舞者，多年严苛的舞蹈训练，练就了她极致的体态线条、扎实的舞台功底和偏执的专业态度，常年稳居排练室最晚离场名单，被同行称作 “练功狂人”。本该深耕舞蹈舞台的她，却因一次演出意外膝盖重伤，被迫告别高强度舞蹈表演，打碎了多年的职业梦想。低谷期的她偶然接触摇滚音乐，被贝斯的沉稳厚重、架子鼓的强劲节奏深深治愈，从此开启跨界之路，从零开始自学贝斯与架子鼓。深夜排练室独自练琴调试的侧拍视频意外出圈，清冷疏离的神态、优越的体态线条、专注认真的模样收到很多人点赞。她将多年舞蹈功底融入摇滚舞台，独创极具张力的唱跳编排，对舞台细节极致严苛，为团队舞台质感保驾护航，用硬核的舞台实力，活出独属于自己的飒爽锋芒。`,
+  },
+  {
+    no: `019`,
+    name: `方凌`,
+    enName: `FANNY`,
+    age: 29,
+    gender: `F`,
+    height: 167,
+    tags: [`chinese`] as ArtistTag[],
+    motto: `以匠心传国风，以坚守续传统。`,
+    personality: `温婉古典、清冷雅致，沉稳内敛、低调专注，自带正统民乐气韵，匠心纯粹坚定。舞台上专业极致、匠心满满，演奏沉稳精准，打破传统与现代壁垒，尽显国风温柔力量。`,
+    catchphrase: `再练习一次好吗？`,
+    skills: `二胡演奏、长笛演奏、国风编曲、古风演唱`,
+    track: `民乐担当、国风古典赛道`,
+    bio: `方凌出身正统民乐世家，父母均为国家级民乐演奏家，四岁便开启练琴生涯，每日坚持六小时以上专业训练，数十年从未间断，基本功扎实到极致。18 岁考入中央音乐学院民乐系，毕业后进入中国广播民族乐团，成为乐团里年轻的二胡演奏者，常年参与国内外巡演，深耕正统民乐演奏多年，斩获不少专业奖项。常年的正统民乐熏陶，造就了她温婉清冷、严谨雅致的古典气质。但不甘于固守传统的她，厌倦了千篇一律的复刻演出，一心想要打破民乐与流行音乐的壁垒，让传统国风被更多年轻人看见。一次巡演后台校音花絮意外走红，她古典雅致的气质，收获大批国风爱好者关注。随后她致力于将二胡、长笛等传统民乐乐器与现代编曲融合，深耕国风改编与原创，以极致专业的态度，让传统民乐在新时代舞台焕发全新生机。`,
+  },
+  {
+    no: `020`,
+    name: `尹卓曜`,
+    enName: `ROY`,
+    age: 29,
+    gender: `M`,
+    height: 185,
+    tags: [`rock`] as ArtistTag[],
+    motto: `自由为魂，热爱为骨。`,
+    personality: `随性洒脱、痞帅温柔，自由不羁、不受拘束，自带港风复古慵懒质感，豁达通透。舞台上松弛感拉满、随性张扬，即兴演奏灵动炸裂，曲风醇厚复古，感染力极强。`,
+    catchphrase: `OK啦`,
+    skills: `主音吉他演奏、单簧管演绎、港风歌曲演绎、即兴 solo`,
+    track: `主音吉他手、港风复古摇滚赛道`,
+    bio: `尹卓曜成长于香港老街区，自幼浸润在黄金时代港乐与复古摇滚的氛围中，家中收藏大量经典老唱片与磁带，早早埋下音乐热爱的种子。少年时期的他洒脱不羁，偏爱机车改装与街头自由氛围，高中毕业后深耕机车改装行业，同时与志同道合的好友组建地下乐队，专职担任主音吉他手，常年游走于香港街头酒吧、露天街头演出。他不被刻板规则束缚，偏爱自由随性的舞台风格，擅长将复古港风旋律与摇滚律动结合，还自学单簧管，将小众乐器音色融入原创编曲，打造独属于自己的复古摇滚风格。一场暴雨后的街头义演路透，让他收获了不少关注，机车上随性弹吉他的模样，痞帅松弛的港风气质、自由狂野的舞台状态，瞬间击中很多路人。他的舞台从无刻意设计，全程松弛自然，即兴 solo 灵动炸裂，始终坚守自由热血的摇滚初心，用复古旋律致敬港乐黄金时代。`,
+  },
+  {
+    no: `021`,
+    name: `温景然`,
+    enName: `KINGSTON`,
+    age: 27,
+    gender: `M`,
+    height: 178,
+    tags: [`pop`] as ArtistTag[],
+    motto: `默默深耕，极致求精。`,
+    personality: `温润儒雅、沉稳低调，内敛谦和、温润通透，不爱张扬造势，做事踏实细致。舞台上专注极致、细腻走心，编曲演奏精准深情，擅长用温柔旋律勾勒情绪，共情力强。`,
+    catchphrase: `我来吧。`,
+    skills: `钢琴演奏、音乐制作、作曲编曲`,
+    track: `音乐制作人、钢琴演奏、抒情流行赛道`,
+    bio: `温景然年少展露极致音乐天赋，三岁学钢琴，十岁独立完成原创作曲，音乐感知力与创作天赋远超同龄人。本科考入中央音乐学院音乐制作专业，科班功底扎实，毕业后入职国内唱片公司，从事幕后编曲制作多年，是业内小有名气的音乐制作人。他为人低调内敛，极少公开露面，常年隐身幕后。一场颁奖礼突发演奏嘉宾缺席事故，作为幕后编曲的他临时救场，一袭西装端坐钢琴前，行云流水的即兴独奏、温润儒雅的气质引发热捧。作为音乐制作人，他擅长把控编曲、作曲与音乐质感，偏爱细腻治愈的抒情流行曲风，擅长用精准的乐理编排勾勒细腻情绪。沉稳温柔的性格、顶级的专业实力，让他成为团队最可靠的灵魂核心。`,
+  },
+  {
+    no: `022`,
+    name: `林铮`,
+    enName: `CHAIN`,
+    age: 33,
+    gender: `M`,
+    height: 186,
+    tags: [`rock`] as ArtistTag[],
+    motto: `以担当护团队，以真诚待伙伴。`,
+    personality: `沉稳可靠、幽默豁达，真诚坦荡、接地气，责任心极强，是团队的定心丸。舞台上稳重笃定、掌控全局，贝斯律动扎实稳健，统筹守护团队，低调靠谱担当十足。`,
+    catchphrase: `有我呢。`,
+    skills: `贝斯演奏、编曲制作、团队统筹`,
+    track: `队长 / 贝斯手、摇滚 / 流行赛道`,
+    bio: `土生土长的东北人林铮，18 岁应征入伍，五年武警军旅生涯，磨练出坚韧沉稳的意志、极强的责任心与绝佳的团队统筹能力，自带一身正直可靠的硬汉气质。退伍后，他从事健身教练工作，同时始终坚守年少热爱，自学贝斯演奏，深耕摇滚音乐领域，和好友组建乐队并担任队长。多年军旅生涯造就了他雷厉风行、靠谱稳重的处事风格，同时自带东北人天生的幽默豁达，待人真诚接地气，是团队公认的定海神针。一场户外义演的设备突发故障，现场支架即将倾倒，他单手稳稳稳住设备，从容安抚全场观众，冷静靠谱的救场画面在网络上传播，收获了少量粉丝。作为乐队队长与贝斯手，他统筹团队大小事务，把控舞台安全与作品质量，深耕摇滚与流行融合曲风，用沉稳的贝斯律动稳住全队节奏，以极强的责任感，守护团队稳步前行。`,
+  },
+  {
+    no: `023`,
+    name: `高翊宸`,
+    enName: `ALSTON`,
+    age: 30,
+    gender: `M`,
+    height: 184,
+    tags: [`pop`] as ArtistTag[],
+    motto: `以艺术为信仰，以专业为基石。`,
+    personality: `温润贵气、专业严谨，儒雅通透、谦和有礼，对待艺术心怀敬畏，不慕浮华。舞台上端庄雅致、表现力高级，美声跨界兼具力量与美感，舞台叙事感饱满，质感拉满。`,
+    catchphrase: `完美。`,
+    skills: `美声高音演唱、音乐剧跨界、小提琴演奏`,
+    track: `高音担当 / 主唱、音乐剧跨界赛道`,
+    bio: `高翊宸出身艺术世家，自小浸泡在正统古典艺术氛围中，三岁启蒙小提琴，五岁系统学习美声唱法，从小接受严苛的艺术训练，深耕古典艺术领域二十余年，练就了极致扎实的科班功底与端正雅致的艺术气质。他自幼对艺术怀揣极致敬畏之心，做任何演绎、练习都力求精益求精，从不敷衍潦草，常年的打磨让他拥有了精准到极致的艺术感知力。私下的他温润谦和、低调内敛，待人处事分寸得当，自带温润端庄的青年艺术家风骨。剧院中，他兼具力量与细腻的美声跨界演绎，流畅高级的舞台叙事感，让无数观众感受到古典艺术与流行音乐融合的独特魅力。深耕音乐剧与美声跨界赛道的他，打破了古典艺术小众固化的壁垒，摒弃传统美声的刻板厚重，将轻盈的流行律动、细腻的情感表达融入正统唱法之中。站上舞台的他端庄大气、气场雅致，他以正统艺术底蕴赋能现代舞台，用跨界演绎让古典艺术焕发新生，凭极致专业的舞台素养，成为圈内小众且优质的实力派新人。`,
+  },
+  {
+    no: `024`,
+    name: `江驰`,
+    enName: `CHILL`,
+    age: 26,
+    gender: `M`,
+    height: 179,
+    tags: [`hiphop`] as ArtistTag[],
+    motto: `音乐无国界，潮流我定义。`,
+    personality: `潮酷随性、阳光痞帅，开朗洒脱、真诚坦荡，审美前卫独到，创意十足。舞台上活力四射、气场全开，Rap 节奏精准炸裂，架子鼓充满力量，先锋编曲自带国际质感。`,
+    catchphrase: `酷。`,
+    skills: `Rap 演唱、架子鼓手、先锋编曲、舞台设计`,
+    track: `Rapper / 先锋制作人、国际流行赛道`,
+    bio: `江驰出生于美国洛杉矶的华人家庭，自幼浸润在多元国际文化氛围中，深受欧美嘻哈、先锋流行音乐熏陶。十岁专攻架子鼓，十五岁便能登台洛杉矶地下 Livehouse 演出，是当地小有名气的新生代华人鼓手，常年接触国际前沿的音乐制作与舞台设计理念，审美与实力接轨国际。24 岁，他选择回国发展，立志将海外先锋音乐理念与华语音乐融合，打破本土音乐的风格壁垒。一场街头即兴 Rap Battle 现场，他无彩排即兴控场，节奏切分新潮炸裂，阳光痞帅的气质、潮酷十足的舞台风格，收获了不少年轻粉丝的关注。他身兼 rapper、鼓手、先锋制作人多重身份，亲自打磨编曲、舞台设计、舞台演绎，拒绝流水线套路，主打新潮、先锋、国际化的音乐风格，用顶级的舞台实力与创新思维，打造年轻化、潮流化的华语流行新形态。`,
+  },
+  {
+    no: `025`,
+    name: `曾辙`,
+    enName: `JACK`,
+    age: 28,
+    gender: `M`,
+    height: 176,
+    tags: [`folk`] as ArtistTag[],
+    motto: `声音有温度，音乐有力量。`,
+    personality: `温柔沉稳、高情商通透，谦和内敛、待人真诚，善于体察情绪，是团队情绪粘合剂。舞台上温润治愈、共情力极强，唱腔醇厚磁性，和声细腻和谐，仅凭歌声打动人心。`,
+    catchphrase: `别急，慢慢来。`,
+    skills: `实力演唱、和声编写、抒情演绎`,
+    track: `主唱 / 和声担当、治愈系流行赛道`,
+    bio: `曾辙毕业于中国传媒大学播音主持专业，拥有极佳的声线条件与语言共情力，毕业后任职深夜电台配音主播，多年深夜播音经历，让他的声线温润醇厚、自带治愈质感，常年陪伴无数失眠听众。工作之余，他始终尝试声乐与和声编写，利用业余时间打磨唱功、创作原创歌曲，唱功扎实、共情力极强。一场户外直播突发设备故障，现场嘈杂混乱，他仅凭一段纯净温柔的和声，瞬间抚平全场躁动。他是擅长捕捉细腻情绪，将平凡的歌词与旋律演绎出满满的画面感，深耕治愈系流行赛道，不追求炸裂噱头，只用温柔纯粹的歌声治愈人心。`,
+  },
+  {
+    no: `026`,
+    name: `范智演`,
+    enName: `CY`,
+    age: 30,
+    gender: `M`,
+    height: 178,
+    tags: [`pop`] as ArtistTag[],
+    motto: `颠覆传统，创造未来。`,
+    personality: `特立独行、先锋前卫，清冷孤傲、不随波逐流，对艺术有极致追求，创意大胆。舞台上张力拉满、极具颠覆性，电音制作先锋炸裂，舞台设计冲击力强，视听体验极致。`,
+    catchphrase: `炸了。`,
+    skills: `电音制作、鼓手、Rap 演唱、舞台艺术设计`,
+    track: `音乐总监 / 制作人、先锋电音赛道`,
+    bio: `范智演自幼兼具美术与音乐双重艺术天赋，对视觉、听觉艺术拥有极致敏锐的感知力。大学远赴德国留学，深耕先锋艺术与电子音乐制作，潜心研究极简主义与暴力美学的艺术融合，曾亮相欧洲先锋艺术周，是业内极具辨识度的新锐视觉导演与音乐制作人。他的艺术风格极具颠覆性，擅长打破常规、解构传统，打造极具冲击力的先锋作品。一场午夜先锋 live 秀，他操控鼓棒与采样器，将破碎的电音底噪与炸裂的说唱节奏完美融合，癫狂又极致专业的舞台状态、先锋潮流的艺术质感，受到了大批先锋乐迷的关注。加入乐队担任音乐总监后，他全权把控团队音乐风格与舞台视觉设计，对音色、节奏、舞台细节偏执苛求，擅长解构重组音轨，打造独一无二的先锋电音风格。他不迎合大众主流审美，坚持自我先锋艺术理念，用超强的创作能力与舞台审美，引领小众潮流音乐出圈。`,
+  },
+  {
+    no: `027`,
+    name: `周新宇`,
+    enName: `JOE`,
+    age: 29,
+    gender: `M`,
+    height: 178,
+    tags: [`pop`] as ArtistTag[],
+    motto: `用音乐记录都市，用旋律治愈孤独。`,
+    personality: `沉稳内敛、低调务实，理性通透、思维缜密，兼具程序员严谨与音乐人感性。舞台上专注投入、氛围感十足，词曲贴近都市生活，用旋律讲述喜怒哀乐，代入感极强。`,
+    catchphrase: `我试试。`,
+    skills: `词曲创作、吉他演奏、音乐制作`,
+    track: `全能制作人、都市流行赛道`,
+    bio: `周新宇本科攻读计算机专业，毕业后成为一名程序员，深耕互联网行业。但他从未放弃自幼热爱的音乐，利用下班、深夜的碎片化时间，自学吉他、词曲创作、后期混音，从零搭建个人小型音乐工作室，被圈内人称作 “深夜搬砖音乐人”。常年的都市职场生活，让他深谙当代年轻人的压力与孤独，创作灵感大多源于真实的都市烟火。他因发起 “一人成军” 创作挑战受到关注，狭小的出租屋内，他独自包揽词曲、演奏、后期全流程，融入地铁、雨夜、街道等真实城市白噪音，打造极具代入感的都市流行旋律。他凭借顶级的全能创作能力，主打生活化、共情力极强的都市流行曲风，拒绝流水线模板化创作，每一首作品都扎根现实、贴近人心，用细腻的旋律，讲述当代都市人的喜怒哀乐。`,
+  },
+  {
+    no: `028`,
+    name: `刘影`,
+    enName: `SHADOW`,
+    age: 38,
+    gender: `F`,
+    height: 170,
+    tags: [`pop`] as ArtistTag[],
+    motto: `音乐是灵魂的栖息地。`,
+    personality: `清冷疏离、特立独行，安静淡然、不慕名利，厌倦商业化束缚，偏爱山野生活。舞台上空灵治愈、仙气十足，嗓音天籁极具辨识度，另类摇滚演绎充满生命力。`,
+    catchphrase: `随缘。`,
+    skills: `流行演唱、词曲创作、空灵抒情演绎`,
+    track: `抒情主唱、长线 IP 赛道`,
+    bio: `刘影曾是华语乐坛黄金时代出道的歌手，19 岁正式出道，凭借独一无二的空灵天籁嗓音、小众高级的音乐风格收获了一些关注，留下过传唱度较高的歌曲。事业上升期的她，厌倦了流量内卷与规则束缚，毅然选择淡出乐坛，隐居大理山野，远离喧嚣浮华，潜心沉淀自我、打磨音乐心境。隐居多年，她极少公开露面，唯一的动态是一段深山溶洞无伴奏清唱视频，纯天然的空灵嗓音、不带烟火气的纯粹唱腔，搭配自然水声回响，让无数老粉与文艺爱好者为之动容，悄然回归大众视野。她坚持原创、坚守艺术本心，不迎合流量、不妥协市场，用空灵治愈的声线，打造长线艺术生命力。`,
+  },
+  {
+    no: `029`,
+    name: `君墨`,
+    enName: `CHAO`,
+    age: 37,
+    gender: `F`,
+    height: 172,
+    tags: [`chinese`, `rock`] as ArtistTag[],
+    motto: `以戏曲为根，以摇滚为魂。`,
+    personality: `英气沉稳、专业严谨，坚韧独立、做事认真，自带戏曲端庄气场，敢于跨界突破。舞台上气场全开、英气逼人，越剧与摇滚完美融合，雌雄莫辨的气场极具颠覆性。`,
+    catchphrase: `可。`,
+    skills: `越剧演唱、架子鼓演奏、国风编曲`,
+    track: `国风担当、国风摇滚赛道`,
+    bio: `君墨出身绍兴越剧世家，母亲是国家级越剧表演艺术家，自幼泡在剧团长大，耳濡目染深耕戏曲艺术，15 岁正式拜师学戏，专攻小生反串，身段利落、唱腔醇厚，年纪轻轻便成为剧团台柱子，是业内公认的越剧新星。看似深耕传统戏曲的她，骨子里藏着极致的叛逆与热爱，私下痴迷摇滚音乐，无人教导便凭着极致的自律与专业，自学架子鼓、国风编曲，默默探索戏曲与摇滚的融合之路。一次下乡公益演出，现场伴奏设备突发故障，舞台中断，她临场应变，褪去戏袍、卸下戏曲妆容，手持鼓棒即兴敲出强劲摇滚节奏，将经典越剧唱段与硬核摇滚旋律完美融合，雌雄莫辨的英气气场、颠覆性的舞台演绎，让在场的所有人印象深刻。自此，她彻底打破传统戏曲与现代音乐的壁垒，走出独一无二的国风摇滚跨界之路。`,
+  },
+  {
+    no: `030`,
+    name: `李叙`,
+    enName: `SEAN`,
+    age: 28,
+    gender: `M`,
+    height: 176,
+    tags: [`folk`] as ArtistTag[],
+    motto: `平凡日子里，也有温柔回响。`,
+    personality: `温和沉稳、接地气通透，内敛真诚、高情商，深谙普通人辛酸，习惯平视生活。舞台上温暖治愈、共情力极强，嗓音自带生活磨砺质感，用简单旋律戳中内心柔软。`,
+    catchphrase: `好的。`,
+    skills: `民谣弹唱、词曲创作、木吉他演奏`,
+    track: `民谣主唱、都市治愈民谣赛道`,
+    bio: `李叙大学毕业后，进入一家互联网公司做产品经理，一做就是五年。这五年里，他每天过着 996 的生活，加班到深夜是家常便饭，经历过无数次的项目改稿和职场内卷，深知社畜的辛酸与不易。为了排解工作和生活的压力，他开始自学吉他，把自己的经历和感受写进歌里。他的故事没有奇迹，只有共鸣：他没有在专业的录音棚，而是在合租房窄小的阳台上，就着路灯的光，抱着那把边角磨损的木吉他，用那副自带生活磨砺感的温暖烟嗓，平淡地唱出一句关于 “下班后在车里发呆” 的原创歌词，戳中了无数社畜内心最隐秘的孤独。他亲自操刀词曲创作，坚持保留音乐里那份最原始的呼吸感，用最简单的旋律，为每一个在深夜里自我怀疑的灵魂，点燃一盏不必太亮却足够暖心的灯。`,
+  },
+  {
+    no: `031`,
+    name: `金晓璐`,
+    enName: `KIM`,
+    age: 31,
+    gender: `F`,
+    height: 168,
+    tags: [`pop`] as ArtistTag[],
+    motto: `以琴为始，以歌为终。`,
+    personality: `温婉大气、低调谦和，沉稳内敛、待人真诚，毫无明星架子，亲和力拉满。舞台上从容优雅、气场温润，钢琴演奏行云流水，将古典功底与流行完美融合。`,
+    catchphrase: `谢谢。`,
+    skills: `流行演唱、钢琴演奏`,
+    track: `主唱 / 键盘手、经典流行赛道`,
+    bio: `金晓璐出生在一个钢琴世家，父亲是著名的钢琴教育家，母亲是钢琴演奏家。她三岁开始学习钢琴，五岁登台演出，十岁获得全国钢琴比赛冠军，被誉为 “钢琴神童”。长大后，她成为了一名职业钢琴演奏家，在国内外举办过多场个人独奏音乐会，是业内公认的实力派钢琴家。但她内心一直渴望尝试不同的音乐风格，不满足于只演奏古典音乐。她的转折点发生在一次极其 “失态” 的意外：在某次严肃的古典音乐会现场，面对台下昏昏欲睡的观众，她突然中断了练习过万次的肖邦，转而用那副被乐评人称为 “温婉大气” 却暗藏力量的嗓音，即兴拆解了一段流行金曲。这种对规则的低调真诚反击，让她在社交媒体上凭借极具辨识度的经典淡颜感，收获了大量关注。她不再甘于只做背景板，而是以另一种身份重回经典流行赛道，比起精致的滤镜，她更愿意展示自己在琴房练到指尖红肿的真实，用成熟女性的韧性，重新定义自己的音乐之路。`,
+  },
+  {
+    no: `032`,
+    name: `莫晴`,
+    enName: `MOMO`,
+    age: 11,
+    gender: `F`,
+    height: 145,
+    tags: [`pop`] as ArtistTag[],
+    motto: `音乐是我的好朋友。`,
+    personality: `元气灵动、懂事乖巧，开朗活泼、心思细腻，共情力远超同龄人，自律坚韧。舞台上清澈治愈、元气满满，童声干净透亮，小提琴悠扬动听，自然纯真无表演痕迹。`,
+    catchphrase: `好呀好呀。`,
+    skills: `童声演唱、小提琴演奏、舞台表演、短视频陪伴内容创作`,
+    track: `乐队童声主唱、乐队小提琴手、养成系偶像赛道`,
+    bio: `莫晴出生在杭州，父母均为浙江音乐学院的小提琴教师，她从 3 岁起就踮着脚趴在琴凳上看父母练琴，展现出远超同龄人的音乐感知力。5 岁时她就能完整演奏《小星星变奏曲》，6 岁首次登台参加全国少儿小提琴比赛便斩获金奖，被评委誉为 “极具潜力的小提琴神童”。妈妈随手分享的一段睡前练琴视频：扎着羊角辫的她抱着比自己还高的小提琴，认真拉完一曲后，对着镜头露出缺了一颗门牙的可爱笑容，治愈了很多网友。虽然年纪尚小，但莫晴格外懂事自律，每天坚持练琴 ，同时从未落下学业，还会在短视频平台分享自己的练琴日常和暖心小故事。她清澈透亮的童声与悠扬的小提琴声，为观众增添了独一无二的治愈色彩。对她而言，音乐不是任务，而是和世界对话的方式。`,
+  },
+  {
+    no: `033`,
+    name: `裴靖`,
+    enName: `JAY`,
+    age: 14,
+    gender: `M`,
+    height: 168,
+    tags: [`pop`] as ArtistTag[],
+    motto: `摇滚少年，永不言弃。`,
+    personality: `阳光开朗、活泼好动，热情真诚、精力旺盛，自带少年元气冲劲，坚韧不服输。舞台上活力四射、爆发力强，电吉他演奏灵动炸裂，充满少年热血与青春激情。`,
+    catchphrase: `冲！`,
+    skills: `电吉他演奏、木吉他弹唱、架子鼓演奏、舞台表演`,
+    track: `节奏 / 主音吉他手、养成系偶像赛道`,
+    bio: `裴靖的父亲曾是北京一支地下摇滚乐队的主音吉他手，受父亲影响，他从 6 岁起就抱着比自己还大的电吉他摸索琴弦，展现出惊人的天赋。9 岁时他就能完成高难度的速弹即兴 solo，12 岁获得全国少儿电吉他大赛总冠军，被业内前辈称为 “未来的吉他新星”。他性格活泼好动，是学校篮球队的主力后卫，走到哪里都带着满满的元气。穿着校服的他抱着电吉他在舞台上尽情挥洒汗水，阳光帅气的脸庞和极具爆发力的演奏，收获了不少同学的喜爱。虽然年纪不大，但裴靖对音乐有着近乎偏执的热爱，每天放学后都会泡在排练室练琴到天黑，手指磨出茧子也从不叫苦。作为吉他手，他用充满活力的演奏，为世界注入了年轻的热血与朝气。`,
+  },
+  {
+    no: `034`,
+    name: `Kael Walker`,
+    enName: `KAEL`,
+    age: 20,
+    gender: `M`,
+    height: 190,
+    tags: [`folk`] as ArtistTag[],
+    motto: `Music brighten everywhere.`,
+    personality: `安静内敛、温柔绅士，谦和有礼、待人真诚，自带加州松弛感，偏爱独处创作。舞台上判若两人、感染力极强，电吉他演奏充满力量，演唱温柔治愈，反差魅力独特。`,
+    catchphrase: `Cheers.`,
+    skills: `电吉他演奏、木吉他弹唱、流行演唱、即兴词曲创作`,
+    track: `主音吉他手、欧美流行赛道、治愈系偶像赛道`,
+    bio: `Kael Walker 出生在美国加州圣塔莫尼卡的一个艺术家庭，父亲是知名音乐制作人，母亲是前维多利亚的秘密超模。他从小在阳光明媚的海边长大，12 岁生日时父亲送了他一把电吉他，从此便与音乐结下不解之缘。16 岁时，他在 YouTube 上传了一段自己在海边弹唱《Here Comes The Sun》的视频，凭借干净帅气的外形和温柔治愈的烟嗓受到关注，被网友亲切地称为 “加州阳光”。私下里的 Kael 安静内敛，最大的爱好是冲浪、摄影和写歌，常常一个人带着吉他去海边，把海风、日落和海浪的声音写进旋律里。舞台上的他却判若两人，抱着电吉他时眼神坚定，演奏充满力量。他拒绝了多家主流唱片公司的单独签约邀约，选择加入乐队，希望和伙伴们一起创造出更有温度、更有灵魂的音乐。`,
+  },
+  {
+    no: `035`,
+    name: `Anthony Williams`,
+    enName: `TRUMPET`,
+    age: 20,
+    gender: `M`,
+    height: 190,
+    tags: [`jazz`] as ArtistTag[],
+    motto: `Music is the voice of the soul.`,
+    personality: `慵懒随性、清冷孤傲，独立自我、不被束缚，自带贵族高级疏离感，浪漫细腻。舞台上慵懒迷人、氛围感拉满，爵士小号悠扬慵懒，融合复古与现代，气质独一无二。`,
+    catchphrase: `Well.`,
+    skills: `爵士小号演奏、高级时装走秀、黑胶采样制作、即兴编曲`,
+    track: `小号手、时尚先锋模特赛道、爵士融合赛道`,
+    bio: `Anthony Williams 出身于英国伦敦的一个贵族家庭，从小接受严格的精英教育，学习钢琴、马术和古典绘画，但他唯独对爵士小号情有独钟。7 岁时，他在一场爵士音乐节上听到小号演奏家 Miles Davis 的演出，瞬间被那种慵懒又充满故事感的音色吸引，从此便全身心投入到爵士小号的学习中，师从英国著名爵士小号手 。14 岁时，他在伦敦街头被顶级时尚星探发掘，凭借近乎雕塑般的深邃五官和 190CM 的优越身材，迅速成为时尚界的宠儿，16 岁首次登上T台，为品牌走秀。即使在时尚界声名鹊起，Anthony 也从未放弃自己的音乐梦想，他常常在走秀间隙带着小号去伦敦的老爵士酒吧即兴演奏，那种将高级时尚与复古爵士完美融合的独特气质，让人印象深刻。`,
+  },
+  {
+    no: `036`,
+    name: `Sylvia Ross`,
+    enName: `SYLVIA`,
+    age: 18,
+    gender: `F`,
+    height: 172,
+    tags: [`rock`] as ArtistTag[],
+    motto: `Girls Bravo！`,
+    personality: `直爽开朗、率真可爱，独立坚强、敢想敢做，热爱自由，喜欢小动物反差感十足。舞台上气场全开、爆发力极强，全能驾驭多种乐器，用摇滚打破对女孩的刻板印象`,
+    catchphrase: `I love it！`,
+    skills: `架子鼓演奏、贝斯演奏、电吉他 / 木吉他弹唱、摇滚演唱`,
+    track: `全能乐器担当、欧美摇滚赛道、酷飒偶像赛道`,
+    bio: `Sylvia Ross 出生在加拿大温哥华的一个摇滚家庭，父母都是当地知名朋克乐队的成员，她从小在排练室长大，耳边永远是吉他和鼓声的轰鸣，摇篮曲都是父母演奏的摇滚歌曲。受家庭氛围熏陶，她 5 岁开始学习架子鼓，7 岁学贝斯，10 岁学吉他，15 岁就和三个好朋友组建了自己的少女摇滚乐队 “Silver Hair”，在温哥华的地下 Livehouse 演出，凭借极具爆发力的演奏和酷飒的舞台风格，成为当地小有名气的少女摇滚偶像。留着标志性银白发的她在舞台上疯狂打鼓，汗水顺着发丝滴落，眼神里充满了野性的生命力，酷飒的舞台风格收获了不少年轻粉丝的喜爱。私下里的 Sylvia 直爽开朗，喜欢滑板、涂鸦和收养流浪猫，毫无偶像包袱。她能熟练驾驭多种乐器，用自己的音乐，打破人们对女孩的刻板印象。`,
+  },
+];

src/lib/auth.ts

@@ -1,6 +1,7 @@
 import NextAuth, { type NextAuthConfig } from "next-auth";
 import Credentials from "next-auth/providers/credentials";
 import { prisma } from "./prisma";
+import { consumeOtp } from "./otp-store";
 import { z } from "zod";
 
 /**
@@ -101,23 +102,15 @@ export const authConfig: NextAuthConfig = {
 export const { handlers, signIn, signOut, auth } = NextAuth(authConfig);
 
 /**
- * 校验 OTP 验证码（开发态：固定接受 "123456"）。
+ * 校验 OTP 验证码。
- * 生产态：从 Redis 读取并比对，校验后删除避免重放。
+ *  - 开发态万能码 "123456" 始终通过（仅 NODE_ENV !== "production"，不走 SMS）
+ *  - 真实码通过 consumeOtp 核对（Redis 或进程内 Map，由 otp-store 决定）；
+ *    校验通过后立即销毁该码防止重放
  */
 async function verifyOtp(phone: string, code: string): Promise<boolean> {
   if (process.env.NODE_ENV !== "production" && code === "123456") {
     console.log(`[dev-otp] 手机号 ${phone} 使用万能码 123456 通过`);
     return true;
   }
-
+  return await consumeOtp(phone, code);
-  // TODO[团队]: 接入 Redis
-  // const redis = getRedis();
-  // if (!redis) return false;
-  // const key = `sms:otp:${phone}`;
-  // const stored = await redis.get(key);
-  // if (!stored || stored !== code) return false;
-  // await redis.del(key);
-  // return true;
-
-  return false;
 }

src/lib/date-utils.ts

@@ -0,0 +1,27 @@
+/**
+ * 日期工具 · 跨 API 共享, 避免日期 / 时区 相关 bug。
+ *
+ * 为什么用 UTC 而不是本地时区？
+ *   MySQL @db.Date 列存储时只保留日期部分。如果用 setHours(0,0,0,0) 取本地午夜,
+ *   JS Date 对应的 UTC 时刻在 +8 区是当日 16:00 UTC, 经过 Prisma 序列化 + MySQL
+ *   TZ 转换后, 存的"日期"和读的"日期"可能差一天, 导致 dailyQuota 复合键 (userId, date)
+ *   找不到刚 upsert 的行 (P2025)。
+ *
+ *   用 setUTCHours(0,0,0,0) 拿到的是 "今天的 UTC 0 点", 无论服务器 / 客户端 TZ,
+ *   存取一致。代价: 中国用户在 08:00 之前(UTC 0 点之前)算"昨天"。对于按日额度场景
+ *   足够好(短期可接受, 长期需要按"运营日"显式划分)。
+ */
+export function startOfUtcDay(d = new Date()): Date {
+  const x = new Date(d);
+  x.setUTCHours(0, 0, 0, 0);
+  return x;
+}
+
+/** 判断两个 Date 是否同一个 UTC 日期 */
+export function isSameUtcDay(a: Date, b: Date): boolean {
+  return (
+    a.getUTCFullYear() === b.getUTCFullYear() &&
+    a.getUTCMonth() === b.getUTCMonth() &&
+    a.getUTCDate() === b.getUTCDate()
+  );
+}

src/lib/mock-data.ts

@@ -1,124 +1,95 @@
-import type { Artist, ArtistTag } from "@/types/artist";
+import type { Artist } from "@/types/artist";
+import { ARTIST_SEEDS } from "./artist-bios";
+import { tosUrl } from "./tos";
 
-const STAGE_NAMES: Array<[string, string, string]> = [
+/**
-  ["艺奈", "AURORA", "破晓极光"],
+ * 真实艺人数据装配层。
-  ["路米", "LUMI", "暖光治愈"],
+ * 所有人物字段（姓名 / 性别 / 年龄 / 身高 / 性格 / 技能 / 赛道 / 口头禅 /
-  ["星澪", "NEBULA", "星云吟唱"],
+ * 座右铭 / 长简介）来自《36 位虚拟艺人人物小传.docx》。
-  ["凯", "KAI", "海岸少年"],
+ * 立绘 / 三视图 / 氛围图 / solo 视频 走火山 TOS 桶（webp + mp4 已压缩到 1/10）。
-  ["回音", "ECHO", "声波女王"],
+ *
-  ["薇尔", "VEIL", "薄雾低语"],
+ * 票数 / 排名是运行时计算（store 投票后会更新）。除此之外不再有任何虚构数据。
-  ["艾莉雅", "ARIA", "咏叹之声"],
+ */
-  ["怜", "REN", "莲华少女"],
-  ["米拉", "MIRA", "镜面舞者"],
-  ["诺娃", "NOVA", "超新星"],
-  ["纪罗", "KIRO", "Rap 制造机"],
-  ["瑞", "ZUI", "醉月夜"],
-  ["阳", "SOL", "阳光少年"],
-  ["凛", "LIN", "学院偶像"],
-  ["律", "LYRA", "竖琴公主"],
-  ["昕", "DAWN", "晨曦少女"],
-  ["天", "SKY", "天空之翼"],
-  ["语", "ARIE", "诗与远方"],
-  ["翼", "WING", "飞翔之翼"],
-  ["铃", "CHIME", "风铃声"],
-  ["夜", "NYX", "暗夜女神"],
-  ["晴", "SUNNY", "晴空万里"],
-  ["月", "LUNA", "月光女神"],
-  ["岚", "STORM", "暴风之子"],
-  ["雷", "BOLT", "雷霆速度"],
-  ["焰", "FLARE", "火焰之心"],
-  ["雪", "FROST", "霜花少女"],
-  ["林", "LEAF", "森林精灵"],
-  ["渊", "ABYSS", "深渊之声"],
-  ["瑶", "JADE", "翡翠少女"],
-  ["晨", "AURIA", "金色晨光"],
-  ["岩", "ROCK", "硬核摇滚"],
-  ["翔", "SOAR", "翱翔天际"],
-  ["茉", "MOLLY", "茉莉芬芳"],
-  ["梓", "AZUR", "蓝调诗人"],
-];
 
-// 4 个新主标签均匀分布。每位艺人 1-2 个标签，便于筛选器命中。
+/** 没有 solo.mp4 的艺人编号(docx 标注"缺视频")。
-const TAG_POOL: ArtistTag[][] = [
+    003/010/017/027 在 v2 物料里已补上,033 已替换,这些都从集合里移除。 */
-  ["vocal"],
+const MISSING_VIDEO: ReadonlySet<string> = new Set<string>();
-  ["dance"],
-  ["all-rounder"],
-  ["rap"],
-  ["vocal", "all-rounder"],
-  ["dance", "all-rounder"],
-  ["rap", "all-rounder"],
-  ["vocal"],
-  ["dance"],
-  ["all-rounder"],
-  ["rap"],
-  ["vocal", "dance"],
-];
 
-const THEME_COLORS = [
+/**
-  "#8b5cf6",
+ * 自定义封面:这些艺人的卡片/详情主立绘改用单独上传的 cover 图,
-  "#ec4899",
+ * 而不是默认的氛围图1。氛围图1/2/3 在画廊里保持不变。
-  "#06b6d4",
+ * (调整.xlsx 里 "封面图用氛围图N" 的实现 —— 新封面已转 webp 上传到
-  "#f59e0b",
+ *  portraits/{no}-cover.webp,这里把 portrait 字段切到该路径。)
-  "#10b981",
+ */
-  "#ef4444",
+const CUSTOM_COVERS: ReadonlySet<string> = new Set([
-  "#a78bfa",
+  "002",
-  "#f472b6",
+  "003",
-  "#38bdf8",
+  "005",
-  "#fbbf24",
+  "012",
-  "#34d399",
+  "013",
-  "#fb7185",
+  "014",
-];
+  "019",
+  "025",
+]);
+
+/** 画廊 = 三张氛围图（1/2/3）。不包含三视图，因为长宽比与卡片不一致。 */
+function buildGallery(no: string): string[] {
+  return [
+    tosUrl(`portraits/${no}.webp`),
+    tosUrl(`portraits/${no}-2.webp`),
+    tosUrl(`portraits/${no}-3.webp`),
+  ];
+}
 
-/** 生成确定性 35 位艺人 mock 数据 */
 function buildArtists(): Artist[] {
-  return STAGE_NAMES.map(([name, enName, slogan], idx) => {
+  return ARTIST_SEEDS.map((seed, idx) => {
-    const no = String(idx + 1).padStart(3, "0");
-    const rank = idx + 1;
-    // 票数采用反比例衰减（确定性 · 避免 SSR/CSR hydration 不一致）
-    // 主曲线：125000/√rank · 用 idx 推导抖动量保持稳定分布
-    const jitter = ((idx * 1103) % 2999) - 1499;
-    const votes = Math.round(125000 / Math.sqrt(rank) + jitter);
-
     return {
-      id: no,
+      id: seed.no,
-      no,
+      no: seed.no,
-      name,
+      name: seed.name,
-      enName,
+      enName: seed.enName,
-      slogan,
+      age: seed.age,
-      bio: `来自虚拟星域的偶像候选人 ${enName}，从小热爱音乐与舞蹈。性格${
+      gender: seed.gender,
-        rank % 2 === 0 ? "温柔" : "活泼"
+      bio: seed.bio,
-      }，擅长${
+      portrait: tosUrl(
-        idx % 3 === 0 ? "抒情曲" : idx % 3 === 1 ? "舞台表演" : "Rap 创作"
+        CUSTOM_COVERS.has(seed.no)
-      }。曾获得多项虚拟偶像新人奖项，代表作品深受粉丝喜爱。立志成为 Top12 出道阵容的一员，用音乐传递梦想与力量。`,
+          ? `portraits/${seed.no}-cover.webp`
-      portrait: "",
+          : `portraits/${seed.no}.webp`,
+      ),
       avatar: "",
-      gallery: ["", "", "", "", ""],
+      gallery: buildGallery(seed.no),
-      videoUrl: undefined,
+      videoUrl: MISSING_VIDEO.has(seed.no)
+        ? undefined
+        : tosUrl(`videos/artists/${seed.no}.mp4`),
+      // 不设置 poster，由播放器运行时 seek 到 0.001s 渲染首帧作为封面
       videoPoster: "",
-      tags: TAG_POOL[idx % TAG_POOL.length]!,
+      tags: seed.tags,
-      birthday: `${String(((idx * 7) % 12) + 1).padStart(2, "0")}-${String(
+      height: seed.height,
-        ((idx * 13) % 28) + 1
+      // 初始全部 0 票，等用户投票产生真实排名；rank 按 no 顺序兜底
-      ).padStart(2, "0")}`,
+      votes: 0,
-      height: 158 + (idx % 12),
+      rank: idx + 1,
-      cv: idx < 12 ? `CV 配音 #${idx + 1}` : undefined,
+      motto: seed.motto,
-      themeColor: THEME_COLORS[idx % THEME_COLORS.length]!,
+      personality: seed.personality,
-      votes,
+      catchphrase: seed.catchphrase,
-      rank,
+      skills: seed.skills,
+      track: seed.track,
     };
   });
 }
 
 export const ARTISTS: Artist[] = buildArtists();
 
-export const TOP_12 = ARTISTS.slice(0, 12);
+/** 排序方式 · "votes" = 实时排名(票数倒序),"no" = 编号顺序 */
-export const CANDIDATES = ARTISTS.slice(12);
+export type SortKey = "votes" | "no";
 
-/** 按当前排序方式获取艺人列表 */
+/** 票数相同时按编号升序兜底，保证排序稳定 */
-export type SortKey = "votes" | "no" | "recent";
 export function sortArtists(list: Artist[], key: SortKey = "votes"): Artist[] {
   const sorted = [...list];
-  if (key === "votes") sorted.sort((a, b) => b.votes - a.votes);
+  if (key === "votes") {
-  else if (key === "no") sorted.sort((a, b) => a.no.localeCompare(b.no));
+    sorted.sort((a, b) => b.votes - a.votes || a.no.localeCompare(b.no));
+  } else {
+    sorted.sort((a, b) => a.no.localeCompare(b.no));
+  }
   return sorted;
 }
 

src/lib/mock-user.ts

@@ -1,52 +0,0 @@
-import { ARTISTS } from "./mock-data";
-import type { Artist } from "@/types/artist";
-
-export interface MockUser {
-  id: string;
-  nickname: string;
-  /** 头像 URL（无则使用首字母占位） */
-  avatar: string;
-  signInStreak: number;
-  /** 本周签到状态：每天 true/false（按周一开始的一周 7 天） */
-  weeklySignIn: boolean[];
-  /** 今日是否已签到 */
-  todaySignedIn: boolean;
-  /** 累计投票数 */
-  totalVotes: number;
-  /** 应援的艺人 ID 列表 */
-  supportingIds: string[];
-  /** 邀请好友数 */
-  invitedCount: number;
-}
-
-export interface FanSupport {
-  artist: Artist;
-  votedCount: number;
-}
-
-export const MOCK_USER: MockUser = {
-  id: "12345678",
-  nickname: "粉丝昵称",
-  avatar: "",
-  signInStreak: 7,
-  weeklySignIn: [true, true, true, true, true, true, false],
-  todaySignedIn: false,
-  totalVotes: 87,
-  supportingIds: ["001", "005", "014"],
-  invitedCount: 2,
-};
-
-export function getFanSupports(): FanSupport[] {
-  // 已应援票数采用确定性映射（避免 hydration 不一致）
-  const VOTED_BY_ID: Record<string, number> = { "001": 42, "005": 28, "014": 17 };
-  return MOCK_USER.supportingIds
-    .map((id) => {
-      const artist = ARTISTS.find((a) => a.id === id);
-      if (!artist) return null;
-      return {
-        artist,
-        votedCount: VOTED_BY_ID[id] ?? 10,
-      };
-    })
-    .filter((x): x is FanSupport => x !== null);
-}

src/lib/otp-store.ts

@@ -0,0 +1,65 @@
+/**
+ * OTP 验证码存储抽象层。
+ *
+ * 路由策略:
+ *  - Redis 可用 → 走 Redis (生产, 多实例, 跨重启)
+ *  - Redis 缺失 → 降级到进程内 Map (dev 联调; 单实例; 重启丢失但 5min TTL 无所谓)
+ *
+ * 不能"Redis 缺失就直接通过校验" —— 那会复活之前的安全漏洞。
+ * 必须真实生成 / 真实存储 / 真实核对。
+ */
+import { getRedis } from "./redis";
+
+const TTL_SECONDS = 300;
+const redisKey = (phone: string) => `sms:otp:${phone}`;
+
+// 通过 globalThis 防止 Next dev HMR 重置模块导致 Map 丢失
+declare global {
+  // eslint-disable-next-line no-var
+  var __otpMemStore: Map<string, { code: string; expiresAt: number }> | undefined;
+}
+const mem: Map<string, { code: string; expiresAt: number }> =
+  globalThis.__otpMemStore ?? (globalThis.__otpMemStore = new Map());
+
+/** 清理 mem 里过期的条目, 防止长跑后内存膨胀 */
+function sweep() {
+  const now = Date.now();
+  for (const [phone, entry] of mem) {
+    if (entry.expiresAt <= now) mem.delete(phone);
+  }
+}
+
+/** 存验证码 (覆盖该手机号的旧码) */
+export async function storeOtp(phone: string, code: string): Promise<void> {
+  const redis = getRedis();
+  if (redis) {
+    await redis.set(redisKey(phone), code, "EX", TTL_SECONDS);
+    return;
+  }
+  sweep();
+  mem.set(phone, { code, expiresAt: Date.now() + TTL_SECONDS * 1000 });
+}
+
+/**
+ * 核对验证码;
+ * 通过则立即销毁该码 (防止重放), 返回 true;
+ * 失败 (码不存在 / 已过期 / 不匹配) 返回 false。
+ */
+export async function consumeOtp(phone: string, code: string): Promise<boolean> {
+  const redis = getRedis();
+  if (redis) {
+    const stored = await redis.get(redisKey(phone));
+    if (!stored || stored !== code) return false;
+    await redis.del(redisKey(phone));
+    return true;
+  }
+  const entry = mem.get(phone);
+  if (!entry) return false;
+  if (Date.now() > entry.expiresAt) {
+    mem.delete(phone);
+    return false;
+  }
+  if (entry.code !== code) return false;
+  mem.delete(phone);
+  return true;
+}

src/lib/sms.ts

@@ -0,0 +1,83 @@
+/**
+ * 阿里云短信服务客户端
+ *
+ * 接入: dysmsapi.aliyuncs.com (短信服务在国内是全局服务,所有调用走 cn-hangzhou)
+ * 文档: https://help.aliyun.com/document_detail/419298.html
+ *
+ * 环境变量:
+ *   SMS_ACCESS_KEY      RAM 子账号 AccessKey ID
+ *   SMS_SECRET_KEY      RAM 子账号 AccessKey Secret
+ *   SMS_SIGN_NAME       已审核通过的签名 (例: 广州气元科技)
+ *   SMS_TEMPLATE_CODE   已审核通过的模板 Code (例: SMS_506210397)
+ *
+ * 模板内容必须严格使用 ${code} 占位符,例如:
+ *   "您的验证码是 ${code},5 分钟内有效,请勿泄露。"
+ */
+import Dysmsapi, * as $Dysmsapi from "@alicloud/dysmsapi20170525";
+import * as $OpenApi from "@alicloud/openapi-client";
+import * as $Util from "@alicloud/tea-util";
+
+let client: Dysmsapi | null = null;
+
+function getClient(): Dysmsapi | null {
+  if (client) return client;
+  const accessKeyId = process.env.SMS_ACCESS_KEY;
+  const accessKeySecret = process.env.SMS_SECRET_KEY;
+  if (!accessKeyId || !accessKeySecret) return null;
+  const config = new $OpenApi.Config({ accessKeyId, accessKeySecret });
+  config.endpoint = "dysmsapi.aliyuncs.com";
+  client = new Dysmsapi(config);
+  return client;
+}
+
+export interface SendOtpResult {
+  ok: boolean;
+  /** 阿里云返回的 BizId,排查问题时给阿里云工单用 */
+  bizId?: string;
+  /** 阿里云错误码 / 失败原因 */
+  errorCode?: string;
+  errorMessage?: string;
+}
+
+/**
+ * 发送 6 位验证码短信。
+ * 返回 ok=true 表示阿里云已受理 (用户收到短信通常在 30 秒内);
+ * ok=false 时 errorCode 给出原因 (如 isv.MOBILE_NUMBER_ILLEGAL / isv.BUSINESS_LIMIT_CONTROL 等)。
+ *
+ * 若 SMS_ACCESS_KEY/SMS_SECRET_KEY 未配置,函数直接返回 ok=false 且 errorCode='SMS_NOT_CONFIGURED',
+ * 调用方可根据该信号 fallback 到 dev console.log 输出验证码。
+ */
+export async function sendOtpSms(
+  phone: string,
+  code: string,
+): Promise<SendOtpResult> {
+  const c = getClient();
+  const signName = process.env.SMS_SIGN_NAME;
+  const templateCode = process.env.SMS_TEMPLATE_CODE;
+  if (!c || !signName || !templateCode) {
+    return { ok: false, errorCode: "SMS_NOT_CONFIGURED" };
+  }
+
+  const req = new $Dysmsapi.SendSmsRequest({
+    phoneNumbers: phone,
+    signName,
+    templateCode,
+    templateParam: JSON.stringify({ code }),
+  });
+
+  try {
+    const resp = await c.sendSmsWithOptions(req, new $Util.RuntimeOptions({}));
+    const body = resp.body;
+    if (body?.code === "OK") {
+      return { ok: true, bizId: body.bizId };
+    }
+    return {
+      ok: false,
+      errorCode: body?.code ?? "UNKNOWN",
+      errorMessage: body?.message,
+    };
+  } catch (e) {
+    const msg = e instanceof Error ? e.message : String(e);
+    return { ok: false, errorCode: "EXCEPTION", errorMessage: msg };
+  }
+}

src/lib/store.ts

@@ -1,83 +1,175 @@
 import { create } from "zustand";
+import { persist } from "zustand/middleware";
 import { ARTISTS } from "./mock-data";
 import type { Artist } from "@/types/artist";
 
-/** 每日基础投票额度（与后端 ActivityConfig.dailyQuota 对齐） */
+/**
-export const DAILY_VOTE_QUOTA = 10;
+ * 每用户终身投票总额度 —— 一人 12 票,每位艺人最多 1 票,
+ * 投完即结束,不限时,不可撤销。
+ */
+export const TOTAL_VOTE_QUOTA = 12;
+
+/** 派生类型:我应援的艺人(新规则下每位仅 1 票,不再带 votedCount) */
+export interface MySupport {
+  artist: Artist;
+}
 
 interface VoteStore {
-  /** 当前所有艺人（含动态票数 / 实时排名） */
+  /** 当前所有艺人(含动态票数 / 实时排名) */
   artists: Artist[];
-  /** 累计已投票数 */
-  myTotalVotes: number;
-  /** 今日已用票数（跨日自动重置） */
-  usedToday: number;
-  /** 今日额度日期标记（YYYY-M-D，按本地时区） */
-  quotaDate: string;
   /**
-   * 给艺人投票（本地模拟，会重新排名）。
+   * 我已投票的艺人 ID 列表(顺序 = 投票顺序)。
-   * 票数不足时返回 false，前端可据此提示。
+   * 用数组而不是 Set:zustand persist 默认 storage 是 JSON,Set 无法直接序列化。
+   * 数组按投票顺序保留,既能 .includes() 判重,也能在 /me 页面显示"我的投票"时按时间排序。
    */
-  vote: (artistId: string, count: number) => boolean;
+  votedArtists: string[];
-  /** 重置（开发时用） */
+  /**
+   * 给艺人投票。
+   * - 已投过该艺人 → 返回 { ok: false, reason: "already" }
+   * - 已用满 12 票 → 返回 { ok: false, reason: "exhausted" }
+   * - 成功 → 返回 { ok: true }
+   */
+  vote: (artistId: string) => { ok: boolean; reason?: "already" | "exhausted" };
+  /**
+   * 服务端权威态覆盖本地态:登录后从 /api/me 拿到的 votedArtists 直接灌进来,
+   * 跨设备/清缓存的关键 —— 本地 localStorage 不再是唯一真相源。
+   */
+  hydrateFromServer: (votedArtists: string[]) => void;
+  /** 服务端拒绝时回滚单次投票(乐观更新的兜底) */
+  rollbackVote: (artistId: string) => void;
+  /** 重置(开发时用 / 测试用 / 登出时清理) */
   reset: () => void;
 }
 
-function todayKey(): string {
+/** 票数倒序 + 编号升序兜底,确保 0 票时也有稳定排名 */
-  const d = new Date();
-  return `${d.getFullYear()}-${d.getMonth() + 1}-${d.getDate()}`;
-}
-
 function rank(list: Artist[]): Artist[] {
   return [...list]
-    .sort((a, b) => b.votes - a.votes)
+    .sort((a, b) => b.votes - a.votes || a.no.localeCompare(b.no))
     .map((a, i) => ({ ...a, rank: i + 1 }));
 }
 
-const INITIAL = rank(ARTISTS);
+const INITIAL_ARTISTS = rank(ARTISTS);
 
-export const useVoteStore = create<VoteStore>((set) => ({
+export const useVoteStore = create<VoteStore>()(
-  artists: INITIAL,
+  persist(
-  myTotalVotes: 0,
+    (set, get) => ({
-  usedToday: 0,
+      artists: INITIAL_ARTISTS,
-  quotaDate: todayKey(),
+      votedArtists: [],
-  vote: (artistId, count) => {
+      vote: (artistId) => {
-    let success = false;
+        const state = get();
-    set((state) => {
+        if (state.votedArtists.includes(artistId)) {
-      const today = todayKey();
+          return { ok: false, reason: "already" };
-      const baseUsed = state.quotaDate === today ? state.usedToday : 0;
+        }
-      const remaining = DAILY_VOTE_QUOTA - baseUsed;
+        if (state.votedArtists.length >= TOTAL_VOTE_QUOTA) {
-      if (count <= 0 || count > remaining) {
+          return { ok: false, reason: "exhausted" };
-        return state;
         }
-      success = true;
         const updated = state.artists.map((a) =>
-        a.id === artistId ? { ...a, votes: a.votes + count } : a,
+          a.id === artistId ? { ...a, votes: a.votes + 1 } : a,
         );
-      return {
+        set({
           artists: rank(updated),
-        myTotalVotes: state.myTotalVotes + count,
+          votedArtists: [...state.votedArtists, artistId],
-        usedToday: baseUsed + count,
+        });
-        quotaDate: today,
+        return { ok: true };
-      };
+      },
+      hydrateFromServer: (votedArtists) => {
+        // 用服务端返回的 votedArtists 重建 artists 票数(回放 mock baseline)
+        const counts = new Map<string, number>();
+        for (const id of votedArtists) {
+          counts.set(id, (counts.get(id) ?? 0) + 1);
+        }
+        const rebuilt = INITIAL_ARTISTS.map((a) => ({
+          ...a,
+          votes: a.votes + (counts.get(a.id) ?? 0),
+        }));
+        set({
+          artists: rank(rebuilt),
+          votedArtists,
+        });
+      },
+      rollbackVote: (artistId) => {
+        const state = get();
+        const idx = state.votedArtists.lastIndexOf(artistId);
+        if (idx === -1) return;
+        const nextVoted = [
+          ...state.votedArtists.slice(0, idx),
+          ...state.votedArtists.slice(idx + 1),
+        ];
+        const updated = state.artists.map((a) =>
+          a.id === artistId ? { ...a, votes: Math.max(0, a.votes - 1) } : a,
+        );
+        set({
+          artists: rank(updated),
+          votedArtists: nextVoted,
         });
-    return success;
       },
       reset: () =>
         set({
-      artists: INITIAL,
+          artists: INITIAL_ARTISTS,
-      myTotalVotes: 0,
+          votedArtists: [],
-      usedToday: 0,
-      quotaDate: todayKey(),
         }),
-}));
+    }),
+    {
+      name: "cyber-star-vote",
+      // 仅持久化 votedArtists —— artists 票数/排名是派生数据,
+      // 刷新后重新从初始数据 + votedArtists 重建。
+      // localStorage 仅作本设备缓存,加速首屏渲染;真相源是 /api/me
+      // —— useSyncMe 会在登录/切换用户后用服务端数据覆盖本地。
+      partialize: (state) => ({ votedArtists: state.votedArtists }),
+      // rehydrate 时把 votedArtists 数据"回放"到 artists 票数上,保持视图一致
+      onRehydrateStorage: () => (state) => {
+        if (!state) return;
+        const counts = new Map<string, number>();
+        for (const id of state.votedArtists) {
+          counts.set(id, (counts.get(id) ?? 0) + 1);
+        }
+        const rebuilt = INITIAL_ARTISTS.map((a) => ({
+          ...a,
+          votes: a.votes + (counts.get(a.id) ?? 0),
+        }));
+        state.artists = rank(rebuilt);
+      },
+    },
+  ),
+);
 
-/** 便捷选择器：按 ID 获取最新艺人 */
+/** 选择器:按 ID 获取最新艺人 */
 export function selectArtist(id: string) {
   return (s: VoteStore) => s.artists.find((a) => a.id === id);
 }
 
-/** 选择器：当前剩余票数（基于今日已用） */
+/** 选择器:当前剩余票数 = 12 - 已投艺人数 */
 export function selectRemaining(s: VoteStore): number {
-  return Math.max(0, DAILY_VOTE_QUOTA - s.usedToday);
+  return Math.max(0, TOTAL_VOTE_QUOTA - s.votedArtists.length);
+}
+
+/** 选择器:是否已投过指定艺人(高阶,在组件里用 useVoteStore(selectHasVoted(id))) */
+export function selectHasVoted(id: string) {
+  return (s: VoteStore) => s.votedArtists.includes(id);
+}
+
+/** 选择器:12 票是否已全部投完 */
+export function selectIsExhausted(s: VoteStore): boolean {
+  return s.votedArtists.length >= TOTAL_VOTE_QUOTA;
+}
+
+/**
+ * 派生函数:"我的应援"列表 —— 按投票顺序(最早投的在前)。
+ *
+ * ⚠️ 不要直接 `useVoteStore(selectMySupports)`:它每次都返回新数组,
+ *    会触发 React 19 的 "getSnapshot should be cached" 报错。
+ *    正确用法:在组件里 useMemo 派生(参考 MeContent.tsx)。
+ */
+export function selectMySupports(s: VoteStore): MySupport[] {
+  const list: MySupport[] = [];
+  for (const id of s.votedArtists) {
+    const artist = s.artists.find((a) => a.id === id);
+    if (artist) list.push({ artist });
+  }
+  return list;
+}
+
+/** 选择器:我支持的艺人数 = 投票数 */
+export function selectMySupportingCount(s: VoteStore): number {
+  return s.votedArtists.length;
 }

src/lib/tos.ts

@@ -0,0 +1,23 @@
+/**
+ * TOS 资源 URL 拼接工具
+ *
+ * 用法:
+ *   tosUrl("portraits/001.webp")
+ *   → https://cyberstar.tos-cn-shanghai.volces.com/cyber-star/portraits/001.webp?v=2
+ *
+ * 环境变量 NEXT_PUBLIC_TOS_DOMAIN 配置:
+ *   .env.local / .env.production → 完整的桶 + 路径前缀 (含 scheme, 不含末尾 /)
+ *   未设置时 fallback 到相对路径 (/path/...), 适合本地用 public/ 静态文件托管的场景。
+ *
+ * 缓存版本号 TOS_VERSION:每次有 TOS 文件被原地覆盖更新(图片/视频),
+ * 把这个数字 +1。浏览器和 CDN 会把带新版本号的 URL 当作全新资源,
+ * 立即看到更新后的内容,不必等 TTL 过期或手动 invalidate。
+ */
+const TOS_BASE = (process.env.NEXT_PUBLIC_TOS_DOMAIN ?? "").replace(/\/+$/, "");
+const TOS_VERSION = "8";
+
+export function tosUrl(path: string): string {
+  const clean = path.replace(/^\/+/, "");
+  const base = TOS_BASE ? `${TOS_BASE}/${clean}` : `/${clean}`;
+  return `${base}?v=${TOS_VERSION}`;
+}

src/lib/ui-store.ts

@@ -0,0 +1,18 @@
+import { create } from "zustand";
+
+/**
+ * 跨组件 UI 协调状态。
+ * 主要用途:首页筛选条吸顶时通知导航关掉自己的玻璃,
+ * 让筛选条把玻璃从 y=0 一路延伸到自己底部,形成单一连续 backdrop-filter,
+ * 消除两块独立玻璃在 y=80 处的接缝。
+ */
+interface UIStore {
+  /** 当前页面有 sticky 筛选条且已经吸顶 */
+  filterStuck: boolean;
+  setFilterStuck: (stuck: boolean) => void;
+}
+
+export const useUIStore = create<UIStore>((set) => ({
+  filterStuck: false,
+  setFilterStuck: (stuck) => set({ filterStuck: stuck }),
+}));

src/types/artist.ts

@@ -1,57 +1,63 @@
 export type ArtistTag =
-  | "vocal"
+  | "rock"
-  | "dance"
+  | "pop"
-  | "rap"
+  | "chinese"
-  | "all-rounder"
+  | "hiphop"
-  | "visual"
+  | "folk"
-  | "leader";
+  | "jazz";
 
 export interface Artist {
-  /** 唯一 ID（如 001 ~ 035） */
+  /** 唯一 ID（如 001 ~ 036） */
   id: string;
   /** 编号字符串（如 "001"） */
   no: string;
-  /** 中文名 */
+  /** 中文名（来自小传） */
   name: string;
-  /** 英文名 / 艺名 */
+  /** 英文名 / 艺名（来自小传） */
   enName: string;
-  /** Slogan 短宣传语 */
+  /** 年龄（来自小传） */
-  slogan: string;
+  age?: number;
-  /** 长简介 (200-500 字) */
+  /** 性别（来自小传） */
+  gender?: "M" | "F";
+  /** 长简介 / 人物小传（来自小传） */
   bio: string;
   /** 立绘主图 URL */
   portrait: string;
-  /** 圆形头像 URL */
+  /** 圆形头像 URL（暂未使用） */
   avatar: string;
-  /** 表演视频 URL (15s) */
+  /** 表演视频 URL（来自 solo.mp4，缺失则 undefined） */
   videoUrl?: string;
   /** 视频封面图 */
   videoPoster?: string;
-  /** 表演图片轮播 */
+  /** 表演图片轮播（三视图 + 氛围图 2/3） */
   gallery: string[];
-  /** 标签 */
+  /** 实力标签（用于筛选） */
   tags: ArtistTag[];
-  /** 生日 MM-DD */
+  /** 身高 cm（来自小传） */
-  birthday: string;
-  /** 身高 cm */
   height: number;
-  /** CV / 声优 */
-  cv?: string;
-  /** 应援色 hex */
-  themeColor: string;
   /** 当前票数 */
   votes: number;
-  /** 当前排名 (1-35) */
+  /** 当前排名 (1-36) */
   rank: number;
+  /** 座右铭（来自小传） */
+  motto?: string;
+  /** 性格描述（来自小传） */
+  personality?: string;
+  /** 口头禅（来自小传） */
+  catchphrase?: string;
+  /** 核心技能（来自小传） */
+  skills?: string;
+  /** 核心赛道（来自小传） */
+  track?: string;
 }
 
 export const TAG_LABEL: Record<ArtistTag, string> = {
-  vocal: "声乐担当",
+  rock: "摇滚",
-  dance: "舞蹈担当",
+  pop: "流行",
-  rap: "rap担当",
+  chinese: "国风",
-  "all-rounder": "全能型",
+  hiphop: "嘻哈说唱",
-  visual: "颜值担当",
+  folk: "民谣治愈",
-  leader: "队长担当",
+  jazz: "爵士",
 };
 
 export type RankCategory = "gold" | "silver" | "bronze" | "top12" | "candidate";

tools/asset-pipeline/README.md

@@ -0,0 +1,51 @@
+# Asset Pipeline · TOS 桶资源压缩 + 打包
+
+把 `public/portraits/` 和 `public/videos/` 转成桶友好的体积（WebP + H.264），输出到仓库外的 `../assets-compressed/`。
+
+## 输出结构（与桶目录对齐）
+
+```
+assets-compressed/
+├── portraits/
+│   ├── 001.webp
+│   ├── 001-2.webp
+│   ├── 001-3.webp
+│   ├── 001-view.webp
+│   └── ...
+└── videos/
+    ├── hero-pv.mp4
+    └── artists/001.mp4 ...
+```
+
+## 压缩参数
+
+| 类型 | 处理 | 目标体积 |
+|---|---|---|
+| 立绘 / 氛围图 PNG | WebP q82, 最大宽 1600 | ≤ 800KB |
+| 三视图 `-view.png` | WebP q82, 最大宽 2400 | ≤ 1.5MB |
+| 视频 MP4 | libx264 CRF 28, 最大宽 1920, AAC 96k, faststart | 单条 ≤ 3MB / Hero PV ≤ 15MB |
+
+## 用法
+
+```bash
+cd tools/asset-pipeline
+npm install           # 装 sharp + ffmpeg-installer (各自带二进制, 无需系统装)
+npm run compress      # 压缩, 已存在且新于源的输出会跳过 (可恢复中断)
+npm run pack          # 打包成 cyber-star-assets.tar.gz
+```
+
+输出文件：
+
+```
+../../assets-compressed/                # 压缩后的源文件 (供回滚 / 抽查)
+../../cyber-star-assets.tar.gz          # 发给运维上传的最终包
+```
+
+## 上传到桶
+
+运维拿到 `cyber-star-assets.tar.gz` 解压后，用 tosutil 整目录推：
+
+```bash
+tar -xzf cyber-star-assets.tar.gz
+tosutil cp -r -f assets-compressed/* tos://cyber-star/
+```