:root{--text:#18243b;--page:#eef2fc;--muted:#40506d;--divider:#c1cce3;--border:#667897;--accent:#274786;--accent-hover:#1a3265;--surface-tint:#f6f8ff;--interaction-tint:#dee8ff;--disabled:#e1e8f5;--focus:#3c5aa8;--backdrop:#18243b80;color:var(--text);background:var(--page);font:100%/1.6 system-ui,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;padding:clamp(3rem,11vh,7rem) 1rem 2rem}main{max-width:32rem;margin:auto}header{margin-bottom:1.5rem}.heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;display:flex}select,input[type=number]{border:1px solid var(--border);min-height:3rem;color:inherit;font:inherit;background:#fff;border-radius:.5rem;padding:.35rem .5rem}h1{letter-spacing:-.065em;margin:0;font-size:clamp(2.75rem,10vw,4rem);line-height:1.15}header p{color:var(--muted);margin:.65rem 0 0}.card{border:1px solid var(--divider);background:#fff;border-radius:1.25rem;padding:clamp(.75rem,4vw,1.25rem)}button,.button{background:var(--accent);color:#fff;min-height:3rem;font:inherit;text-align:center;cursor:pointer;border:1px solid #0000;border-radius:.5rem;place-items:center;padding:.45rem 1rem;font-weight:650;text-decoration:none;display:inline-grid}:is(button,.button):hover{background:var(--accent-hover)}.secondary{color:var(--accent);border-color:var(--border);background:#fff}.secondary:hover{background:var(--interaction-tint)}:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.drop-zone{border:2px dashed var(--border);background:var(--surface-tint);width:100%;color:inherit;border-radius:.75rem;gap:.85rem;padding:2rem .75rem;display:grid}.drop-zone:is(:hover,.dragging){background:var(--interaction-tint)}.drop-zone.dragging{border-style:solid}.drop-zone svg{color:var(--accent)}.drop-zone small{font-weight:400}small{color:var(--muted)}#download-settings{border:1px solid var(--border);width:min(30rem,100% - 2rem);color:inherit;background:#fff;border-radius:1rem;padding:clamp(.85rem,4vw,1.25rem)}#download-settings::backdrop{background:var(--backdrop)}#settings-title{margin:0;font-size:1.25rem}#batch-note,#photo-note{color:var(--muted);overflow-wrap:anywhere;margin:.4rem 0 0}#source-dimensions{display:block}.settings-grid{grid-template-columns:minmax(0,9.25rem) minmax(0,1fr);align-items:start;gap:.75rem 1rem;padding-top:.75rem;display:grid}.settings-grid>:is(label,span){align-self:start;padding-top:.55rem}.radio-buttons{border:1px solid var(--border);background:var(--surface-tint);border-radius:.65rem;flex-wrap:wrap;justify-self:start;gap:.25rem;padding:.2rem;display:flex}.radio-buttons label{cursor:pointer;position:relative}.radio-buttons input{clip-path:inset(50%);width:1px;height:1px;margin:0;position:absolute}.radio-buttons span{text-align:center;border:1px solid #0000;border-radius:.4rem;min-width:3rem;min-height:3rem;padding:.5rem .65rem;display:block}.radio-buttons label:hover span{background:var(--interaction-tint)}.radio-buttons input:checked+span{border-color:var(--accent);background:var(--accent);color:#fff;font-weight:650}.radio-buttons input:focus-visible+span{outline:3px solid var(--focus);outline-offset:1px}.resize-control{gap:.2rem;display:grid}#percent-dimensions{color:var(--muted);font-size:.875rem}.size-input{width:min(100%,11rem)}.quality-control{align-items:center;gap:.5rem;min-height:3rem;display:flex}.quality-control input{width:100%;min-width:0;min-height:3rem;accent-color:var(--accent);margin:0}.quality-control span{text-align:end;font-variant-numeric:tabular-nums;min-width:3.3rem}.actions{flex-wrap:wrap;gap:.5rem;margin-top:.85rem;display:flex}button:disabled{background:var(--disabled);color:var(--muted);cursor:default}.results{margin:.75rem 0 0;padding:0;list-style:none}.results li{border-top:1px solid var(--divider);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.35rem .75rem;padding:.6rem 0;display:flex}.file-details{overflow-wrap:anywhere;flex:10rem;min-width:0}.file-text{display:flow-root}.file-details small{display:block}.file-actions{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.remove-photo{min-width:3rem;padding-inline:.5rem;font-size:1.25rem}.photo-preview{float:left;object-fit:contain;background:var(--page);border-radius:.5rem;width:3.5rem;height:3.5rem;margin-right:.65rem}.results .button{max-width:100%}@media (width<=24rem){.settings-grid{grid-template-columns:minmax(0,1fr);gap:.35rem}}.status{color:var(--muted);overflow-wrap:anywhere;margin:.75rem 0 0}.status:empty{margin:0}.status.error,.file-details .error{color:#a02222}.privacy{color:var(--muted);margin:.85rem 0 0;font-size:.875rem}