主题生成器：素材尺寸按视口自适应 + 导出画质可调

- 尺寸单位 4 档：fit(按高)/fitw(按宽)/px/vh，输出 auto clamp(min(calc(100vh-24px),55%),基准,上限)，下限让位视口 → 自适应单位永不把图撑出屏幕
- fitw 补上宽幅素材：fit 只按高度缩，16:9 素材在 390 竖屏仍出 1001px 宽（照裁）
- 视口预设带高度（含 390×844）；layerMetrics 统一出 CSS/预览框/溢出检测，图层编辑区显示实测尺寸并报越界，可一键按当前视口修好
- 窄屏每层策略（原样/缩小/隐藏）+ 缩放系数；修 @media 只覆盖全局、独立配置页面在手机上从不生效的特异性 bug
- 导出画质：质量滑块（上限 0.95，Skia 在 q=1 切无损会反常）+ 长边上限，改动后从原图重算
- base.css 新增 --tb-page-position（默认 center center，旧主题不受影响），StaticVersion +1
- 新增 ?dump=fit / ?dump=quality 自检，README 与 _scaffold.css 同步

static/css/base.css

@@ -29,6 +29,7 @@
       --tb-page-image: none;
       --tb-page-pattern: none;
       --tb-page-pattern-size: auto;
+      --tb-page-position: center center;
       /* 装饰层：固定像素尺寸 + 四角定位，不受 cover 裁切影响（整页背景图做不到这一点，
          视口比例一变，贴在图片边缘的插画就会被裁掉）。
          ⚠️ 固定 6 个槽位：background-* 各列表的层数必须恒定（1 图案 + 6 装饰 + 1 背景 = 8），
@@ -282,7 +283,7 @@
       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, no-repeat, no-repeat, no-repeat, no-repeat;
-      background-position: left top, var(--tb-deco-position), center center;
+      background-position: left top, var(--tb-deco-position), var(--tb-page-position, center center);
       background-attachment: scroll, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed,
           fixed, fixed;
       color: var(--tb-text);

static/css/themes/_scaffold.css

@@ -35,11 +35,20 @@
    页面背景 --tb-page-image    整页背景图（cover，fixed）
             --tb-page-pattern  整页图案（平铺，可叠加在背景图之上）
             --tb-page-pattern-size 图案平铺尺寸（默认 auto）
+            --tb-page-position 背景焦点（cover 裁切时保留哪一侧，默认 center center）
    装饰     --tb-deco          装饰图层，固定 10 个槽位（必须写满 10 个，缺的填 none）；
-                               固定像素尺寸、不随视口裁切，适合放人物/摆件/光斑。默认 none。
+                               适合放人物/摆件/光斑。默认 none。
                                值可以是图片，也可以是 linear-gradient / radial-gradient（纯"光"）。
             --tb-deco-size      对应每层的尺寸，如 auto 400px, 100% 100%, auto, …（10 个）
+                               想随视口缩就用 clamp，不要写死 px：
+                                 人物/竖幅  auto clamp(min(calc(100vh - 24px), 231px), 46.67vh, 420px)
+                                 横幅/场景  clamp(min(calc(100vw - 24px), 587px), 70.57vw, 1067px) auto
+                               内层 min() 是兜底：屏幕小到连下限都放不下时让位给视口。
+                               background-size 的百分比是相对「容器 − 图片」，和 position 不同，
+                               所以用 clamp 比用 % 好推理。
             --tb-deco-position  对应每层的位置，如 calc(50% - 524px) calc(100% - 36px), …（10 个）
+                               两值形式（水平 垂直）；别用 left/bottom 关键字混搭成三值，
+                               非法时整条声明作废，图层会静默掉回左上角。
 
    ── 素材规格（放 R2，不需要重新编译） ─────────────────────────────
    页面背景图   2400×1600（3:2）或 2560×1440，WebP q80，≤300KB；明暗各一张：