.char-picker-layout{gap:var(--space-5);grid-template-columns:minmax(0,1fr) minmax(280px,360px);align-items:start;display:grid}.char-picker-layout.no-preview{grid-template-columns:minmax(0,1fr)}.char-picker-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(140px,1fr));display:grid}.char-picker-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);cursor:pointer;position:relative;overflow:hidden}.char-picker-card:hover,.char-picker-card.previewing{border-color:var(--accent)}.char-picker-card.selected{border-color:var(--gold)}.char-picker-card.taken{cursor:not-allowed;filter:grayscale(.4);opacity:.55}.char-picker-thumb{aspect-ratio:3/4;background:var(--c-character);justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.char-picker-thumb img,.char-preview-art img{object-fit:cover;width:100%;height:100%}.char-picker-meta{min-height:56px;padding:var(--space-2) var(--space-3)}.char-picker-name,.char-preview-name{color:var(--text);font-family:var(--ff-display);font-size:var(--fs-sm);font-weight:700}.char-picker-item,.char-preview-hint{color:var(--text-muted);font-size:10px}.char-selected-badge,.char-taken-badge{border-radius:var(--radius-pill);background:var(--gold);color:#1c1606;padding:3px 8px;font-size:10px;font-weight:700;position:absolute;top:6px;right:6px}.char-preview-panel{top:var(--space-3);gap:var(--space-3);max-height:calc(100vh - 220px);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);flex-direction:column;display:flex;position:sticky;overflow:auto}.char-preview-body,.char-preview-info,.char-preview-actions,.char-preview-item{gap:var(--space-2);flex-direction:column;display:flex}.char-preview-art{aspect-ratio:3/4;border-radius:var(--radius-md);background:var(--c-character);width:100%;max-width:220px;overflow:hidden}.char-preview-art-col{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.char-preview-id{color:var(--text-muted);font-family:var(--ff-body);font-size:10px}.char-preview-stats{gap:var(--space-2);flex-wrap:wrap;display:flex}.char-preview-placeholder{min-height:240px;color:var(--text-muted);text-align:center;place-items:center;display:grid}.char-preview-placeholder__icon{font-size:48px}.char-preview-placeholder__text{font-size:var(--fs-sm)}.char-variant-nav{border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface2);font-size:var(--fs-xs);align-items:center;gap:4px;padding:2px;display:inline-flex}.char-variant-nav button{background:0 0;border:0;width:24px;height:24px;padding:0}.char-variant-nav__caption{color:var(--text-muted);padding-left:6px;font-size:10px}.char-variant-nav__label{text-align:center;min-width:32px}.char-preview-item-label{color:var(--text-muted);letter-spacing:var(--ls-cap);text-transform:uppercase;font-size:10px}.char-preview-item-name,.char-preview-ability{color:var(--text);font-size:var(--fs-xs)}.card-modal-overlay{z-index:var(--z-modal);background:#000000d6;place-items:center;display:grid;position:fixed;inset:0}@media (max-width:960px){.char-picker-layout{grid-template-columns:minmax(0,1fr)}}