Space Bunny 模型测试提示词

以下保留原始提示词，可直接复制。

沉浸式产品官网：NOCTURNE ONE 空间音频耳机

## 你的任务

请在当前项目中直接设计并实现一个可运行的高端消费电子产品官网，产品名为 **NOCTURNE ONE**，它是一款主打“空间音频、透明声学腔体与 42 小时续航”的旗舰头戴式耳机。

这不是普通 SaaS 落地页。最终效果需要像一场精心编排的数字产品发布会：第一眼有强烈视觉冲击，继续滚动时又能逐层理解产品。不要询问我设计偏好，请自行做出高级、统一且有辨识度的设计决策，并直接完成实现。

## 视觉方向

- 整体采用 **深石墨色 + 冰银色 + 单一低饱和琥珀色点缀**。不要纯黑，不要紫蓝霓虹，不要彩虹渐变。
- 设计气质是“暗室中的精密声学仪器”，克制、锋利、昂贵，而不是电竞风。
- 大量使用真正有材质感的 **Liquid Glass**：半透明分层、背景折射感、1px 内高光、微弱内阴影、边缘亮度变化和景深。不能只给白色透明层加 `backdrop-blur` 就算完成。
- 页面首屏采用非对称分屏：左侧为短而有力的中文文案与 CTA，右侧为一个占据视觉主导的耳机产品艺术装置。产品主体可用 CSS、SVG 或 Canvas 构建，不依赖易失效的外部图片。
- 字体使用 Geist、Satoshi、Outfit 或其他有现代工业感的无衬线字体，中文提供合理 fallback。禁止使用 Inter，禁止 Emoji。
- 允许细腻的暗部噪点、柔和体积光和微弱色散，但不要廉价外发光，不要满屏玻璃卡片。
  
## 页面内容

请完整实现以下内容，但不要套用“Hero + 三张功能卡 + CTA”的模板结构：

1. 悬浮玻璃导航：品牌、声音、结构、规格、购买；滚动后材质和尺寸有细腻变化。
2. 首屏发布场景：
	- 标题：`听见空间，而不只是声音。`
	- 副文案：`NOCTURNE ONE 以透明双腔体、个性化 HRTF 与 42 小时续航，重新定义私人声场。`
	- 主按钮：`预约试听`
	- 次按钮：`观看 90 秒设计故事`
	- 右侧产品装置需有缓慢悬浮、光线扫过、前后层景深，以及玻璃 HUD 显示 `42h`、`Spatial Engine`、`38 mm`。
3. 声场章节：做一个可交互的环形声场或波形可视化；用户移动鼠标时，声波和空间方位有轻微响应。
4. 结构章节：使用错位排版或 sticky scroll，让耳罩、声学腔体、头梁三个结构层逐步分解并配合短文案出现。
5. 配色选择器：`Obsidian`、`Mist Silver`、`Burnt Amber` 三种外观；切换时产品颜色与环境光平滑过渡，不能整页刷新。
6. 规格与购买：用精炼的技术排版展示重量 `312 g`、蓝牙 `5.4`、续航 `42 h`、快充 `10 min / 6 h`、首发价 `¥3,499`。
7. 页尾要像品牌出版物的封底，而不是常见的四列链接模板。
  
## 交互与动效

- 首次进入时要有一次完整的编排式开场：导航、文案、产品和 HUD 按节奏依次出现。
- 核心 CTA 具备克制的磁吸跟随或方向感 hover；不要用 React state 驱动每帧鼠标动画。
- 滚动动画只使用 transform 和 opacity，避免监听原生 scroll 做高频运算。
- 所有按钮实现 hover、active、focus-visible 和 disabled 状态；点击“预约试听”后出现由按钮自然扩展而来的玻璃预约面板，并完成一个可关闭、可提交的最小表单流程。
- 表单包含默认、提交中、成功与校验错误状态。不要只做静态成功页面。
- 支持 `prefers-reduced-motion`，并保证键盘可操作。
  
## 工程约束

- 使用 React + TypeScript；优先复用项目现有技术栈。先检查 `package.json`，缺少依赖时再安装，不要假设 Framer Motion 或图标库已经存在。
- 图标仅使用 `@phosphor-icons/react`、`@radix-ui/react-icons` 或自行绘制的简洁 SVG，且风格统一。
- 使用清晰的组件拆分；持续动画组件需隔离，避免带动整页重渲染。
- 桌面、平板、手机都必须完成设计。首屏使用 `min-h-[100dvh]`，小于 768px 时收敛为稳定单列，不允许横向滚动。
- 不要使用 Unsplash，不要留下占位框、TODO、伪代码或无法点击的主要按钮。
  
## 完成标准

最终请交付可直接运行的页面，而不是设计说明或截图。页面必须同时做到：视觉足够惊艳、玻璃材质可信、动效有主次、内容真实、交互闭环、移动端不崩，并且整体不像任何默认组件库模板。

# Challenge 1: Reactive Spreadsheet Engine

Starting from the current empty directory, build a complete, runnable full-stack web application: **a compact spreadsheet with formula evaluation and dependency tracking**.

## Goal

Users should be able to edit cells much like they would in Excel. Whenever a cell changes, every formula that depends on it—directly or indirectly—must be recalculated in the correct order. The interface must make raw formulas, computed values, errors, and dependency relationships easy to inspect.

## Required functionality

1. Build an editable grid with at least 20 rows and 10 columns. Support keyboard selection, Enter to edit, arrow-key navigation, and copy/paste.
2. Cells must accept text, numbers, and formulas beginning with `=`.
3. Implement the formula parser and evaluator yourself. At minimum, support:
	- A1-style cell references.
	- `+`, `-`, `*`, `/`, parentheses, and correct operator precedence.
	- `SUM(A1:A5)` and `AVG(B1:B5)`.
	- Formulas that combine functions, ranges, references, and arithmetic expressions.
4. Maintain a real dependency graph and recalculate only affected cells. Multi-level indirect dependencies and forward references must work correctly.
5. Detect both direct and indirect circular references. Every cell participating in a cycle must display `#CYCLE!`; the application must never hang or crash.
6. Correctly produce and propagate `#DIV/0!`, `#REF!`, and `#VALUE!` errors.
7. When a cell is selected, clearly highlight both the cells it references and the cells that depend on it.
8. Implement undo and redo for at least the 20 most recent edits.
9. Persist the workbook through a backend. After a page reload, raw values, formulas, and computed results must remain correct.
10. Provide clear setup and start commands in a README, and ensure the project can complete a production build.
  
## Acceptance scenario

I will create a formula dependency chain at least three levels deep, change the root value, and observe the cascade recalculation. I will then create an indirect circular reference and inspect the resulting errors. Finally, I will test undo, redo, and persistence across a full page reload.

This is a **15-minute challenge**. Start implementing immediately. Prioritize the formula engine, dependency graph, error propagation, and a runnable end-to-end result.

# Challenge 2: Multi-Robot Warehouse Scheduling System

Starting from the current empty directory, build a complete, runnable full-stack web application: **a multi-robot warehouse scheduling and simulation system**.

## Goal

Multiple robots must execute transport jobs simultaneously inside a warehouse made of aisles, shelves, pickup locations, and workstations. The system must plan routes, prevent collisions, and replan in real time when an aisle is unexpectedly blocked. The interface must make every robot's position, planned route, current job, and reason for waiting immediately understandable.

## Required functionality

1. Generate a deterministic warehouse grid containing at least 8 robots, 20 shelves, 4 workstations, and several one-cell-wide bottleneck aisles.
2. Allow users to create transport jobs by selecting a shelf, destination workstation, and priority. The scheduler must automatically assign an available robot.
3. Implement a real pathfinding algorithm on the backend. Planned routes must never cross shelves, walls, or blocked cells.
4. Implement time-step-based path reservations that prevent:
	- Two robots from occupying the same cell at the same time.
	- Two robots from swapping cells during the same time step.
	- Robots entering a permanent head-on deadlock inside a narrow aisle.
5. Robots may wait or replan to resolve conflicts, but the system must expose the reason. High-priority jobs must not starve indefinitely.
6. The backend must advance the simulation using fixed time steps and remain the authoritative state source. The frontend must not independently decide final robot positions.
7. Stream state updates through WebSocket or SSE with monotonically increasing sequence numbers. After reconnecting, the client must obtain a complete snapshot and then continue applying newer events without reverting to stale state.
8. Allow users to block or unblock any traversable grid cell while the simulation is running. Affected robots must stop before entering the new obstacle and replan immediately.
9. Support pause, resume, single-step execution, and reset with the same deterministic seed so scheduling behavior can be reproduced.
10. Persist jobs, map changes, and the current simulation state so that a page reload can continue observing the same run.
11. The interface must display the warehouse map, planned robot paths, job queue, robot states, and event log at the same time. Desktop is the primary target, but the layout must not visibly break on a small screen.
12. Provide clear setup and start commands in a README, and ensure the project can complete a production build.
  
## Acceptance scenario

I will create at least three simultaneous transport jobs and watch robots pass through narrow aisles without colliding. I will then block a cell directly ahead of an active robot and verify immediate replanning. Finally, I will disconnect and reconnect the page and confirm that the snapshot and subsequent event sequence remain consistent.

This is a 25-minute challenge. Start implementing immediately. Prioritize scheduling correctness, space-time conflict avoidance, dynamic replanning, and real-time state consistency.