*{box-sizing:border-box}html{scroll-behavior:smooth;color-scheme:light}body{margin:0;background:#f6f5f1;color:#172a28;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.55}button,input{font:inherit}a{color:inherit;text-underline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.46}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ca632e;outline-offset:4px}[hidden]{display:none!important}.skip{position:absolute;left:16px;top:-70px;background:white;padding:12px;z-index:10}.skip:focus{top:10px}.site-head,main,footer{width:min(1336px,calc(100% - 64px));margin:auto}.site-head{display:flex;justify-content:space-between;align-items:center;padding:26px 0;border-bottom:1px solid #d9dfd8}.brand{font-size:24px;letter-spacing:-1px;font-weight:800;text-decoration:none}.brand span{font-size:12px;font-weight:500;letter-spacing:0;margin-left:12px;color:#66756d}.site-head nav{display:flex;gap:26px;font-size:13px}.site-head nav a{text-decoration:none}.hero{padding:56px 0 35px;max-width:900px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:750;color:#62766a;margin:0 0 16px}h1{font-size:clamp(42px,5vw,68px);line-height:1.05;letter-spacing:-3px;font-weight:650;margin:0 0 22px}h1 em{font-style:normal;color:#677e50}.lede{font-size:17px;max-width:570px;color:#596660;margin:0;line-height:1.7}.trust{list-style:none;display:flex;gap:22px;padding:0;font-size:12px;font-weight:550;color:#516050;margin:24px 0 0}.trust li:before{content:"✓";color:#788b5a;margin-right:7px}.studio{display:grid;grid-template-columns:minmax(0,1fr) 350px;background:#fff;border:1px solid #dce2db;border-radius:20px;box-shadow:0 16px 50px #23382f06;overflow:clip;align-items:start}.workspace{padding:28px;min-width:0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.section-heading .eyebrow{margin-bottom:6px}h2{font-size:19px;font-weight:650;letter-spacing:-.6px;margin:0}.count{padding:4px 11px;background:#f0f3ec;border:1px solid #e3e8dc;border-radius:20px;white-space:nowrap;font-size:11px}.drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;min-height:155px;border:1px dashed #a9ba9c;border-radius:12px;background:#f9fbf6;margin-top:24px;padding:20px;cursor:pointer}.drop:hover,.drop.dragging{background:#edf5e4;border-color:#566d3d}.drop strong{font-size:14px}.drop>span:last-of-type{font-size:11px;color:#6f7b6b}.drop-icon{font-size:26px;font-weight:300;color:#70825f}.drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.drop:focus-within{outline:3px solid #ca632e;outline-offset:3px}.file-actions{display:flex;justify-content:space-between;gap:8px;margin-top:8px}.text-button{padding:8px 0;background:none;border:0;color:#567046;font-size:12px;text-decoration:underline;text-underline-offset:4px}.danger{color:#975443}.empty-preview{padding:30px 10px 20px;text-align:center}.sample-art{position:relative;width:240px;height:148px;max-width:100%;margin:6px auto 20px;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,#ece4d0,#e2d9bb)}.art-disc{position:absolute;top:30px;left:75px;width:90px;height:90px;border-radius:50%;background:linear-gradient(140deg,#df8462,#9b4835);box-shadow:7px 14px 22px #74452633}.art-orbit{position:absolute;top:17px;left:65px;width:110px;height:110px;border:1px solid #fff9;border-radius:50%;transform:rotate(-30deg) scaleX(1.8)}.art-chip{position:absolute;bottom:10px;left:12px;font-size:9px;letter-spacing:1px;color:#5f513e;background:#fffc;padding:3px 7px;border-radius:4px}.empty-preview h3{font-size:16px;margin:0 0 8px}.empty-preview p{font-size:13px;color:#788176;margin:0}.settings{padding:28px;border-left:1px solid #e5e9e1;background:#f9faf7;position:sticky;top:0}.settings .eyebrow{margin-bottom:6px}.settings h2{margin-bottom:26px}fieldset{border:0;margin:0;padding:0}legend,.control-label{font-size:12px;font-weight:650;margin-bottom:10px}.format-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.format-choices label{position:relative;cursor:pointer}.format-choices input{position:absolute;opacity:0}.format-choices span{display:flex;flex-direction:column;gap:5px;background:#fff;border:1px solid #d8dfd2;border-radius:8px;padding:11px 5px;text-align:center;font-size:14px;font-weight:750}.format-choices small{font-size:8px;font-weight:500;white-space:nowrap;color:#798473}.format-choices input:checked+span{background:#e6eddc;border-color:#697f50;color:#33452b}.format-choices input:focus-visible+span{outline:3px solid #ca632e;outline-offset:2px}.format-choices input:disabled+span{opacity:.4}.hint{font-size:11px;color:#6c7868;line-height:1.65;margin:11px 0 20px}.control-label{display:flex;justify-content:space-between;margin-top:18px}.control-label output,.control-label span{font-size:11px;color:#69725d}input[type=range]{width:100%;accent-color:#687e48}input[type=color]{width:100%;height:37px;padding:2px;border:1px solid #d1d9cb;border-radius:6px;background:#fff}.dimensions{border-top:1px solid #dce2d5;border-bottom:1px solid #dce2d5;margin:22px 0;padding:15px 0}.dimensions summary{cursor:pointer;font-size:12px;font-weight:650}.dimensions summary span{float:right;color:#85907b;font-size:11px;font-weight:400}.dimension-grid{display:grid;grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr);align-items:end;gap:8px}.dimension-grid label{font-size:10px;color:#596653}.dimension-grid>span{margin-bottom:7px;color:#8f9987}.dimension-grid input{display:block;width:100%;min-width:0;margin-top:5px;border:1px solid #ccd5c5;border-radius:6px;padding:9px;background:#fff}.dimensions .hint:last-child{margin-bottom:0}.button{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 17px;border-radius:8px;font-weight:650;font-size:13px;min-height:48px;border:1px solid transparent}.primary{background:#344c2e;color:#fff}.primary:hover:not(:disabled){background:#253e20}.secondary{background:#fff;border-color:#cdd8c4;color:#425338;margin-top:8px}.progress-area{margin:13px 0;font-size:11px;color:#65705f;min-height:26px}.progress-area p{margin:5px 0}progress{width:100%;height:6px;accent-color:#6b8546}.local-note{font-size:10px;color:#7b8773;margin:18px 0 0}.error{font-size:12px;background:#fff0e8;border:1px solid #f3cab9;border-radius:8px;padding:12px;color:#89482f}.comparison{margin:24px 0 10px}.compare-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}.compare-heading h3{font-size:13px;overflow-wrap:anywhere;margin:0}.compare-heading>span{font-size:9px;white-space:nowrap;color:#7b8474}.preview-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.preview-pair figure{margin:0;min-width:0}.checker{background-color:#fff;background-image:linear-gradient(45deg,#e7e9e3 25%,transparent 25%),linear-gradient(-45deg,#e7e9e3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e7e9e3 75%),linear-gradient(-45deg,transparent 75%,#e7e9e3 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;min-height:160px;aspect-ratio:4/3;border:1px solid #e1e5da;border-radius:9px;display:flex;align-items:center;justify-content:center;overflow:hidden}.checker img{max-width:100%;max-height:240px;object-fit:contain}.preview-pair figcaption{display:flex;flex-direction:column;gap:3px;font-size:10px;margin-top:7px;color:#77826b}.preview-pair strong{color:#33422d;font-size:11px}.results{padding:0;margin:22px 0 0;list-style:none}.result-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;border-top:1px solid #e6eadf;padding:14px 0}.row-thumb{width:44px;height:44px;object-fit:contain;border:1px solid #e2e6da;background:#f3f5ed;border-radius:7px}.row-placeholder{display:grid;place-items:center;font-size:9px;color:#819075}.result-row strong{font-size:12px;display:block;overflow-wrap:anywhere;font-weight:600}.result-row p{font-size:10px;line-height:1.55;color:#7a8571;margin:3px 0 0;overflow-wrap:anywhere}.result-row[data-state=error] p{color:#99543b}.result-row[data-state=success] p{color:#58713c}.row-actions{display:flex;gap:5px;align-items:center}.row-actions a,.row-actions button{font-size:10px;background:#f5f7ef;border:1px solid #dce4d0;border-radius:5px;padding:6px 8px;text-decoration:none;color:#3f5c29;min-height:32px}.row-actions button.remove{background:none;border:0;color:#8a9182}.explain{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin:58px 0 50px}.explain article>span{font-size:10px;letter-spacing:1px;color:#6e845b}.explain h2{font-size:18px;margin:12px 0}.explain p{font-size:13px;color:#6c786d;margin:0;line-height:1.8}.faq{max-width:850px;border-top:1px solid #d9dfd3;padding:34px 0 45px}.faq h2{font-size:26px;margin-bottom:24px}.faq details{padding:16px 0;border-bottom:1px solid #e0e4da}.faq summary{cursor:pointer;font-size:14px;font-weight:600}.faq p{font-size:13px;color:#6a7768;line-height:1.85;margin:13px 0 0}footer{display:flex;gap:30px;align-items:center;padding:25px 0 34px;border-top:1px solid #d9dfd3}footer span{font-size:12px;color:#7b8774}footer>a:last-child{font-size:12px;margin-left:auto}@media(max-width:960px){.studio{grid-template-columns:minmax(0,1fr) 310px}.workspace,.settings{padding:21px}.site-head,main,footer{width:calc(100% - 36px)}.hero{padding-top:38px}}@media(max-width:720px){.site-head{padding:20px 0}.brand span{display:none}.site-head nav{gap:17px;font-size:11px}.hero{padding:34px 0 27px}h1{font-size:44px;letter-spacing:-2px}.lede{font-size:14px}.trust{gap:15px;font-size:10px}.studio{grid-template-columns:1fr;border-radius:14px}.settings{position:static;border-left:0;border-top:1px solid #e5e9e1}.workspace{padding:18px}.section-heading h2{font-size:16px}.empty-preview{padding:20px 0 5px}.sample-art{height:115px;width:200px}.art-disc{top:15px;left:57px}.art-orbit{top:8px;left:47px}.explain{grid-template-columns:1fr;gap:26px;margin:35px 0}.explain h2{margin:7px 0}.compare-heading{align-items:start;flex-direction:column;gap:4px}.checker{min-height:100px}.result-row{grid-template-columns:36px minmax(0,1fr);gap:9px}.row-thumb{width:36px;height:36px}.row-actions{grid-column:2;flex-wrap:wrap}.faq{padding-top:27px}footer{gap:12px}footer span{max-width:130px;font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.settings.settings{min-width:0}.format-choices.format-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.format-choices.format-choices small{white-space:normal}@media(max-width:720px){.studio.studio{grid-template-columns:minmax(0,1fr)}}
/* Secondary copy keeps the quiet green palette with AA contrast on every
   light surface, including selected format tiles and converted-file states. */
.brand span,.eyebrow,.drop>span:last-of-type,.drop-icon,.empty-preview p,
.format-choices small,.hint,.control-label output,.control-label span,
.dimensions summary span,.dimension-grid>span,.progress-area,.local-note,
.compare-heading>span,.preview-pair figcaption,.row-placeholder,.result-row p,
.row-actions button.remove,.explain article>span,.explain p,.faq p,footer span{color:#526149}
.format-choices small{font-size:10px;line-height:1.45}
.format-choices span{height:100%;justify-content:center}