:root{--bg:#fff;--surface:#fff;--surface-soft:#edf7ff;--line:#d8ecff;--line-strong:#172033;--text:#172033;--muted:#5c6b7a;--accent:#51a9fd;--accent-dark:#1479d2;--accent-soft:#e7f4ff;--gold:#ffc94a;--danger:#b64b38;--pink:#51a9fd;--lavender:#d8ecff;--mint:#71dca7;--lime:#d5f06a;--shadow:7px 7px 0 #d8ecff}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{color:var(--text);background:var(--bg);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;position:relative;overflow-x:hidden}body:before,body:after{content:"";pointer-events:none;position:fixed;inset:0}body:before{z-index:-2;opacity:.9;background-color:#0000;background-image:linear-gradient(90deg,#51a9fd17 1px,#0000 1px),linear-gradient(#51a9fd17 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box}body:after{z-index:-1;opacity:.55;background:radial-gradient(circle at 50% 0,#51a9fd29,#0000 34rem);-webkit-mask-image:linear-gradient(#000,#0000 80%);mask-image:linear-gradient(#000,#0000 80%)}button,input,select{font:inherit}button,a,label,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}img{max-width:100%}h1,h2,h3,p{margin-top:0}.site-nav{z-index:20;border:3px solid var(--line-strong);width:min(1180px,100% - 28px);box-shadow:6px 6px 0 var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff0;border-radius:0;justify-content:space-between;align-items:center;gap:1rem;margin:12px auto 0;padding:.68rem .78rem;display:flex;position:sticky;top:10px}.brand,.nav-links,.nav-actions,.nav-cta{align-items:center;gap:.7rem;display:flex}.brand{color:var(--text);font-weight:900;text-decoration:none}.brand-block{width:26px;height:26px;image-rendering:pixelated;border:2px solid var(--line-strong);background:linear-gradient(var(--accent) 0 42%, #8a5a35 42%), repeating-linear-gradient(90deg, #fff3 0 4px, transparent 4px 8px);border-radius:0;display:inline-block}.nav-links a{color:var(--muted);font-size:.94rem;font-weight:800;text-decoration:none}.nav-links a:hover,.text-link:hover{color:var(--accent)}.language-switcher select{min-height:40px;color:var(--text);border:3px solid var(--line-strong);background:var(--surface);box-shadow:4px 4px 0 var(--line);border-radius:0;padding:.52rem .7rem;font-weight:900}.nav-cta,.download-row button{color:#fff;border:3px solid var(--line-strong);background:var(--accent);min-height:40px;box-shadow:4px 4px 0 var(--line-strong);border-radius:0;padding:.62rem .9rem;font-weight:900;text-decoration:none}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.hero{padding:clamp(2rem,4vw,4rem) clamp(1rem,4vw,4rem) 2.5rem}.hero-copy{text-align:center;max-width:900px;margin:0 auto 1.6rem}.eyebrow,.panel-kicker{color:var(--accent-dark);letter-spacing:.09em;text-transform:uppercase;margin:0 0 .6rem;font-size:.78rem;font-weight:900}h1{max-width:900px;color:var(--text);letter-spacing:0;overflow-wrap:anywhere;text-shadow:4px 4px 0 var(--line);margin-bottom:.85rem;margin-left:auto;margin-right:auto;font-size:clamp(2.35rem,4.9vw,4.65rem);font-weight:950;line-height:.95}.subtitle{max-width:780px;color:var(--muted);margin:0 auto;font-size:clamp(1.05rem,1.9vw,1.38rem);line-height:1.5}.hero-social-proof{color:var(--text);border:3px solid var(--line-strong);background:var(--surface);box-shadow:5px 5px 0 var(--line);align-items:center;gap:.85rem;margin-top:1.15rem;padding:.55rem .8rem .55rem .55rem;font-weight:950;display:inline-flex}.avatar-train{align-items:center;padding-left:.2rem;display:flex}.avatar-train img{object-fit:cover;border:2px solid var(--line-strong);background:var(--accent-soft);width:36px;height:36px;image-rendering:pixelated;margin-left:-.35rem}.avatar-train img:first-child{margin-left:0}.generator-shell,.section,.feature-grid{width:100%;max-width:1180px;margin:0 auto}.compare-slider{--split:54%;border:3px solid var(--line-strong);min-height:344px;box-shadow:none;background:#10160f;border-radius:0;position:relative;overflow:hidden}.compare-media,.compare-fallback{width:100%;height:100%;position:absolute;inset:0}.compare-media{object-fit:cover}.before-media{z-index:1;background:0 0}.compare-fallback{background:linear-gradient(#93d5f7f2 0 58%,#69aa4ff2 58% 78%,#7e522ff2 78%),repeating-linear-gradient(90deg,#ffffff29 0 18px,#0000 18px 36px)}.before-fallback:before,.after-fallback:before{content:"";aspect-ratio:1;background:#33a94d;width:28%;position:absolute;top:20%;left:9%;box-shadow:34px 28px #1d7b35,104px 28px #1d7b35,72px 82px #111,42px 122px #111,112px 122px #111}.after-fallback{z-index:2;background:repeating-linear-gradient(0deg,#0000 0 15px,#0000003d 15px 16px),repeating-linear-gradient(90deg,#0000 0 15px,#0000003d 15px 16px),linear-gradient(#62b9d8 0 58%,#5da54a 58% 78%,#7a4a2b 78%)}.after-fallback:before{background:#2fa547;width:26%;top:22%;left:10%;box-shadow:32px 32px #1d7b35,96px 32px #1d7b35,64px 80px #111,32px 128px #111,96px 128px #111}.after-media{clip-path:inset(0 0 0 var(--split));image-rendering:pixelated;z-index:2}.compare-range{z-index:8;opacity:0;cursor:ew-resize;width:100%;height:100%;position:absolute;inset:0}.compare-handle{top:0;bottom:0;left:var(--split);z-index:6;pointer-events:none;background:#fff;width:3px;position:absolute;transform:translate(-50%);box-shadow:0 0 0 1px #1f281f38,0 0 24px #ffffffbf}.compare-handle:after{content:"";border:3px solid var(--line-strong);background:var(--accent);width:46px;height:46px;box-shadow:4px 4px 0 var(--line-strong);border-radius:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.compare-label{z-index:7;color:var(--text);border:2px solid var(--line-strong);background:#ffffffeb;border-radius:0;padding:.4rem .58rem;font-size:.82rem;font-weight:900;position:absolute;top:.85rem}.before-label{left:.85rem}.after-label{right:.85rem}.tool-grid{border:3px solid var(--line-strong);background:var(--surface);box-shadow:var(--shadow);border-radius:0;grid-template-columns:minmax(330px,.82fr) minmax(0,1.18fr);align-items:stretch;gap:1.1rem;padding:1rem;display:grid}.control-panel,.preview-panel,.materials-panel,.feature-card,.step-row article,.compare-cols article,.faq details,.review-card{min-width:0;color:var(--text);border:3px solid var(--line-strong);background:var(--surface);box-shadow:5px 5px 0 var(--line);border-radius:0}.control-panel,.preview-panel,.materials-panel{padding:1.2rem}.control-panel,.preview-panel{min-height:410px}.control-panel h2,.preview-panel h2,.materials-panel h2,.feature-card h3,.section h2,.section h3{color:var(--text)}.upload-box{min-height:344px;color:var(--text);text-align:center;border:3px dashed var(--accent);cursor:pointer;background-color:#0000;background-image:linear-gradient(45deg,#51a9fd0f 25%,#0000 25% 75%,#51a9fd0f 75%),linear-gradient(45deg,#51a9fd0f 25%,#0000 25% 75%,#51a9fd0f 75%);background-position:0 0,10px 10px;background-repeat:repeat,repeat;background-size:20px 20px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border-radius:0;flex-direction:column;justify-content:center;place-items:center;gap:.75rem;padding:1.1rem;transition:transform .2s,background-color .2s,border-color .2s;display:flex;position:relative;overflow:hidden}.upload-box:before{display:none}.upload-box:hover{border-color:var(--line-strong);background-color:var(--accent-soft);transform:translateY(-2px)}.upload-box input{display:none}.upload-box>*{position:relative}.upload-icon{width:106px;height:106px;color:var(--line-strong);border:3px solid var(--line-strong);background:var(--surface);box-shadow:7px 7px 0 var(--line);border-radius:0;place-items:center;display:grid}.upload-box strong{text-wrap:balance;max-width:340px;font-size:clamp(1.35rem,2.2vw,1.88rem);line-height:1.1}.upload-box small{max-width:340px;font-size:.95rem;font-weight:650;line-height:1.5}.choose-button{min-height:48px;color:var(--text);border:3px solid var(--line-strong);background:var(--accent);box-shadow:5px 5px 0 var(--line-strong);border-radius:0;justify-content:center;align-items:center;margin-top:.2rem;padding:.75rem 1.1rem;font-weight:950;display:inline-flex}.upload-box:hover .choose-button{color:#fff;background:var(--accent-dark)}.upload-box em{max-width:100%;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-style:normal;overflow:hidden}.upload-box small,.preview-head span,.feature-card p,.step-row p,.step-row li,.compare-cols p,.compare-cols li,.faq p,.review-card p,.intro p,.use-case-list,.faq-list{color:var(--muted)}.settings-card{color:#33443b;border-top:3px solid var(--line-strong);margin-top:1rem;padding-top:1rem}.settings-heading{align-items:center;gap:.55rem;margin-bottom:.8rem;display:flex}.settings-heading svg{color:var(--accent)}.settings-heading h3{margin:0;font-size:1rem}.settings-group{gap:.55rem;margin-top:.85rem;display:grid}.settings-group small,.material-row small{color:#879283}.segmented,.palette-pills{grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;display:grid}.segmented button,.palette-pills button{min-height:40px;color:var(--text);border:2px solid var(--line-strong);background:var(--surface);box-shadow:3px 3px 0 var(--line);border-radius:0;padding:.52rem .6rem;font-weight:850}.segmented button.is-active,.palette-pills button.is-active{color:#fff;border-color:var(--line-strong);background:var(--accent)}.custom-width,.control select{width:100%;min-height:40px;color:var(--text);border:2px solid var(--line-strong);background:var(--surface);border-radius:0;padding:.5rem .7rem}.checkbox-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem .9rem;display:grid}.checkbox-grid label,.toggle{color:var(--text);font-weight:800}.checkbox-grid input,.toggle input,.control input,.mini-controls input{accent-color:var(--accent)}.checkbox-grid input,.toggle input{width:18px;height:18px}.notice{color:var(--text);border:2px solid var(--line-strong);background:#fff8d8;border-radius:0;margin:.2rem 0 0;padding:.65rem .75rem}.upload-gate{color:var(--muted);border:2px solid var(--line-strong);background:var(--surface-soft);border-radius:0;gap:.35rem;margin-top:1rem;padding:.85rem;display:grid}.upload-gate b{color:var(--text)}.control,.mini-controls label,.toggle{color:var(--text);gap:.45rem;margin-top:.85rem;font-weight:800;display:grid}.control input,.mini-controls input{width:100%}.toggle{grid-template-columns:auto 1fr;align-items:center}.error{color:var(--danger);margin:1rem 0 0;font-weight:800}.preview-head{justify-content:space-between;align-items:start;gap:1rem;display:flex}.preview-head>*{min-width:0}.preview-head span{font-size:.92rem}.preview-canvas{border:3px solid var(--line-strong);background:var(--surface-soft);width:100%;max-height:620px;image-rendering:pixelated;border-radius:0;display:block}.after-preview-frame{border:3px solid var(--line-strong);background-color:#fff;background-image:linear-gradient(45deg,#51a9fd14 25%,#0000 25% 75%,#51a9fd14 75%),linear-gradient(45deg,#51a9fd14 25%,#0000 25% 75%,#51a9fd14 75%),none;background-position:0 0,10px 10px;background-repeat:repeat,repeat,repeat;background-size:20px 20px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;place-items:center;min-height:344px;display:grid;overflow:auto}.after-preview-frame .preview-canvas{background:0 0;border:0}@media (min-width:901px){.preview-panel .compare-slider,.preview-panel .after-preview-frame{margin-top:1.9rem}}.preview-canvas.is-hidden{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.download-row{flex-wrap:wrap;gap:.65rem;margin-top:1rem;display:flex}.download-row button{align-items:center;gap:.45rem;display:inline-flex}.materials-panel{grid-template-columns:230px 1fr;gap:1rem;margin-top:1rem;display:grid}.materials-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;max-height:460px;padding-right:.25rem;display:grid;overflow:auto}.material-row{color:var(--text);border:2px solid var(--line-strong);background:var(--surface-soft);border-radius:0;grid-template-columns:24px 1fr auto auto;align-items:center;gap:.45rem;padding:.45rem;display:grid}.swatch{border:2px solid var(--line-strong);border-radius:0;width:22px;height:22px}.section{padding:clamp(2.8rem,5vw,5rem) clamp(1rem,3vw,2rem)}.intro{text-align:center;padding-bottom:clamp(1rem,1.5vw,1.5rem)}.section h2{letter-spacing:0;max-width:850px;margin-bottom:1.1rem;margin-left:auto;margin-right:auto;font-size:clamp(2rem,4vw,3.4rem);line-height:1.05}.intro p,.use-case-list,.faq-list{max-width:860px;margin-left:auto;margin-right:auto;font-size:1.06rem;line-height:1.7}.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem;padding:0 clamp(1rem,3vw,2rem);display:grid}.feature-card,.step-row article,.compare-cols article,.review-card{padding:1.05rem}.feature-art{aspect-ratio:16/10;object-fit:cover;border:3px solid var(--line-strong);background:var(--surface-soft);width:100%;image-rendering:pixelated;border-radius:0;display:block}.feature-card h3{margin:.85rem 0 .5rem}.feature-card p,.step-row p,.step-row li,.compare-cols p,.compare-cols li,.faq p,.review-card p{line-height:1.55}.step-row,.compare-cols,.review-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;display:grid}.compare-cols{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.step-row ul,.compare-cols ul{margin:0 0 1rem;padding-left:1.2rem}.step-row h3,.compare-cols h3{margin-bottom:.6rem}.example-note{border:2px solid var(--line-strong);background:var(--accent-soft);border-radius:0;padding:.72rem .8rem;font-weight:800;color:var(--text)!important}.highlight{background:var(--accent-soft)!important}.use-case-list,.faq-list{gap:.7rem;display:grid}.use-cases,.steps,.split,.reviews,.faq{text-align:center}.use-case-list,.faq-list,.step-row,.compare-cols,.review-carousel{text-align:left}.faq details{padding:1rem}.faq summary{color:var(--text);cursor:pointer;font-weight:900}.text-link{color:var(--accent-dark);margin-top:1.25rem;font-weight:900;text-decoration:none;display:inline-flex}.review-carousel{padding:.25rem 0 .8rem;overflow:hidden}.review-track{gap:0;width:max-content;animation:36s linear infinite review-scroll;display:flex}.review-carousel:hover .review-track{animation-play-state:paused}.review-set{flex:none;gap:1rem;padding-right:1rem;display:flex}.review-card{flex:0 0 340px;width:340px}.review-person{align-items:center;gap:.7rem;margin-bottom:.8rem;display:flex}.review-person img{object-fit:cover;object-position:center;border:2px solid var(--line-strong);background:var(--accent-soft);width:42px;height:42px;image-rendering:pixelated;border-radius:0}.review-card strong{display:block}.review-card span:not(.stars){color:var(--muted);font-size:.9rem}.stars{color:var(--gold)}@keyframes review-scroll{to{transform:translate(-50%)}}.blog-hero{text-align:center}.blog-hero h1,.blog-hero .subtitle{margin-left:auto;margin-right:auto}.blog-hero h1{max-width:900px;font-size:clamp(2.4rem,6vw,5rem)}.blog-faq{padding-top:1rem}.generator-shell.is-empty .compare-slider{min-height:344px}@media (max-width:900px){.nav-links{display:none}.tool-grid,.generator-shell.is-empty .tool-grid,.materials-panel,.feature-grid,.step-row,.compare-cols,.review-grid{grid-template-columns:1fr}.compare-slider{min-height:300px}.materials-list{grid-template-columns:1fr}}@media (max-width:560px){html,body{width:100%;max-width:100%}main{width:100%;max-width:100%;overflow:hidden}h1,h2,h3,p,a,button,span,strong,b,small,li{overflow-wrap:anywhere}.generator-shell{width:min(330px,100vw - 56px);max-width:min(330px,100vw - 56px);margin-left:10px;margin-right:auto;overflow:hidden}.site-nav{width:min(360px,100vw - 32px);max-width:min(360px,100vw - 32px);margin-left:10px;margin-right:auto;padding:.62rem;top:8px;overflow:hidden}.brand span:last-child,.nav-cta{display:none}.nav-actions{margin-left:auto}.language-switcher select{max-width:150px}h1{width:11ch;max-width:11ch;font-size:2rem;line-height:1}.subtitle{max-width:30ch;font-size:1rem}.hero-social-proof{justify-content:center;gap:.55rem;width:100%;max-width:100%;padding:.5rem;font-size:.82rem;display:flex}.avatar-train img{width:30px;height:30px}.hero{padding-left:0;padding-right:0}.hero-copy{width:min(330px,100vw - 44px);max-width:min(330px,100vw - 44px);margin-left:10px;margin-right:auto;overflow:hidden}.compare-slider{width:100%;max-width:100%;min-height:230px}.compare-label{max-width:42%}.tool-grid{width:100%;max-width:100%;padding:.55rem;overflow:hidden;grid-template-columns:minmax(0,1fr)!important}.control-panel,.preview-panel{width:100%;max-width:100%;min-height:0;padding:.8rem;overflow:hidden}.upload-box{align-items:center;min-height:330px;padding:.85rem}.upload-box strong,.upload-box small,.upload-box em,.upload-gate b,.upload-gate span{overflow-wrap:anywhere;width:100%;max-width:100%}.upload-box strong{font-size:1.22rem;line-height:1.18}.upload-box small{font-size:.88rem}.compare-label{padding:.34rem .45rem;font-size:.74rem}.upload-gate{max-width:100%;overflow:hidden}.upload-gate b{display:block}.tool-grid *,.control-panel *,.preview-panel *{white-space:normal;min-width:0;max-width:100%}.preview-head{flex-direction:column;gap:.35rem}.segmented,.palette-pills,.checkbox-grid{grid-template-columns:1fr}.download-row button{justify-content:center;width:100%}.review-card{flex-basis:280px;width:280px}.material-row{grid-template-columns:24px 1fr auto}.material-row small{grid-column:2/-1}}
