分享一个主题，琥珀

最近闲来无事vibe了一套Typecho主题，也就是现在你看到的这个网站主题，取名「琥珀」（Amber）。核心诉求很直白：暗色优先、科技感、轻量、能直接拿来写博客。今天把它整理出来开源分享。

主题特色

1. 暗色科技，琥珀点缀
   整套主题以 #0a0a0a 为底，辅以三层灰阶递进，营造纵深。强调色统一使用琥珀金（#f59e0b），只在该亮的地方亮——按钮 hover、链接高亮、卡片边缘微光、表格行高亮左边界。不滥用发光，保持克制。

支持明暗双主题切换，localStorage 持久化 + 系统偏好跟随，CSS 加载前内联脚本防闪烁。

2. 毛玻璃 + 微动效
   导航栏、搜索框、浮动按钮、APM 结果气泡统一采用 backdrop-filter: blur(16px) saturate(180%) 毛玻璃效果，配合 --glass-* 设计 token 保持一致性。
   动效只做该做的：卡片入场淡入上移、滚动吸顶毛玻璃、按钮 hover 微光、背景齿轮缓慢旋转。不做全屏粒子——之前试过，性能开销大，最终换成了局部 Canvas 齿轮动画。
3. 背景齿轮动画
   纯 Canvas + 极坐标算法生成对称齿廓，9 个齿轮互相啮合缓慢旋转，半透明呈现若隐若现的效果。移动端自动缩放至 280×280px，prefers-reduced-motion 时可关闭。后台可一键禁用。
4. 完整的内容功能
   卡片式首页：封面图 + 摘要 + 分类/标签色块 + 阅读时长
   文章页：目录 TOC、代码高亮（highlight.js 琥珀主题）、图片 Lightbox 点击查看原图、表格 hover 高亮
   侧边栏：个人资料 + 数字递增动画、分类、标签云（确定性 HSL 配色，每个标签唯一色相）、最新/最热文章
   标签云独立页：page-tags.php 模板
   评论：嵌套楼层、博主标识、UA 解析
   搜索：毛玻璃浮层搜索，不阻塞页面交互
5. APM 测试小彩蛋
   页脚藏了个 APM（Actions Per Minute）测试器。一个 ^_^ 小框，狂点 100 次后计算每分钟操作数并固定显示在上方，下次完成自动替换。后台可填图片 URL 替换默认表情。
6. 标签确定性配色：扫描数据库所有分类标签，按名称 CRC32 分配色相，避开琥珀色域，保证同一标签每次刷新颜色一致

免费分享

这套主题完全免费开源，托管在 GitHub：

https://github.com/musnow/typecho-theme-amber

下载后丢进 Typecho 的 usr/themes/ 目录，后台启用即可。后台「外观 → 琥珀 设置」可配置 Logo、GitHub/Twitter、备案号、侧边栏、字体源、背景动画、代码高亮、APM 头像。