.picon{vertical-align:middle;border-radius:50%;flex:none;place-items:center;width:32px;height:32px;display:inline-grid;position:relative}.picon img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.picon--empty{opacity:.85}.picon--bot{border:1px solid color-mix(in srgb, var(--gold-pale) 50%, transparent);background:radial-gradient(circle at 38% 30%, color-mix(in srgb, var(--surface-2) 75%, var(--ink-3)), var(--surface) 70%);color:var(--gold-hi);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--hi) 12%, transparent)}.picon--bot .icon{width:58%;height:58%}.apick{flex-direction:column;gap:10px;display:flex}.apick__grid{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px;display:grid}.apick__grid.is-off{opacity:.6}.apick__opt{aspect-ratio:1;cursor:pointer;transition:transform var(--dur-fast), box-shadow var(--dur-fast);background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.apick__opt .picon{width:100%;height:100%;box-shadow:0 0 0 1px var(--shade-2);transition:box-shadow var(--dur-fast)}.apick__opt:hover .picon{box-shadow:0 0 0 1px var(--shade-2), 0 0 0 2px var(--gold-line)}.apick__opt.is-on .picon{box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--gold-hi), 0 0 18px var(--gold-glow)}.apick__opt:focus-visible{outline:none;transform:scale(1.06)}.apick__opt:focus-visible .picon{box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--gold-hi), 0 0 18px var(--gold-glow)}.apick__opt:disabled{cursor:default}.apick__name{min-height:1.2em;color:var(--ink-2);font-weight:600;font-size:var(--text-sm)}@media (width<=700px){.apick__grid{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:6px}}
