
:root{font-family:Arial,Helvetica,sans-serif;color:#213d35;background:#f6f7f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:1200px;margin:auto}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce2d8}a{color:inherit}header>a:last-child{text-decoration:none;font-size:14px}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:700;letter-spacing:-1px;text-decoration:none}.mark{font-size:35px;color:#42775a}.badge{font-size:9px;letter-spacing:1.2px;margin-left:14px;border:1px solid #ccd8cb;border-radius:20px;padding:8px;font-weight:500}.intro{padding:62px 0 36px;position:relative}.eyebrow,.steps{font-size:10px;font-weight:700;letter-spacing:1.8px}.eyebrow{color:#54745e}h1{font-size:68px;line-height:1.03;letter-spacing:-3.5px;margin:20px 0}h1 span{color:#718a65}.intro>p:last-child{position:absolute;right:18px;bottom:48px;line-height:1.8;color:#667368;font-size:16px}.workspace{border:1px solid #d7dfd2;border-radius:20px;background:#fff;display:grid;grid-template-columns:1.5fr 1fr;overflow:hidden;box-shadow:0 12px 40px #203d3506}.editor{padding:30px}.steps{display:flex;justify-content:space-between;color:#718072;margin-bottom:24px}.drop{height:302px;background:#f6f8f2;border:1px dashed #a7b89a;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;cursor:pointer;position:relative}.drop:hover,.drop.dragging{background:#eaf0e0;border-color:#4c7154}.drop strong{font-size:21px}.drop>span:not(.upload-icon){font-size:14px;color:#75816f}.drop small{font-size:11px;color:#7c8777;margin-top:10px}.upload-icon{font-size:36px;background:#e9efdf;border-radius:14px;width:64px;height:64px;text-align:center;padding-top:8px}.drop input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.settings{background:#fcfcf8;border-left:1px solid #e4e8de;padding:30px}.tabs{display:flex;background:#ecefe7;padding:4px;border-radius:9px;margin-bottom:26px;gap:3px}.tabs button{flex:1;border:0;background:transparent;padding:10px 4px;border-radius:6px;color:#60705d;cursor:pointer}.tabs button[aria-pressed=true]{background:white;box-shadow:0 2px 5px #0000000c;color:#213d35;font-weight:700}label:not(.drop){display:block;font-size:12px;font-weight:700;margin:18px 0 9px}label>span{float:right;color:#82917a}input[type=number],select{width:100%;padding:12px;border:1px solid #d6ddce;border-radius:7px;background:#fff;font-size:15px;color:#213d35}.presets{display:flex;gap:8px;margin-top:10px}.presets button{border:1px solid #dfe5d8;border-radius:5px;padding:6px 12px;background:white;font-size:11px;color:#617456;cursor:pointer}.hint{font-size:11px;line-height:1.65;color:#7b8574;margin:10px 0 16px}.primary,.download{display:block;width:100%;border:0;border-radius:8px;padding:15px;margin-top:20px;background:#294e3e;color:white;font-size:14px;font-weight:700;text-align:center;text-decoration:none;cursor:pointer}.primary:disabled{opacity:.45;cursor:not-allowed}.download{background:#dceabb;color:#294e3e;margin-top:10px}.local{font-size:10px;color:#7b8974;text-align:center;margin:16px 0 0}.ad-slot{margin:28px 0 66px;border:1px solid #dce2d6;border-radius:8px;text-align:center;padding:18px;background:#eff2e9;color:#8b9582}.ad-slot span{font-size:8px;letter-spacing:2px}.ad-slot p{font-size:12px;margin:9px}.how{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:35px;border-bottom:1px solid #dce2d8;padding-bottom:55px}h2{font-size:27px;letter-spacing:-1px;line-height:1.2}.how article{padding-top:10px}.how article>span{font-size:11px;color:#829874}.how h3{font-size:16px;margin-top:20px}.how article p,.faq p{font-size:13px;color:#74806f;line-height:1.8}.faq{max-width:750px;margin:50px auto 70px}.faq h2{margin-bottom:25px}details{border-bottom:1px solid #dce2d8;padding:19px 0}summary{cursor:pointer;font-size:14px}footer{border-top:1px solid #dce2d8;display:flex;align-items:center;gap:25px;padding:28px 0;font-size:12px;color:#7d8875}footer span{margin-right:auto}footer .brand{font-size:20px}.fileline{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.fileline strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-button{background:none;border:0;color:#54745e;text-decoration:underline;cursor:pointer;white-space:nowrap}.preview{height:250px;background:repeating-conic-gradient(#edf0e9 0% 25%,#fafbf8 0% 50%) 0/20px 20px;border-radius:8px;margin:15px 0;display:flex;justify-content:center;align-items:center}.preview img{max-width:100%;max-height:100%;object-fit:contain}.stats{display:flex;gap:30px;font-size:9px;letter-spacing:1px;color:#7b8974}.stats b{display:block;letter-spacing:0;font-size:12px;color:#294e3e;margin-top:7px}#status{font-size:12px;color:#6f7d66;line-height:1.6;margin-bottom:0}#status.error{color:#a03624}.dimensions{display:flex;gap:10px;align-items:center}.dimensions>div{flex:1;min-width:0}.check{display:flex!important;align-items:center;gap:8px;font-weight:400!important}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #91ab70;outline-offset:3px}[hidden]{display:none!important}@media(max-width:1250px){header,main,footer{margin-left:30px;margin-right:30px}}@media(max-width:760px){header{height:80px}.badge{display:none}.intro{padding-top:35px}h1{font-size:50px}.intro>p:last-child{position:static;font-size:14px}.workspace{grid-template-columns:1fr}.settings{border-left:0;border-top:1px solid #e4e8de}.editor,.settings{padding:22px}.drop{height:250px}.drop small{font-size:9px}.how{grid-template-columns:1fr 1fr;gap:20px}.how>div{grid-column:1/-1}.ad-slot{margin-bottom:40px}footer{flex-wrap:wrap;gap:16px}footer span{width:100%;order:3}header,main,footer{margin-left:18px;margin-right:18px}}
/* Accessibility and small-screen refinements. */
.skip-link{position:absolute;left:16px;top:-100px;z-index:10;padding:12px 18px;background:#294e3e;color:#fff;border-radius:6px}.skip-link:focus{top:12px}.drop:focus-within{outline:3px solid #52753d;outline-offset:4px}.hint,.local,.drop small,.how article p,.faq p{color:#56634f}.presets{flex-wrap:wrap}.presets button{min-height:36px}.tabs button,.text-button{min-height:40px}#workspace:focus{outline:3px solid #91ab70;outline-offset:4px}.drop small{padding:0 12px;text-align:center;line-height:1.6}.noscript{max-width:750px;margin:25px auto;padding:20px;border:2px solid #a03624}.stats{flex-wrap:wrap;gap:18px}.stats span{min-width:0}.stats b{line-height:1.5}.preview{overflow:hidden}button:disabled,select:disabled,input:disabled{cursor:wait}.primary:disabled{cursor:not-allowed}
@media(max-width:400px){header .brand{font-size:21px}header>a:last-child{font-size:12px}.intro h1{font-size:43px;letter-spacing:-2px}.editor,.settings{padding:18px}.steps{font-size:9px;letter-spacing:1px}.how{grid-template-columns:1fr}.how>div{grid-column:auto}.drop strong{font-size:19px}.faq h1{font-size:42px;letter-spacing:-2px}}

.guide{max-width:750px;margin:52px auto 0;padding:0 0 25px;border-bottom:1px solid #dce2d8}.guide p{font-size:14px;line-height:1.8;color:#56634f}.intro>p:last-child{max-width:440px}.intro h1{font-size:58px;letter-spacing:-3px}@media(max-width:1000px){.intro>p:last-child{position:static;max-width:none}.intro h1{font-size:54px}}@media(max-width:760px){.intro h1{font-size:48px}}@media(max-width:400px){.intro h1{font-size:37px;letter-spacing:-1.8px}}

.language-nav{max-width:1200px;margin:0 auto;padding:12px 0 0;display:flex;gap:16px;align-items:center;font-size:13px}.language-nav a{padding:6px 0;text-underline-offset:3px}.language-nav [aria-current]{font-weight:700}.language-nav+header{height:80px}html[lang="pt-BR"] .intro h1{font-size:52px}html[lang="pt-BR"] .intro>p:last-child{position:static;max-width:none}html[lang="pt-BR"] .tabs button{font-size:12px}@media(max-width:1250px){.language-nav{margin-left:30px;margin-right:30px}}@media(max-width:760px){.language-nav{margin-left:18px;margin-right:18px}html[lang="pt-BR"] .intro h1{font-size:43px}}@media(max-width:400px){html[lang="pt-BR"] .intro h1{font-size:36px;letter-spacing:-1.5px}.language-nav{gap:12px}html[lang="pt-BR"] .tabs button{font-size:11px}}

/* File actions remain reachable with long filenames and narrow screens. */
.editor,.settings{min-width:0}.fileline{flex-wrap:wrap}.fileline strong{min-width:0;flex:1 1 140px}.file-actions{display:flex;gap:12px;flex-wrap:wrap}.file-actions button{padding:6px 0;min-height:44px}.check input{flex-shrink:0;min-width:18px;min-height:18px}.language-nav a{min-height:44px;display:inline-flex;align-items:center}.language-nav+ .skip-link+header{height:80px}#status{color:#526048}.drop>span:not(.upload-icon){color:#56634f}
