.fn-wardrobe-art {
    --fn-wardrobe-sprite-scale:1.6;
    position:relative;
    display:block;
    width:100%;
    max-width:78px;
    padding:0 8px 5px 0;
    box-sizing:border-box;
}
html body .fn-wardrobe-art .fn-wardrobe-face {
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:1;
    object-fit:cover;
    image-rendering:auto;
    border:1px solid #ecc9df;
    border-radius:11px;
}
.fn-wardrobe-sprite {
    position:absolute;
    right:0;
    bottom:0;
    width:calc(18px * var(--fn-wardrobe-sprite-scale));
    height:calc(26px * var(--fn-wardrobe-sprite-scale));
    background:var(--fn-wardrobe-sprite) no-repeat calc(-18px * var(--fn-wardrobe-sprite-scale)) 0;
    background-size:calc(54px * var(--fn-wardrobe-sprite-scale)) calc(104px * var(--fn-wardrobe-sprite-scale));
    image-rendering:pixelated;
    filter:drop-shadow(0 1px 1px #fff) drop-shadow(0 1px 2px #7c506b64);
}
.fn-wardrobe-equipped {
    padding:3px 5px;
    border-radius:999px;
    background:#f1ddec;
    color:#714662;
    font:700 .63rem/1.15 system-ui,sans-serif;
    text-align:center;
    overflow-wrap:anywhere;
}
.fn-wardrobe-a11y {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    overflow:hidden;
    clip-path:inset(50%);
    white-space:nowrap;
}
@media(max-width:700px){
    .fn-wardrobe-art { --fn-wardrobe-sprite-scale:1.35; max-width:68px; padding-inline-end:5px; }
    .fn-wardrobe-equipped { font-size:.57rem; padding-inline:4px; }
}
