.custom-avatar-open{display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border:1px solid #dce3d4;border-radius:6px;font-size:11px;color:#4d6d51;background:#f3f6ee;white-space:nowrap}
.custom-avatar-open svg{width:14px;height:14px}
.custom-avatar-open:hover{background:#e9efe1}
.custom-avatar-dialog{width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:24px;border:1px solid #d6decc;border-radius:16px;background:#fffefa;color:#354732;box-shadow:0 24px 80px #142a2540;overflow:auto;overscroll-behavior:contain}
.custom-avatar-dialog::backdrop{background:#18322970}
.custom-avatar-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}
.custom-avatar-heading h2{margin:0;font-size:20px}
.custom-avatar-note{font-size:12px;line-height:1.7;color:#7c8574;margin:10px 0 18px}
.custom-avatar-file-label{display:flex;align-items:baseline;gap:10px;font-size:13px;margin-bottom:8px;flex-wrap:wrap}
.custom-avatar-file-label small{color:#7c8574;font-size:11px}
#custom-avatar-file{width:100%;font-size:12px;color:#7c8574}
#custom-avatar-file::file-selector-button{padding:8px 12px;margin-right:10px;border:1px solid #d8e0d0;border-radius:6px;background:#f0f4e9;color:#4d6d51;cursor:pointer}
.custom-avatar-editor{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;align-items:center;margin-top:20px}
.custom-avatar-crop{width:200px;aspect-ratio:1;border-radius:9px;overflow:hidden;border:1px solid #d6decc;background:repeating-conic-gradient(#edf0e7 0 25%,#fffefa 0 50%) 0/20px 20px;display:grid;place-items:center}
.custom-avatar-crop canvas{width:100%;height:100%;cursor:grab;touch-action:none;display:block}
.custom-avatar-crop canvas:active{cursor:grabbing}
.custom-avatar-crop canvas:focus-visible{outline:3px solid #81ad95;outline-offset:-3px}
#custom-avatar-empty{font-size:12px;color:#8d9682;background:#fffefa;padding:7px}
.custom-avatar-fields{display:flex;flex-direction:column;gap:9px;min-width:0}
.custom-avatar-fields label{font-size:12px;font-weight:600}
#custom-avatar-name{width:100%;padding:10px 12px;font-size:14px;border:1px solid #d7dece;background:#f8faf3;border-radius:7px;color:#354732;margin-bottom:8px}
#custom-avatar-name:focus{border-color:#81ad95;box-shadow:0 0 0 2px #b9cbb536}
#custom-avatar-zoom{width:100%;accent-color:#13805a}
.custom-avatar-crop-tip{display:flex;align-items:center;justify-content:space-between;gap:6px;color:#8a947d;font-size:11px;flex-wrap:wrap}
.custom-avatar-crop-tip button{padding:4px 0;color:#527550;font-size:11px}
.custom-avatar-error{font-size:12px;color:#bd4250;line-height:1.6;margin:12px 0}
.custom-avatar-error:empty{display:none}
.custom-avatar-add{display:block;width:100%;margin-top:18px;padding:11px 16px;border-radius:8px;background:#13805a;color:white;font-size:13px;font-weight:600}
.custom-avatar-manager{border-top:1px solid #e2e7d9;margin-top:24px;padding-top:18px}
.custom-avatar-manager h3{margin:0;font-size:13px}
.custom-avatar-manager .custom-avatar-note{margin:5px 0 10px;font-size:11px}
.custom-avatar-list{max-height:180px;overflow:auto;scrollbar-width:thin;scrollbar-color:#d6deca transparent}
.custom-avatar-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid #edf0e5}
.custom-avatar-row img{width:36px;height:36px;object-fit:cover;border-radius:5px;background:#f0f3e9;flex-shrink:0}
.custom-avatar-row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:12px}
.custom-avatar-action{font-size:11px;color:#6e7d60;padding:8px;border-radius:5px;flex-shrink:0}
.custom-avatar-action:hover{background:#edf2e6}
.asset-delete-button{color:#b34349}
.asset-delete-button:hover{background:#fae9e7}
.asset-delete-confirm{flex-basis:100%;background:#faf0ea;border:1px solid #efd6cb;border-radius:7px;padding:10px}
.asset-delete-confirm p{font-size:12px;line-height:1.7;margin:0 0 5px;overflow-wrap:anywhere}
.asset-delete-confirm button{min-height:36px}
.custom-avatar-dialog [hidden]{display:none!important}
.custom-avatar-list-empty{font-size:12px;color:#909884;margin:12px 0 2px}
#custom-avatar-history summary{font-size:12px;color:#859176;cursor:pointer;padding:12px 0 4px}
.unit-face .portrait.custom-portrait,.selection-avatar .portrait.custom-portrait{transform:none}
@media(max-width:540px){
  .custom-avatar-dialog{padding:18px;width:calc(100% - 24px);max-height:calc(100dvh - 24px);border-radius:12px}
  .custom-avatar-heading h2{font-size:18px}
  .custom-avatar-editor{grid-template-columns:1fr;gap:16px;margin-top:16px}
  .custom-avatar-crop{width:160px;margin:auto}
  .custom-avatar-fields{gap:7px}
  #custom-avatar-name{font-size:16px;margin-bottom:3px}
  .custom-avatar-note{font-size:11px;margin-bottom:14px}
}