缩略图二分定位 + 邻域采样

B. 二分定位 + 邻域采样（我推荐）
把配置的语义从"这就是要生成的 10 档"改成"允许搜索的参数梯度"（比如分辨率梯度、帧率梯度、质量梯度三张表）。运行时：
1. 用每个组合只编 2 帧的方式粗估体积（很便宜）；
2. 靠单调性做二分，几轮就找到"体积刚好不超过目标"的参数点；
3. 在这个点周围取 10 个组合（略高、略低各几个），完整生成。
成本大概是十几次估算编码 + 10 档完整编码，和现在基本持平甚至更省（估算只编 2 帧）。效果是候选真正围绕你输入的目标分布——比如你填 30 KB，出来的就是 22、26、29、31、35 KB 这种，而不是 5 KB 和 300 KB 各一个。
代价是你现在这套配置格式要推翻重做——从"精确档位表"变成"参数范围表"

release/UNIVERSAL_SpineViewer/viewer/spine.css

@@ -7,6 +7,7 @@
 			--accent: #4fc1ff;
 			--border: #3c3c3c;
 			--error: #f14c4c;
+			--pick-ok: #3fb950;
 			/* 悬浮层填充与滚动条配色。Eagle 内置 Electron 22 / Chromium 108 不支持 color-mix()，
 			   这些必须写成 rgba()，否则整条颜色声明会被丢弃。 */
 			--hover-fill: rgba(255, 255, 255, .07);
@@ -28,6 +29,7 @@
 			--accent: #0078d4;
 			--border: #ddd;
 			--error: #d13438;
+			--pick-ok: #1a7f37;
 			--hover-fill: rgba(0, 0, 0, .06);
 			--scroll-thumb: rgba(0, 0, 0, .30);
 			--scroll-thumb-hover: rgba(0, 0, 0, .46);
@@ -148,6 +150,38 @@
 		}
 		.animated-thumb-form input[type="number"]:focus { outline: none; border-color: var(--accent); }
 		.animated-thumb-card .thumb-dialog-actions { margin-top: 2px; }
+		.animated-pick-card { width: min(920px, 94vw); gap: 10px; padding: 16px; }
+		.animated-pick-card .thumb-dialog-title { text-align: center; }
+		.animated-pick-card .thumb-dialog-note { font-size: 12px; text-align: center; }
+		.animated-pick-notice { color: var(--text); text-align: center; min-height: 18px; }
+		/* 档位数量由配置决定，行数不固定：格子超高时内部滚动，按钮区始终留在面板底部。 */
+		.animated-pick-grid {
+			display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px;
+			max-height: 58vh; overflow-y: auto; padding-right: 2px;
+		}
+		.animated-pick-item {
+			position: relative;
+			display: flex; flex-direction: column; gap: 6px; width: 100%;
+			padding: 6px; border: 1px solid var(--border); border-radius: 8px;
+			background: var(--panel-2); color: var(--text-dim); cursor: pointer;
+			font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+			font-size: 11px; line-height: 1.4;
+		}
+		.animated-pick-item:hover { border-color: var(--accent); color: var(--text); }
+		.animated-pick-item img {
+			display: block; width: 100%; aspect-ratio: 1 / 1;
+			border-radius: 5px; background: var(--bg);
+		}
+		.animated-pick-item.selected {
+			border-color: var(--pick-ok); box-shadow: 0 0 0 1px var(--pick-ok); color: var(--text);
+		}
+		.animated-pick-item.selected::after {
+			content: '✓'; position: absolute; top: 10px; right: 10px;
+			width: 20px; height: 20px; border-radius: 50%;
+			background: var(--pick-ok); color: #fff;
+			font-size: 13px; line-height: 20px; text-align: center; font-weight: 700;
+		}
+		.animated-pick-params { display: block; word-break: break-all; }
 		/* 收窄下拉，避免在窄窗口下把右侧按钮挤到第二行（展开后的选项不受影响）*/
 		#toolbar #suffixSelect { max-width: 140px; }
 		#stage { position: absolute; inset: 0; display: flex; overflow: hidden; }