.characters{text-align:center}
.characters h2{margin-bottom:16px}
.characters .characters-intro{max-width:480px;margin:0 auto}
.characters .character-picker{margin:28px auto 0}
.character-picker{max-width:660px;margin:30px auto 28px;text-align:center;color:var(--ink)}
.character-picker-lineup{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:stretch;gap:6px;margin:17px 0 16px}
.character-picker-lineup:before{content:"";position:absolute;z-index:-1;inset:auto 4% 23px;height:18px;border-radius:50%;background:#dcd8c345;filter:blur(10px)}
.character-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;min-height:145px;padding:9px 0 10px;border:1px solid transparent;border-radius:17px;background:transparent;color:var(--muted);font:11px/1.4 ui-monospace,monospace;text-align:center;appearance:none;opacity:1;-webkit-text-fill-color:currentColor;transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease}
/* Center and scale the visible artwork, independently of each PNG’s padding. */
.character-portrait{position:relative;display:block;width:104px;max-width:100%;aspect-ratio:1;flex:none;overflow:hidden;pointer-events:none}
.character-portrait img{position:absolute;display:block;width:var(--portrait-width,100%);max-width:none;height:auto;left:var(--portrait-left,0);top:var(--portrait-top,0);pointer-events:none;image-rendering:auto}
.character-option .character-name{display:block;white-space:normal;overflow-wrap:anywhere}
.character-option[aria-pressed=true]{border-color:#cf765b5c;background:#fffaf0;color:var(--ink)}
.character-option[aria-pressed=true]:after{content:"";position:absolute;bottom:-4px;left:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:var(--coral)}
.character-picker-ready .character-option{cursor:pointer}
.character-option:not(:disabled):hover{background:#fffcf5;transform:translateY(-3px);color:var(--ink)}
.character-option:focus-visible{outline:2px solid var(--coral);outline-offset:4px}
@media(max-width:540px){.character-picker{max-width:350px;margin-top:25px;margin-bottom:24px}.character-picker-lineup{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:15px 0 17px}.character-picker-lineup:before{inset:auto 8% 23px}.character-option{min-height:133px;padding:6px 2px 9px;gap:5px}.character-portrait{width:98px}.character-option[aria-pressed=true]:after{bottom:-3px}}
@media(prefers-reduced-motion:reduce){.character-option{transition:none}.character-option:not(:disabled):hover{transform:none}}
.character-picker-status{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}