*{box-sizing:border-box}body{margin:0;background:#f5f7f9;color:#172c3b;font:17px/1.65 system-ui,sans-serif}header,main,footer{max-width:1040px;margin:auto;padding:28px}header{display:flex;justify-content:space-between;border-bottom:1px solid #dbe2e8}a{color:#176356}h1{font-size:clamp(32px,6vw,56px);line-height:1.1}h2{line-height:1.3}.eyebrow{color:#176356;letter-spacing:.12em;text-transform:uppercase;font-size:13px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.card,form{background:white;border:1px solid #dbe2e8;border-radius:16px;padding:24px}.badge{font-size:13px;background:#fff0ca;padding:4px 9px;border-radius:6px}label{display:block;margin:16px 0}input{display:block;max-width:100%;padding:10px}button{background:#176356;color:white;padding:12px 18px;border:0;border-radius:8px;cursor:pointer}button:disabled{opacity:.5}#cancel{background:#516776}footer{font-size:14px}nav a{margin-left:18px}:focus-visible{outline:3px solid #df9f25;outline-offset:3px}

.check{display:flex;align-items:center;gap:10px}.check input{display:inline;width:auto}.hint{font-size:14px;color:#516776}.download{display:inline-block;border:1px solid #176356;padding:10px 16px;border-radius:8px}.download[hidden]{display:none}@media(max-width:600px){header{display:block}nav{margin-top:12px}nav a{margin:0 16px 0 0}}

select{display:block;max-width:100%;padding:10px;font:inherit}input:disabled,select:disabled{opacity:.6}

.conversion-progress{display:block;width:100%;height:12px;margin:20px 0 8px;accent-color:#176356}.conversion-progress[hidden]{display:none}

/* The WebP sample is scoped so the other tools retain their existing layout. */
.polished-tool{background:#f7f8f5;color:#203d36;font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.polished-tool :focus-visible{outline:3px solid #176356;outline-offset:3px}
.polished-tool [hidden]{display:none!important}
.polished-tool header,.polished-tool main,.polished-tool footer{max-width:1100px;padding:16px 32px}
.polished-tool header{align-items:center;border:0}
.polished-tool header>a{text-decoration:none;font-size:20px;font-weight:750;letter-spacing:-.8px}
.polished-tool nav a{font-size:13px;text-decoration:none;color:#53665a}
.polished-tool nav a:hover,.back-link:hover{text-decoration:underline}
.polished-tool main{padding-top:0}
.polished-tool footer{font-size:12px;color:#53665a;text-align:center;padding-top:0;padding-bottom:28px}
.tool-intro{position:relative;margin:0 0 20px;text-align:center}
.back-link{position:absolute;left:0;top:12px;display:block;width:max-content;margin:0;color:#53665a;text-decoration:none;font-size:12px}
.polished-tool h1{font-size:clamp(36px,5vw,46px);font-weight:750;letter-spacing:-2px;line-height:1.15;margin:0 0 8px}
.polished-tool h1 span{color:#d28b59}
.tool-intro>p{font-size:16px;color:#53665a;margin:0 0 6px}
.privacy-note{line-height:20px;font-size:12px;color:#536b5e;display:flex;gap:7px;justify-content:center;align-items:center}
.privacy-note>span{font-size:17px;color:#34715d}
.converter{border:1px solid #e0e6df;border-radius:24px;padding:0;box-shadow:0 12px 36px #203d3606;overflow:hidden}
.tool-loading{text-align:center;font-size:12px;color:#53665a;margin:0 0 12px}
.converter-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:24px}
.polished-tool h2{font-size:16px;letter-spacing:-.25px;font-weight:650;margin:0 0 12px;display:flex;align-items:center;gap:10px}
.step-number{border-radius:50%;width:24px;height:24px;display:grid;place-items:center;background:#eef2ed;font-size:12px;color:#53665a}
.polished-tool label{margin:0}
.drop-zone{position:relative;border:1.5px dashed #bbcdbd;border-radius:16px;min-height:252px;background:#f8faf7;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop-zone:hover,.drop-zone.drag-over{background:#edf5ee;border-color:#34715d}
.drop-zone:focus-within{outline:3px solid #176356;outline-offset:3px}
.drop-zone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;padding:0}
.upload-art{width:72px;height:72px;display:grid;place-items:center;background:#eaf0e8;border-radius:20px;margin:0 0 20px;transform:rotate(-6deg)}
.upload-art svg{width:52px;height:52px;stroke:#5b7f60;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.drop-zone>strong{font-size:17px;font-weight:600}
.drop-caption{font-size:13px;color:#53665a;margin-top:7px}
.choose-file{color:#176356;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.preview-promise{font-size:12px;color:#53665a;margin-top:20px}
.selected-file{border:1px solid #e0e6df;border-radius:16px;overflow:hidden;background:#f8faf7}
.preview-wrap{height:204px;padding:16px;display:grid;place-items:center;background:repeating-conic-gradient(#eaf0e8 0% 25%,#f5f7f2 0% 50%) 50%/16px 16px}
#file-preview{display:block;max-width:100%;max-height:172px;object-fit:contain}
.file-info{padding:16px 18px;display:flex;flex-direction:column;gap:4px}
#file-name{font-size:13px;overflow-wrap:anywhere}
#file-size{font-size:12px;color:#53665a}
.text-button{border:0;padding:4px 0;background:none!important;color:#176356;font:inherit;font-size:12px;text-align:left;width:fit-content;text-decoration:underline;text-underline-offset:3px}
.presets{border:0;padding:0;margin:0;display:grid;gap:8px;min-width:0}
.preset{display:flex;gap:12px;align-items:center;border:1px solid #e0e6df;border-radius:12px;padding:10px 14px;cursor:pointer;transition:background .15s,border-color .15s}
.preset:has(input:checked){background:#f0f6ef;border-color:#739d7f;box-shadow:inset 0 0 0 .5px #739d7f}
.preset:hover{background:#f7faf5}
.preset input{accent-color:#176356;width:16px;height:16px;margin:0;flex-shrink:0;padding:0}
.preset>span{display:flex;flex-direction:column;gap:3px}
.preset strong{font-size:13px;font-weight:650;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.preset strong small{font-size:8px;letter-spacing:.6px;background:#dce8d9;border-radius:4px;padding:3px 5px;color:#496b4f;font-weight:650}
.preset span span{font-size:12px;color:#53665a}
.target-label{font-size:12px;font-weight:600;margin:16px 0 8px!important;display:flex;justify-content:space-between}
.target-label>span{font-weight:400;color:#53665a;font-size:11px}
.target-field{display:flex;align-items:center;border:1px solid #dce3da;border-radius:9px;background:#fff}
.target-field:focus-within{outline:3px solid #176356;outline-offset:1px}
.target-field input{font:inherit;font-size:13px;width:100%;min-width:0;padding:10px 12px;border:0;background:transparent;outline:none}
.target-field select{font:inherit;font-size:12px;color:#466251;padding:10px 12px;border:0;border-left:1px solid #e0e6df;background:transparent;min-width:70px;border-radius:0 9px 9px 0;cursor:pointer}
.field-help{font-size:12px;line-height:1.6;color:#53665a;margin:7px 0 0}
.custom-setting{font-size:11px;color:#176356;margin:10px 0 0}
.compatibility-help{font-size:12px;color:#53665a;margin-top:14px}
.compatibility-help>summary{font-weight:600;padding:4px 0}
.compatibility-help>div{line-height:1.7;padding:0 2px}
.compatibility-help ul{padding-left:18px}
.compatibility-help li+li{margin-top:8px}
.compatibility-help a{color:#176356;text-underline-offset:2px}
.advanced{border-top:1px solid #e9ede7;margin:0 32px}
.polished-tool summary{cursor:pointer;list-style:none}
.polished-tool summary::-webkit-details-marker{display:none}
.polished-tool summary::before{content:'+';font-size:16px;margin-right:10px;color:#53665a}
.polished-tool details[open]>summary::before{content:'−'}
.advanced>summary{padding:18px 0;font-size:12px;font-weight:600}
.advanced>summary>span{font-size:11px;font-weight:400;color:#53665a;float:right}
.advanced-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:4px 0 24px}
.advanced-grid>label,.quality-floor>label{font-size:12px;font-weight:500}
.advanced-grid select,.advanced-grid input[type=number]{width:100%;font:inherit;margin-top:8px;padding:10px;border:1px solid #dce3da;border-radius:8px;background:#fff;color:#203d36}
.advanced-grid .check{font-size:12px;gap:8px;align-items:flex-start}
.advanced-grid .check input{accent-color:#176356;margin:3px 0 0}
.action-row{padding:18px 32px;border-top:1px solid #e9ede7;display:flex;justify-content:space-between;align-items:center;gap:16px;background:#fcfdfb}
.action-row>div:first-child{font-size:11px;color:#53665a;display:flex;align-items:center;gap:7px}
.local-dot{background:#84a780;width:5px;height:5px;border-radius:50%}
.action-buttons{display:flex;align-items:center;gap:12px}
.polished-tool button[type=submit],.polished-tool .download{font:inherit;font-size:13px;font-weight:600;padding:13px 20px;border-radius:10px;background:#245e48;display:inline-flex;align-items:center;justify-content:center;gap:22px;color:#fff;text-decoration:none;border:0;min-height:46px;transition:background .15s}
.polished-tool button[type=submit]:hover:not(:disabled),.polished-tool .download:hover{background:#184a36}
.polished-tool button[type=submit]:disabled{cursor:not-allowed;background:#dce3da;color:#53665a;opacity:1}
.converter:has(.converter-grid[aria-busy=true]) button[type=submit]:disabled{cursor:wait;background:#245e48;color:#fff;opacity:.6}
.polished-tool #cancel{background:#edf1eb;color:#536b5e;border-radius:10px;font:inherit;font-size:12px;padding:13px 16px}
.conversion-feedback{padding:0 32px}
.conversion-feedback>[role=status]{font-size:12px;margin:0;padding:0 0 18px;color:#53665a;overflow-wrap:anywhere}
.conversion-feedback>[role=status]:empty{padding:0}
.resource-notice{font-size:12px;line-height:1.6;padding:14px 16px;margin:0 0 18px;background:#fff6df;border:1px solid #e2c783;border-radius:10px;color:#6b4913}
.resource-notice strong{display:block;font-size:13px}
.resource-notice p{margin:5px 0 0}
.conversion-feedback .conversion-progress{height:6px;margin:0 0 8px;accent-color:#245e48}
#progress-detail{padding-bottom:20px}
.conversion-result{margin:0 32px 28px;padding:24px;background:#f0f6ed;border:1px solid #d8e4d2;border-radius:14px}
.result-heading{display:flex;gap:12px;align-items:center}
.result-check{background:#dcead5;color:#3e7148;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.result-heading h2{font-size:16px;margin:0 0 4px}
#result-size{margin:0;font-size:15px;font-weight:600;color:#365b41}
#result-saving{margin-left:auto;white-space:nowrap;font-size:13px;font-weight:650;color:#365b41;background:#dcead5;border-radius:7px;padding:6px 10px}
#result-note{font-size:12px;color:#53665a;margin:14px 0 0}
.size-suggestion{margin-top:18px;padding:16px;border:1px solid #cbdbea;border-radius:10px;background:#f0f6fc;color:#36536d;font-size:12px;line-height:1.6}
.size-suggestion strong{display:block;font-size:13px}
.size-suggestion p{margin:6px 0 12px}
.polished-tool .suggestion-link{display:inline-flex;align-items:center;gap:10px;min-height:42px;padding:9px 12px;border:1px solid #52758e;border-radius:7px;color:#284d67;background:#fff;font-weight:600;text-decoration:none}
.polished-tool .suggestion-link:hover{background:#e5eff8}
.playback-notice{margin-top:18px;padding:16px;border:1px solid #e2c783;border-left:4px solid #b77b19;border-radius:10px;background:#fff6df;color:#6b4913;font-size:12px;line-height:1.6}
.playback-notice strong{display:block;font-size:13px}
.playback-notice p{margin:6px 0 10px}
.polished-tool #change-playback{padding:8px 12px;border:1px solid #b77b19;border-radius:7px;background:#fffaf0;color:#6b4913;font:inherit;font-weight:600;min-height:40px}
.preview-comparison{margin-top:20px;--comparison-position:50%}
.preview-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.result-preview{margin:0;min-width:0}
.result-preview figcaption{display:flex;justify-content:space-between;gap:10px;font-size:12px;font-weight:600;margin-bottom:10px}
.result-preview figcaption>span{font-weight:400;color:#53665a;white-space:nowrap}
.preview-pair .preview-stage{display:grid;place-items:center;min-height:180px;padding:20px;border:1px solid #d8e4d2;border-radius:10px;background:repeating-conic-gradient(#e3eade 0% 25%,#f7faf4 0% 50%) 50%/20px 20px}
.preview-pair img{display:block;max-width:100%;max-height:360px;object-fit:contain}
.comparison-captions{display:flex;justify-content:space-between;gap:16px;margin-bottom:10px;font-size:12px;font-weight:600}
.comparison-captions>div{min-width:0}
.comparison-captions>div:last-child{text-align:right}
.comparison-captions span{display:block;font-weight:400;color:#53665a;white-space:nowrap;margin-top:2px}
.comparison-canvas{position:relative;isolation:isolate;overflow:hidden;width:100%;min-height:180px;max-height:480px;border:1px solid #c6d7bf;border-radius:10px;aspect-ratio:4/3}
.comparison-canvas .preview-stage{position:absolute;inset:0;display:grid;place-items:center;background:repeating-conic-gradient(#e3eade 0% 25%,#f7faf4 0% 50%) 50%/20px 20px}
.comparison-canvas img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;user-select:none}
.preview-comparison[data-comparison-ready] .comparison-source{clip-path:inset(0 calc(100% - var(--comparison-position)) 0 0)}
.polished-tool .comparison-range{position:absolute;z-index:3;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;opacity:0;pointer-events:none}
.preview-comparison[data-comparison-ready] .comparison-canvas{cursor:ew-resize;touch-action:pan-y}
.comparison-canvas:has(.comparison-range:focus-visible){outline:3px solid #176356;outline-offset:3px}
.comparison-divider{position:absolute;z-index:2;top:0;bottom:0;left:var(--comparison-position);width:3px;transform:translateX(-50%);background:#fff;box-shadow:0 0 0 1px #203d3670;pointer-events:none}
.comparison-divider>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:7px;width:44px;height:44px;border:2px solid #fff;border-radius:50%;background:#176356;color:#fff;box-shadow:0 2px 12px #203d3640;font-size:25px;line-height:1}
.comparison-divider>span>span{height:18px;border-left:1px solid #ffffff80}
.comparison-canvas:has(.comparison-range:focus-visible) .comparison-divider>span{outline:3px solid #203d36;outline-offset:3px}
.comparison-note{font-size:12px;color:#53665a;margin:10px 0 0}
#result-preview-fallback{font-size:12px}
.polished-tool .download{margin-top:18px}
.result-details{margin-top:18px;font-size:12px;color:#53665a}
#conversion-report{line-height:1.8;overflow-wrap:anywhere}
.tool-help{max-width:700px;margin:24px auto 0;color:#53665a;font-size:12px}
.tool-help>summary{text-align:center;padding:8px}
.tool-help>div{padding:8px 16px}
.help-points{padding-left:20px;margin:4px 0 16px;line-height:1.8}
.help-points li+li{margin-top:6px}
.technical-details{border-top:1px solid #e0e6df;padding-top:12px}
.technical-details>summary{font-weight:600}
.technical-details>div{line-height:1.8}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.polished-tool header,.polished-tool main,.polished-tool footer{padding-left:20px;padding-right:20px}.polished-tool header{display:flex;flex-wrap:wrap;gap:10px;padding-top:20px;padding-bottom:20px}.polished-tool nav{margin:0;display:flex;flex-wrap:wrap;gap:14px}.polished-tool nav a{margin:0;font-size:11px}.tool-intro{margin-bottom:24px}.back-link{position:static;margin:0 auto 16px}.polished-tool h1{letter-spacing:-1.5px}.tool-intro>p{font-size:15px}.converter{border-radius:18px}.converter-grid{grid-template-columns:1fr;gap:28px;padding:24px}.drop-zone{min-height:220px}.upload-art{width:60px;height:60px;margin-bottom:14px}.advanced{margin:0 24px}.advanced>summary>span{display:none}.advanced-grid{grid-template-columns:1fr;gap:18px}.action-row{padding:20px 24px;flex-wrap:wrap}.action-row>div:first-child{display:none}.action-buttons{width:100%}.polished-tool button[type=submit]{flex:1}.conversion-feedback{padding:0 24px}.conversion-result{margin:0 16px 20px;padding:20px}.result-heading{flex-wrap:wrap}#result-saving{margin-left:46px}.polished-tool .download{width:100%}.tool-help{margin-top:16px}}
@media(prefers-reduced-motion:reduce){.polished-tool *{transition:none!important}}
@media(max-width:700px){.comparison-canvas{min-height:160px;max-height:360px}.preview-pair{grid-template-columns:minmax(0,1fr)}.preview-pair img{max-height:240px}}

/* Shared tool and information pages use the WebP interface's visual language. */
.simple-settings{border:1px solid #e0e6df;border-radius:12px;padding:20px;background:#f8faf7;font-size:13px;line-height:1.7}
.simple-settings p{margin:10px 0 0;color:#53665a}
#file-preview-fallback{max-width:260px;text-align:center;font-size:13px;margin:0}
.home-page{padding:20px 0 40px}
.home-intro{text-align:center;max-width:680px;margin:0 auto 48px}
.home-intro .eyebrow{font-size:12px;letter-spacing:.1em;margin-bottom:14px}
.polished-tool .home-intro h1{font-size:clamp(40px,6vw,64px);margin-bottom:18px}
.home-intro>p:not(.eyebrow){color:#53665a;font-size:17px}
.home-intro .privacy-note{font-size:13px;margin-top:18px}
.home-page #tools-heading{font-size:18px;margin-bottom:18px}
.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.tool-card{position:relative;border-radius:18px;padding:24px;min-height:204px;box-shadow:0 8px 28px #203d3605}
.tool-card:focus-within,.tool-card:hover{border-color:#739d7f;background:#f8faf7}
.format-label{display:inline-block;font-size:12px;font-weight:650;color:#365b41;background:#eaf0e8;padding:6px 10px;border-radius:8px;margin-bottom:22px}
.polished-tool .tool-card h2{font-size:17px;margin-bottom:10px;display:block}
.tool-card h2 a{color:#203d36;text-decoration:none}
.tool-card h2 a::after{content:'';position:absolute;inset:0;border-radius:18px}
.tool-card h2 a:focus-visible{outline:none}
.tool-card:has(a:focus-visible){outline:3px solid #176356;outline-offset:3px}
.tool-card p{font-size:13px;line-height:1.7;color:#53665a;margin:0;padding-right:16px}
.card-arrow{position:absolute;top:26px;right:24px;color:#176356;font-size:20px}
.document-page{position:relative;max-width:820px;margin:24px auto 48px;padding:32px;background:white;border:1px solid #e0e6df;border-radius:20px;line-height:1.8;overflow-wrap:anywhere}
.document-page .back-link{position:static;margin-bottom:22px}
.document-page h1{margin-bottom:24px}
.document-page p{font-size:14px}
.hdr-example{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);align-items:center;gap:32px;margin:36px 0;padding:28px;background:#fff;border:1px solid #e0e6df;border-radius:20px}
.hdr-example .eyebrow{font-size:11px;letter-spacing:.06em;margin:0 0 12px}
.polished-tool .hdr-example h2{display:block;font-size:clamp(23px,3vw,30px);letter-spacing:-.8px;line-height:1.2;margin:0 0 14px}
.hdr-example-copy>p{font-size:14px;line-height:1.7;margin:0 0 14px}
.hdr-example-copy .hdr-example-support,.hdr-example-copy .hdr-example-auto{font-size:12px;color:#53665a}
.hdr-example-link{display:inline-block;margin-top:4px;font-size:13px;font-weight:650;text-underline-offset:4px}
.hdr-example-photo{min-width:0;margin:0;overflow:hidden;border:1px solid #e0e6df;border-radius:14px;background:#f7f8f5}
.hdr-example-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;font-size:12px;font-weight:600;min-height:68px}
.hdr-example-photo img{display:block;width:100%;height:auto;aspect-ratio:1512/850;object-fit:contain;dynamic-range-limit:no-limit}
.hdr-example-switch{display:flex;align-items:center;gap:8px;padding:10px 12px;min-height:44px;border-radius:9px;color:#203d36;background:#eaf0e8;white-space:nowrap;font:inherit;font-weight:650}
.hdr-example-switch:hover{background:#dce8d9}
.hdr-switch-track{display:block;width:30px;height:18px;padding:3px;background:#65786d;border-radius:12px}
.hdr-switch-track::after{content:'';display:block;width:12px;height:12px;background:#fff;border-radius:50%}
.hdr-example-switch[aria-checked=true] .hdr-switch-track{background:#176356}
.hdr-example-switch[aria-checked=true] .hdr-switch-track::after{transform:translateX(12px)}
.hdr-example-photo figcaption{padding:12px 14px}
.hdr-example-photo figcaption p{font-size:12px;line-height:1.6;margin:0;color:#53665a}
.hdr-example-photo figcaption .hdr-example-credit{font-size:11px;margin-top:7px}
.hdr-example-credit a{text-underline-offset:2px}
.batch-results{border-top:1px solid #e9ede7;padding:24px 32px}
.batch-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}
.batch-heading h2{margin:0!important}
.batch-results>p,.batch-downloads p{font-size:12px;color:#53665a}
#batch-progress{display:block;width:100%;height:10px;accent-color:#176356;margin:12px 0}
.batch-list{list-style:none;padding:0;margin:16px 0;display:grid;gap:10px}
.batch-photo{display:flex;justify-content:space-between;align-items:center;gap:18px;border:1px solid #e0e6df;border-radius:12px;padding:14px}
.batch-photo>div:first-child{min-width:0;flex:1}.batch-photo strong{font-size:13px;overflow-wrap:anywhere}.batch-photo p{font-size:12px;color:#53665a;margin:5px 0 0;overflow-wrap:anywhere}
.batch-photo[data-state=active]{border-color:#739d7f;background:#f0f6ef}.batch-photo[data-state=failed]{border-color:#d7b298;background:#fffaf5}
.batch-photo-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:45%}.batch-photo-actions a{font-size:12px;text-underline-offset:3px}.batch-photo-actions button{min-height:40px;overflow-wrap:anywhere}
.batch-downloads{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.batch-downloads p{width:100%;margin:0}
.heic-fallback{margin:16px 32px}.heic-fallback button{margin-top:10px;font-size:12px;max-width:100%;white-space:normal}
.heic-error-details{margin:0 0 16px;font-size:13px;color:#53665a}.heic-error-details summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}.heic-error-details p{overflow-wrap:anywhere;line-height:1.6}.batch-photo .heic-error-details{margin:10px 0 0}
@media(max-width:700px){.batch-results{padding:20px}.batch-photo{display:block}.batch-photo-actions{max-width:none;margin-top:10px}.heic-fallback{margin:16px 24px}}
@media(max-width:850px){.hdr-example{grid-template-columns:minmax(0,1fr);gap:14px;padding:24px}.hdr-example-copy>p{max-width:640px}}
@media(max-width:700px){.hdr-example{margin:24px 0;padding:20px;gap:12px}.hdr-example-toolbar{padding:10px;font-size:11px}.hdr-example-photo figcaption{padding:10px}.hdr-example-switch{padding:10px}}
@media(max-width:900px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.tool-grid{grid-template-columns:minmax(0,1fr)}.home-page{padding-top:4px}.home-intro{margin-bottom:32px}.home-intro>p:not(.eyebrow){font-size:15px}.home-intro .privacy-note{display:block;font-size:12px}.tool-card{min-height:180px}.document-page{padding:24px;margin:12px auto 28px}}

/* A labeled concept diagram; the real photo is never visually simulated. */
.hdr-illustration{grid-column:1/-1;border-top:1px solid var(--line,#d6ded9);padding-top:1.6rem;display:grid;grid-template-columns:1fr 1.3fr;gap:2rem;align-items:center}.hdr-illustration h3{font-size:1.45rem;margin:.3rem 0 .7rem}.hdr-illustration p{font-size:.9rem;line-height:1.6}.hdr-range-diagram>div+div{margin-top:1rem}.hdr-range-diagram>div>span{display:block;font-weight:650;font-size:.85rem;margin-bottom:.4rem}.hdr-range{display:flex;border-radius:.5rem;overflow:hidden;min-height:2.8rem;font-size:.78rem;line-height:1.3}.hdr-range>span{width:60%;background:#dce9e2;color:#203e32;padding:.7rem}.hdr-range>strong{width:40%;background:#f8db9a;color:#513a13;padding:.7rem}.hdr-range-diagram>p{font-size:.77rem;color:#53635a;margin-bottom:0}.heic-faq,.common-questions{margin:2rem 0 0}.heic-faq>h2,.common-questions>h2{font-size:1.5rem}.heic-faq details,.common-questions details{border-top:1px solid #d6ded9;padding:1rem 0}.heic-faq summary,.common-questions summary{font-weight:650;cursor:pointer}.heic-faq p,.common-questions p{line-height:1.65;max-width:70ch;color:#53635a}.technical-details li+li{margin-top:.8rem}.result-heading>div{min-width:0}.result-heading #result-size{overflow-wrap:anywhere}
@media(max-width:700px){.hdr-illustration{grid-template-columns:1fr;gap:.5rem}.hdr-range>strong,.hdr-range>span{padding:.6rem;font-size:.72rem}}

/* Static examples and help stay below the conversion form. */
.animation-example{margin:36px 0;padding:28px;border:1px solid #e0e6df;border-radius:20px;background:#fff}
.animation-example .eyebrow{font-size:11px;margin:0 0 10px}
.polished-tool .animation-example h2{display:block;font-size:clamp(23px,3vw,30px);line-height:1.2;margin:0 0 12px;letter-spacing:-.8px}
.animation-example p{font-size:13px;line-height:1.7;color:#53665a}
.example-heading>p:last-child{margin:0 0 20px}
.example-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.example-previews figure{min-width:0;margin:0;border:1px solid #e0e6df;border-radius:12px;overflow:hidden}
.example-previews img{display:block;width:100%;height:auto;aspect-ratio:8/5;background:#f5f7f1}
.example-previews figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;padding:12px 14px;font-size:13px}
.example-result strong{display:inline-block;margin-left:8px;color:#203d36}
.example-details{font-size:13px;border-top:1px solid #e0e6df;padding-top:14px}
.example-details summary{cursor:pointer;font-weight:650}
.example-details a{display:inline-block;margin-bottom:5px}
.home-about{margin:28px 0;line-height:1.7}.home-about p{font-size:14px;color:#53665a}
.document-page h2{display:block;font-size:20px;margin-top:28px}
.guide-callout{margin:28px 0;padding:24px 28px;background:#eaf0e8;border:1px solid #c7d6c6;border-radius:18px;line-height:1.6}
.guide-callout .eyebrow{font-size:11px;letter-spacing:.06em;margin:0 0 8px;color:#365b41}
.polished-tool .guide-callout h2{display:block;font-size:22px;margin:0 0 8px;letter-spacing:-.5px}
.guide-callout p{font-size:14px;margin:0;color:#365b41}
.hdr-guide{max-width:1120px;margin:auto}
.hdr-guide .document-page{max-width:none;padding:32px 40px}
.hdr-guide .guide-intro{background:#f8faf7}
.hdr-guide .guide-intro h1{font-size:clamp(30px,4.5vw,48px);line-height:1.15;max-width:20ch;letter-spacing:-1.5px;margin:16px 0 20px}
.hdr-guide .document-page p,.hdr-guide li{font-size:15px;line-height:1.8;max-width:78ch}
.hdr-guide .guide-intro .guide-lead{font-size:18px;line-height:1.7}
.hdr-guide h2{scroll-margin-top:24px;margin:0 0 18px}
.hdr-guide h3{font-size:17px;line-height:1.5;margin:20px 0 6px}
.hdr-guide li p{margin:6px 0 14px}
.hdr-guide ol,.hdr-guide ul{padding-left:24px}
.hdr-guide .guide-steps li::marker{font-weight:700;color:#176356}
.guide-action{display:inline-block;padding:12px 18px;border-radius:10px;background:#176356;color:#fff;font-size:14px;font-weight:650;text-decoration:none}
.guide-action:hover{background:#124b41}
.guide-contents{display:flex;flex-wrap:wrap;gap:12px 24px;border-top:1px solid #d6ded9;padding-top:20px;margin-top:24px;font-size:14px}
.hdr-guide details{border-top:1px solid #d6ded9;margin-top:24px;padding-top:18px;font-size:14px}
.hdr-guide summary{cursor:pointer;font-weight:650}
.guide-table{overflow-x:auto;margin:22px 0;border:1px solid #d6ded9;border-radius:12px}
.guide-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7;text-align:left}
.guide-table th,.guide-table td{padding:14px 18px;vertical-align:top;border-bottom:1px solid #d6ded9}
.guide-table thead{background:#eaf0e8}
.guide-table tbody th{width:30%;font-weight:650}
.guide-table tr:last-child>*{border-bottom:0}
.guide-measurements{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}
.guide-measurements>div{background:#f7f8f5;border-radius:12px;padding:18px}
.guide-measurements dt{font-size:13px;line-height:1.6;color:#53665a}
.guide-measurements dd{margin:8px 0 0;font-size:24px;font-weight:700;color:#203d36}
.guide-downloads{display:flex;flex-wrap:wrap;gap:12px 24px}
.guide-cases li+li{border-top:1px solid #d6ded9;padding-top:4px;margin-top:20px}
@media(max-width:700px){.guide-callout{padding:20px}.hdr-guide .document-page{padding:24px}.hdr-guide .guide-intro .guide-lead{font-size:16px}.guide-measurements{grid-template-columns:1fr;gap:10px}.guide-measurements>div{padding:14px}.guide-measurements dd{font-size:22px}.guide-table th,.guide-table td{padding:12px}.guide-table tbody th{width:35%}}
@media(max-width:600px){.animation-example{padding:18px}.example-previews{gap:10px}.example-previews figcaption{padding:10px;font-size:12px}.common-questions>h2{font-size:22px}}

.hdr-example-verification{grid-column:1/-1;border-top:1px solid #d6ded9;padding-top:1rem;font-size:.85rem;line-height:1.65}.hdr-example-verification summary{font-weight:650;cursor:pointer}.hdr-example-verification p{max-width:75ch;color:#53635a;margin:.8rem 0 0}.hdr-example-verification a{text-underline-offset:3px}

.tool-intro>.local-processing-note,.home-intro>.local-processing-note{font-size:13px;line-height:1.6;color:#53665a;max-width:52ch;margin:8px auto 0}.local-processing-note a{text-underline-offset:3px}
