fix(phone-image): 修復5個UI問題

1. 中間預覽區工具欄折行: 縮小字號/間距(gap 8->4, font 12->11px)
2. 右側畫布缺少頁間距: 新增scaleWrapper裁切transform溢出
3. 右側對齊下拉框不可見: select改為正常文檔流,移除position:absolute
4. 正文水平居中: dom-page-content添加text-align:left
5. 列表不顯示序號/圓點: 顯式設置list-style-type + display:list-item

public/static/js/phone-image.js

@@ -1515,9 +1515,14 @@ var PhoneImageEngine = (function () {
             var $thumbItem = $('<div class="preview-thumb-item" data-page-index="' + i + '"></div>').css({
                 'flex-shrink': '0',
                 'width': thumbWidth + 'px',
-                'position': 'relative'
+                'position': 'relative',
+                'margin-bottom': '8px'
             });
 
+            // 创建overflow:hidden的缩放wrapper，裁切transform:scale溢出
+            var scaledH = Math.round(sizeConfig.height * scaleRatio);
+            var $scaleWrapper = $('<div style="overflow:hidden;width:' + thumbWidth + 'px;height:' + scaledH + 'px;"></div>');
+
             // 创建DOM分页容器（实际尺寸，通过transform缩放显示为缩略图）
             var $container = $('<div class="dom-page-container"></div>').css({
                 'transform': 'scale(' + scaleRatio + ')',
@@ -1535,13 +1540,14 @@ var PhoneImageEngine = (function () {
             // pages[].html 是完整的 .phone-image-page 结构（含品牌header、内容、页码、水印）
             $container.html(domPage.html);
 
-            $thumbItem.append($container);
+            $scaleWrapper.append($container);
+            $thumbItem.append($scaleWrapper);
 
             // 页码标签（N/M格式）
             var $pageNum = $('<span class="preview-thumb-page-num"></span>').text((i + 1) + '/' + totalPages);
             $thumbItem.append($pageNum);
 
-            // 对齐select（仅内容页显示）
+            // 对齐select（仅内容页显示，正常文档流放在页码下方）
             if (pageType === 'content') {
                 var pageNum = domPage.pageNum || (i + 1);
                 var currentAlign = (config.pageAlignments && config.pageAlignments[pageNum]) || 'top';