.avatar[data-color] { color:var(--avatar-light-ink); background:var(--avatar-light-bg); box-shadow:inset 0 0 0 1px currentColor; overflow:hidden; }
.avatar img { width:100%; height:100%; min-width:0; object-fit:contain; padding:2px; box-sizing:border-box; }
.avatar[data-color="BLUE"] { --avatar-light-ink:#0a4f89; --avatar-light-bg:#eaf2f8; --avatar-dark-ink:#92c6f0; --avatar-dark-bg:#132f4b; }
.avatar[data-color="GREEN"] { --avatar-light-ink:#356954; --avatar-light-bg:#e7f0eb; --avatar-dark-ink:#a6d0bb; --avatar-dark-bg:#20382f; }
.avatar[data-color="RED"] { --avatar-light-ink:#963e49; --avatar-light-bg:#f7e8e9; --avatar-dark-ink:#edb1b9; --avatar-dark-bg:#3d2630; }
.avatar[data-color="AMBER"] { --avatar-light-ink:#805d22; --avatar-light-bg:#f8efdc; --avatar-dark-ink:#e4c48b; --avatar-dark-bg:#3a3020; }
.avatar[data-color="PURPLE"] { --avatar-light-ink:#695388; --avatar-light-bg:#eee9f5; --avatar-dark-ink:#c8b6e4; --avatar-dark-bg:#30283e; }
.avatar[data-color="TEAL"] { --avatar-light-ink:#2e6770; --avatar-light-bg:#e5f0f1; --avatar-dark-ink:#9bced5; --avatar-dark-bg:#20363c; }
.avatar[data-color="PINK"] { --avatar-light-ink:#8e4c6c; --avatar-light-bg:#f5e7ee; --avatar-dark-ink:#dfb2c8; --avatar-dark-bg:#3a2835; }
.avatar[data-color="SLATE"] { --avatar-light-ink:#4f6071; --avatar-light-bg:#e9edf1; --avatar-dark-ink:#bdcbd8; --avatar-dark-bg:#293541; }
html[data-theme="dark"] .avatar[data-color] { color:var(--avatar-dark-ink); background:var(--avatar-dark-bg); }
@media(prefers-color-scheme:dark) {
  html[data-theme="system"] .avatar[data-color] { color:var(--avatar-dark-ink); background:var(--avatar-dark-bg); }
}