:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#12130f;--ink-2:#2c3027;--muted:#676d5d;--paper:#f6f2e7;--panel:#fffdf5;--line:#d8d0bd;--acid:#b9df54;--acid-2:#8ab63f;--orange:#f05d23;--blue:#2635d9;--blue-2:#5763f5;--shadow:0 22px 80px #12130f29;--radius:8px}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--ink);background:linear-gradient(90deg, #12130f0a 1px, transparent 1px), linear-gradient(#12130f0a 1px, transparent 1px), var(--paper);letter-spacing:0;background-size:18px 18px;margin:0;font-family:Trebuchet MS,Avenir Next,Segoe UI,sans-serif}body:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(118deg,#b9df5459,#0000 28%),linear-gradient(242deg,#f05d2329,#0000 26%),linear-gradient(#0000 54%,#2635d91a);position:fixed;inset:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit}svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;width:1.1rem;height:1.1rem;display:block}.skip-link{z-index:1000;color:var(--panel);background:var(--ink);border-radius:var(--radius);padding:.7rem 1rem;text-decoration:none;position:absolute;top:-4rem;left:1rem}.skip-link:focus{top:1rem}.shell{width:min(1180px,100% - 32px);margin:0 auto}.site-header{z-index:50;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f6f2e7e0;border-bottom:2px solid #12130f1a;position:sticky;top:0}.header-shell,.footer-shell{justify-content:space-between;align-items:center;gap:1.5rem;min-height:70px;display:flex}.brand{color:var(--ink);align-items:center;gap:.72rem;font-weight:800;text-decoration:none;display:inline-flex}.brand-mark{border:2px solid var(--ink);background:var(--panel);box-shadow:4px 4px 0 var(--ink);grid-template-rows:repeat(2,12px);grid-template-columns:repeat(2,12px);gap:3px;padding:5px;display:grid}.brand-mark span:first-child{background:var(--acid)}.brand-mark span:nth-child(2){background:var(--orange)}.brand-mark span:nth-child(3){background:var(--blue)}.brand-mark span:nth-child(4){background:var(--ink)}.site-nav,.site-footer nav{color:var(--muted);align-items:center;gap:1.1rem;font-size:.94rem;font-weight:700;display:flex}.site-nav a,.site-footer a{text-decoration:none}.site-nav a:hover,.site-footer a:hover{color:var(--ink)}.hero{padding:2.8rem 0 1.4rem;overflow:hidden}.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(260px,.58fr);align-items:center;gap:2rem;min-height:360px;display:grid}.eyebrow,.section-kicker{color:var(--blue);letter-spacing:.08em;text-transform:uppercase;margin:0 0 .9rem;font-size:.78rem;font-weight:900}h1,h2,h3,p{margin-top:0}h1{max-width:620px;margin-bottom:.85rem;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.7rem,6vw,5rem);font-weight:900;line-height:.94}.hero-lede{max-width:580px;color:var(--ink-2);font-size:1.05rem;line-height:1.62}.hero-actions,.export-actions{flex-wrap:wrap;gap:.85rem;margin-top:1.2rem;display:flex}.button,.icon-button,.segmented{border:2px solid var(--ink);color:var(--ink);background:var(--panel);box-shadow:4px 4px 0 var(--ink);transition:transform .16s,box-shadow .16s,background .16s}.button{border-radius:var(--radius);justify-content:center;align-items:center;gap:.55rem;min-height:46px;padding:.78rem 1.05rem;font-weight:900;text-decoration:none;display:inline-flex}.button.primary{background:var(--acid)}.button.secondary{background:var(--panel)}.button:hover:not(:disabled),.icon-button:hover:not(:disabled),.segmented:hover{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}.button:active:not(:disabled),.icon-button:active:not(:disabled),.segmented:active{box-shadow:0 0 0 var(--ink);transform:translate(4px,4px)}.button:disabled{opacity:.48}.hero-sample{aspect-ratio:1;justify-self:end;width:min(315px,100%)}.sample-frame{border:3px solid var(--ink);background:var(--panel);box-shadow:12px 12px 0 var(--ink);width:100%;padding:.75rem;transform:rotate(3deg)}.sample-pixels{aspect-ratio:1;border:2px solid var(--ink);background:var(--ink);image-rendering:pixelated;position:relative}.sample-pixels span{left:calc(var(--x) * 16.666%);top:calc(var(--y) * 16.666%);background:var(--c);width:16.666%;height:16.666%;position:absolute}.sample-meta{color:var(--muted);text-transform:uppercase;justify-content:space-between;gap:1rem;margin-top:.6rem;font-size:.6375rem;font-weight:800;display:flex}.sample-meta strong{color:var(--ink)}.product-band{padding:3rem 0 4rem}.app-shell{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:1.2rem;display:grid}.workspace,.control-panel{border:3px solid var(--ink);background:var(--panel);box-shadow:var(--shadow)}.workspace{min-width:0}.toolbar{border-bottom:3px solid var(--ink);background:#e7e0cf;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem;display:flex}.tool-title,.toolbar-actions{gap:.55rem;display:flex}.tool-title,.icon-button{justify-content:center;align-items:center;font-weight:900;display:inline-flex}.tool-title{min-height:40px;color:var(--ink);gap:.45rem}.icon-button{border-radius:var(--radius);width:42px;height:42px;padding:0}.canvas-stage{background-color:#eee8da;background-image:linear-gradient(45deg,#d7d0c1 25%,#0000 25%),linear-gradient(-45deg,#d7d0c1 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#d7d0c1 75%),linear-gradient(-45deg,#0000 75%,#d7d0c1 75%),none;background-position:0 0,0 12px,12px -12px,-12px 0;background-repeat:repeat,repeat,repeat,repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box;place-items:center;min-height:620px;display:grid;position:relative;overflow:hidden}.canvas-stage.dragging{outline:5px solid var(--orange);outline-offset:-14px}.upload-state{text-align:center;border:3px dashed var(--ink);border-radius:var(--radius);background:#fffdf5eb;flex-direction:column;justify-content:center;align-items:center;width:min(520px,100% - 2rem);min-height:310px;padding:2rem;display:flex}.upload-state.hidden{display:none}.upload-icon{width:78px;height:78px;color:var(--ink);border:2px solid var(--ink);background:var(--orange);box-shadow:6px 6px 0 var(--ink);place-items:center;margin-bottom:1rem;display:grid}.upload-icon svg{width:2rem;height:2rem}.upload-state h2{margin-bottom:.6rem;font-size:clamp(1.5rem,4vw,2.1rem)}.upload-state p{max-width:400px;min-height:3.2em;color:var(--muted);margin-bottom:1.4rem;line-height:1.6}.preview-wrap{border:3px solid var(--ink);background:var(--panel);width:640px;max-width:calc(100% - 2rem);height:420px;max-height:calc(100% - 2rem);display:none;position:relative;box-shadow:10px 10px #12130fe0}.preview-wrap.visible{display:block}#preview-canvas,#grid-overlay{width:100%;height:100%;display:block}#preview-canvas{image-rendering:pixelated;touch-action:none}#grid-overlay{pointer-events:none;position:absolute;inset:0}.status-row{color:var(--muted);border-top:3px solid var(--ink);background:#e7e0cf;justify-content:space-between;gap:1rem;padding:.78rem .95rem;font-size:.86rem;font-weight:800;display:flex}.control-panel{position:sticky;top:88px}.panel-section{border-bottom:3px solid var(--ink);padding:1rem}.panel-section:last-child{border-bottom:0}.section-heading{justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1rem;display:flex}.section-heading h2,.panel-section h2{margin-bottom:0;font-size:1.1rem}.section-heading span,#output-size{color:var(--blue);text-transform:uppercase;font-size:.78rem;font-weight:900}.control,.select-control{gap:.55rem;margin-top:1rem;display:grid}.control.is-collapsed{display:none}.control span,.select-control span{color:var(--ink-2);justify-content:space-between;gap:1rem;font-size:.9rem;font-weight:800;display:flex}input[type=range]{width:100%;accent-color:var(--orange)}select{border:2px solid var(--ink);border-radius:var(--radius);width:100%;height:44px;color:var(--ink);background:var(--panel);font-weight:800}.toggle-row{border:2px solid var(--line);border-radius:var(--radius);background:#f8f4e9;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.2rem;padding:.75rem;display:flex}.toggle-row span{gap:.2rem;display:grid}.toggle-row small{color:var(--muted);line-height:1.4}input[type=checkbox]{width:46px;height:26px;accent-color:var(--blue)}.export-actions .button{flex:132px}.insights p{color:var(--muted);margin:.55rem 0 0;font-size:.94rem;line-height:1.65}.content-section{padding:4.5rem 0}.use-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.use-grid article,.feature-list,.faq-list details{border:2px solid var(--ink);border-radius:var(--radius);background:var(--panel);box-shadow:6px 6px 0 var(--ink)}.use-grid article{min-height:250px;padding:1.2rem}.tile-index{color:var(--orange);margin-bottom:3.5rem;font-weight:900;display:inline-flex}.use-grid h2,.feature-summary h2,.faq h2{margin-bottom:.75rem;font-size:clamp(1.7rem,4vw,2.8rem);line-height:1}.use-grid p,.feature-summary p,.faq p{color:var(--muted);line-height:1.7}.feature-grid,.faq-grid{grid-template-columns:.78fr 1fr;align-items:start;gap:2rem;display:grid}.feature-list{overflow:hidden}.feature-list>div{border-bottom:2px solid var(--ink);grid-template-columns:180px 1fr;gap:1rem;padding:1rem;display:grid}.feature-list>div:last-child{border-bottom:0}.feature-list strong{color:var(--ink)}.feature-list span{color:var(--muted);line-height:1.55}.faq-list{gap:.8rem;display:grid}.faq-list details{padding:1rem 1.1rem}.faq-list summary{cursor:pointer;font-weight:900}.faq-list p{margin:.7rem 0 0}.site-footer{background:#e7e0cf;border-top:2px solid #12130f1f}.site-footer p{color:var(--muted);margin:0;font-weight:700}.toast{z-index:200;min-width:min(360px,100% - 32px);color:var(--panel);text-align:center;border:2px solid var(--ink);background:var(--ink);box-shadow:6px 6px 0 var(--orange);visibility:hidden;padding:.85rem 1rem;font-weight:900;transition:transform .22s,visibility .22s;position:fixed;bottom:1.2rem;left:50%;transform:translate(-50%,calc(100% + 2.5rem))}.toast.show{visibility:visible;transform:translate(-50%)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (width<=980px){.hero{padding-top:3.5rem}.hero-grid{min-height:0}.hero-grid,.app-shell,.feature-grid,.faq-grid{grid-template-columns:1fr}.hero-sample{justify-self:start}.canvas-stage{min-height:520px}.control-panel{position:static}.use-grid{grid-template-columns:1fr}}@media (width<=700px){.shell{width:min(100% - 24px,1180px)}.header-shell,.footer-shell{flex-direction:column;justify-content:center;align-items:flex-start;padding:.8rem 0}.site-nav,.site-footer nav{gap:.8rem;width:100%;padding-bottom:.15rem;overflow-x:auto}h1{font-size:clamp(2.7rem,17vw,4.6rem)}.hero-actions,.export-actions,.toolbar{flex-direction:column;align-items:stretch}.toolbar-actions{flex-direction:row}.canvas-stage{min-height:390px}.status-row,.feature-list>div{flex-direction:column;grid-template-columns:1fr}.sample-frame{box-shadow:8px 8px 0 var(--ink);transform:rotate(0)}}