.character-selection-list{--character-row-surface: var(--system-surface, #fff);--character-row-border: var(--system-surface-border, rgba(0, 0, 0, .08));--character-row-shadow: var(--system-shadow, 0 1px 3px rgba(0, 0, 0, .06));--character-row-text: var(--system-text-primary, #1d1d1f);--character-row-muted: var(--system-text-secondary, #6e6e73);--character-row-accent: #007aff;--character-row-accent-soft: rgba(0, 122, 255, .12);--character-row-badge: rgba(118, 118, 128, .1);--character-row-action-divider: var(--system-row-divider, rgba(0, 0, 0, .08));display:flex;width:100%;flex-direction:column;gap:10px}.character-selection-list__row{display:grid;grid-template-columns:minmax(0,1fr);min-height:82px;overflow:hidden;border:1px solid var(--character-row-border);border-radius:20px;background:var(--character-row-surface);box-shadow:var(--character-row-shadow)}.character-selection-list__row[data-has-action=true]{grid-template-columns:minmax(0,1fr) 48px}.character-selection-list__row[data-selected=true]{border-color:var(--character-row-accent);box-shadow:0 0 0 1px var(--character-row-accent-soft),var(--character-row-shadow)}.character-selection-list__primary{display:grid;grid-template-columns:58px minmax(0,1fr);min-width:0;min-height:80px;align-items:center;gap:12px;padding:11px 12px;color:var(--character-row-text);text-align:left}.character-selection-list__portrait{width:58px;height:58px;border:1px solid var(--character-row-border);border-radius:16px;box-shadow:var(--character-row-shadow)}.character-selection-list__body,.character-selection-list__name-line{min-width:0}.character-selection-list__body{display:flex;flex-direction:column;gap:6px}.character-selection-list__name-line{display:flex;align-items:center;gap:7px}.character-selection-list__name-line strong{overflow:hidden;font-size:calc(15px * var(--os-font-scale, 1));font-weight:680;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.character-selection-list__name-line small{flex:none;padding:3px 7px;border-radius:999px;background:var(--character-row-accent-soft);color:var(--character-row-accent);font-size:calc(10px * var(--os-font-scale, 1));line-height:1}.character-selection-list__check{display:grid;width:20px;height:20px;flex:0 0 20px;margin-left:auto;place-items:center;border-radius:50%;background:var(--character-row-accent);color:#fff;font-size:calc(12px * var(--os-font-scale, 1));font-weight:800}.character-selection-list__subtitle{overflow:hidden;color:var(--character-row-muted);font-size:calc(11px * var(--os-font-scale, 1));line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.character-selection-list__badges{display:flex;min-width:0;flex-wrap:wrap;gap:5px}.character-selection-list__badges>span{padding:4px 7px;border:1px solid var(--character-row-border);border-radius:999px;background:var(--character-row-badge);color:var(--character-row-muted);font-size:calc(10px * var(--os-font-scale, 1));line-height:1;white-space:nowrap}.character-selection-list__badges>span[data-active=true]{border-color:var(--character-row-accent-soft);background:var(--character-row-accent-soft);color:var(--character-row-accent)}.character-selection-list__action{display:flex;width:48px;min-height:80px;align-items:center;justify-content:center;border-left:1px solid var(--character-row-action-divider);color:var(--character-row-muted)}.character-selection-list__primary:focus-visible,.character-selection-list__action:focus-visible{outline:2px solid var(--character-row-accent);outline-offset:-3px}.character-selection-list__empty{display:flex;min-height:220px;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px dashed var(--system-surface-border, rgba(0, 0, 0, .12));border-radius:20px;background:var(--system-surface, #fff);color:var(--system-text-primary, #1d1d1f);text-align:center}.character-selection-list__empty span{color:var(--system-text-secondary, #6e6e73);font-size:calc(12px * var(--os-font-scale, 1))}html[data-skin=iphone-liquid] .character-selection-list:not(.character-selection-list--soul-flat){--character-row-surface: rgba(255, 255, 255, .44);--character-row-border: rgba(255, 255, 255, .6);--character-row-text: #1d1d1f;--character-row-muted: #6e6e73;--character-row-accent: #007aff;--character-row-accent-soft: rgba(0, 122, 255, .14)}html[data-skin=iphone-liquid] .character-selection-list:not(.character-selection-list--soul-flat) .character-selection-list__row{-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%)}:is(html[data-skin=ios-flat],html[data-skin=paper]) .character-selection-list:not(.character-selection-list--soul-flat){--character-row-surface: #fff;--character-row-border: rgba(0, 0, 0, .08);--character-row-shadow: 0 1px 3px rgba(0, 0, 0, .06);--character-row-accent: #007aff;--character-row-accent-soft: rgba(0, 122, 255, .12)}html[data-skin=night] .character-selection-list:not(.character-selection-list--soul-flat){--character-row-surface: #1c1c1e;--character-row-border: rgba(255, 255, 255, .08);--character-row-shadow: 0 1px 4px rgba(0, 0, 0, .3);--character-row-accent: #4dabf7;--character-row-accent-soft: rgba(77, 171, 247, .18);--character-row-badge: rgba(255, 255, 255, .06);--character-row-text: #fff;--character-row-muted: rgba(255, 255, 255, .65)}html[data-skin=illustration] .character-selection-list:not(.character-selection-list--soul-flat){--character-row-surface: #fff;--character-row-border: #2c2c2c;--character-row-shadow: 4px 4px 0 #2c2c2c;--character-row-accent: #52c41a;--character-row-accent-soft: rgba(82, 196, 26, .16);--character-row-badge: #fff9f0;--character-row-text: #2c2c2c;--character-row-muted: #595959}html[data-skin=iphone-liquid] .character-selection-list__empty:not(.character-selection-list__empty--soul-flat){border-color:#fff9;background:#ffffff70;color:#1d1d1f;-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%)}html[data-skin=night] .character-selection-list__empty:not(.character-selection-list__empty--soul-flat){border-color:#ffffff14;background:#1c1c1e;color:#fff}html[data-skin=night] .character-selection-list__empty:not(.character-selection-list__empty--soul-flat) span{color:#ffffffa6}html[data-skin=illustration] .character-selection-list__empty:not(.character-selection-list__empty--soul-flat){border:3px dashed #2c2c2c;background:#fff;color:#2c2c2c;box-shadow:4px 4px #2c2c2c}html[data-skin=illustration] .character-selection-list__empty:not(.character-selection-list__empty--soul-flat) span{color:#595959}html[data-skin=illustration] .character-selection-list:not(.character-selection-list--soul-flat) .character-selection-list__row{border-width:3px}.character-selection-list--soul-flat{--character-row-surface: linear-gradient(135deg, rgb(38 43 57 / .98), rgb(24 28 39 / .98));--character-row-border: rgb(255 255 255 / .16);--character-row-shadow: 0 12px 28px rgb(3 7 18 / .2);--character-row-text: rgb(248 250 252);--character-row-muted: rgb(203 213 225 / .72);--character-row-accent: hsl(var(--primary-hue) var(--primary-sat) var(--primary-lightness));--character-row-accent-soft: hsl(var(--primary-hue) var(--primary-sat) var(--primary-lightness) / .22);--character-row-badge: rgb(15 23 42 / .38);--character-row-action-divider: rgb(255 255 255 / .1)}.character-selection-list--soul-flat .character-selection-list__row[data-selected=true]{border-color:hsl(var(--primary-hue) var(--primary-sat) var(--primary-lightness) / .78);box-shadow:0 0 0 1px hsl(var(--primary-hue) var(--primary-sat) var(--primary-lightness) / .3),0 14px 32px #0307123d}.character-selection-list--soul-flat .character-selection-list__name-line small,.character-selection-list--soul-flat .character-selection-list__badges>span[data-active=true]{color:#ede9fe}.character-selection-list__empty--soul-flat{border-color:#ffffff2e;background:#181c27b8;color:#f8fafc}.character-selection-list__empty--soul-flat strong{color:hsl(var(--primary-hue) var(--primary-sat) var(--primary-lightness))}.character-selection-list__empty--soul-flat span{color:#cbd5e1ad}@media (max-width: 340px){.character-selection-list__primary{grid-template-columns:52px minmax(0,1fr);gap:10px;padding-inline:10px}.character-selection-list__portrait{width:52px;height:52px}.character-selection-list__badges>span{padding-inline:6px;font-size:calc(9px * var(--os-font-scale, 1))}}