@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--paper:#f4f6f3;--card:#fff;--ink:#1d2926;--muted:#78827d;--line:#dfe5df;--green:#245d4e;--lime:#c9f45a;--wash:#edf3eb;--shadow:0 18px 50px #20382b0d}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}.app-shell{min-height:100vh}.topbar{height:76px;padding:0 max(28px,calc((100% - 1120px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#f9faf8}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font:700 15px Manrope,sans-serif;letter-spacing:-.03em}.brand b{color:var(--green)}.brand-mark{height:34px;width:34px;border-radius:10px;background:var(--green);color:white;display:grid;place-items:center;font:500 11px 'DM Mono',monospace;letter-spacing:-.06em}.privacy{font:500 12px 'DM Mono',monospace;color:#53645b;display:flex;align-items:center;gap:9px}.privacy-dot{width:7px;height:7px;background:#8eaf42;border-radius:50%;box-shadow:0 0 0 4px #8eaf4218}main{max-width:1000px;margin:auto;padding:72px 28px 0}.intro{max-width:700px;margin-bottom:44px}.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 18px;color:var(--green);font:500 10px 'DM Mono',monospace;letter-spacing:.13em}.eyebrow-line{width:35px;height:1px;background:#9ab39f}.intro h1{font:600 clamp(42px,7vw,76px)/.99 Manrope,sans-serif;letter-spacing:-.075em;margin:0}.intro h1 em{font-style:normal;color:#62806d}.lead{max-width:570px;color:#64716a;line-height:1.7;font-size:15px;margin:20px 0 0}.workspace{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:var(--shadow)}.step-heading{display:flex;align-items:center;gap:14px;margin:0 0 18px}.step-number{font:500 11px 'DM Mono',monospace;color:#718179;align-self:flex-start;padding-top:5px}.step-heading h2{font:700 17px Manrope,sans-serif;letter-spacing:-.035em;margin:0 0 4px}.step-heading p{font-size:12px;color:var(--muted);margin:0}.count{margin-left:auto;font:500 11px 'DM Mono',monospace;color:#718179}.dropzone{min-height:182px;border:1px dashed #b9c8bc;border-radius:13px;background:#f9fbf8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.18s ease;color:#596b60}.dropzone:hover,.dropzone.dragover{border-color:var(--green);background:var(--wash);transform:translateY(-1px)}.dropzone input{display:none}.upload-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#e8f0e7;color:var(--green);margin-bottom:3px}.upload-icon svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dropzone strong{font-size:13px;color:var(--ink)}.dropzone span:not(.upload-icon){font-size:12px}.dropzone u{color:var(--green);text-underline-offset:2px}.dropzone small{font-size:10px;color:#89938d;margin-top:3px}.file-toolbar{display:flex;align-items:center;justify-content:space-between;min-height:40px;font-size:11px;color:var(--muted)}.text-button{border:0;background:none;color:var(--green);font:600 11px 'DM Sans',sans-serif;cursor:pointer;padding:7px}.text-button:disabled{opacity:.35;cursor:not-allowed}.file-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.file-card{min-width:0;border:1px solid var(--line);border-radius:10px;padding:8px;display:flex;align-items:center;gap:9px;background:white}.file-thumb{width:44px;height:44px;object-fit:cover;border-radius:7px;background:#edf0ec;flex:none}.file-meta{min-width:0;flex:1}.file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600}.file-size{font:10px 'DM Mono',monospace;color:var(--muted);margin-top:4px}.remove-file{border:0;background:none;color:#97a09a;font-size:17px;cursor:pointer}.settings-heading{margin-top:35px}.settings-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:8px;font-size:11px;font-weight:600;color:#53625a}.field small{font-weight:400;color:#89938d}.field input,.field select{width:100%;height:42px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:500 12px 'DM Sans',sans-serif;outline:none}.field input:focus,.field select:focus{border-color:#779789;box-shadow:0 0 0 3px #245d4e12}.hint{display:flex;align-items:flex-start;gap:9px;margin-top:12px;padding:12px 13px;border-radius:8px;background:#f4f7f2;color:#68766e;font-size:11px;line-height:1.6}.hint-icon{width:16px;height:16px;flex:none;border:1px solid #a4b6a4;border-radius:50%;display:grid;place-items:center;font:10px Georgia;color:#58755f;margin-top:1px}.quality-row{display:flex;align-items:center;justify-content:space-between;margin-top:23px}.quality-row span{display:flex;align-items:baseline;gap:9px}.quality-row b{font-size:12px}.quality-row small{font-size:10px;color:var(--muted)}.quality-row output{font:500 12px 'DM Mono',monospace;color:var(--green);background:var(--wash);padding:5px 8px;border-radius:6px}.range{width:100%;margin:13px 0 0;accent-color:var(--green)}.range-labels{display:flex;justify-content:space-between;color:#919b95;font:10px 'DM Mono',monospace;margin-top:1px}.output-heading{margin-top:33px}.output-note{display:flex;align-items:center;gap:11px;background:#f8faf7;border:1px solid #e9eee8;border-radius:9px;padding:12px;color:#6a766e;font-size:11px;line-height:1.5}.download-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:7px;background:#eaf1e8;color:var(--green);font-size:16px;flex:none}.action-row{display:flex;align-items:center;gap:9px;margin-top:16px}.primary-button,.secondary-button{height:43px;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:23px;padding:0 16px;font:700 12px 'DM Sans',sans-serif;cursor:pointer;transition:.15s}.primary-button{background:var(--green);border:1px solid var(--green);color:white}.primary-button:hover:not(:disabled){background:#194b3e;transform:translateY(-1px)}.primary-button:disabled{opacity:.45;cursor:not-allowed}.secondary-button{background:white;border:1px solid var(--line);color:#53625a}.secondary-button:disabled{opacity:.4;cursor:not-allowed}.status{margin-left:auto;font:10px 'DM Mono',monospace;color:#718179;text-align:right}.progress-track{height:4px;background:#edf0ec;border-radius:9px;margin-top:12px;overflow:hidden}.progress-bar{height:100%;width:0;background:#8caa55;border-radius:inherit;transition:width .2s}.results{margin-top:18px;border-top:1px solid var(--line);padding-top:15px}.results h3{margin:0 0 10px;font:700 13px Manrope,sans-serif}.result-row{display:flex;gap:12px;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-top:7px}.result-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600}.result-details{font:10px 'DM Mono',monospace;color:var(--muted);margin-top:4px}.download-link{flex:none;border:1px solid #cfdbd0;border-radius:7px;padding:7px 9px;color:var(--green);text-decoration:none;font-size:10px;font-weight:700}.download-link:hover{background:var(--wash)}footer{display:flex;justify-content:space-between;gap:20px;padding:26px 2px 34px;color:#8a948d;font:10px 'DM Mono',monospace}footer span:first-child{letter-spacing:.1em;color:#617368}
@media(max-width:760px){.topbar{height:64px;padding:0 18px}.privacy{font-size:0}.privacy-dot{width:8px;height:8px}main{padding:47px 16px 0}.intro{margin-bottom:28px}.intro h1{font-size:clamp(42px,11vw,64px)}.lead{font-size:14px}.workspace{padding:20px 16px;border-radius:14px}.step-heading{gap:10px}.step-heading h2{font-size:15px}.step-heading p{font-size:11px}.dropzone{min-height:158px}.file-list{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 10px}.quality-row span{display:flex;flex-direction:column;gap:3px}.action-row{flex-wrap:wrap}.primary-button{flex:1}.status{width:100%;margin:3px 0 0;text-align:left}.output-note{align-items:flex-start}footer{flex-direction:column;gap:6px;padding:21px 2px 28px}}@media(max-width:390px){.workspace{padding:18px 12px}.file-list{grid-template-columns:1fr}.field input,.field select{padding:0 8px;font-size:11px}.count{font-size:10px}.result-row{align-items:flex-start}.download-link{padding:6px}}
