:root{font-family:Inter,Arial,sans-serif;color:#172b35;background:#f5f7f4;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.47}a{color:#0a6760}a:hover{text-decoration:underline}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:white;padding:10px;z-index:9}header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1280px)/2));background:#fff;border-bottom:1px solid #e6ebe8}.wordmark{font-size:18px;font-weight:900;letter-spacing:.18em;color:#102b35;text-decoration:none}.wordmark span{font-size:8px;vertical-align:top;margin-left:3px}nav{display:flex;gap:25px;font-size:13px;font-weight:700}nav a{text-decoration:none;color:#233a41}main{max-width:1360px;margin:auto;padding:0 24px}.preview-banner{margin:20px 0 0;padding:9px 14px;border-radius:6px;background:#e8f0ed;color:#24675c;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.hero{display:grid;grid-template-columns:1.3fr .7fr;gap:36px;min-height:300px;align-items:center;padding:38px 20px 26px}.eyebrow{color:#23877c;text-transform:uppercase;letter-spacing:.18em;font-size:11px;font-weight:900;margin:0 0 10px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(36px,4.8vw,72px);line-height:1.04;letter-spacing:-.055em;max-width:750px;margin-bottom:20px}h1 em{font-style:normal;color:#178578}.lead{font-size:17px;line-height:1.6;color:#4a626a;max-width:640px}.promises{font-size:12px;font-weight:800;color:#425e61}.promises span{padding:0 9px;color:#91a6a5}.hero-art{height:230px;border-radius:22px;background:linear-gradient(135deg,#e0ede8,#edf3eb);display:flex;align-items:center;justify-content:center;gap:22px;overflow:hidden}.hero-art span{width:115px;height:130px;background:#fff;border:1px solid #d8e3df;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-size:11px;color:#7a8e91;font-weight:800;box-shadow:0 10px 28px #1f534315}.hero-art i,.hero-art b{font-size:48px;color:#286862;font-style:normal;letter-spacing:-.12em}.hero-art i{filter:blur(2px);opacity:.5}.hero-art strong{font-size:30px;color:#319b88}.tool{background:#fff;border:1px solid #e3eae7;border-radius:20px;box-shadow:0 20px 65px #1b42310b;margin:0 0 50px;overflow:hidden}.tool-head{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:24px 30px;border-bottom:1px solid #e8eeeb}.tool-head h2{font-size:26px;letter-spacing:-.03em;margin:0}.tool-head>p{font-size:12px;color:#61777b;max-width:240px;line-height:1.5;margin:0}.tool-grid{display:grid;grid-template-columns:380px 1fr;min-height:600px}.controls{padding:27px 29px;border-right:1px solid #e8eeeb}.controls label,.downloads label,.dpi label{display:block;font-size:12px;font-weight:800;color:#2b454b;margin:13px 0}.controls label small{display:block;color:#839397;font-weight:500;margin-top:6px;line-height:1.4}.upload{border:2px dashed #b9d6cd;background:#f5faf7;border-radius:12px;padding:17px;text-align:center;cursor:pointer}.upload input{width:100%;font-size:11px;margin-top:10px}.demo-button{display:block;margin:9px 0 12px;border:0;background:transparent;color:#0f706a;text-decoration:underline;font-size:12px;padding:4px 0}.status{font-size:12px;color:#586f73;min-height:17px;line-height:1.45}fieldset{border:0;padding:8px 0;margin:17px 0 10px;border-top:1px solid #e8eeeb}legend{font-size:11px;font-weight:900;text-transform:uppercase;color:#667e80;letter-spacing:.08em;padding-top:17px}.method-grid{display:flex;gap:8px}.method-grid label{flex:1;display:flex;gap:7px;align-items:flex-start;border:1px solid #dce6e3;padding:10px;border-radius:8px;margin:4px 0;line-height:1.3}.method-grid label:has(input:checked){border-color:#208d80;background:#eff9f5}.method-grid input{accent-color:#158779;margin:2px 0 0}.method-grid b{display:block}.method-grid small{font-size:10px}.tip{font-size:11px;color:#668084;line-height:1.5;margin:9px 0}input[type=range]{display:block;width:100%;accent-color:#148578;margin:7px 0}input[type=number],select{border:1px solid #cddcd8;border-radius:7px;padding:8px;max-width:100%;background:white;color:#203c42}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.inline-check{display:flex!important;gap:7px;align-items:center}.inline-check input{accent-color:#168578}.swatches{display:flex;flex-wrap:wrap;gap:6px}.swatches input{height:28px;width:28px;border:1px solid #d6e2df;border-radius:50%;padding:0;background:white}.actions{display:flex;gap:7px;margin:21px 0 9px}.actions button,.downloads button,.handoff button{padding:11px 15px;border-radius:8px;border:1px solid #c7dad5;background:#fff;font-weight:800;font-size:12px;color:#135c56}.actions .primary{background:#073c3a;color:white;border-color:#073c3a;flex:1}.limits,.small{font-size:11px;line-height:1.5;color:#7c8f91}.results{padding:26px 30px;background:#fbfcfa}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px}.comparison figure{margin:0}.checker{height:360px;border:1px solid #dce6e3;border-radius:12px;display:flex;align-items:center;justify-content:center;background-color:#f5f8f6;background-image:linear-gradient(45deg,#e7efeb 25%,transparent 25%),linear-gradient(-45deg,#e7efeb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e7efeb 75%),linear-gradient(-45deg,transparent 75%,#e7efeb 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;overflow:hidden}.checker img{width:100%;height:100%;object-fit:contain;padding:14px}.comparison figcaption{font-size:10px;letter-spacing:.08em;font-weight:900;color:#5c7579;padding:10px 2px}.comparison figcaption span{float:right;letter-spacing:0;font-weight:500}.dpi,.downloads,.handoff{border-top:1px solid #e6eeeb;margin-top:19px;padding-top:18px}.dpi h3{font-size:15px;margin-bottom:7px}.dpi input{width:72px}.dpi select{width:62px}.badge{display:inline-block;border-radius:20px;padding:6px 12px;font-size:11px;font-weight:800}.badge.neutral{background:#edf2f0;color:#526d70}.badge.good{background:#d9f4e9;color:#087454}.badge.warn{background:#fff0d1;color:#825419}.badge.bad{background:#ffe5e1;color:#a63c31}.downloads,.handoff{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.downloads label{margin:0}.downloads input{width:86px}.handoff button{background:#e8f4ef}.handoff a{font-size:12px;font-weight:700}.seo-copy{max-width:900px;margin:0 auto 90px;font-size:14px;line-height:1.75;color:#435c63}.seo-copy h2{font-size:25px;color:#102e37;letter-spacing:-.03em;margin:38px 0 10px}.seo-copy table{border-collapse:collapse;width:100%;margin:15px 0 25px;font-size:12px}.seo-copy th,.seo-copy td{border:1px solid #dce6e3;padding:10px;text-align:left}.seo-copy th{background:#eaf2ef}.faq details{border-bottom:1px solid #dfe8e4;padding:12px 0}.faq summary{cursor:pointer;font-weight:800;color:#25464a}.faq details p{margin:9px 0}footer{padding:30px max(24px,calc((100vw - 1280px)/2));background:#102b35;display:flex;gap:28px;color:white;font-size:12px}footer a{color:white}@media(max-width:980px){.tool-grid{grid-template-columns:330px 1fr}.controls{padding:20px}.results{padding:20px}.checker{height:270px}.hero-art{height:190px}.hero-art span{width:90px;height:105px}}@media(max-width:720px){header{height:62px;padding:0 17px}.wordmark{font-size:14px}nav{gap:13px;font-size:11px}main{padding:0 13px}.preview-banner{font-size:9px}.hero{grid-template-columns:1fr;padding:38px 4px 25px;gap:16px}.hero-art{height:140px}.hero-art span{width:75px;height:90px;font-size:9px}.hero-art i,.hero-art b{font-size:31px}.hero h1{font-size:clamp(33px,9vw,49px)}.lead{font-size:14px}.promises{font-size:10px}.tool-head{padding:19px;display:block}.tool-head h2{font-size:22px}.tool-head>p{margin-top:8px}.tool-grid{display:block}.controls{border-right:0;border-bottom:1px solid #e8eeeb}.results{padding:17px}.checker{height:210px}.seo-copy{font-size:13px;padding:0 5px}.seo-copy h2{font-size:22px}.seo-copy table{font-size:10px}footer{padding:25px 18px;flex-wrap:wrap}}@media(max-width:380px){.comparison{gap:7px}.checker{height:160px}.method-grid{display:block}.tool-head h2{font-size:20px}.promises span{padding:0 3px}.hero-art{height:115px}}

.swatches>div{display:flex;align-items:center;gap:3px;border:1px solid #dfe9e5;border-radius:18px;padding:3px;background:#fff}.swatches button{border:0;background:#e8f4ef;color:#0b6d60;font-size:11px;font-weight:800;min-height:28px;border-radius:14px;padding:2px 7px}
/* Milestone progress for the optional AI upscale. */
#upscale-progress:not([hidden]){display:block;width:100%;height:10px;margin:12px 0 4px;accent-color:#158779}

[hidden]{display:none!important}.preview-tools{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-bottom:16px}.preview-tools label{font-size:11px;font-weight:800;display:grid;gap:5px}.preview-tools button,.photo-warning button,.dialog-actions button{border:1px solid #bfd5cd;background:#fff;border-radius:8px;padding:10px 12px;font-size:12px;font-weight:750;color:#14574f}.preview-tools input[type=color]{height:35px;width:50px}.comparison[data-background=dark] .checker{background:#15212c}.comparison[data-background=garment] .checker{background:var(--garment-background,#254439)}.photo-warning{border:1px solid #dcc797;background:#fff9ec;padding:16px;border-radius:10px;margin:15px 0}.photo-warning h3{font-size:16px}.photo-warning p{font-size:12px;line-height:1.55}.photo-warning button{width:100%;text-align:left;margin:5px 0;background:#fffdf7}.photo-warning button:hover{border-color:#258174}dialog{width:min(940px,94vw);max-height:92vh;overflow:auto;border:1px solid #cfdfd7;border-radius:16px;padding:24px;color:#183c40;background:#fbfdfb;box-shadow:0 20px 80px #001a2440}dialog::backdrop{background:#0a202baa}.dialog-heading{display:flex;justify-content:space-between;align-items:start;gap:18px}.dialog-heading h2{font-size:24px;letter-spacing:-.02em}.dialog-heading button{border:0;background:transparent;font-size:25px;padding:0 5px;color:#34565b}dialog p{font-size:13px;line-height:1.6}dialog label{font-size:12px;font-weight:700}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}.dialog-actions .primary{background:#073c3a;color:white;border-color:#073c3a}#crop-canvas{display:block;max-width:100%;height:auto;margin:auto;background:#dbe5e1;touch-action:none;cursor:crosshair}.crop-fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.crop-fields label{display:grid;gap:5px}.crop-fields input{width:100%}.reference-photo{display:flex;align-items:center;gap:16px;margin:18px 0;padding:12px;background:#edf3ef;border-radius:10px}.reference-photo img{width:150px;height:150px;object-fit:contain}.reference-photo p{overflow-wrap:anywhere;margin:0}#recreation-dialog{max-width:690px}#recreation-dialog textarea{display:block;width:100%;font:inherit;font-weight:400;border:1px solid #bdd3c9;border-radius:8px;padding:10px;margin:6px 0 12px}.attachment-note{border-left:3px solid #aa803c;padding:10px 13px;background:#fff8e8}dialog .inline-check{line-height:1.5;margin:15px 0}dialog .inline-check input{flex-shrink:0}@media(max-width:600px){dialog{padding:17px}.crop-fields{grid-template-columns:1fr 1fr}.reference-photo{display:block}.reference-photo img{width:120px;height:120px}.preview-tools{align-items:center}.preview-tools button{font-size:11px}.dialog-actions button{flex:1}}

/* The tool comes first on phones; processing and comparison remain reachable. */
:focus-visible{outline:3px solid #bc851e;outline-offset:3px}
button{min-height:42px}button,input,select{touch-action:manipulation}
.hero-upload{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;padding:14px 22px;background:#073c3a;color:#fff;font-weight:800;margin:0 0 16px;min-height:48px}
.processing-dock{background:#fff;border:1px solid #dce7e1;border-radius:10px;padding:10px 12px;margin:14px 0}
.processing-dock .actions{margin:0}.processing-dock .status:empty{display:none}.processing-dock .status{margin:8px 0 0}
.gradient-warning,.warning{border-left:3px solid #a47324;background:#fff5dd;color:#78521f;padding:12px;font-size:12px;line-height:1.5}
.comparison{display:grid;grid-template-columns:minmax(0,1fr);gap:0;position:relative;isolation:isolate;border-radius:12px;overflow:hidden;background:#254439}
.comparison figure{grid-area:1 / 1;min-width:0;position:relative}
.comparison .checker{height:clamp(320px,36vw,480px);border-radius:0;border:0}
.comparison .checker img{padding:16px;user-select:none;-webkit-user-drag:none}
.compare-after{clip-path:inset(0 0 0 var(--compare,50%));z-index:1}
.comparison figcaption{position:absolute;top:12px;left:12px;right:auto;max-width:calc(100% - 24px);padding:6px 9px;color:#fff;background:#0c202bce;border-radius:5px;line-height:1.4;pointer-events:none}
.comparison .compare-after figcaption{left:auto;right:12px}.comparison figcaption span{float:none;display:block;font-size:9px}
.compare-divider{position:absolute;left:var(--compare,50%);top:0;bottom:0;border-left:2px solid #fff;box-shadow:0 0 4px #112b4e66;z-index:2;pointer-events:none}
.compare-controls{display:flex;align-items:center;gap:16px;margin-top:12px}.compare-controls label{flex:1;font-size:12px;font-weight:700;min-width:0}.compare-controls input{margin:12px 0;min-height:24px}
.compare-controls button,.area-tools button{border:1px solid #bfd5cd;border-radius:8px;background:#fff;color:#14574f;padding:10px 14px;font-weight:700;font-size:12px;flex-shrink:0}
.area-tools button[aria-pressed=true]{color:#fff;background:#14574f}.area-tools .tip{max-width:650px}
.print-size-fields{display:flex;gap:12px}.print-size-fields label{display:grid;gap:6px}.dpi .print-size-fields input,.dpi .print-size-fields select{width:100px}
.downloads .small,.downloads .tip,.downloads .inline-check{flex-basis:100%;margin:0;line-height:1.5}.downloads label[for=png-width]{display:flex;align-items:center;gap:9px}.downloads input[type=checkbox]{width:auto}
.zoom-comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px}.zoom-comparison figure{min-width:0;margin:0}.zoom-comparison figcaption{font-size:12px;font-weight:800;margin-bottom:7px}.zoom-image{background:#254439;border-radius:8px;overflow:auto;min-height:160px}.zoom-image img{display:block;width:100%;height:auto;min-height:160px;object-fit:contain;padding:10px}
#compare-zoom-dialog .dialog-heading{position:sticky;top:-24px;background:#fbfdfb;z-index:2;padding-top:6px}#compare-zoom-dialog .dialog-heading h2{margin-bottom:12px}
#crop-dialog{max-height:96vh;max-height:96dvh;padding:18px}#crop-dialog .dialog-heading h2{margin-bottom:8px;font-size:21px}#crop-dialog>p{margin:0 0 8px;font-size:12px;line-height:1.45}
#crop-canvas{width:auto;max-height:max(90px,calc(100vh - 290px));max-height:max(90px,calc(100dvh - 290px));max-width:100%;object-fit:contain}
#crop-dialog .crop-fields{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}#crop-dialog .crop-fields label{font-size:11px}#crop-dialog .crop-fields input{min-width:0;padding:6px}
#crop-dialog .dialog-actions{position:sticky;bottom:-18px;z-index:2;background:#fbfdfb;padding:10px 0 2px;margin-top:6px;box-shadow:0 -6px 12px #fbfdfbcc}
#crop-dialog #crop-note{margin-top:7px;font-size:10px}.recreation-price{background:#ecf6ef;padding:10px 12px;border-radius:7px}
@media(max-width:720px){
  .hero{padding:24px 4px 18px;gap:0;min-height:0}.hero-art{display:none}.hero h1{font-size:34px;line-height:1.04;margin-bottom:12px}.hero .lead{font-size:13px;line-height:1.5;margin-bottom:14px}.hero .eyebrow{font-size:10px;margin-bottom:8px}.promises{font-size:10px;line-height:1.6;margin-bottom:0}.hero-upload{width:100%;margin-bottom:12px}
  .preview-banner{margin-top:12px;font-size:8px;line-height:1.5;padding:7px 10px}.tool-head{padding:16px}.tool-head .eyebrow{font-size:10px}.controls{padding:16px}.tool{overflow:visible}.tool-head{border-radius:20px 20px 0 0}.results{border-radius:0 0 20px 20px;padding:14px;scroll-margin-top:12px;min-width:0}
  .processing-dock{position:sticky;top:8px;z-index:5;box-shadow:0 4px 20px #173b3420;scroll-margin-top:12px}.method-grid{display:flex}.method-grid label{min-width:0;font-size:11px;padding:9px}.method-grid small{line-height:1.4}
  .comparison .checker{height:320px;min-height:280px}.comparison .checker img{padding:10px}.compare-controls{gap:10px}.compare-controls button{padding:9px 11px}.preview-tools{gap:8px}.preview-tools button{flex-grow:1}
  .zoom-comparison{grid-template-columns:1fr}.zoom-image img{max-height:none}.zoom-image{min-height:220px}dialog{width:calc(100vw - 20px);padding:15px}.dialog-heading h2{font-size:21px}.dialog-heading button{min-width:42px;min-height:42px;flex-shrink:0}#compare-zoom-dialog .dialog-heading{top:-15px}#crop-dialog{padding:12px}#crop-dialog .dialog-actions{bottom:-12px}#crop-dialog .dialog-heading h2{font-size:18px}#crop-dialog .dialog-heading button{min-height:30px}#crop-dialog .crop-fields{gap:5px}#crop-dialog .crop-fields label{font-size:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}