npm install -g @google/gemini-cli@latest

Objective: Build a visually stunning, photorealistic 3D Voxel simulation of the Golden Gate Bridge using Three.js, prioritizing quality and complex visuals (no simple blocks),  atmospheric depth and 60FPS performance.

Visuals & Atmosphere:
- Lighting: Slider (0-24h) controlling sun position, light intensity, sky color, and fog color.
- Fog: Volumetric-style fog using sprite particles that drift and bob. Slider 0-100. 0 = True Zero (Crystal Clear). 100 = Dense but realistic (not whiteout).
- Water: Custom GLSL shader with waves, specular reflections, and manual distance-based fog blending (exp2) for seamless horizon integration.
- Post-Processing: ACESFilmic Tone Mapping and UnrealBloom (optimized for glowing lights at night).

Scene Details:
- Bridge: Art Deco towers with concrete piers (anchored to seabed), main span catenary cables, and suspenders.
- Terrain: Low-poly Marin Headlands and SF Peninsula.
- Skyline: Procedural city blocks on the SF side.
- Traffic: Up to 400 cars using \`InstancedMesh\`, positioned accurately on top of the deck (ensure vertical alignment prevents clipping into the concrete). Each car features emissive headlights (white) and taillights (red).
- Ships: Procedural cargo ships with hull, containers, and functional navigation lights (Port/Starboard/Mast/Cabin) moving along the water.
- Nature: Animated flocking birds.
- Night Mode: At night, activate city lights, car headlights, ship navigation lights, tower beacons, street lights.

Tech & Controls:
- Core: Must output only single HTML file \`golden_gate_bridge.html\` to be run in a blank Chrome tab. Import Three.js/Addons via CDN map.
  -   \`three\` (Core library) via CDN (ES Modules).
  -   \`three/examples/jsm/...\` modules via Import Map.
  -   No build step (Vite/Webpack). Pure HTML/JS.

- UI: Visually appealing sliders for Time (0-24h), Fog Density (0-100%), Traffic Density (0-100%), and Camera Zoom.
- Optimization: \`InstancedMesh\` for all repetitive elements (cars, lights, birds).


目标： 使用 Three.js 构建一个视觉效果惊艳、照片级真实的金门大桥 3D 体素（Voxel）模拟。优先考虑画质和复杂的视觉效果（不要简单的方块），以及大气纵深感和 60FPS 的性能表现。
视觉与氛围：
光照： 滑块（0-24小时）控制太阳位置、光照强度、天空颜色和雾气颜色。
雾气： 使用漂浮和摆动的精灵粒子（sprite particles）制作体积雾。滑块 0-100。0 = 绝对零度（清晰透明）。100 = 浓密但真实（不是全白）。
水面： 自定义 GLSL 着色器，带有波浪、镜面反射和基于距离的手动雾气混合（exp2），以实现无缝的地平线融合。
后期处理： ACESFilmic 色调映射和 UnrealBloom（针对夜间发光灯光进行了优化）。
场景细节：
桥梁： 带有混凝土桥墩（锚定在海底）、主跨悬链线和吊索的装饰艺术风格塔楼。
地形： 低多边形的马林岬角（Marin Headlands）和旧金山半岛。
天际线： 旧金山一侧的程序化城市街区。
交通： 使用 InstancedMesh 生成多达 400 辆汽车，准确放置在桥面上（确保垂直对齐，防止穿模进入混凝土）。每辆车都有自发光的前灯（白色）和尾灯（红色）。
船只： 带有船体、集装箱和功能性航行灯（左舷/右舷/桅杆/船舱）的程序化货船沿水面移动。
自然： 动画化的鸟群。
夜间模式： 在夜间，激活城市灯光、汽车前灯、船只航行灯、塔楼信标和路灯。
技术与控制：
核心： 必须仅输出单个 HTML 文件 golden_gate_bridge.html，以便在空白 Chrome 标签页中运行。通过 CDN map 导入 Three.js/插件。
通过 CDN (ES Modules) 导入 three (核心库)。
通过 Import Map 导入 three/examples/jsm/... 模块。
无构建步骤 (Vite/Webpack)。纯 HTML/JS。
UI： 视觉美观的滑块，用于控制时间（0-24小时）、雾气密度（0-100%）、交通密度（0-100%）和摄像机缩放。
优化： 对所有重复元素（汽车、灯光、鸟类）使用 InstancedMesh。

Create a UI for "Project Constellation," an internal brand intelligence tool prototype that shows a customer acquisition pipeline. The aesthetic is an ultra-creative, futuristic dark-mode nebula. Luminous, iridescent threads representing customer journeys weave through semi-transparent glass pillars. A sleek, floating data card with Tailwind CSS precision materializes when hovering over a pillar. I've prepared a sketch for you to work from: @sketch.png.

为“星座计划（Project Constellation）”创建一个 UI，这是一个展示获客渠道的内部品牌情报工具原型。其审美风格是极具创意的、未来主义的暗黑模式星云风格。代表客户旅程的发光、彩虹色丝线穿梭于半透明的玻璃柱之间。当鼠标悬停在柱子上时，一张具有 Tailwind CSS 精度的时尚浮动数据卡片将会显现。我已经为你准备了一张草图作为参考：@sketch.png。

At some point I lost the commit that set my default theme to dark. 
Find it for me with git bisect and return the hash to me.

之前某个时候，我弄丢了将默认主题设置为暗色模式的那个提交（commit）。
请用 git bisect 帮我找到它，并将哈希值（hash）返回给我。

"This is an application that does not have any documentation and we do not have a technical writer. Before you begin, review all of the code. Then make me a user documentation. This document should only explain user facing features, but make sure to explain every single feature such as usage of the app, command line options, authentication options, built in tools, and all other user facing features. For certain features such as MCP or extensions, also explain the topic and concept so that the user has a better understanding. Since this is an open source project, provide an architectural overview of how the code is laid out, a summary of each component, and how they can contribute to the open-source project. The document should be organized and formatted so that it is easy to read and find. Do not make it a single html page. Make sure to add a search feature."

这是一个没有任何文档的应用程序，而且我们没有技术文档撰写人员。在你开始之前，请审查所有的代码。然后为我制作一份用户文档。这份文档应该只解释面向用户的功能，但务必解释每一个功能，例如应用程序的用法、命令行选项、身份验证选项、内置工具以及所有其他面向用户的功能。对于某些特定功能（如 MCP 或扩展），还请解释其主题和概念，以便用户能有更好的理解。由于这是一个开源项目，请提供代码布局的架构概览、每个组件的摘要，以及如何为这个开源项目做出贡献。文档的组织和格式应易于阅读和查找。不要把它做成单页 HTML。请务必添加搜索功能。

Users are reporting that the "Save Changes" button is slow, investigate the 'tech-stack' service

用户报告称“保存更改”按钮响应缓慢，请调查 'tech-stack' 服务。