/* Shared by all skill cards; reuse each existing icon's silhouette, with no extra images. */
.skill-icon-backplate.skill-card.selected .skill-picture,
.skill-icon-backplate .skill-icon-toggle[aria-expanded="true"] .skill-icon{outline:none}
.skill-icon-backplate .skill-picture{position:relative;isolation:isolate}
.skill-icon-backplate .skill-icon-toggle,
.skill-icon-backplate .skill-picture>.skill-icon{position:relative;z-index:1}
.skill-icon-backplate.selected .skill-picture::before,
.skill-icon-backplate[data-icon-open="true"] .skill-picture::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 background-image:var(--skill-icon-art);background-position:center;background-size:contain;background-repeat:no-repeat;
 filter:var(--skill-backplate-filter,brightness(0) saturate(100%) invert(88%) sepia(12%) saturate(385%) hue-rotate(112deg) brightness(96%) contrast(90%));
 transform:scale(1.18);
}
.skill-icon-backplate[data-selection="guard"]{--skill-backplate-filter:brightness(0) saturate(100%) invert(89%) sepia(10%) saturate(571%) hue-rotate(167deg) brightness(97%) contrast(94%)}

/* Wish picker selection uses the same enlarged icon silhouette as skills. */
.will-type-options button{position:relative;isolation:isolate}
.will-type-options button>img,.will-type-options button>.will-icon-placeholder{position:relative;z-index:1}
.will-type-options button[aria-pressed="true"],.will-type-options button[aria-pressed="true"]:hover{background:transparent;border-color:transparent;outline:none;box-shadow:none}
.will-type-options button[aria-pressed="true"]::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background-image:var(--skill-icon-art);background-position:center;background-repeat:no-repeat;background-size:45px 45px;filter:brightness(0) saturate(100%) invert(88%) sepia(12%) saturate(385%) hue-rotate(112deg) brightness(96%) contrast(90%);transform:scale(1.18)}