.gen{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:24px;margin:24px 0}
@media(max-width:720px){.gen{grid-template-columns:1fr}}
.gen form{display:flex;flex-direction:column;gap:10px}
.gen label{display:flex;flex-direction:column;gap:4px;font-size:14px}
.gen .colors{display:flex;gap:6px;flex-wrap:wrap}
.gen input[type=color]{width:44px;height:36px;padding:0}
.gen .row{display:flex;gap:8px;flex-wrap:wrap}
.gen button{padding:8px 14px;cursor:pointer}
.gen canvas{max-width:100%;height:auto;border:1px solid #ccc;image-rendering:pixelated}
.gen .previews{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.gen .previews figure{margin:0}
.gen .previews canvas{width:256px;height:256px}
.gen .note{font-size:13px;opacity:.75}