.converter{padding:46px 0 80px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:28px}.page-heading h1{font-size:clamp(30px,4.5vw,48px);line-height:1.2;margin:7px 0}.page-heading p{margin:0;color:var(--muted)}.safe-badge{background:#eafaf5;border:1px solid #bce9dc;border-radius:14px;padding:13px 16px;display:grid;grid-template-columns:28px auto;column-gap:8px;min-width:280px}.safe-badge span{grid-row:1/3;width:26px;height:26px;background:#19a978;color:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900}.safe-badge strong{font-size:13px;line-height:1.4}.safe-badge small{font-size:11px;color:#4d7b6c}.workspace{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}.dropzone{margin:24px;border:2px dashed #b9c8d9;border-radius:18px;min-height:430px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;cursor:pointer;background:linear-gradient(145deg,#fbfdff,#f3f8fe);transition:.2s}.dropzone:hover,.dropzone.is-dragging{border-color:var(--blue);background:#eef5ff;transform:scale(.995)}.upload-icon{width:66px;height:66px;border-radius:20px;background:var(--blue);color:white;display:grid;place-items:center;font-size:32px;font-weight:300;box-shadow:0 14px 28px rgba(23,105,224,.24)}.dropzone h2{font-size:22px;margin:20px 0 3px}.dropzone p{margin:0;color:var(--muted)}.dropzone p span{color:var(--blue);font-weight:800;text-decoration:underline;text-underline-offset:3px}.dropzone small{margin-top:12px;color:#8a98aa}.dropzone.has-files{align-items:stretch;justify-content:flex-start;text-align:left}.dropzone.has-files .upload-icon,.dropzone.has-files>h2,.dropzone.has-files>p,.dropzone.has-files>small{display:none}.preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.preview-item{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:#eaf0f6}.preview-item img{width:100%;height:100%;object-fit:cover}.preview-item button{position:absolute;top:6px;right:6px;width:26px;height:26px;border:0;border-radius:50%;background:rgba(11,25,45,.75);color:#fff;cursor:pointer}.add-more{aspect-ratio:1;border:1px dashed #a8b9cc;border-radius:12px;background:#f7faff;color:var(--blue);font-weight:800;cursor:pointer}.settings{padding:28px;background:#f9fbfd;border-left:1px solid var(--line)}.setting-block{padding-bottom:25px;margin-bottom:24px;border-bottom:1px solid var(--line)}.setting-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.switch input{display:none}.switch span{display:block;width:44px;height:24px;background:#c6d0dc;border-radius:99px;position:relative;cursor:pointer}.switch span:after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s}.switch input:checked+span{background:var(--blue)}.switch input:checked+span:after{transform:translateX(20px)}.size-row{display:grid;grid-template-columns:1fr 18px 1fr;gap:7px;align-items:end;margin-bottom:12px}.size-row>span{text-align:center;padding-bottom:9px;color:#91a0b0}.size-row label{font-size:12px;color:var(--muted);position:relative}.size-row input{width:100%;margin-top:4px;border:1px solid #cfd9e5;border-radius:9px;padding:10px 34px 10px 10px;background:#fff;color:var(--ink);font-weight:700}.size-row em{position:absolute;right:10px;bottom:10px;font-size:11px;font-style:normal}.check{display:block;font-size:13px;color:var(--muted);margin:7px 0}.format-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.format-options input{display:none}.format-options span{display:block;text-align:center;padding:9px 4px;border:1px solid #cfd9e5;border-radius:9px;background:#fff;font-size:13px;font-weight:800;cursor:pointer}.format-options input:checked+span{border-color:var(--blue);background:#eaf3ff;color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}.quality{margin-top:18px}.quality label{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}.quality input{width:100%;accent-color:var(--blue)}.primary-btn{width:100%;border:0;border-radius:13px;padding:13px;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;cursor:pointer;box-shadow:0 12px 24px rgba(23,105,224,.2)}.primary-btn:disabled{background:#b9c5d3;box-shadow:none;cursor:not-allowed}.primary-btn span,.primary-btn small{display:block}.primary-btn span{font-weight:900}.primary-btn small{font-size:11px;opacity:.8}.results{margin-top:28px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow)}.results-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.results h2{margin:0;font-size:22px}.results-head p{margin:2px 0 0;color:var(--muted);font-size:13px}.result-actions{display:flex;gap:8px}.ghost-btn,.zip-btn,.download-btn{border-radius:9px;padding:9px 13px;font-weight:800;cursor:pointer}.ghost-btn{background:#fff;border:1px solid var(--line);color:var(--muted)}.zip-btn,.download-btn{background:var(--blue);border:1px solid var(--blue);color:#fff}.result-row{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:15px;padding:12px 0;border-top:1px solid var(--line)}.result-thumb{width:64px;height:50px;object-fit:cover;border-radius:8px;background:#eef2f7}.result-name{font-size:14px;font-weight:800;overflow-wrap:anywhere}.result-meta{font-size:12px;color:var(--muted)}.saving{color:#15926b;font-weight:800}.download-btn{font-size:12px}.guide{margin-top:66px}.guide h2{text-align:center;font-size:26px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.steps>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}.steps b{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#eaf3ff;color:var(--blue)}.steps strong{display:block;margin-top:12px}.steps p{color:var(--muted);font-size:13px;margin:4px 0 0}.guide-note{text-align:center;color:var(--muted);font-size:12px;margin-top:20px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:#10233f;color:#fff;border-radius:10px;padding:10px 16px;opacity:0;pointer-events:none;transition:.2s;z-index:30;font-size:13px}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:820px){.page-heading{display:block}.safe-badge{margin-top:18px;min-width:0}.workspace{grid-template-columns:1fr}.dropzone{min-height:280px}.settings{border-left:0;border-top:1px solid var(--line)}.preview-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:560px){.converter{padding-top:30px}.page-heading h1{font-size:29px}.workspace{border-radius:18px}.dropzone{margin:14px;min-height:250px}.settings{padding:21px}.preview-grid{grid-template-columns:repeat(3,1fr)}.results{padding:18px}.results-head{display:block}.result-actions{margin-top:12px}.zip-btn{flex:1}.result-row{grid-template-columns:54px 1fr}.result-thumb{width:54px}.download-btn{grid-column:1/3}.steps{grid-template-columns:1fr}}