.pixel-editor{margin-top:32px;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:28px;align-items:start}.pixel-stage{position:relative;background:var(--soft);border-radius:24px;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:320px}.pixel-stage canvas{display:block;width:100%;height:auto;max-height:620px;object-fit:contain;touch-action:none;cursor:crosshair}.pixel-stage canvas:focus-visible{outline-offset:-4px}.pixel-side{background:var(--soft);border-radius:24px;padding:24px;display:grid;gap:20px}.pixel-side label,.pixel-side legend{font:600 13px/1.6 var(--fh)}.pixel-side fieldset{border:0;padding:0;margin:0;min-width:0}.pixel-side legend{margin-bottom:8px}.pixel-side select{width:100%;border:1px solid var(--line);border-radius:16px;padding:10px 12px;background:#fff;font:400 14px/1.6 var(--fp);color:var(--ink)}.pixel-side input[type=range]{width:100%;accent-color:var(--pink);margin:16px 0 0}.pixel-side input[type=color]{width:100%;height:38px;padding:4px;border:1px solid var(--line);background:#fff;border-radius:16px}.pixel-chips{display:flex;flex-wrap:wrap;gap:8px}.pixel-chips button,.pixel-secondary{border:1.5px solid var(--line);border-radius:999px;padding:10px 16px;background:#fff;color:var(--ink);font:600 13px/1.2 var(--fh);min-height:40px;cursor:pointer}.pixel-chips button[aria-pressed=true]{background:var(--pink);border-color:var(--pink);color:#fff}.pixel-secondary:hover:enabled{color:var(--pink);border-color:var(--pink)}.pixel-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.pixel-upload{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;margin:24px 0}.pixel-help,.pixel-status,.pixel-badges,.pixel-scale{font:400 13px/1.6 var(--fp);color:var(--sub)}.pixel-help{margin:12px 0}.pixel-status{min-height:24px;margin:12px 0}.pixel-badges{text-align:center;margin:24px 0 0}.pixel-scale{display:flex;justify-content:space-between}.pixel-side .btn{width:100%;cursor:pointer}.pixel-section{max-width:1160px;margin:auto;padding:72px 20px}.pixel-section h2{font:800 var(--h2)/1.2 var(--fh);letter-spacing:-.01em}.pixel-section h3{font:700 21px/1.3 var(--fh)}.pixel-section p{max-width:72ch}.pixel-features article{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin:20px 0;padding:64px 48px;border-radius:40px;background:var(--t2)}.pixel-features article:nth-child(2n){background:var(--t4)}.pixel-features article:nth-child(3n){background:var(--t3)}.pixel-features h2{margin:0 0 20px}.pixel-features p{margin:0 0 24px;color:var(--sub)}.pixel-demo{width:100%;height:auto;border-radius:24px;background:var(--soft)}.pixel-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:44px}.pixel-facts p{font:400 14px/1.6 var(--fp);color:var(--sub)}.pixel-facts h3{margin:0 0 12px}.pixel-how .steps{grid-template-columns:repeat(4,1fr)}.pixel-how .steps h3{font-size:18px}.pixel-section .sec-head{max-width:680px;margin:0 auto 44px;text-align:center}.pixel-section .sec-head h2{margin:0}.pixel-drop.dragging{outline:3px dashed var(--pink);outline-offset:8px}.pixel-side [hidden]{display:none}.pixel-side output{float:right;color:var(--sub);font-family:var(--fp);font-weight:400}
@media(max-width:860px){.pixel-editor{grid-template-columns:1fr;gap:24px}.pixel-side{padding:24px 18px}.pixel-stage{min-height:0}.pixel-stage canvas{max-height:520px}.pixel-section{padding:56px 16px}.pixel-features article{grid-template-columns:1fr;gap:28px;padding:40px 16px;border-radius:28px;margin:20px -4px}.pixel-facts,.pixel-how .steps{grid-template-columns:1fr}.pixel-features h2{font-size:var(--h2)}.pixel-upload{gap:8px}.pixel-upload .btn{font-size:14px;padding:12px 18px}}
.pixel-demo{object-fit:contain;aspect-ratio:3/2}.pixel-side .btn{background:linear-gradient(90deg,var(--pink),var(--pink2));color:#fff}.pixel-side button:disabled{opacity:.45;cursor:not-allowed}

.pixel-example{margin:0;min-width:0}.pixel-example .pixel-demo{display:block;object-fit:contain}.pixel-example figcaption{margin-top:12px;color:var(--sub);font:400 13px/1.6 var(--fp)}