:root{--paper:#f3f4ef;--ink:#17201f;--muted:#68716e;--coral:#ff6b4a;--cyan:#25c7c9;--yellow:#f3c952;--night:#102b35;--line:#9ba5a0;--mono:ui-monospace, SFMono-Regular, Consolas, monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);margin:0;font-family:Arial,Helvetica,sans-serif}button,input,select{font:inherit}a{color:inherit;text-underline-offset:4px}.skip{z-index:99;background:var(--ink);color:#fff;padding:.75rem 1rem;position:fixed;top:-5rem;left:1rem}.skip:focus{top:1rem}.siteHeader{border-bottom:1px solid var(--line);z-index:10;background:#f3f4eff2;grid-template-columns:auto 1fr auto;align-items:center;gap:2rem;height:68px;padding:0 clamp(1rem,4vw,4rem);display:grid;position:relative}.brand{letter-spacing:.05em;align-items:center;gap:.5rem;font-weight:900;text-decoration:none;display:flex}.brand span{background:var(--coral);width:25px;height:25px;color:var(--ink);clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%);place-items:center;display:grid}.brand small{font:600 .6rem var(--mono);color:var(--muted)}.siteHeader nav{font:600 .72rem var(--mono);justify-self:center;gap:1.5rem;display:flex}.siteHeader nav a,.locale{text-decoration:none}.siteHeader nav a:hover,.siteHeader nav a:focus-visible{text-decoration:underline}.locale{border:1px solid var(--ink);font:700 .65rem var(--mono);padding:.45rem .7rem}.hero{background-image:linear-gradient(#17201f0b 1px,#0000 1px),linear-gradient(90deg,#17201f0b 1px,#0000 1px);background-size:32px 32px;grid-template-columns:minmax(0,1fr) minmax(380px,.78fr);align-items:center;gap:5vw;min-height:700px;padding:5rem clamp(1rem,6vw,7rem);display:grid}.eyebrow,.sectionKicker{color:#852b18;font:800 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}.hero h1{letter-spacing:-.065em;max-width:900px;margin:.7rem 0 2rem;font-size:clamp(3rem,6.5vw,7.1rem);line-height:.86}.hero h1 em{color:#b43f27;font-style:normal}.heroCopy>p:not(.eyebrow){max-width:650px;font-size:1.1rem;line-height:1.55}.heroCta,.primary{background:var(--ink);color:#fff;border:1px solid var(--ink);box-shadow:5px 5px 0 var(--coral);padding:1rem 1.25rem;font-weight:800;text-decoration:none;display:inline-block}.heroCta:hover,.heroCta:focus-visible,.primary:hover,.primary:focus-visible{box-shadow:3px 3px 0 var(--cyan);transform:translate(2px,2px)}.heroLimits{flex-wrap:wrap;gap:.4rem;margin-top:2rem;display:flex}.heroLimits span,.localFlag{border:1px solid var(--line);background:var(--paper);font:700 .64rem var(--mono);padding:.45rem .6rem}.signature{background:var(--night);color:#fff;flex-direction:column;justify-content:space-between;min-height:480px;padding:1rem;display:flex;overflow:hidden;box-shadow:18px 20px #cad0ca}.signatureTop,.panelTop{font:700 .62rem var(--mono);letter-spacing:.08em;justify-content:space-between;display:flex}.pixelStage{aspect-ratio:1;background-color:#dfe6db;background-image:linear-gradient(#17201f18 1px,#0000 1px),linear-gradient(90deg,#17201f18 1px,#0000 1px);background-size:16px 16px;border:6px solid #274650;width:min(88%,430px);margin:auto;position:relative;box-shadow:12px 14px #08191f}.pixelStage i{width:15%;height:15%;left:var(--loose-x);top:var(--loose-y);background:var(--frame-color);transition:all .55s cubic-bezier(.2,.8,.2,1);position:absolute;box-shadow:inset 0 0 0 3px #17201f}.signature[data-phase="1"] .pixelStage i,.signature[data-phase="2"] .pixelStage i{left:var(--packed-x);top:var(--packed-y);width:var(--packed-w);height:var(--packed-h)}.lens{aspect-ratio:1;border:5px solid var(--yellow);width:34%;color:var(--yellow);font:900 1.3rem var(--mono);opacity:.2;background:#102b35cc;border-radius:50%;place-items:center;transition:all .5s;display:grid;position:absolute;bottom:-8%;right:-8%;transform:scale(.7)}.signature[data-phase="2"] .lens{opacity:1;transform:scale(1)}.signature button{border:1px solid var(--yellow);color:var(--yellow);font:700 .65rem var(--mono);background:0 0;border-radius:99px;align-self:center;padding:.55rem .9rem}.signature button:disabled{opacity:.75}.toolSection{background:var(--night);color:#fff;padding:4rem clamp(1rem,4vw,4rem) 5rem}.toolSection .sectionKicker{color:var(--yellow)}.toolSection .localFlag{color:var(--ink)}.toolHeading{border-bottom:1px solid #658087;justify-content:space-between;align-items:end;gap:2rem;margin:.8rem 0 1.5rem;padding-bottom:1.5rem;display:flex}.toolHeading h2{max-width:800px;margin-bottom:.75rem;font-size:clamp(2rem,4vw,4rem);line-height:.95}.toolHeading p{color:#bfd0cb;margin:0}.workbench{border:1px solid #77908a;grid-template-columns:minmax(220px,.8fr) minmax(360px,1.55fr) minmax(230px,.8fr);min-height:660px;display:grid}.inputPanel,.inspectPanel{background:#17343d;padding:1rem}.inputPanel{border-right:1px solid #77908a}.inspectPanel{border-left:1px solid #77908a}.dropZone{border:1px dashed var(--cyan);color:#fff;cursor:pointer;gap:.5rem;padding:1.1rem;display:grid}.dropZone strong{font-size:1rem}.dropZone span{color:#b7cdca;font:.65rem/1.5 var(--mono)}.dropZone input{max-width:100%;margin-top:.5rem;font-size:.75rem}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.secondary,.textButton{color:#fff;background:0 0;border:1px solid #78928d;width:100%;margin-top:.7rem;padding:.7rem}.settings{grid-template-columns:1fr 1fr;gap:.7rem;margin:1.2rem 0;display:grid}.settings label{color:#b7cdca;font:.65rem var(--mono);gap:.35rem;display:grid}.settings select{color:var(--ink);background:#f3f4ef;padding:.65rem}.primary{width:100%}.primary:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.textButton{font:.68rem var(--mono);border:0;text-decoration:underline}.status{border-left:3px solid var(--coral);color:#dbe5e1;min-height:3rem;font:.68rem/1.45 var(--mono);background:#0d2830;margin:1rem 0;padding:.6rem .75rem}.spriteList{max-height:275px;margin:0;padding:0;list-style:none;overflow:auto}.spriteList button{color:#fff;width:100%;font:.68rem var(--mono);background:0 0;border:0;border-bottom:1px solid #4c6767;justify-content:space-between;padding:.65rem;display:flex}.spriteList button.selected{background:var(--cyan);color:var(--ink)}.atlasPanel{background:#0e262d;min-width:0;padding:1rem}.canvasStage{aspect-ratio:1;background-color:#e6e9e1;background-image:linear-gradient(45deg,#ccd2cb 25%,#0000 25%),linear-gradient(-45deg,#ccd2cb 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ccd2cb 75%),linear-gradient(-45deg,#0000 75%,#ccd2cb 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;place-items:center;width:min(100%,580px);margin:2rem auto;display:grid;position:relative;box-shadow:10px 12px #06181d}.atlasCanvas{width:100%;height:100%;image-rendering:pixelated}.frameHit{background:0 0;border:1px solid #fff8;min-width:3px;min-height:3px;padding:0;position:absolute}.frameHit:hover,.frameHit:focus-visible,.frameHit.selected{border:3px solid var(--yellow);z-index:2;box-shadow:0 0 0 2px #102b35}.emptyAtlas{color:#576460;font:.7rem var(--mono);place-items:center;gap:.5rem;display:grid}.emptyAtlas b{color:#9aa59d;font-size:5rem}.loupe{aspect-ratio:1;color:var(--ink);font:.7rem var(--mono);background-color:#f1f3ed;background-image:linear-gradient(45deg,#cfd5cf 25%,#0000 25%),linear-gradient(-45deg,#cfd5cf 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#cfd5cf 75%),linear-gradient(-45deg,#0000 75%,#cfd5cf 75%);background-position:0 0,0 11px,11px -11px,-11px 0;background-size:22px 22px;border:1px solid #78928d;place-items:center;margin:1.2rem 0;display:grid;overflow:hidden}.loupe canvas{object-fit:contain;width:82%;height:82%}.loupe.nearest canvas{image-rendering:pixelated}.loupe.linear canvas{image-rendering:auto}.filterToggle{grid-template-columns:1fr 1fr;display:grid}.filterToggle button{color:#fff;background:0 0;border:1px solid #78928d;padding:.65rem}.filterToggle button.active{background:var(--yellow);color:var(--ink)}.finePrint{color:#afc3bf;font:.64rem/1.5 var(--mono);margin:1rem 0}dl{font:.7rem var(--mono);margin:1rem 0}dl div{border-top:1px solid #4c6767;justify-content:space-between;padding:.55rem 0;display:flex}dt{color:#9fb7b2}dd{margin:0}.exports{gap:.5rem;display:grid}.exports button{background:var(--coral);color:var(--ink);border:0;padding:.8rem;font-weight:800}.exports button:disabled{opacity:.35;cursor:not-allowed}.noScript{border:2px solid var(--yellow);padding:1rem}.edgeStory,.jsonStory,.limitsSection,.faq{padding:7rem clamp(1rem,7vw,8rem)}.edgeStory{background:#dfe5de;grid-template-columns:.8fr 1.2fr;align-items:center;gap:8vw;display:grid}.edgeStory h2,.jsonStory h2,.limitsSection h2,.faq h2,.finalCta h2{letter-spacing:-.055em;font-size:clamp(2.6rem,5vw,6rem);line-height:.92}.edgeStory p{max-width:600px;line-height:1.6}.edgeDiagram{background:var(--paper);border:1px solid var(--ink);min-height:440px;box-shadow:16px 18px 0 var(--cyan);font:800 .64rem var(--mono);place-items:center;display:grid;position:relative}.edgeDiagram span{place-items:center;display:grid;position:absolute}.edgeDiagram .padding{border:2px dashed var(--ink);inset:10%}.edgeDiagram .extrude{background:var(--cyan);inset:22%}.edgeDiagram .content{background:var(--coral);border:2px solid var(--ink);font-size:1rem;inset:29%}.edgeDiagram b{z-index:3;align-self:end;margin-bottom:4%}.jsonStory{background:#f5d969;grid-template-columns:.7fr 1.1fr .7fr;align-items:center;gap:4vw;display:grid}pre{white-space:pre-wrap;background:var(--night);color:#d9faf2;font:clamp(.68rem, 1.1vw, .9rem)/1.65 var(--mono);box-shadow:9px 10px 0 var(--coral);padding:1.5rem;overflow:auto}.jsonStory p{line-height:1.6}.limitsSection{background:var(--paper)}.limitsGrid{border:1px solid var(--ink);grid-template-columns:repeat(3,1fr);display:grid}.limitsGrid article{border-right:1px solid var(--ink);min-height:260px;padding:1.5rem}.limitsGrid article:last-child{border:0}.limitsGrid b{font:800 .7rem var(--mono);color:#b43f27}.limitsGrid h3{margin:4rem 0 1rem;font-size:1.5rem}.limitsGrid p{line-height:1.5}.faq{background:#dce8e4;grid-template-columns:.65fr 1fr;gap:8vw;display:grid}details{border-top:1px solid var(--ink);padding:1.2rem 0}details:last-child{border-bottom:1px solid var(--ink)}summary{cursor:pointer;font-weight:800}details p{max-width:680px;margin:1rem 0 0;line-height:1.6}.finalCta{text-align:center;background:var(--coral);padding:7rem 1rem}.finalCta p{font:700 .65rem var(--mono)}.finalCta h2{max-width:900px;margin:0 auto 2rem}.finalCta a{background:var(--ink);color:#fff;padding:.9rem 1rem;text-decoration:none;display:inline-block}footer{background:var(--ink);color:#fff;font:.68rem/1.5 var(--mono);justify-content:space-between;gap:2rem;padding:3rem clamp(1rem,5vw,5rem);display:flex}footer nav{flex-wrap:wrap;align-content:start;gap:1.5rem;display:flex}.contentPage{max-width:1100px;margin:0 auto;padding:7rem clamp(1rem,5vw,5rem)}.contentPage>h1{letter-spacing:-.06em;max-width:1000px;font-size:clamp(3rem,7vw,7rem);line-height:.9}.contentPage .lede{max-width:750px;font-size:1.25rem;line-height:1.55}.contentPage section{border-top:1px solid var(--ink);grid-template-columns:.65fr 1.35fr;gap:4rem;margin-top:5rem;padding-top:1.5rem;display:grid}.contentPage section p{line-height:1.7}.contentPage section pre{margin:0}.guidePixels{background:var(--night);grid-template-columns:1fr 1fr 2fr 1fr 1fr;align-items:stretch;min-height:300px;padding:3rem;display:grid}.guidePixels i{background:#f3f4ef33;border:1px dashed #f3f4ef88}.guidePixels b{background:var(--coral);border:12px solid var(--cyan);font:800 .7rem var(--mono);place-items:center;display:grid}.paddingExample{gap:12px}.extrudeExample{gap:0}.contentReturn{background:var(--yellow);margin-top:5rem;padding:3rem;font-size:1.5rem;font-weight:800}.notFound{text-align:center;background:var(--night);color:#fff;place-content:center;min-height:100vh;padding:2rem;display:grid}.notFound h1{font-size:clamp(3rem,8vw,8rem)}@media (max-width:1000px){.siteHeader nav{display:none}.hero{grid-template-columns:1fr}.signature{min-height:420px}.workbench{grid-template-columns:320px 1fr}.inspectPanel{border-top:1px solid #77908a;border-left:0;grid-column:1/-1;grid-template-columns:1fr 1fr;gap:1rem;display:grid}.inspectPanel .panelTop{grid-column:1/-1}.loupe{grid-row:2/7;width:100%;max-width:330px;margin:0 auto}.jsonStory{grid-template-columns:1fr 1fr}.jsonStory>div:last-child{grid-column:1/-1}}@media (max-width:650px){.siteHeader{grid-template-columns:1fr auto;height:60px;padding:0 1rem}.brand small{display:none}.hero{min-height:auto;padding:3.5rem 1rem}.hero h1{font-size:3.3rem}.signature{min-height:360px;box-shadow:8px 10px #cad0ca}.toolSection{padding:3rem .75rem}.toolHeading{display:block}.localFlag{margin-top:1rem;display:inline-block}.workbench{display:block}.inputPanel,.inspectPanel{border:0;border-bottom:1px solid #77908a}.atlasPanel{padding:.75rem}.canvasStage{margin:1rem auto}.inspectPanel{display:block}.loupe{margin:1rem auto}.edgeStory,.jsonStory,.faq{grid-template-columns:1fr;padding:5rem 1rem}.edgeDiagram{min-height:330px}.limitsSection{padding:5rem 1rem}.limitsGrid{grid-template-columns:1fr}.limitsGrid article{border-right:0;border-bottom:1px solid var(--ink);min-height:auto}.limitsGrid h3{margin:2rem 0 1rem}.jsonStory>div:last-child{grid-column:auto}.contentPage{padding:5rem 1rem}.contentPage section{grid-template-columns:1fr;gap:1rem;margin-top:3rem}.guidePixels{min-height:220px;padding:1rem}footer{flex-direction:column}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}.signature .pixelStage i{left:var(--packed-x);top:var(--packed-y);width:var(--packed-w);height:var(--packed-h)}.signature .lens{opacity:1;transform:scale(1)}}