*{box-sizing:border-box}body{margin:0;background:#f5f9fb;color:#16334c;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit}header{background:#fff;border-bottom:1px solid #e2edf0;padding:13px max(18px,calc((100% - 1140px)/2));display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}header a{text-decoration:none;font-weight:850;color:#14516a}.brand{display:flex;align-items:center;gap:9px;font-size:23px}.brand img{height:40px;width:40px;object-fit:contain}.language{display:flex;align-items:center;gap:7px;font-size:13px}.language select{border:1px solid #cbdfe5;border-radius:10px;background:#fff;padding:10px;color:#16334c}main{max-width:1080px;margin:0 auto;padding:34px 18px 70px}.hero{text-align:center;max-width:740px;margin:0 auto 28px}.eyebrow{font-size:12px;letter-spacing:.09em;color:#008e88;font-weight:850}.hero h1{font-size:clamp(30px,5vw,49px);letter-spacing:-.045em;margin:11px 0}.hero p{font-size:17px;line-height:1.55;color:#607887}.panel{background:#fff;border:1px solid #dcebf0;box-shadow:0 12px 36px rgba(13,55,70,.07);border-radius:23px;padding:clamp(16px,3vw,30px)}.drop{display:flex;min-height:210px;border:2px dashed #76cbc8;border-radius:19px;align-items:center;justify-content:center;flex-direction:column;gap:11px;text-align:center;cursor:pointer;background:#f2fcfa;transition:.2s}.drop:hover,.drop.drag{background:#e0f7f3;border-color:#08978c}.drop strong{font-size:19px}.drop span{color:#69818d;font-size:14px}.drop input{position:absolute;width:1px;height:1px;opacity:0}.upload-icon{font-size:40px}.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;margin:20px 0 10px}.btn{border:0;border-radius:12px;background:#087f77;color:white;font-weight:800;padding:15px 22px;cursor:pointer;min-height:48px;font-size:15px}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.secondary{background:#e7f2f3;color:#16505d}.btn.download{background:#1b668d}.preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px}.preview figure{margin:0;min-width:0}.preview figcaption{font-weight:800;margin:0 0 9px}.canvas{border:1px solid #d8e5eb;border-radius:15px;min-height:220px;max-height:460px;display:grid;place-items:center;overflow:hidden;background-color:#fff;background-image:linear-gradient(45deg,#e5ebed 25%,transparent 25%),linear-gradient(-45deg,#e5ebed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5ebed 75%),linear-gradient(-45deg,transparent 75%,#e5ebed 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0}.canvas img{max-width:100%;max-height:460px;object-fit:contain}.canvas .empty{color:#64808b;padding:20px;text-align:center}.status{text-align:center;min-height:26px;font-weight:650;color:#386476;margin-top:14px}.status.error{color:#b12543}.note{font-size:13px;line-height:1.6;color:#647c88;text-align:center;max-width:800px;margin:22px auto}footer{text-align:center;padding:22px;color:#6a8089;font-size:13px}@media(max-width:650px){main{padding-top:20px}.preview{grid-template-columns:1fr}.drop{min-height:185px}.actions .btn{width:100%}.hero p{font-size:15px}}
.quality{margin-top:18px;padding:16px;border-radius:14px;background:#effaf8;border:1px solid #d2ebe7;display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap}.quality strong{color:#096c67}.quality p{font-size:13px;line-height:1.5;color:#536f76;margin:7px 0}.edge-label{font-size:13px;font-weight:700;display:grid;gap:7px}.edge-label select{padding:10px;border:1px solid #a9d3cf;border-radius:9px;background:#fff;color:#17394a}.dimensions,.limits{font-size:12px;color:#577982}.limits{text-align:center}.quality select:focus-visible,.btn:focus-visible{outline:3px solid #50bcb3;outline-offset:2px}

.processing-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;color:#245466}.processing-placeholder strong{font-size:15px}.processing-placeholder small{font-size:12px;color:#587780}.spinner{width:40px;height:40px;border:4px solid #ccece7;border-top-color:#008e88;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.drop.processing{pointer-events:none;opacity:.75}

/* V45: refined result presentation */
.canvas{position:relative;min-height:280px}.canvas img{display:block;width:auto;height:auto;max-width:100%;max-height:460px}.canvas:has(img){background-size:18px 18px}.preview figcaption{display:flex;align-items:center;gap:8px}.preview figure:last-child figcaption:after{content:'PNG HD';font-size:10px;font-weight:800;background:#ddf7ef;color:#08745b;border-radius:99px;padding:4px 8px}.processing-placeholder{min-height:260px}.processing-placeholder small{max-width:300px;line-height:1.5}.btn:not(:disabled):hover{filter:brightness(.94)}