.compress-image-val{min-width:44px}
.compress-image-note{display:block;font-size:12.5px;color:var(--ok)}
.compress-image-note.bad{color:var(--err)}
.compress-image-res{text-align:left;margin:0 0 22px}
.compress-image-list .fitem{flex-wrap:wrap}
.compress-image-list .nm span{display:block}
.compress-image-cmp{position:relative;max-width:640px;margin:0 auto;border-radius:14px;overflow:hidden;border:1px solid var(--line);cursor:ew-resize;touch-action:none;user-select:none;background:repeating-conic-gradient(#f1f3f7 0 25%,#fff 0 50%) 0 0/20px 20px}
.compress-image-cmp img{display:block;width:100%;height:auto;max-height:60vh;object-fit:contain;pointer-events:none}
.compress-image-top{position:absolute;inset:0}
.compress-image-top img{width:100%;height:100%}
.compress-image-line{position:absolute;top:0;bottom:0;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.compress-image-line::after{content:"↔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.25);font-weight:800;color:var(--ink)}
.compress-image-tag{position:absolute;top:10px;background:rgba(22,24,29,.75);color:#fff;font-size:12.5px;font-weight:700;border-radius:99px;padding:4px 10px}
.compress-image-tag.l{left:10px}.compress-image-tag.r{right:10px}
.compress-image-cap{text-align:center;font-size:13px;margin:8px 0 16px}
.compress-image-opts [hidden]{display:none!important}
.compress-image-opts .seg{flex-wrap:nowrap}
.compress-image-opts .seg button{white-space:nowrap}