:root{--paper: #f4efe4;--card: #fbf8f1;--ink: #2b2724;--muted: #6e675e;--line: #ddd4c3;--accent: #c2705c;--radius: 10px}@media (prefers-color-scheme: dark){:root{--paper: #1c1a18;--card: #262320;--ink: #efe8dc;--muted: #a49b8d;--line: #3a352f}}*{box-sizing:border-box}body{margin:0;padding:2rem 1.25rem 4rem;background:var(--paper);color:var(--ink);font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}header{max-width:1080px;margin:0 auto 2rem}h1{margin:0;font-size:clamp(2rem,5vw,3rem);letter-spacing:-.02em}.tagline{margin:.35rem 0 0;color:var(--muted)}main{max-width:1080px;margin:0 auto;display:grid;gap:1.5rem;grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:start}@media (max-width: 760px){main{grid-template-columns:1fr}}.stage{position:sticky;top:1.5rem;display:grid;gap:.75rem}.portrait{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;line-height:0}.portrait svg{width:100%;height:auto;display:block}.seedbar{display:flex;gap:.5rem}input[type=text]{flex:1;min-width:0;padding:.55rem .7rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);color:inherit;font:inherit}button{padding:.5rem .75rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);color:inherit;font:inherit;cursor:pointer}button:hover{border-color:var(--accent)}.actions{display:flex;flex-wrap:wrap;gap:.5rem}.hint{margin:0;min-height:1.4em;color:var(--muted);font-size:.875rem}.controls{display:grid;gap:.15rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:.6rem}.trait{border-bottom:1px solid var(--line)}.trait:last-of-type{border-bottom:0}.trait-head{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;padding:.5rem .4rem;border:0;border-radius:8px;background:transparent;text-align:left}.trait-head:hover{background:var(--paper)}.trait-head:after{content:"";flex:none;width:.42rem;height:.42rem;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:translateY(-.15em) rotate(-45deg)}.trait-head[aria-expanded=true]:after{transform:translateY(.05em) rotate(45deg)}.trait-name{color:var(--muted);font-size:.875rem}.trait-value{margin-left:auto;font-size:.875rem}.trait-value.pinned:before{content:"";display:inline-block;width:.4rem;height:.4rem;margin-right:.35rem;border-radius:50%;background:var(--accent);vertical-align:.05em}.options{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:.4rem;padding:.15rem .4rem .7rem}.option{display:grid;padding:0;overflow:hidden;border-radius:8px;line-height:0}.thumb{display:block;overflow:hidden}.option svg{width:100%;height:auto;display:block}.option[data-framing=head] svg{transform:scale(1.35);transform-origin:50% 40%}.option[data-framing=close] svg{transform:scale(2.1);transform-origin:50% 50%}.option .name{padding:.2rem .1rem;color:var(--muted);font-size:.68rem;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.option[data-seeded]{border-color:var(--accent)}.option[aria-pressed=true]{border-color:var(--ink);outline:2px solid var(--ink);outline-offset:1px}.option[aria-pressed=true] .name{color:var(--ink)}.row{display:grid;grid-template-columns:8.5rem minmax(0,1fr);gap:.75rem;align-items:center;padding:.35rem .4rem}.rowlabel{color:var(--muted);font-size:.875rem}.swatches{display:flex;flex-wrap:wrap;gap:.3rem}.swatch{width:1.4rem;height:1.4rem;padding:0;border-radius:50%;border:1px solid var(--line)}.swatch[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:2px}.sheet{max-width:1080px;margin:2.5rem auto 0}.sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.75rem}.sheet-head h2{margin:0;font-size:1.1rem;font-weight:600}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.6rem}.cell{padding:0;border-radius:var(--radius);overflow:hidden;line-height:0}.cell svg{width:100%;height:auto;display:block}footer{max-width:1080px;margin:3rem auto 0;color:var(--muted);font-size:.875rem}footer a{color:inherit}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (max-width: 760px){.stage{position:static}}
