.image-builder{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;align-items:start}.image-panel{min-width:0;padding:24px;border:1px solid var(--np-line);border-radius:10px;background:var(--np-canvas)}.image-panel h2{margin:12px 0 20px}.image-step{font-size:.8rem;font-weight:750;color:var(--np-muted)}.image-drop{display:grid;justify-items:center;gap:12px;padding:28px 14px;border:2px dashed var(--np-line-strong);border-radius:10px;background:var(--np-paper);text-align:center}.image-drop.is-dragover{border-color:var(--np-ink);background:var(--np-lime)}.image-drop small{color:var(--np-muted);font-size:.8rem}.image-file-picker{position:relative;overflow:hidden}.image-file-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.image-file-picker:focus-within{outline:2px solid var(--np-ink);outline-offset:4px}.image-options{display:grid;gap:18px;margin:24px 0}.image-options label{display:grid;gap:8px;font-weight:750}.image-options select{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--np-line-strong);border-radius:8px;background:var(--np-canvas);color:var(--np-ink);font:inherit}.image-options details{border-top:1px solid var(--np-line);padding-top:16px}.image-options summary{cursor:pointer;font-weight:700;margin-bottom:14px}.image-note{font-size:.8rem;color:var(--np-muted);line-height:1.5;margin:12px 0 0}.image-submit{width:100%;min-height:48px}.image-status{margin:16px 0 0;padding:12px;border:1px solid var(--np-line);border-radius:8px;background:var(--np-paper);font-size:.9rem;line-height:1.5;overflow-wrap:anywhere}.image-status[data-error=true]{border-color:var(--np-purple);background:var(--np-paper)}.image-summary{margin:-8px 0 18px;color:var(--np-muted);font-weight:650;overflow-wrap:anywhere}.image-download{width:100%;margin:0 0 18px}.image-results{display:grid;gap:12px}.image-result{display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px;align-items:center;padding:12px;border:1px solid var(--np-line);border-radius:8px}.image-result img{width:80px;height:80px;object-fit:contain;border-radius:5px;background:repeating-conic-gradient(#eee 0% 25%,white 0% 50%) 0/12px 12px}.image-result h3{font-size:.9rem;margin:0 0 6px;overflow-wrap:anywhere}.image-result p,.image-result small{font-size:.8rem;color:var(--np-muted);margin:0;line-height:1.45;overflow-wrap:anywhere}.image-result button{grid-column:2;justify-self:start}.image-empty{display:grid;place-items:center;min-height:260px;padding:24px;border:1px dashed var(--np-line);border-radius:8px;color:var(--np-muted);text-align:center;line-height:1.5}.image-footer-note{max-width:760px;margin:20px 0 0;color:var(--np-muted);font-size:.84rem;line-height:1.5}#imageOutput{scroll-margin-top:100px}[hidden]{display:none!important}button:disabled,.image-file-picker:has(input:disabled){opacity:.55;cursor:not-allowed}select:focus-visible{outline:2px solid var(--np-ink);outline-offset:3px}@media(max-width:900px){.image-builder{grid-template-columns:minmax(0,1fr)}}@media(max-width:600px){.image-panel{padding:18px}.image-result{grid-template-columns:64px minmax(0,1fr);gap:10px}.image-result img{width:64px;height:64px}}