:root{--green:#277258;--dark:#183d32;--ink:#243b33;--muted:#819087;--line:#e5e9e3;--bg:#f7f8f4}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button,a,input,select,[tabindex]{outline-offset:4px}button{border:0}aside{position:fixed;inset:0 auto 0 0;width:238px;background:#173c31;color:#e5eee8;padding:34px 20px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;color:#fff;text-decoration:none;font:800 25px Manrope,sans-serif;letter-spacing:-1px;margin:0 10px 52px}.brand-icon{background:#bdecb6;color:#1c4c39;border-radius:9px;font-size:32px;line-height:32px;width:33px;height:33px;margin-right:9px;text-align:center}.brand-dot{color:#bdecb6}.workspace-label{font-size:9px;letter-spacing:1.8px;color:#8da79b;margin:0 13px 13px}.nav{width:100%;text-align:left;background:transparent;color:#b8c9bf;padding:14px 12px;border-radius:7px;display:flex;gap:11px;align-items:center;font-size:12px;margin-bottom:5px}.nav>span:first-child{font-size:19px}.nav.active{background:#31574a;color:#fff}.small-dot{width:5px;height:5px;background:#c5edbd;border-radius:50%;margin-left:auto}.next-label{margin-top:39px}.future{display:flex;align-items:center;gap:12px;color:#93a99e;padding:14px 12px;font-size:12px}.future>span{font-size:19px}.future small{font-size:7px;border:1px solid #476355;border-radius:4px;padding:3px 5px;margin-left:auto;letter-spacing:.5px}.side-bottom{margin-top:auto;padding:20px 12px 0}.privacy-icon{font-size:25px;color:#c1e0a9;margin-bottom:14px}.side-bottom strong{font-size:12px}.side-bottom p{font-size:11px;line-height:1.8;color:#9eb3a7}.text-btn{background:transparent;color:#c2d7c9;padding:7px 0;font-size:11px}.version{border-top:1px solid #365347;margin-top:27px;padding-top:22px;color:#809d8d;font-size:8px;letter-spacing:1px;display:flex;justify-content:space-between}.shell{margin-left:238px}header{height:76px;border-bottom:1px solid var(--line);padding:0 44px;display:flex;align-items:center;justify-content:space-between;font-size:11px;background:#fcfdf9}.breadcrumb{color:#9aa49b}.slash{margin:0 14px;color:#b8c1b7}.head-right{display:flex;gap:22px;align-items:center}.local{color:#627b69;font-size:10px;display:flex;align-items:center;gap:6px}.local i{background:#66a474;width:5px;height:5px;border-radius:50%}#lang{font-size:10px;background:none;color:#637569}.help{background:none;border:1px solid #cdd7cd;border-radius:50%;width:22px;height:22px;color:#728474}main{max-width:1450px;padding:40px 44px 0;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:31px}.eyebrow{font-size:9px;letter-spacing:2px;color:#6d8b73;font-weight:700}h1{font:750 clamp(30px,3vw,44px) Manrope,sans-serif;letter-spacing:-1.8px;margin:12px 0 12px}h1 em{font-style:normal;color:#49845e}.intro p{font-size:12px;color:#7a867d;line-height:1.85;margin:0}.outline{background:transparent;border:1px solid #d9e1d5;padding:12px 15px;border-radius:7px;color:#526951;font-size:10px;white-space:nowrap}.steps{display:flex;align-items:center;max-width:700px;margin:0 0 25px;gap:16px}.step{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a958b;white-space:nowrap}.step b{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e9eee5;font-size:10px;font-weight:500}.step.current{color:#355b3e}.step.current b{background:#d9e9cc;color:#43633e}.step-line{height:1px;background:#e0e6dc;flex:1}.studio{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start}.panel{background:#fff;border:1px solid var(--line);border-radius:11px;overflow:hidden}.panel-heading{height:63px;display:flex;align-items:center;padding:0 22px;gap:10px}.panel-heading h2{font:700 13px Manrope,sans-serif;margin:0}.pill{background:#f0f3ed;border-radius:5px;color:#7e8f7b;padding:4px 7px;font-size:9px}.subtle{background:transparent;color:#7c8a7d;font-size:10px;padding:4px}.panel-heading>.subtle:last-child,.sub-label{margin-left:auto}.drop{border:1.5px dashed #bed0b8;border-radius:8px;margin:0 22px 20px;text-align:center;padding:36px 10px 29px;background:#f9fbf6;cursor:pointer;transition:.2s}.drop:hover,.drop.drag{background:#ecf5e6;border-color:#5c8f61}.upload-icon{background:#eaf1e4;border:1px solid #dae6d3;width:48px;height:48px;border-radius:12px;margin:0 auto 16px;font-size:33px;line-height:42px;position:relative;color:#58854f}.upload-icon span{position:absolute;bottom:-3px;right:-5px;background:#fff;border:1px solid #d9e5d0;border-radius:50%;font-size:13px;line-height:17px;width:18px}.drop h3{font:700 15px Manrope;margin:0 0 8px}.drop p{font-size:11px;color:#8a9488;margin:0}.drop u{color:#4c7c50;text-underline-offset:3px}.formats{font-size:8px;letter-spacing:1px;color:#9ba594;margin-top:24px}.formats span{margin:0 8px}.file-foot{display:flex;justify-content:space-between;padding:13px 22px;background:#fcfdf9;border-top:1px solid #f0f2ec;color:#8c9986;font-size:9px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 22px}.gallery:empty{margin:0}.photo{border:2px solid transparent;position:relative;border-radius:7px;padding:5px;min-width:0;margin-bottom:15px;cursor:pointer;background:#fafbf8}.photo.selected{border-color:#89a578}.photo img{width:100%;height:115px;object-fit:contain;background:#f2f1ec;border-radius:4px}.photo strong{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:8px 0 3px}.photo small{font-size:8px;color:#9ba494}.photo button{position:absolute;right:9px;top:9px;border-radius:50%;background:#ffffffdd;color:#516248;width:21px;height:21px;line-height:15px}.preview-panel{margin-top:22px}.sub-label{font-size:8px;letter-spacing:1px;color:#9aa38f}.preview-empty{text-align:center;padding:16px 12px 37px}.empty-tiles{display:flex;justify-content:center;align-items:center;gap:9px;margin-bottom:20px}.empty-tiles span{display:grid;place-items:center;width:51px;height:58px;border:1px solid #e1e8da;border-radius:6px;background:#f7f9f2;color:#c0cdb3;font-size:23px;transform:rotate(-9deg)}.empty-tiles span:nth-child(2){height:68px;transform:rotate(0deg)}.empty-tiles span:last-child{transform:rotate(9deg)}.preview-empty strong{font-size:11px;font-weight:500;color:#75806d}.preview-empty p{font-size:10px;color:#a3aa9b}.preview-note{padding:12px 22px;border-top:1px solid #f1f3ed;font-size:9px;color:#9ca492}.previews{display:flex;gap:14px;padding:0 22px 22px;overflow-x:auto}.previews:empty{display:none}.preview-item{min-width:110px;flex:1}.preview-item canvas{width:100%;height:140px;object-fit:contain;background:repeating-conic-gradient(#fafaf8 0% 25%,#f1f3ed 0% 50%) 50%/12px 12px;border-radius:6px}.preview-item strong{display:block;font-size:10px;margin-top:9px}.preview-item small{font-size:9px;color:#91a08a}.workflow{display:flex;gap:13px;margin:25px 4px;color:#697b5e}.workflow-icon{font-size:28px}.workflow strong{font-size:11px;font-weight:500}.workflow p{font-size:10px;color:#9aa18e;line-height:1.8;margin-top:5px}.settings .panel-heading{border-bottom:1px solid var(--line)}.settings-body{padding:20px}.label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.label-row h3{font-size:9px;letter-spacing:1.15px;font-weight:650;margin:0}.label-row>span{font-size:9px;color:#8d9b82}.profile{border:1px solid #dde6d7;border-radius:7px;padding:12px;margin-bottom:9px;background:#fbfcf8}.profile-top{display:flex;align-items:center;gap:8px}.profile-top input[type=checkbox]{accent-color:#5c824b;width:13px;height:13px;margin:0}.profile-name{border:none;background:none;min-width:0;flex:1;font-size:11px;color:#40573a;width:80px;font-weight:500}.remove-profile{background:transparent;font-size:14px;color:#9da796;padding:0 4px}.dims{display:flex;align-items:center;gap:6px;margin:9px 0 0 22px;font-size:9px;color:#8e9d85}.dims input{background:#fff;border:1px solid #e2e8dd;border-radius:4px;width:60px;padding:4px;color:#6b7d60;font-size:9px}.add-profile{width:100%;padding:9px;background:#fff;border:1px dashed #ccd8c3;border-radius:6px;font-size:10px;color:#6e8760}.section-line{height:1px;background:#edf0e8;margin:20px 0}.segmented{display:flex;padding:3px;background:#f1f4ed;border-radius:6px}.segmented button{flex:1;background:none;color:#89967d;font-size:10px;padding:8px 4px;border-radius:4px}.segmented .selected{background:#fff;box-shadow:0 1px 3px #31442110;color:#486439}.micro{font-size:9px;color:#939e88;line-height:1.6;margin:9px 0}.color-row{display:flex;align-items:center;justify-content:space-between;font-size:10px;margin-top:16px;color:#66785a}.color-control{display:flex;align-items:center;gap:8px;font-size:8px;color:#98a08e}input[type=color]{width:24px;height:24px;padding:1px;background:#fff;border:1px solid #dfe6d7;border-radius:5px}.toggle input{position:absolute;opacity:0}.toggle span{display:block;width:29px;height:17px;border-radius:20px;background:#e1e7db;position:relative;cursor:pointer}.toggle span:after{content:'';position:absolute;top:3px;left:3px;border-radius:50%;width:11px;height:11px;background:white;transition:.2s}.toggle input:checked+span{background:#5e8552}.toggle input:checked+span:after{left:15px}.toggle input:focus-visible+span{outline:2px solid #59814b}.two-fields{display:flex;gap:12px}.two-fields>label{flex:1;min-width:0}.two-fields label>span,.rename-label>span{display:block;font-size:10px;color:#6f7e62;margin-bottom:7px}select,.field{width:100%;border:1px solid #dde5d6;border-radius:5px;background:#fff;padding:9px 10px;color:#526746;font-size:10px}.quality{height:33px;display:flex;gap:6px;align-items:center}.quality input{width:70px;accent-color:#608449;height:3px}.quality output{font-size:9px;color:#718361}.rename-label{display:block;margin-top:14px}.code{font-family:monospace}.recipe-save{display:flex;justify-content:space-between;margin-top:15px}.export-bottom{background:#f7f9f3;border-top:1px solid #e5ebdc;padding:18px 20px}.export-bottom>div:first-child{display:flex;justify-content:space-between;font-size:9px;margin-bottom:13px;color:#8b987d}.export-bottom strong{font-size:9px;color:#5d7650;font-weight:500}.primary{display:flex;justify-content:space-between;align-items:center;width:100%;border-radius:6px;background:#284f3d;color:#fff;padding:14px 15px;font-size:11px;font-weight:500}.export-bottom p{text-align:center;font-size:8px;color:#96a087;margin:11px 0 0}progress{width:100%;margin-top:12px;accent-color:#5a8a4b}footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:23px 0;font-size:9px;color:#a0a895;margin-top:30px}footer button{padding:0!important;font-size:9px!important}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#214733;color:white;padding:13px 24px;border-radius:8px;z-index:10;display:none;max-width:90%;box-shadow:0 4px 24px #15302422;font-size:12px}dialog{border:1px solid #d7e2d0;border-radius:12px;padding:30px;color:var(--ink);max-width:500px;width:90%}dialog::backdrop{background:#0f291d66;backdrop-filter:blur(3px)}dialog h2{font-family:Manrope;font-size:22px}dialog p,dialog li{font-size:13px;line-height:1.8;color:#6b7d62}.close{float:right;background:none;font-size:24px;color:#7a8971}.logo-label{font-size:9px;color:#879579}.logo-label input{font-size:8px;width:120px;margin-top:7px}#watermarkOptions .two-fields{margin-top:9px}.busy .settings-body,.busy .files-panel,.busy .nav,.busy #demo,.busy #reset{pointer-events:none;opacity:.65}[hidden]{display:none!important}
@media(min-width:1500px){main{padding-top:48px}.drop{padding:48px 10px}.studio{grid-template-columns:minmax(0,1fr) 360px}.preview-empty{padding:30px 12px 46px}}@media(max-width:1150px){aside{width:204px;padding:30px 12px}.shell{margin-left:204px}main{padding:30px 25px 0}header{padding:0 25px}.studio{grid-template-columns:minmax(0,1fr) 300px;gap:16px}.intro{gap:15px}.intro .outline{max-width:145px;white-space:normal;line-height:1.5}.gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){aside{position:static;width:auto;padding:17px 22px;display:block}.brand{margin:0;font-size:22px}.workspace-label,.side-bottom,.future,aside nav{display:none}.shell{margin-left:0}header{height:58px}.studio{grid-template-columns:minmax(0,1fr) 300px}.intro h1{font-size:34px}.intro .outline{font-size:9px}}@media(max-width:680px){header{padding:0 20px}.local{display:none}.head-right{gap:10px}main{padding:26px 17px 0}.intro{display:block}.intro .outline{margin-top:18px;max-width:none}.intro h1{font-size:34px}.intro p{font-size:11px}.steps{gap:7px}.step{font-size:8px;gap:5px}.step b{width:19px;height:19px}.studio{display:flex;flex-direction:column}.left,.settings{width:100%}.gallery{grid-template-columns:repeat(3,1fr)}.photo img{height:85px}.workflow{display:none}.settings{margin-top:4px}.profile .dims input{width:80px}footer{flex-wrap:wrap}footer>span:nth-child(2){display:none}}
@media(max-width:900px){aside nav{display:flex;gap:8px;margin-top:16px}aside .nav{width:auto;padding:8px 12px;margin:0}aside .nav .small-dot{display:none}}@media(max-width:680px){aside{padding:15px 18px}.nav{font-size:10px}}

.profile-options{margin-top:12px;border-top:1px solid #e3e9dc;padding-top:10px}.profile-options summary{font-size:9px;color:#6d825d;cursor:pointer}.profile-options summary span{float:right;font-size:8px;color:#89977d}.profile-options label{display:block;font-size:9px;color:#738264;margin-top:10px}.profile-options select,.profile-options input{margin-top:5px}.profile-options .micro{font-size:8px}.future>span[data-i]{font-size:12px}.formats>span[data-i]{margin:0}
