:root {
    --avatar-scale:    1.4;
    --avatar-native-w: 128px;
    --avatar-native-h: 128px;
    --ssc: -0.8;
    --usc: 0.8;
}

.avframe { width: 128px; height: 128px; position: relative; overflow: hidden; flex-shrink: 0; }
.avscaler {
    position: absolute;
    bottom: 0;
    left: 50%;
    width:  var(--avatar-native-w);
    height: var(--avatar-native-h);
    transform: scale(var(--avatar-scale)) translateX(-50%);
    transform-origin: bottom left;
}

.avatar  {width: 128px;height: 128px; position: relative; top: 15px;}
.groupLayer1 { position: relative; z-index: 999; }
.groupLayer2 { position: relative; }

.slot { position: absolute; pointer-events: none; }


.mood      { left: -15.5px; top: 4px;    }
.hands     { left:  40.8px; top: 85px;   }
.leftShoe  { left:  32px;   top: 86.5px; transform: scale(var(--usc)); }
.rightShoe { left:  56px;   top: 86.5px; transform: scale(var(--ssc), var(--usc)); }
.body      { left:  20.5px; top: 38px;   }
.hat       { left:  24px;   top: 13px;   z-index: 2; }
.item0     { left:  38.4px; top: 45px;   z-index: 5; }
.item1     { left:  31px;   top: 65px;   z-index: 4; }
.item2     { left:  31px;   top: 16px;   z-index: 5; }