:root{font-family:Manrope,Segoe UI,sans-serif;color:#17312c;background:#f4f7f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink: #17312c;--muted: #60736d;--green: #186e59;--green-dark: #125342;--mint: #e5f0eb;--line: #dce6e1;--paper: #ffffff;--amber: #f0b84b;--red: #a4372a;--mono: "DM Mono", Consolas, monospace}*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth;scroll-padding-top:24px}body{min-width:320px;margin:0;background:linear-gradient(115deg,rgba(222,235,228,.48),transparent 38%) no-repeat,#f4f7f5}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.drop-zone:focus-visible{outline:3px solid #d88c20;outline-offset:3px}#app{overflow:hidden}.skip-link{position:absolute;z-index:2;top:8px;left:8px;padding:9px 12px;transform:translateY(-150%);border-radius:3px;background:var(--green-dark);color:#fff;font-size:12px}.skip-link:focus{transform:translateY(0)}.site-header,main,.site-footer{width:min(1100px,calc(100% - 64px));margin-inline:auto}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(23,49,44,.12)}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);font-size:16px;font-weight:800;text-decoration:none}.brand-mark{width:30px;height:30px;display:grid;place-items:center;border-radius:8px 3px;background:var(--green);color:#fff;font-family:Georgia,serif;font-size:20px;font-weight:700}.brand-accent{color:var(--green)}.site-nav{display:flex;align-items:center;gap:26px}.site-nav a,.related-links a{color:#38534c;font-size:12px;font-weight:700;text-decoration:none}.site-nav a:hover,.site-nav a:focus-visible,.related-links a:hover,.related-links a:focus-visible{color:var(--green)}.hero{min-height:315px;display:flex;align-items:center;justify-content:space-between;padding:54px 4px 52px}.hero-copy{max-width:710px}.eyebrow,.section-kicker{margin:0;color:var(--green);font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.1em;line-height:1.5}.eyebrow{display:flex;align-items:center;gap:9px}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:#d89222}h1,h2,h3,p{overflow-wrap:anywhere}h1{margin:15px 0 12px;color:var(--ink);font-family:Georgia,Times New Roman,serif;font-size:64px;font-weight:400;line-height:1.05}h1 span{color:var(--green);font-style:italic}.hero-description{max-width:590px;margin:0;color:#50665f;font-size:15px;line-height:1.8}.privacy-note{display:flex;align-items:center;gap:9px;margin-top:20px;color:#385b50;font-size:12px;font-weight:600}.privacy-icon{width:17px;height:17px;display:grid;place-items:center;border:1px solid #8db4a6;border-radius:50%;color:var(--green);font-size:7px}.hero-index{width:114px;align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;padding-right:8px;color:#557369}.index-number{color:#9ab2a8;font-family:Georgia,serif;font-size:48px;line-height:1}.index-rule{width:48px;height:2px;margin:17px 0 12px;background:var(--amber)}.index-label{font-family:var(--mono);font-size:9px;line-height:1.6;text-align:right}.tool-section{width:min(820px,100%);margin:0 auto;padding-top:4px}.converter-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:12px;padding:5px;border:1px solid var(--line);border-radius:6px;background:#edf3ef}.converter-tab{min-height:43px;padding:9px 12px;border:1px solid transparent;border-radius:4px;background:transparent;color:#536a60;font-size:12px;font-weight:800;cursor:pointer}.converter-tab span{margin-inline:5px;color:#81988e}.converter-tab.is-active{border-color:#d8e6de;background:#fff;color:var(--green-dark);box-shadow:0 2px 6px #1a42360f}.converter-tab:hover:not(.is-active){color:var(--green)}.tool-panel{padding:30px 34px 32px;border:1px solid #dce7e1;border-radius:8px;background:var(--paper);box-shadow:0 16px 42px #1a42360f}.tool-intro{max-width:650px;margin:-8px 0 19px;color:var(--muted);font-size:12px;line-height:1.7}.trace-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:28px;margin-top:27px;padding-top:24px;border-top:1px solid var(--line)}.trace-field+.trace-field{margin-top:17px}.trace-field input[type=range]{width:100%;height:24px;margin:2px 0 0;accent-color:var(--green);cursor:pointer}.trace-field label span{float:right;color:var(--green);font-family:var(--mono);font-size:10px;font-weight:500}.trace-field select{width:100%;min-height:41px;padding:0 10px;border:1px solid #cddbd4;border-radius:4px;background:#fff;color:var(--ink);font-size:11px}.trace-field select:focus{border-color:var(--green);box-shadow:0 0 0 2px #186e591c}.trace-preview-section .preview-frame{min-height:235px}.trace-preview-section .preview-frame img{display:block;max-width:100%;max-height:260px;object-fit:contain;box-shadow:0 1px 5px #17312c21}.trace-note{display:flex;align-items:flex-start;gap:11px;margin-top:17px;color:#586e65}.trace-note p{margin:0;font-size:10px;line-height:1.7}.png-drop-zone:disabled{cursor:not-allowed;opacity:.7}.png-file-card{margin-top:13px}.panel-heading,.results-heading,.preview-heading,.file-list-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.panel-heading{margin-bottom:22px}.panel-heading h2,.section-heading h2,.limitations-section h2{margin:6px 0 0;color:var(--ink);font-family:Georgia,Times New Roman,serif;font-size:28px;font-weight:400;line-height:1.2}.limit-label{padding:7px 10px;border-radius:3px;background:#f0f5f2;color:#516a61;font-family:var(--mono);font-size:9px;white-space:nowrap}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.drop-zone{width:100%;min-height:205px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 16px 19px;border:1px dashed #a9c2b7;border-radius:5px;background:#f7faf8;color:inherit;appearance:none;cursor:pointer;text-align:center;transition:border-color .16s ease,background-color .16s ease,transform .16s ease}.drop-zone:hover,.drop-zone.is-dragging{border-color:var(--green);background:#eff7f2}.drop-zone.is-dragging{transform:scale(1.01)}.file-art{width:47px;height:47px;display:grid;place-items:center;margin-bottom:9px;color:var(--green)}.file-art svg{width:44px;height:44px}.drop-title{color:var(--ink);font-size:14px;font-weight:700}.drop-subtitle{margin-top:4px;color:var(--muted);font-size:12px}.button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:0 18px;border:1px solid transparent;border-radius:4px;font-size:12px;font-weight:700;line-height:1.3;text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .15s ease}.button:active:not(:disabled){transform:translateY(1px)}.button:disabled,.text-button:disabled{cursor:not-allowed;opacity:.48}.button-secondary{min-height:37px;margin-top:14px;border-color:#c6d7cf;background:#fff;color:var(--green-dark)}.button-secondary:hover{border-color:var(--green);background:#f1f7f4}.file-help{margin-top:13px;color:#778a83;font-family:var(--mono);font-size:9px}.file-list-heading{align-items:center;margin-top:24px}.file-list-heading h3,.subsection-heading h3,.results-heading h3{margin:5px 0 0;color:#29483e;font-size:13px;font-weight:700}.count-label{display:inline-grid;min-width:20px;height:20px;place-items:center;margin-left:4px;border-radius:50%;background:#edf4f0;color:var(--green-dark);font-family:var(--mono);font-size:10px}.text-button{padding:8px 4px;border:0;background:transparent;color:#63776f;font-size:11px;font-weight:700;cursor:pointer}.text-button:hover:not(:disabled){color:var(--green-dark);text-decoration:underline;text-underline-offset:3px}.empty-list{margin:8px 0 0;padding:13px 12px;border:1px dashed #dce6e1;border-radius:4px;color:#798981;font-size:11px}.file-list,.result-list{display:grid;gap:7px;margin:9px 0 0;padding:0;list-style:none}.file-item,.result-item{min-height:62px;display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--line);border-radius:4px;background:#fbfdfc}.file-item.is-active{border-color:#a7c3b6;background:#f5faf7}.file-select{min-width:0;flex:1;display:flex;align-items:center;gap:11px;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.file-badge{width:36px;height:40px;flex:0 0 auto;display:grid;place-items:center;border-radius:3px;background:#e8f2ed;color:var(--green);font-family:var(--mono);font-size:9px;font-weight:500}.file-details{min-width:0;flex:1;display:grid;gap:3px}.file-name{overflow:hidden;color:var(--ink);font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.file-size{color:var(--muted);font-family:var(--mono);font-size:9px}.remove-file{padding:7px 3px;border:0;background:transparent;color:#63776f;font-size:10px;font-weight:700;cursor:pointer}.remove-file:hover{color:var(--red);text-decoration:underline}.converter-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:28px;margin-top:27px;padding-top:24px;border-top:1px solid var(--line)}.subsection-heading{margin-bottom:13px}.dimensions-row{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:end;gap:7px}.form-field>label{display:block;margin-bottom:7px;color:#29463e;font-size:11px;font-weight:700}.form-field>label span{color:#778981;font-weight:500}.form-field input[type=number],.background-controls select{width:100%;min-width:0;height:41px;padding:0 10px;border:1px solid #cddbd4;border-radius:4px;background:#fff;color:var(--ink);font-size:12px}.form-field input[type=number]:focus,.background-controls select:focus{border-color:var(--green);box-shadow:0 0 0 2px #186e591c}.dimension-cross{padding-bottom:12px;color:#71847c;font-family:var(--mono);text-align:center}.field-hint{margin:8px 0 0;color:#788981;font-size:9px;line-height:1.6}.field-hint.is-error{color:var(--red)}.background-field{margin-top:17px}.background-controls{display:flex;align-items:center;gap:8px}.color-control{height:41px;display:flex;align-items:center;gap:7px;padding:0 7px;border:1px solid #cddbd4;border-radius:4px;color:#516a61;font-size:10px}.color-control input{width:27px;height:27px;padding:2px;border:0;background:transparent;cursor:pointer}.preview-section{min-width:0}.preview-heading{align-items:flex-end;margin-bottom:13px}.preview-size{color:#61776d;font-family:var(--mono);font-size:9px;text-align:right}.preview-frame{min-height:211px;display:grid;place-items:center;overflow:hidden;padding:12px;border:1px solid var(--line);border-radius:4px;background-color:#fff;background-image:linear-gradient(45deg,#e8eeea 25%,transparent 25%),linear-gradient(-45deg,#e8eeea 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e8eeea 75%),linear-gradient(-45deg,transparent 75%,#e8eeea 75%);background-position:0 0,0 6px,6px -6px,-6px 0;background-size:12px 12px}.preview-frame.is-empty{background:#f7faf8}.preview-frame canvas{display:block;max-width:100%;max-height:260px;object-fit:contain;box-shadow:0 1px 5px #17312c21}.preview-frame>p{max-width:230px;margin:0;color:#798981;font-size:11px;line-height:1.7;text-align:center}.preview-file-name{overflow:hidden;margin:7px 0 0;color:#6d7f77;font-family:var(--mono);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.action-row{display:flex;align-items:center;gap:16px;margin-top:23px}.button-primary{min-width:176px;min-height:46px;justify-content:space-between;background:var(--green);color:#fff}.button-primary:hover:not(:disabled){background:var(--green-dark)}.button-arrow{font-size:16px;font-weight:500}.reset-button{min-height:42px}.processing{margin-top:18px}.processing-line{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;color:#425f55;font-size:11px;font-weight:600}.progress-value{color:var(--green);font-family:var(--mono);font-size:10px}.processing progress{width:100%;height:5px;display:block;overflow:hidden;border:0;border-radius:5px;appearance:none;background:#e5ede9}.processing progress::-webkit-progress-bar{border-radius:5px;background:#e5ede9}.processing progress::-webkit-progress-value{border-radius:5px;background:var(--green);transition:width .12s ease}.processing progress::-moz-progress-bar{border-radius:5px;background:var(--green)}.result-message{margin-top:16px;padding:12px 14px;border-left:3px solid;border-radius:2px;font-size:11px;line-height:1.65}.result-message.is-error{border-color:var(--red);background:#fff4f1;color:#70291f}.result-message.is-success{border-color:var(--green);background:#eff8f3;color:#215a48}.result-message.is-warning{border-color:#ba7a12;background:#fff8e8;color:#72500f}.results-section{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.results-heading{align-items:center}.button-download,.button-small-download{border-color:#d8e6de;background:#e9f3ed;color:var(--green-dark)}.button-download:hover:not(:disabled),.button-small-download:hover{border-color:#a7c3b6;background:#deeee4}.button-download{min-height:37px;padding-inline:12px;font-size:10px}.button-small-download{min-height:33px;flex:0 0 auto;padding-inline:11px;font-size:10px}.privacy-aside{display:flex;align-items:flex-start;gap:11px;margin:16px 4px 0;color:#586e65}.note-icon{width:17px;height:17px;flex:0 0 auto;display:grid;place-items:center;border:1px solid #8aa99c;border-radius:50%;color:#45685a;font-family:Georgia,serif;font-size:11px;font-weight:700}.privacy-aside p{margin:0;font-size:10px;line-height:1.7}.info-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;margin-top:102px;padding:47px 0 49px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.section-heading h2{max-width:330px;margin-top:11px;font-size:31px;line-height:1.24}.steps-list{display:grid;gap:23px;margin:0;padding:0;list-style:none}.steps-list li{display:grid;grid-template-columns:38px 1fr;gap:13px}.step-number{color:#9aafa5;font-family:var(--mono);font-size:11px;line-height:1.7}.steps-list h3{margin:0;color:#24453b;font-size:12px;font-weight:700}.steps-list p{max-width:370px;margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.7}.limitations-section{display:grid;grid-template-columns:34px 1fr;gap:17px;max-width:800px;margin:54px auto 0;padding:20px 22px;border-left:3px solid #d5a341;background:#edf2ef}.limitations-mark{width:28px;height:28px;display:grid;place-items:center;border:1px solid #c4a156;border-radius:50%;color:#8a641b;font-family:Georgia,serif;font-size:16px}.limitations-section h2{margin-top:4px;font-size:21px}.limitations-section>div:last-child>p:last-child{max-width:650px;margin:9px 0 0;color:#586b63;font-size:11px;line-height:1.8}.faq-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;margin-top:87px;padding-bottom:70px}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{position:relative;padding:17px 32px 17px 0;color:#29483e;font-size:12px;font-weight:700;line-height:1.5;list-style:none;cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{position:absolute;top:15px;right:3px;color:var(--green);content:"+";font-family:var(--mono);font-size:18px;font-weight:400}.faq-list details[open] summary:after{content:"−"}.faq-list details p{margin:-3px 25px 17px 0;color:var(--muted);font-size:11px;line-height:1.8}.related-links{display:flex;align-items:center;flex-wrap:wrap;gap:12px 27px;margin-bottom:68px;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.related-links .section-kicker{margin-right:auto}.related-links a span{margin-left:3px;color:var(--green)}.site-footer{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid rgba(23,49,44,.12)}.footer-brand{font-size:13px}.footer-brand .brand-mark{width:25px;height:25px;font-size:17px}.site-footer>p{margin:0;color:#72827b;font-family:var(--mono);font-size:9px;text-align:right}[hidden]{display:none!important}@media(max-width:760px){.site-header,main,.site-footer{width:min(100% - 40px,620px)}.site-header{height:70px}.site-nav{gap:17px}.site-nav a{font-size:10px}.hero{min-height:285px;padding:44px 0 40px}h1{font-size:clamp(47px,9vw,60px)}.hero-index{width:73px}.tool-panel{padding:24px 22px 26px}.converter-grid,.trace-grid{grid-template-columns:1fr;gap:23px}.preview-frame{min-height:235px}.info-section,.faq-section{grid-template-columns:1fr;gap:26px}.info-section{margin-top:78px;padding:36px 0}.faq-section{margin-top:67px}}@media(max-width:520px){.site-header,main,.site-footer{width:min(100% - 32px,450px)}.site-nav{gap:12px}.site-nav a{font-size:9px}.brand{gap:7px;font-size:14px}.brand-mark{width:27px;height:27px;font-size:18px}.hero{min-height:275px}.hero-copy{min-width:0}.hero-index{width:47px;padding-right:0}.index-number{font-size:36px}.index-rule{width:34px;margin-block:12px 9px}.index-label{font-size:7px}.hero-description{font-size:13px}.privacy-note{align-items:flex-start;font-size:10px}.tool-panel{padding:21px 15px 22px}.panel-heading{align-items:flex-start;flex-direction:column;gap:8px}.panel-heading h2{font-size:25px}.limit-label{font-size:8px}.drop-zone{min-height:195px;padding-inline:10px}.file-item,.result-item{gap:6px;padding-inline:7px}.remove-file{font-size:9px}.converter-grid{gap:21px}.action-row{flex-wrap:wrap}.button-primary{width:100%}.results-heading{align-items:flex-start;flex-direction:column}.related-links{align-items:flex-start;flex-direction:column;gap:12px}.site-footer{min-height:75px}.site-footer>p{max-width:150px;font-size:8px;line-height:1.6}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
