:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#282828;background:#fff;font-synthesis:none;line-height:1.7}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}main{width:min(100%,720px);margin:64px auto;padding:0 24px}h1{margin:0 0 32px;font-size:24px;font-weight:600;text-align:center}.drop-zone{padding:56px 16px;border:1px dashed #bbb;border-radius:8px;text-align:center}.drop-zone h2{margin:0;font-size:16px;font-weight:400}.drop-zone p{margin:12px 0;color:#777;font-size:13px}.drop-zone.dragging{background:#f3f6f5;border-color:#555}.drop-zone.busy{opacity:.5}.button{position:relative;display:inline-block;padding:10px 24px;border:1px solid #ccc;border-radius:5px;background:#fff;color:inherit;font-size:14px;text-decoration:none;cursor:pointer}.button:hover{background:#f5f5f5}.button:focus-visible,.select-button:focus-within{outline:2px solid #555;outline-offset:4px}.select-button input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.select-button:has(input:disabled){cursor:wait}.status-line{margin-top:16px;text-align:center;color:#777;font-size:13px}.status-line:empty{margin:0}.error{color:#a52d28;font-size:14px;overflow-wrap:anywhere}#result{margin-top:28px;text-align:center}.preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;text-align:left}figure{margin:0;min-width:0}figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px;margin-bottom:8px;font-size:12px;color:#777}.checkerboard{height:240px;padding:12px;display:flex;align-items:center;justify-content:center;border:1px solid #eee;border-radius:4px;background-image:conic-gradient(#f0f0f0 25%,transparent 0 50%,#f0f0f0 0 75%,transparent 0);background-size:16px 16px}.checkerboard img{max-width:100%;max-height:100%;object-fit:contain}.download-button{margin-top:20px}footer{margin-top:32px;color:#888;text-align:center;font-size:12px}footer p{margin:4px 0}@media(max-width:480px){main{margin-top:40px;padding:0 16px}h1{font-size:22px}.checkerboard{height:180px;padding:8px}.preview-grid{gap:12px}}
