:root{color:#172328;background:#fff;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:1.45}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select{font:inherit}button{color:#172328;cursor:pointer;background:#fff;border:1px solid #172328;border-radius:2px;padding:.62rem .78rem}button:hover,button.active{color:#fff;background:#638596;border-color:#638596}.learn-more{color:#172328;background:#fff;border:1px solid #172328;align-items:center;gap:6px;padding:.2rem .38rem;line-height:1.2;display:inline-flex}.learn-more:hover{color:#fff;background:#638596;border-color:#638596}.learn-more svg{width:12px;height:12px}main{width:min(820px,100vw - 32px);margin:0 auto;padding:28px 0 40px}.topbar{border-bottom:1px solid #dbe4e8;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:24px;padding-bottom:18px;display:grid}h1,h2,p{margin:0}h1{letter-spacing:0;font-size:clamp(2rem,5vw,4.5rem);font-weight:400}h2{font-size:1rem;font-weight:700}.topbar p{color:#4f626a;margin-top:4px}.topbar a{color:#638596;text-decoration:none}.topbar p a{text-underline-offset:2px;text-decoration:underline}.topbar a:hover{text-decoration:underline}.creator{justify-self:end;align-items:center;gap:8px;padding:0;display:inline-flex;color:#172328!important;text-decoration:none!important}.creator:hover{color:#638596!important}.x-mark{color:currentColor;place-items:center;width:22px;height:22px;display:grid}.x-mark svg{width:12px;height:12px}.workspace{grid-template-columns:minmax(360px,1fr) 340px;gap:18px;padding-top:14px;display:grid}.stage{align-content:start;justify-items:stretch;gap:12px;max-width:384px;display:grid}.canvas-wrap{aspect-ratio:1;place-items:center;width:min(100%,384px);margin-bottom:-4px;display:grid}.stage-chips{width:min(100%,384px)}.punk-canvas{width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;border:1px solid #172328}.actions{justify-content:space-between;gap:16px;display:flex}.mobile-filter-button,.mobile-filter-close{display:none}.seed-control{gap:5px;width:100%;display:grid}.seed-control>div{grid-template-columns:minmax(0,1fr) auto auto;gap:8px;display:grid}.seed-control input{font-family:Courier New,monospace;font-size:.9rem}.panel{border-left:1px solid #dbe4e8;padding-left:24px}.filter-sticky{z-index:2;background:#fff}label span,.stage-stats span,.panel-summary span{color:#4f626a;font-size:.84rem}input,select{color:#172328;background:#fff;border:1px solid #b9c9d0;border-radius:2px;width:100%;padding:.54rem .6rem}input[type=checkbox]{width:auto;padding:0}input:focus,select:focus,button:focus-visible{outline-offset:2px;outline:2px solid #638596}.stage-stats{gap:4px;width:100%;margin:0;padding:0 0 4px;display:grid}.stage-stats strong{color:#172328;font-size:1.05rem}.panel-summary{border-bottom:1px solid #dbe4e8;gap:2px;padding-bottom:12px;display:grid}.panel-summary strong{color:#172328;font-size:1.05rem}.panel-summary .eligible-count{color:#638596;font-size:2rem;font-weight:700;line-height:1}.warn,.converged{color:#9b3d24!important}.filters{grid-template-columns:1fr;gap:2px;display:grid}.filter-group{border:0;border-bottom:1px solid #dbe4e8;margin:0;padding:0;display:grid}.filter-toggle{color:#172328;text-align:left;background:0 0;border:0;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;width:100%;padding:10px 0;display:grid}.filter-toggle:hover{color:#172328;background:0 0;border-color:#0000}.filter-toggle strong,.filter-toggle em{color:#638596;font-size:.88rem;font-style:normal}.filter-toggle em{place-items:center;width:16px;height:16px;display:grid}.filter-clear{color:#638596;background:0 0;border:0;justify-self:start;padding:0 0 8px;font-size:.82rem}.filter-clear:hover{color:#172328;background:0 0}.check-list{max-height:260px;padding:0 4px 10px 0;display:none;overflow-y:auto}.check-list.open{gap:2px;display:grid}.check-option{grid-template-columns:18px minmax(0,1fr);align-items:center;gap:6px;min-height:24px;display:grid}.check-option span{color:#172328;justify-content:space-between;align-items:baseline;gap:10px;font-size:.9rem;display:flex}.check-option em{color:#638596;font-size:.8rem;font-style:normal}.filter-head{border-bottom:1px solid #dbe4e8;justify-content:flex-end;align-items:center;gap:16px;padding:10px 0;display:flex}.filter-head h2{margin-right:auto}.filter-head button{padding:.42rem .62rem}.trait-list{flex-wrap:wrap;gap:6px;display:flex}.constraint-chips{flex-wrap:wrap;gap:5px;margin:0;display:flex}.chip{color:#172328;background:#fff;border:1px solid #b9c9d0;align-items:center;gap:5px;min-height:0;padding:.12rem .32rem;font-size:.78rem;line-height:1.2;display:inline-flex}.chip-empty{color:#6d7d84;border-color:#dbe4e8}.chip-removable{background:#f7fbfc;border-color:#638596}.chip-removable:hover{color:#172328;background:#fff;border-color:#638596}.chip-removable svg{stroke:#c62828;stroke-width:1.8px;stroke-linecap:square;width:10px;height:10px}.chip-removable:hover svg{stroke:#a51414}.trait-list span{border:1px solid #dbe4e8;padding:.18rem .38rem}.empty,.loading{text-align:center;color:#4f626a;place-items:center;min-height:220px;display:grid}.empty>div{gap:4px;display:grid}.empty strong{color:#172328;font-size:.98rem}.empty span{font-size:.84rem}.empty.small{border:1px solid #dbe4e8;min-height:120px}@media (width>=821px){html,body,#app{min-height:100%}main{flex-direction:column;min-height:100vh;padding-bottom:28px;display:flex}.workspace{flex:1 0 auto;align-items:start}.stage{overflow:visible}.panel{flex-direction:column;max-height:calc(100vh - 28px);padding-right:12px;display:flex;position:sticky;top:14px;overflow:hidden}.filter-sticky{flex:none}.filters{min-height:0;overflow-y:auto}}@media (width<=820px){main{width:min(100vw - 22px,620px);padding-top:18px}.workspace{grid-template-columns:1fr}.topbar{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px}.topbar>div{min-width:0}.creator{justify-self:end;gap:0;padding:0}.creator span:last-child{display:none}.actions{justify-content:space-between;align-items:center;display:flex}.actions #downloadBtn{justify-self:end}.mobile-filter-button{justify-content:center;justify-self:stretch;align-items:center;gap:6px;width:min(100%,384px);padding:.62rem .7rem;display:inline-flex}.mobile-filter-button strong{color:#fff;background:#638596;place-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.75rem;display:inline-grid}.mobile-filter-button:hover strong{color:#638596;background:#fff}.panel{display:none}.panel.open{z-index:20;background:#fff;border:0;flex-direction:column;padding:14px;display:flex;position:fixed;inset:0;overflow:hidden}.panel.open .filter-sticky{flex:none}.panel.open .filters{min-height:0;overflow-y:auto}.mobile-filter-close{margin-left:auto;display:inline-flex}.filter-head{gap:8px}}