:root{--ink:#16211d;--muted:#67716d;--paper:#f5f3ed;--card:#fffefa;--line:#d9ddd6;--green:#1d7757;--green-dark:#12533c;--mint:#d9eee2;--orange:#ee7048;--shadow:0 18px 45px rgba(22,33,29,.08)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Manrope,system-ui,sans-serif;min-width:300px}
button,input{font:inherit}button{color:inherit}.topbar{height:74px;display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:auto;padding:0 28px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:19px;font-weight:800;text-decoration:none;letter-spacing:-.4px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;background:var(--green);color:#fff;border-radius:8px;font-family:'DM Mono',monospace;font-size:16px}.privacy{display:flex;gap:9px;align-items:center;color:var(--muted);font-size:12px;font-weight:600}.status-dot{width:7px;height:7px;background:#3ab67b;border-radius:50%;box-shadow:0 0 0 4px rgba(58,182,123,.12)}
main{max-width:1200px;margin:auto;padding:0 28px 60px}.hero{text-align:left;padding:38px 0 24px}.hero h1{font-size:30px;line-height:1.2;letter-spacing:-1px;margin:0;font-weight:800}.intro{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.5}
.dropzone{position:relative;text-align:center;border:2px dashed #aebbb3;border-radius:18px;background:rgba(255,255,255,.48);padding:44px 24px;cursor:pointer;transition:.2s}.dropzone:hover,.dropzone:focus-visible,.dropzone.dragging{outline:none;border-color:var(--green);background:#edf6f0;transform:translateY(-2px)}.drop-icon{width:58px;height:58px;margin:0 auto 17px;display:grid;place-items:center;border-radius:16px;background:var(--mint);color:var(--green)}.drop-icon svg{width:29px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.dropzone h2{font-size:21px;margin:0 0 8px}.dropzone p{color:var(--muted);margin:0 0 13px;font-size:14px}.dropzone small{color:#8b9490;font-size:11px}.linklike{color:var(--green);font-weight:700}kbd{background:#fff;border:1px solid #ccd2ce;border-bottom-width:2px;border-radius:5px;padding:2px 5px;font-family:'DM Mono';font-size:10px}
.workspace{display:grid;grid-template-columns:300px 1fr;gap:20px;margin-top:24px}.card{background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}.settings{padding:22px;align-self:start;position:sticky;top:18px}.section-heading,.queue-head,.queue-footer{display:flex;align-items:center;justify-content:space-between}.section-heading h2,.queue h2{font-size:17px;margin:0}.text-button{border:0;background:none;color:var(--green);font-size:12px;font-weight:700;cursor:pointer;padding:5px}.text-button:hover{text-decoration:underline}.danger{color:#ac4e39}.settings fieldset{border:0;border-top:1px solid var(--line);padding:20px 0 0;margin:20px 0 0}.settings legend{padding:0 10px 0 0;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.7px}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.preset-grid button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 3px;cursor:pointer}.preset-grid button strong,.preset-grid button span{display:block}.preset-grid button strong{font-size:11px}.preset-grid button span{font-size:9px;color:var(--muted);margin-top:2px}.preset-grid button.active{border-color:var(--green);background:var(--mint);color:var(--green)}.range-row{display:flex;justify-content:space-between;align-items:center;margin:17px 0 4px;font-size:12px}.range-row output{font-family:'DM Mono';font-weight:500;color:var(--green)}input[type=range]{width:100%;accent-color:var(--green)}.help{color:var(--muted);font-size:10px;line-height:1.5;margin:8px 0 0}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer}.switch-row span strong,.switch-row span small{display:block}.switch-row strong{font-size:12px}.switch-row small{font-size:9px;color:var(--muted);margin-top:2px}.switch-row input{position:absolute;opacity:0}.switch-row i{position:relative;flex:none;width:36px;height:20px;border-radius:20px;background:#bdc4c0;transition:.2s}.switch-row i:after{content:'';position:absolute;width:14px;height:14px;left:3px;top:3px;background:white;border-radius:50%;transition:.2s}.switch-row input:checked+i{background:var(--green)}.switch-row input:checked+i:after{transform:translateX(16px)}.resize-options{margin-top:13px;padding:10px;background:#f1f3ef;border-radius:8px}.resize-options label{font-size:10px;display:flex;align-items:center;justify-content:space-between}.resize-options input{width:76px;border:1px solid var(--line);border-radius:5px;padding:4px;background:#fff}.settings-note{display:flex;gap:10px;margin-top:20px;padding:12px;background:#edf6f0;border-radius:9px}.settings-note svg{width:19px;flex:none;fill:none;stroke:var(--green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.settings-note p{font-size:9px;line-height:1.5;color:var(--muted);margin:0}.settings-note strong{color:var(--green);font-size:10px}
.queue{min-width:0;overflow:hidden}.queue-head{padding:21px 24px;border-bottom:1px solid var(--line)}.queue-head p{font-size:10px;color:var(--muted);margin:4px 0 0}.queue-actions{display:flex;gap:8px;align-items:center}.secondary{border:1px solid var(--line);background:#fff;border-radius:7px;font-size:11px;font-weight:700;padding:8px 11px;cursor:pointer}.secondary:hover{border-color:var(--green);color:var(--green)}.file-list{min-height:128px}.file-row{display:grid;grid-template-columns:66px minmax(130px,1fr) 95px 100px;gap:14px;align-items:center;padding:16px 22px;border-bottom:1px solid #e7e9e5}.thumb{width:66px;height:55px;border:0;border-radius:7px;padding:0;overflow:hidden;cursor:pointer}.thumb img{display:block;width:100%;height:100%;object-fit:contain}.checker{background-color:#eef0ed;background-image:linear-gradient(45deg,#dfe3df 25%,transparent 25%),linear-gradient(-45deg,#dfe3df 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dfe3df 75%),linear-gradient(-45deg,transparent 75%,#dfe3df 75%);background-size:14px 14px;background-position:0 0,0 7px,7px -7px,-7px 0}.file-info{min-width:0}.file-title{display:flex;gap:8px;align-items:center}.file-title strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{flex:none;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;padding:3px 6px;border-radius:9px;background:#eceeeb;color:#78817d}.badge.working{background:#fff0d9;color:#9a6520}.badge.done{background:var(--mint);color:var(--green)}.badge.error{background:#fee5df;color:#a5422c}.dimensions,.message{font-size:9px;color:var(--muted);margin:4px 0 0}.message{color:#a5422c}.progress{height:3px;background:#e4e7e3;border-radius:3px;overflow:hidden;margin-top:8px}.progress i{display:block;height:100%;width:0;background:var(--green);transition:width .2s}.result{text-align:right}.result strong,.result span{display:block}.result strong{font-family:'DM Mono';font-size:13px}.result span{font-size:9px;color:var(--green);margin-top:3px}.file-actions{display:flex;justify-content:flex-end;gap:4px}.icon-button{width:29px;height:29px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer;display:grid;place-items:center;font-size:17px}.icon-button:hover:not(:disabled){border-color:var(--green);color:var(--green)}.icon-button:disabled{opacity:.35;cursor:not-allowed}.queue-footer{padding:19px 24px;background:#fafaf7}.total span,.total strong,.total small{display:block}.total span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.total strong{font-family:'DM Mono';font-size:21px;color:var(--green);margin-top:2px}.total small{font-size:9px;color:var(--muted)}.download{display:flex;align-items:center;gap:8px;border:0;background:var(--green);color:white;padding:12px 17px;border-radius:8px;font-size:11px;font-weight:800;cursor:pointer}.download:hover:not(:disabled){background:var(--green-dark)}.download:disabled{opacity:.45;cursor:not-allowed}.download svg{width:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin:85px 0;padding:0 22px}.features article{border-top:1px solid var(--line);padding-top:20px}.features span{font-family:'DM Mono';font-size:10px;color:var(--green)}.features h3{font-size:14px;margin:10px 0 6px}.features p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}footer{border-top:1px solid var(--line);max-width:1200px;margin:auto;padding:25px 28px 40px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px}footer>span{font-weight:800;color:var(--ink)}footer p{margin:0}footer a{color:var(--green)}
dialog{width:min(1050px,calc(100% - 32px));border:0;border-radius:16px;padding:0;background:var(--card);box-shadow:0 30px 90px rgba(0,0,0,.25)}dialog::backdrop{background:rgba(10,20,16,.65);backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:16px;margin:0}.dialog-head p{font-size:10px;color:var(--muted);margin:4px 0 0}.dialog-head button{border:0;background:none;font-size:27px;cursor:pointer}.compare{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}.compare figure{margin:0;background:var(--card)}.compare figcaption{padding:10px 15px;font-size:10px;font-weight:800;text-transform:uppercase}.compare .checker{height:min(65vh,620px);display:grid;place-items:center;overflow:auto}.compare img{max-width:100%;max-height:100%;object-fit:contain}
@media(max-width:800px){.workspace{grid-template-columns:1fr}.settings{position:static}.file-row{grid-template-columns:56px minmax(100px,1fr) 70px}.thumb{width:56px}.file-actions{grid-column:2/4;justify-content:flex-start}.hero{padding-top:28px}.features{gap:20px}.compare{grid-template-columns:1fr}.compare .checker{height:38vh}}
@media(max-width:520px){.topbar,main{padding-left:16px;padding-right:16px}.privacy{font-size:0}.privacy:after{content:'Local only';font-size:10px}.hero h1{letter-spacing:-2.5px}.dropzone{padding:34px 12px}.queue-head{align-items:flex-start}.queue-actions{flex-direction:column;align-items:flex-end}.file-row{padding:14px;gap:10px;grid-template-columns:50px minmax(90px,1fr) 65px}.thumb{width:50px;height:48px}.queue-footer{padding:16px}.features{grid-template-columns:1fr;margin:55px 0}.download{padding:11px}.settings{padding:18px}footer{padding-left:16px;padding-right:16px;gap:20px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
