theme v4: 装饰层 + 砂狼白子 Q 版插画

- base.css 新增装饰层令牌 --tb-deco / -size / -position：固定 6 个槽位、固定像素四角定位，
  不受 cover 裁切影响（竖屏桌面会把贴边的插画切掉）。多层背景的列表长度必须恒定，
  值一多一少会整层错位（表现为整页重复同一张图）。
- shiroko：4 个 Q 版人物（wave/cheer/think/sit/doze），以用户立绘为参考图 image-to-image
  生成后抠白底；左右各两个、立绘在右下当水印。顶部用固定 96px 避开顶栏，
  真实视口 ≥920px 才补中间两个，矮屏不放（否则与立绘重叠）。
  深色关掉装饰层，图案改为几何纹样。
- sakura：顶栏取页面底色、顶栏链接提到次要文字色、uk-alert-primary 改粉底。
- 主题注入补上 /user 后台与 /vote 投票页（跟随箱主/发布者的语言与配色）。
- StaticVersion → 20261019m

conf/app.sample.ini

@@ -183,11 +183,14 @@ chat_max_messages = 200
 daily_message_limit_max = 999
 
 [theme]
-; 主题系统：只改配色 / 图案 / 整页背景，不涉及布局；仅提问箱相关页面生效。
+; 主题系统：只改配色 / 图案 / 整页背景，不涉及布局。
+; 作用范围：提问箱页面（主页 / 单题 / 密码 / 分享卡）、箱主本人的投票页与 /user 后台；
+;           首页、探索等站方页面保持站点默认外观。
 ; default   ：站点默认主题（箱主未选择时使用）。填 default 或留空 = 现有外观。
 ; available ：启用哪些主题，逗号分隔，同时是箱主设置页的白名单；
 ;             列了但 static/css/themes/<slug>.css 不存在的会被忽略并告警。
 ; 新增主题：把 static/css/themes/_scaffold.css 复制成 <slug>.css，
 ;           改选择器与令牌值，再把 <slug> 加进 available —— 不需要改模板。
+;           需要图片素材的，放 static/images/themes/<slug>/（static/fs.go 已嵌 images/themes 目录）。
 default = default
-available = default,sakura
+available = default,sakura,shiroko

docs/theme-shiroko.md

@@ -0,0 +1,95 @@
+# 主题「砂狼白子」（shiroko）
+
+阿拜多斯学园风格的灰蓝／银白配色，附带 Q 版人物插画。启用方式：
+
+```ini
+[theme]
+available = default,sakura,shiroko
+```
+
+箱主在「账号设置 → 主题外观」里选择即可。作用范围与其他主题一致：提问箱页面、本人投票页、`/user` 后台。
+
+## 配色
+
+| 令牌 | 浅色 | 深色 |
+| --- | --- | --- |
+| `--tb-bg` / `--tb-navbar` | `#edf2f8` | `#141a22` |
+| `--tb-surface` | `#ffffff` | `#1d2530` |
+| `--tb-surface-2` | `#e5ecf5` | `#273140` |
+| `--tb-border` | `#d6e0ec` | `#334052` |
+| `--tb-text` | `#222d3b` | `#e3eaf4` |
+| `--tb-primary` | `#4a7fc1` | `#6fa3e0` |
+
+## 插画布置
+
+| 位置 | 内容 | 尺寸 |
+| --- | --- | --- |
+| 右下角 | 用户提供的立绘（16% 透明，作背景水印） | `auto 520px` |
+| 左下角 | `doze`（站着打瞌睡） | `auto 240px` |
+| 左上角 | `wave`（挥手） | `auto 172px` |
+| 右上角 | `cheer`（双手欢呼） | `auto 160px` |
+| 右中 | `think`（托腮） | `auto 126px` |
+| 整页平铺 | 雪花 + 光环 + 圆环 + 点簇（320px 一铺） | `pattern.svg` |
+| ≤640px | 只保留立绘 + `doze`，尺寸减半 | `@media` |
+
+插画走 **装饰层**（`--tb-deco` / `--tb-deco-size` / `--tb-deco-position`），不是整页背景图：
+
+- 固定像素尺寸 + 四角定位，**任何视口比例都不会被裁切**（`cover` 做不到，竖屏桌面会把贴边的插画切掉）；
+- 固定 6 个槽位，必须写满 6 个值，缺的填 `none` —— 多背景各列表的层数必须恒定
+  （1 图案 + 6 装饰 + 1 背景 = 8），值一多一少，分层就整体错位（会出现整页重复小人）；
+- 深色模式关掉装饰层，只留底色与浅色图案。人物是银白／浅灰为主，压到深色底上会发灰发脏。
+
+## 素材清单
+
+位于 `static/images/themes/shiroko/`，已随二进制嵌入（`static/fs.go` 的 `images/themes`）。
+
+| 文件 | 用途 | 尺寸 | 体积 |
+| --- | --- | --- | --- |
+| `chibi/wave.webp` | 挥手 | 324×620 | 27KB |
+| `chibi/cheer.webp` | 双手欢呼 | 354×620 | 27KB |
+| `chibi/think.webp` | 托腮 | 283×620 | 26KB |
+| `chibi/doze.webp` | 打瞌睡 | 274×620 | 26KB |
+| `hero-fade.webp` | 用户立绘，预乘 16% 透明度 | 275×620 | 18KB |
+| `pattern.svg` | 浅色平铺（几何纹样） | 240×240 | 0.9KB |
+| `pattern-dark.svg` | 深色平铺 | 240×240 | 0.8KB |
+
+## 来源与授权
+
+| 素材 | 来源 |
+| --- | --- |
+| `static/images/shiroko-cutout.png` → `hero-fade.webp` | **用户自行用 AI 生成**的立绘，裁边后降透明度 |
+| `chibi/*.webp` | WorkBuddy ImageGen **以用户立绘为参考图**（image-to-image）生成，再抠白底 |
+| `pattern.svg` / `pattern-dark.svg` | 手写 SVG，纯几何，无外部素材 |
+
+### 生成与抠图参数
+
+- 参考图：`static/images/shiroko-cutout.png`，`input_fidelity: high`，保证角色造型与平涂风格一致；
+- 提示词骨架（四个姿态共用，只改动作句）：
+
+  > Same character, same art style as the reference image: flat vector illustration, no outlines,
+  > simple shapes, soft pastel colors, minimal detail. A chibi anime girl with short fluffy
+  > silver-grey bob hair, pointed grey wolf ears, a small tilted cyan halo ring above her head,
+  > pale blue dot eyes, cyan scarf, dark navy blazer, light grey pleated skirt, cyan and black
+  > sneakers. { 动作 } Plain pure white background (#FFFFFF), no shadow, no ground, no text, no watermark.
+
+- 动作句：`Standing full body, front view, one arm raised waving hello with a small smile` /
+  `both arms raised up cheering happily, big smile` /
+  `one hand resting on her cheek thinking, head slightly tilted` /
+  `eyes closed sleeping peacefully, head drooping slightly to one side`；
+- 抠图：从四角 + 四边中点共 8 点做 floodfill（容差 16），再对 alpha 做 1px MinFilter 收边去白边，
+  裁 bbox 后统一缩放到高 620、WebP q90。
+
+关键经验：**必须是"平涂无描边"**。先试过用手写 SVG 线稿，风格和用户那张立绘（色块、无描边）冲突，
+而且没有真人手感会画得很抽象；用参考图 + image-to-image 出来的四张，角色特征和画风都稳。
+
+**版权说明**：砂狼白子（砂狼シロコ）是《蔚蓝档案》的角色，版权归 NEXON Games / Yostar。
+本主题为**非商用同人装饰**，仅作个人站点外观使用；若站点转为商业用途，请自行取得授权或换成原创素材。
+
+## 替换 / 扩素材
+
+1. 加姿态：按上面的提示词骨架换动作句生成，白底 → 抠图 → 存 `chibi/<name>.webp`（高 620），
+   再塞进 `shiroko.css` 的 `--tb-deco`（记得保持 6 个值）。
+2. 换立绘：透明 PNG 覆盖 `static/images/shiroko-cutout.png`，按 620 高、alpha 16% 重新导出 `hero-fade.webp`。
+3. 换配色：改 `shiroko.css` 的令牌即可，插画是位图，换色需重新生成。
+4. 新增素材不需要改 `static/fs.go`（已嵌整个 `images/themes` 目录）；但改了 CSS 必须把
+   `conf.StaticVersion` +1，否则老访客吃缓存看不到变化。

internal/conf/static.go

@@ -10,7 +10,7 @@ var (
 	BuildCommit = "dev"
 
 	// StaticVersion 静态资源缓存版本号：base.css 与主题 css 共用，改样式只改这一处。
-	StaticVersion = "20261019g"
+	StaticVersion = "20261019m"
 )
 
 // 文本审核通道取值（[security] text_censor_source）。定义在 conf 侧，

internal/i18n/dict_en.go

@@ -940,4 +940,5 @@ var enDict = map[string]string{
 	"profile.theme.invalid":       "That theme is unavailable — pick one from the list",
 	"theme.name.default":          "Default look",
 	"theme.name.sakura":           "Sakura",
+	"theme.name.shiroko":          "Shiroko",
 }

internal/i18n/dict_ja.go

@@ -940,4 +940,5 @@ var jaDict = map[string]string{
 	"profile.theme.invalid":       "このテーマは利用できません。一覧から選択してください",
 	"theme.name.default":          "標準の外観",
 	"theme.name.sakura":           "さくら",
+	"theme.name.shiroko":          "シロコ",
 }

internal/i18n/dict_zh_cn.go

@@ -881,6 +881,7 @@ var zhCNDict = map[string]string{
 	"profile.theme.invalid":       "该主题不可用，请从列表中选择",
 	"theme.name.default":          "基础外观",
 	"theme.name.sakura":           "樱花",
+	"theme.name.shiroko":          "砂狼白子",
 
 	// 验证码 JSON 接口：前端消费（P2）
 	"captcha.json.badRequest": "请求格式错误",

internal/i18n/dict_zh_tw.go

@@ -940,4 +940,5 @@ var zhTWDict = map[string]string{
 	"profile.theme.invalid":       "該主題無法使用，請從清單中選擇",
 	"theme.name.default":          "基礎外觀",
 	"theme.name.sakura":           "櫻花",
+	"theme.name.shiroko":          "砂狼白子",
 }

outputs/preview-assets/base.css

@@ -29,6 +29,13 @@
       --tb-page-image: none;
       --tb-page-pattern: none;
       --tb-page-pattern-size: auto;
+      /* 装饰层：固定像素尺寸 + 四角定位，不受 cover 裁切影响（整页背景图做不到这一点，
+         视口比例一变，贴在图片边缘的插画就会被裁掉）。
+         ⚠️ 固定 6 个槽位：background-* 各列表的层数必须恒定（1 图案 + 6 装饰 + 1 背景 = 8），
+         缺省用 none 占位；值的个数一变，多背景的分层就会整体错位。 */
+      --tb-deco: none, none, none, none, none, none;
+      --tb-deco-size: auto, auto, auto, auto, auto, auto;
+      --tb-deco-position: left top, left top, left top, left top, left top, left top;
   }
   html[data-theme="dark"] {
       --tb-bg: #1a1d23;
@@ -266,12 +273,13 @@
   body {
       font-family: var(--tb-font);
       background-color: var(--tb-bg);
-      /* 主题的整页背景：图案（平铺）在上，图片（cover）在下，都不设置时等价于纯色 */
-      background-image: var(--tb-page-pattern, none), var(--tb-page-image, none);
-      background-size: var(--tb-page-pattern-size, auto), cover;
-      background-repeat: repeat, no-repeat;
-      background-position: left top, center center;
-      background-attachment: scroll, fixed;
+      /* 主题的整页背景：四角装饰 + 平铺图案 + cover 背景图（共 6 层，顺序即绘制顺序） */
+      background-image: var(--tb-page-pattern), var(--tb-deco), var(--tb-page-image);
+      background-size: var(--tb-page-pattern-size), var(--tb-deco-size), cover;
+      background-repeat: repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat,
+          no-repeat;
+      background-position: left top, var(--tb-deco-position), center center;
+      background-attachment: scroll, fixed, fixed, fixed, fixed, fixed, fixed, fixed;
       color: var(--tb-text);
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;

static/css/base.css

@@ -29,6 +29,13 @@
       --tb-page-image: none;
       --tb-page-pattern: none;
       --tb-page-pattern-size: auto;
+      /* 装饰层：固定像素尺寸 + 四角定位，不受 cover 裁切影响（整页背景图做不到这一点，
+         视口比例一变，贴在图片边缘的插画就会被裁掉）。
+         ⚠️ 固定 6 个槽位：background-* 各列表的层数必须恒定（1 图案 + 6 装饰 + 1 背景 = 8），
+         缺省用 none 占位；值的个数一变，多背景的分层就会整体错位。 */
+      --tb-deco: none, none, none, none, none, none;
+      --tb-deco-size: auto, auto, auto, auto, auto, auto;
+      --tb-deco-position: left top, left top, left top, left top, left top, left top;
   }
   html[data-theme="dark"] {
       --tb-bg: #1a1d23;
@@ -266,12 +273,13 @@
   body {
       font-family: var(--tb-font);
       background-color: var(--tb-bg);
-      /* 主题的整页背景：图案（平铺）在上，图片（cover）在下，都不设置时等价于纯色 */
-      background-image: var(--tb-page-pattern, none), var(--tb-page-image, none);
-      background-size: var(--tb-page-pattern-size, auto), cover;
-      background-repeat: repeat, no-repeat;
-      background-position: left top, center center;
-      background-attachment: scroll, fixed;
+      /* 主题的整页背景：四角装饰 + 平铺图案 + cover 背景图（共 6 层，顺序即绘制顺序） */
+      background-image: var(--tb-page-pattern), var(--tb-deco), var(--tb-page-image);
+      background-size: var(--tb-page-pattern-size), var(--tb-deco-size), cover;
+      background-repeat: repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat,
+          no-repeat;
+      background-position: left top, var(--tb-deco-position), center center;
+      background-attachment: scroll, fixed, fixed, fixed, fixed, fixed, fixed, fixed;
       color: var(--tb-text);
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;

static/css/themes/_scaffold.css

@@ -15,7 +15,7 @@
       display / flex / grid、position 一律不动 —— 主题不是换皮模板。
    3. 本文件不参与构建，仅作参考；真正生效的是同目录下的 <slug>.css。
 
-   ── 可用的 20 个令牌 ──────────────────────────────────────────────
+   ── 可用的 23 个令牌 ──────────────────────────────────────────────
    底色层   --tb-bg            页面底色（html/body）
             --tb-surface       卡片、输入框等前景面板
             --tb-surface-2     次级面（标签底、进度条轨道、代码块）
@@ -34,6 +34,10 @@
    页面背景 --tb-page-image    整页背景图（cover，fixed）
             --tb-page-pattern  整页图案（平铺，可叠加在背景图之上）
             --tb-page-pattern-size 图案平铺尺寸（默认 auto）
+   装饰     --tb-deco          四角装饰图，固定 6 个槽位（必须写满 6 个，缺的填 none）；
+                               固定像素尺寸、不随视口裁切，适合放人物/摆件。默认 none。
+            --tb-deco-size      对应每张的尺寸，如 auto 200px, auto 150px, auto, auto, auto, auto
+            --tb-deco-position  对应每张的位置，如 left 1% bottom 0, right 1% top 4%, left top, …
 
    ── 素材规格（放 R2，不需要重新编译） ─────────────────────────────
    页面背景图   2400×1600（3:2）或 2560×1440，WebP q80，≤300KB；明暗各一张：
@@ -75,6 +79,13 @@ html[data-theme-style="SLUG"] {
     --tb-page-image: none;
     --tb-page-pattern: none;
     --tb-page-pattern-size: auto;
+
+    /* 四角装饰（放人物/摆件）。固定 6 个槽位，必须写满，缺的填 none——
+       值一多一少，多背景各列表就错位（会出现整页重复同一张图）。
+       尺寸用「auto <高度>」，位置可写 left 2% bottom 0 / right 2% top 6% / left 2% center。 */
+    --tb-deco: none, none, none, none, none, none;
+    --tb-deco-size: auto, auto, auto, auto, auto, auto;
+    --tb-deco-position: left top, left top, left top, left top, left top, left top;
 }
 
 /* 2) 深色（必须）—— 深浅两套必须成对，缺一段会让深色用户看到「浅色的深色主题」 */

static/css/themes/sakura.css

@@ -1,14 +1,15 @@
 /* 樱花（sakura）：粉调 + 极淡网点，纯 CSS 实现，不依赖图片素材。
    只覆盖令牌，不改动任何布局。要点：
    - 页面底色用纯色（不用渐变），保证整页色感一致；
-   - 顶栏与卡片都是「带粉调的暖白」而不是纯白，和粉底之间是过渡不是硬切；
+   - 顶栏直接取页面底色（--tb-navbar 与 --tb-bg 同值），否则一条近白/灰的横带压在粉底上很突兀；
+   - 卡片用暖白（--tb-surface）而不是纯白，和粉底之间是过渡不是硬切；
    - 网点放大到 24px、透明度降到 0.05，只作纸纹，不在留白处抢注意力。 */
 html[data-theme-style="sakura"] {
     --tb-bg: #fceef3;
     --tb-surface: #fffafc;
     --tb-surface-2: #fbe8ee;
     --tb-surface-hover: #fdf1f5;
-    --tb-navbar: #fff6f9;
+    --tb-navbar: #fceef3;
     --tb-border: #f2dde4;
 
     --tb-text: #3a2b30;
@@ -31,7 +32,7 @@ html[data-theme="dark"][data-theme-style="sakura"] {
     --tb-surface: #2f2228;
     --tb-surface-2: #3a2a33;
     --tb-surface-hover: rgba(255, 138, 176, 0.10);
-    --tb-navbar: #2a1e24;
+    --tb-navbar: #241a1f;
     --tb-border: #4a333e;
 
     --tb-text: #f2e4e9;
@@ -48,3 +49,18 @@ html[data-theme="dark"][data-theme-style="sakura"] {
     --tb-page-pattern: radial-gradient(circle at 1px 1px, rgba(255, 138, 176, 0.05) 1px, transparent 1.4px);
     --tb-page-pattern-size: 24px 24px;
 }
+
+/* 组件微调（仅外观）：顶栏融进粉底后，UIkit 默认的 #999 链接色在粉上偏淡，
+   提到次要文字色；hover 用主色保留反馈。深色由 base.css 的 !important 规则接管。 */
+html[data-theme-style="sakura"] .uk-navbar-nav > li > a {
+    color: var(--tb-text-secondary);
+}
+html[data-theme-style="sakura"] .uk-navbar-nav > li > a:hover {
+    color: var(--tb-primary);
+}
+/* 信息提示条（匿名参与提示 / 空列表 / 未开始）：UIkit 的浅蓝在粉底上是唯一的冷色块，
+   换成浅粉底 + 深玫瑰文字（约 5.3:1）。深色由 base.css 的 !important 规则接管。 */
+html[data-theme-style="sakura"] .uk-alert-primary {
+    background-color: var(--tb-primary-weak);
+    color: #a63a5e;
+}

static/css/themes/shiroko.css

@@ -0,0 +1,109 @@
+/* 砂狼白子（shiroko）：阿拜多斯学园的灰蓝／银白配色。
+   只覆盖令牌与外观层面的组件微调，不改任何布局。
+
+   素材（static/images/themes/shiroko/）：
+   - chibi/*.webp       Q 版人物（wave/cheer/think/doze），以用户立绘为参考图生成 + 抠白底
+   - hero-fade.webp     用户提供的立绘（16% 透明，贴右下角当整页装饰）
+   - pattern.svg / pattern-dark.svg   雪花 + 光环 + 圆环点簇的平铺纹样
+   来源、提示词与抠图参数见 docs/theme-shiroko.md。 */
+html[data-theme-style="shiroko"] {
+    --tb-bg: #edf2f8;
+    --tb-surface: #ffffff;
+    --tb-surface-2: #e5ecf5;
+    --tb-surface-hover: #eaf1f9;
+    --tb-navbar: #edf2f8;
+    --tb-border: #d6e0ec;
+
+    --tb-text: #222d3b;
+    --tb-text-secondary: #51607a;
+    --tb-text-muted: #8794a7;
+
+    --tb-primary: #4a7fc1;
+    --tb-primary-weak: rgba(74, 127, 193, 0.11);
+
+    --tb-shadow: 0 1px 2px rgba(38, 56, 82, 0.05), 0 12px 28px -18px rgba(38, 56, 82, 0.24);
+    --tb-shadow-hover: 0 1px 2px rgba(38, 56, 82, 0.07), 0 18px 40px -20px rgba(38, 56, 82, 0.32);
+
+    /* 整页底色用极浅的竖向渐变（纯 CSS）：比图片稳，不会有 cover 缩放差异 */
+    --tb-page-image: linear-gradient(180deg, #f8fbfe 0%, #edf3f9 58%, #e2ecf6 100%);
+    --tb-page-pattern: url("/static/images/themes/shiroko/pattern.svg");
+    --tb-page-pattern-size: 320px 320px;
+
+    /* 装饰层：左右各两个（上一下一），立绘在右下当背景水印。
+       顶部用固定 92px 而不是百分比：顶栏高 80px，百分比会随视口高度浮动、把头顶压进顶栏。 */
+    --tb-deco: url("/static/images/themes/shiroko/hero-fade.webp"),
+        url("/static/images/themes/shiroko/chibi/sit.webp"),
+        url("/static/images/themes/shiroko/chibi/wave.webp"),
+        url("/static/images/themes/shiroko/chibi/cheer.webp"),
+        none,
+        none;
+    --tb-deco-size: auto 420px, auto 240px, auto 172px, auto 160px, auto, auto;
+    --tb-deco-position: right 1% bottom 6px, left 1% bottom 6px, left 2% top 96px,
+        right 2% top 96px, left top, left top;
+}
+
+html[data-theme="dark"][data-theme-style="shiroko"] {
+    --tb-bg: #141a22;
+    --tb-surface: #1d2530;
+    --tb-surface-2: #273140;
+    --tb-surface-hover: rgba(111, 163, 224, 0.12);
+    --tb-navbar: #141a22;
+    --tb-border: #334052;
+
+    --tb-text: #e3eaf4;
+    --tb-text-secondary: #a6b4c8;
+    --tb-text-muted: #77869b;
+
+    --tb-primary: #6fa3e0;
+    --tb-primary-weak: rgba(111, 163, 224, 0.16);
+
+    --tb-shadow: 0 1px 2px rgba(0, 0, 0, 0.34), 0 12px 28px -18px rgba(0, 0, 0, 0.58);
+    --tb-shadow-hover: 0 1px 2px rgba(0, 0, 0, 0.40), 0 18px 40px -20px rgba(0, 0, 0, 0.68);
+
+    --tb-page-image: linear-gradient(180deg, #161d26 0%, #141a22 60%, #11161d 100%);
+    --tb-page-pattern: url("/static/images/themes/shiroko/pattern-dark.svg");
+    --tb-page-pattern-size: 320px 320px;
+
+    /* 深色下浅色线稿会糊成灰块，装饰层整体关掉，只留底色与浅色图案 */
+    --tb-deco: none, none, none, none, none, none;
+    --tb-deco-size: auto, auto, auto, auto, auto, auto;
+    --tb-deco-position: left top, left top, left top, left top, left top, left top;
+}
+
+/* 高屏才放中间两个：矮屏（1366×768 等）立绘从 348px 起，中间位会和它重叠。
+   门槛按「真实视口」定：1080p 全屏的 innerHeight 约 950-990，所以写 920 而不是 1050。 */
+@media (min-height: 920px) {
+    html[data-theme-style="shiroko"] {
+        --tb-deco: url("/static/images/themes/shiroko/hero-fade.webp"),
+            url("/static/images/themes/shiroko/chibi/sit.webp"),
+            url("/static/images/themes/shiroko/chibi/wave.webp"),
+            url("/static/images/themes/shiroko/chibi/cheer.webp"),
+            url("/static/images/themes/shiroko/chibi/think.webp"),
+            url("/static/images/themes/shiroko/chibi/doze.webp");
+        --tb-deco-size: auto 420px, auto 240px, auto 172px, auto 160px, auto 126px, auto 126px;
+        --tb-deco-position: right 1% bottom 6px, left 1% bottom 6px, left 2% top 96px,
+            right 2% top 96px, left 2.6% top 46%, right 2.6% top 46%;
+    }
+}
+
+/* 窄屏：只保留立绘和一个坐姿，尺寸同步收小 */
+@media (max-width: 640px) {
+    html[data-theme-style="shiroko"] {
+        --tb-deco: url("/static/images/themes/shiroko/hero-fade.webp"),
+            url("/static/images/themes/shiroko/chibi/sit.webp"), none, none, none, none;
+        --tb-deco-size: auto 300px, auto 130px, auto, auto, auto, auto;
+        --tb-deco-position: right 2% bottom 0, left 1% bottom 0, left top, left top, left top,
+            left top;
+        --tb-page-pattern-size: 240px 240px;
+    }
+}
+
+/* 组件微调（仅外观） */
+
+/* 顶栏融进页面底色后，UIkit 默认的 #999 在灰蓝底上偏淡，提到次要文字色 */
+html[data-theme-style="shiroko"] .uk-navbar-nav > li > a {
+    color: var(--tb-text-secondary);
+}
+html[data-theme-style="shiroko"] .uk-navbar-nav > li > a:hover {
+    color: var(--tb-primary);
+}

static/fs.go

@@ -8,5 +8,5 @@ import (
 	"embed"
 )
 
-//go:embed favicon.ico sitemap.xml llms.txt llms-full.txt robots.txt tamabox.changelogs.json index-now/66e5e0911b0941f2ba7dbfbbd961e9be.txt css/base.css css/themes
+//go:embed favicon.ico sitemap.xml llms.txt llms-full.txt robots.txt tamabox.changelogs.json index-now/66e5e0911b0941f2ba7dbfbbd961e9be.txt css/base.css css/themes images/themes
 var FS embed.FS

static/images/themes/shiroko/pattern-dark.svg

@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="240" height="240" viewBox="0 0 240 240">
+  <g fill="none" stroke="#A8C6EC" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" opacity="0.14">
+    <g transform="translate(50 54)">
+      <path d="M0 -20V20M-17.3 -10L17.3 10M-17.3 10L17.3 -10"/>
+      <path d="M0 -20l-4.5 4.5M0 -20l4.5 4.5M0 20l-4.5-4.5M0 20l4.5-4.5"/>
+    </g>
+    <ellipse cx="178" cy="60" rx="21" ry="7.5"/>
+    <circle cx="104" cy="144" r="9"/>
+    <circle cx="104" cy="144" r="3.2"/>
+    <circle cx="152" cy="198" r="1.8"/>
+    <circle cx="166" cy="186" r="1.4"/>
+    <circle cx="72" cy="120" r="1.4"/>
+    <path d="M206 194v10M201 199h10"/>
+    <circle cx="32" cy="196" r="1.6"/>
+    <circle cx="210" cy="138" r="1.3"/>
+  </g>
+</svg>

static/images/themes/shiroko/pattern.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="240" height="240" viewBox="0 0 240 240">
+  <g fill="none" stroke="#6F90BC" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" opacity="0.2">
+    <!-- 雪花 -->
+    <g transform="translate(50 54)">
+      <path d="M0 -20V20M-17.3 -10L17.3 10M-17.3 10L17.3 -10"/>
+      <path d="M0 -20l-4.5 4.5M0 -20l4.5 4.5M0 20l-4.5-4.5M0 20l4.5-4.5"/>
+    </g>
+    <!-- 光环 -->
+    <ellipse cx="178" cy="60" rx="21" ry="7.5"/>
+    <!-- 小圆环 + 点簇（保持密度，不再放人形，避免和正文插画抢戏） -->
+    <circle cx="104" cy="144" r="9"/>
+    <circle cx="104" cy="144" r="3.2"/>
+    <circle cx="152" cy="198" r="1.8"/>
+    <circle cx="166" cy="186" r="1.4"/>
+    <circle cx="72" cy="120" r="1.4"/>
+    <!-- 碎星 -->
+    <path d="M206 194v10M201 199h10"/>
+    <circle cx="32" cy="196" r="1.6"/>
+    <circle cx="210" cy="138" r="1.3"/>
+  </g>
+</svg>

static/tamabox.changelogs.json

@@ -7,7 +7,7 @@
     {
       "collectionId": "tamabox",
       "collectionName": "tamabox-changelogs",
-      "content": "新增：箱主主题功能。设置页可为主题选择配色、图案与整页背景（不影响布局）；提问箱页面（箱主页 / 单题页 / 密码页 / 分享卡）、你发布的投票页与箱主本人后台都会跟随所选主题，首页、探索等公开页保持站点默认外观；未选择时跟随站点默认主题。<br>\n新增：主题底稿 static/css/themes/_scaffold.css，复制改名为 &lt;slug&gt;.css 并在 [theme] available 登记即可新增一套主题，无需改模板；示例主题「樱花」。",
+      "content": "新增：箱主主题功能。设置页可为主题选择配色、图案与整页背景（不影响布局）；提问箱页面（箱主页 / 单题页 / 密码页 / 分享卡）、你发布的投票页与箱主本人后台都会跟随所选主题，首页、探索等公开页保持站点默认外观；未选择时跟随站点默认主题。<br>\n新增：主题底稿 static/css/themes/_scaffold.css，复制改名为 &lt;slug&gt;.css 并在 [theme] available 登记即可新增一套主题，无需改模板；示例主题「樱花」「砂狼白子」（后者附 Q 版人物简笔画与整页装饰，来源与生成方式见 docs/theme-shiroko.md）。",
       "created": "2026-10-19 15:10:00.000Z",
       "id": "none",
       "published_at": "2026-10-19 15:10:00.000Z",