feat: 第 2 页满铺「墙」背景并新增墙上画框

背景按 page1「天」的明度铺满「墙」，前景标题与两列曲目四周整格扣空并居中；
灯笼右移一格、链加长两节使整体下沉；墙上以「框」包「图」拼出画框。

assets/css/page2.css

@@ -1,5 +1,6 @@
-/* 第 2 页：无「天」背景；地、桌、椅、枪 */
+/* 第 2 页：满铺淡色「墙」背景，明度同 page1 的「天」 */
 
+.wall { color: rgba(190, 200, 240, 0.15); }
 .ground { color: color-mix(in srgb, #8a7350 55%, #000); }
 .table { color: color-mix(in srgb, #c08a4e 60%, #000); }
 .chair { color: color-mix(in srgb, #d98f3f 65%, #000); }
@@ -16,11 +17,16 @@
 .tassel { color: color-mix(in srgb, #d8382a 80%, #000); }
 .core { color: #ffe23a; }
 
+/* 墙上画框：偏橄榄的古铜金，避免与本页既有的橙、棕、亮黄重复；画面为灰白 */
+.frame { color: color-mix(in srgb, #e0c34a 62%, #000); }
+.picture { color: color-mix(in srgb, #e8e8e4 42%, #000); }
+
 /* 前景标题「酒水单」：字号与颜色同 page3 的「演职员表」；
-   em 相对自身 1.6em 字号，3.125em = 距顶 5 格，2.5em = 距左 4 格 */
+   em 相对自身 1.6em 字号，2.9375em = 距顶 4.7 格（居中于留空行 4–6），
+   2.5em = 距左 4 格 */
 .listing {
   position: absolute;
-  top: 3.125em;
+  top: 2.9375em;
   left: 2.5em;
   margin: 0;
   color: #f2f2f2;
@@ -33,7 +39,7 @@
 }
 
 /* 酒水单列表：前景两列，各自定位；
-   字号 1.25em，故 em = 格数 ÷ 1.25（如 9 格 = 7.2em） */
+   字号 1.25em，故 em = 格数 ÷ 1.25（如 12.25 格 = 9.8em） */
 .program {
   position: absolute;
   inset: 0;
@@ -44,8 +50,8 @@
 }
 
 .program-col { position: absolute; }
-.program-col-1 { top: 10em; left: 3.2em; }
+.program-col-1 { top: 10.2em; left: 4em; }    /* 距顶 12.75 格、距左 5 格，居中于行 12–25 */
-.program-col-2 { top: 12em; left: 14.4em; }
+.program-col-2 { top: 11.8em; left: 13.6em; } /* 距顶 14.75 格、距左 17 格，居中于行 14–32 */
 
 .program-item {
   display: flex;

assets/js/page2.js

@@ -1,6 +1,5 @@
 /* 第 2 页场景数据
-   全部为背景字：地、桌、椅、枪，均按格对齐。
+   背景字满铺「墙」，明度同 page1 的「天」；前景文字四周整格扣空。 */
-   本页不铺「天」，空白格保持为空。 */
 
 (() => {
   /* 按矩形铺字，逐行生成一条 glyph */
@@ -12,10 +11,14 @@
       cls,
     }));
 
+  /* 扣空：按整格清空，保证留下的背景都是完整字 */
+  const clear = (x, y, w, h) => block(x, y, w, h, '　', 'void');
+
   TextScene.render({
     cols: 28,
     rows: 44,
-    skyChar: '',
+    skyChar: '墙',
+    skyClass: 'wall',
     glyphs: [
       /* 地：最后一排 */
       { text: '地'.repeat(28), x: 0, y: 43, cls: 'ground' },
@@ -55,20 +58,34 @@
       ...block(25, 39, 2, 3, '酒', 'wine'),
       ...block(24, 42, 4, 1, '桶', 'barrel'),
 
-      /* 灯笼：右上角，4 格宽；灰链—橙笼作顶盖—橙侧边去角，内里亮黄灯芯 */
+      /* 灯笼：右上角，4 格宽；链加长两节使整体下移两格，并整体右移一格 */
-      { text: '链', x: 23, y: 0, cls: 'chain' },
+      { text: '链', x: 24, y: 0, cls: 'chain' },
-      ...block(22, 1, 2, 1, '链', 'chain'),
+      { text: '链', x: 24, y: 1, cls: 'chain' },
-      { text: '链', x: 22, y: 2, cls: 'chain' },
+      { text: '链', x: 24, y: 2, cls: 'chain' },
-      ...block(22, 3, 2, 1, '笼', 'cap'),
+      ...block(23, 3, 2, 1, '链', 'chain'),
-      ...block(21, 4, 1, 3, '笼', 'shade'),
+      { text: '链', x: 23, y: 4, cls: 'chain' },
-      ...block(24, 4, 1, 3, '笼', 'shade'),
+      ...block(23, 5, 2, 1, '笼', 'cap'),
-      ...block(22, 4, 2, 3, '灯', 'core'),
+      ...block(22, 6, 1, 3, '笼', 'shade'),
-      ...block(22, 7, 2, 1, '笼', 'shade'),
+      ...block(25, 6, 1, 3, '笼', 'shade'),
+      ...block(23, 6, 2, 3, '灯', 'core'),
+      ...block(23, 9, 2, 1, '笼', 'shade'),
 
       /* 穗：灯笼底下四字，上行两格、下行左右分开 */
-      ...block(22, 8, 2, 1, '穗', 'tassel'),
+      ...block(23, 10, 2, 1, '穗', 'tassel'),
-      { text: '穗', x: 21, y: 9, cls: 'tassel' },
+      { text: '穗', x: 22, y: 11, cls: 'tassel' },
-      { text: '穗', x: 23, y: 9, cls: 'tassel' },
+      { text: '穗', x: 24, y: 11, cls: 'tassel' },
+
+      /* 画框：墙上 8×6 矩形，「框」为边、「图」作画面 */
+      ...block(12, 3, 8, 1, '框', 'frame'),
+      ...block(12, 8, 8, 1, '框', 'frame'),
+      ...block(12, 4, 1, 4, '框', 'frame'),
+      ...block(19, 4, 1, 4, '框', 'frame'),
+      ...block(13, 4, 6, 4, '图', 'picture'),
+
+      /* 前景留白：文字外框各放约半格，再向外取整格扣空，文字在其中居中 */
+      ...clear(3, 4, 7, 3),    /* 「酒水单」y4.7–6.3 → 行 4–6 */
+      ...clear(4, 12, 8, 14),  /* 第一列 y12.75–25.25 → 行 12–25 */
+      ...clear(16, 14, 8, 19), /* 第二列 y14.75–32.25 → 行 14–32 */
     ],
   });