.avatar-picker{--av-accent:#246c9b;color:#263845;background:#fff;border:1px solid #dce4e8;border-radius:8px;padding:0;width:min(560px,calc(100vw - 24px));max-height:min(780px,calc(100dvh - 24px));overflow:hidden;box-shadow:0 18px 60px #102c3b40}.avatar-picker[data-variant=wechat]{--av-accent:#16864a}.avatar-picker::backdrop{background:#102b4660}.avatar-picker header,.avatar-picker footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:#f4f7f8}.avatar-picker h2{font-size:18px;margin:0;color:inherit}.avatar-picker button{appearance:none;cursor:pointer;font:inherit;font-size:14px;min-height:44px;border:1px solid #d8e2e7;border-radius:6px;padding:8px 12px;color:inherit;background:#fff}.avatar-picker button:hover:not(:disabled){background:#eaf1f5;color:#172e3e}.avatar-picker button:focus{outline:none}.avatar-picker button:focus-visible,.avatar-picker input:focus-visible{outline:2px solid var(--av-accent);outline-offset:2px}.avatar-picker button:disabled{opacity:.5;cursor:default}.avatar-picker .avatar-save{background:var(--av-accent);color:#fff;border-color:transparent}.avatar-picker .avatar-save:hover:not(:disabled){filter:brightness(.95);background:var(--av-accent);color:#fff}.avatar-picker-body{overflow:auto;overscroll-behavior:contain;max-height:calc(100dvh - 170px);padding:16px 18px}.avatar-preview{display:flex;align-items:center;gap:16px;margin-bottom:12px}.avatar-preview p{font-size:14px;color:#536772;line-height:1.5}.avatar-large{display:block;flex-shrink:0;width:88px;height:88px;border-radius:8px;overflow:hidden}.avatar-large img{width:100%;height:100%;object-fit:cover;display:block}.avatar-tabs{display:flex;gap:6px;overflow:auto;margin:14px 0;overscroll-behavior:contain}.avatar-tabs button{white-space:nowrap;flex-shrink:0}.avatar-picker [aria-pressed=true]{border-color:var(--av-accent);box-shadow:inset 0 0 0 1px var(--av-accent);background:#eaf3f6;color:#163d53}.avatar-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.avatar-picker .avatar-choice{padding:6px;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}.avatar-choice img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:5px}.avatar-choice span{font-size:12px}.avatar-status{font-size:14px;line-height:1.5;color:#9b4c28;min-height:20px}.avatar-picker .avatar-crop[hidden]{display:none}.avatar-crop{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin:12px 0}.avatar-crop canvas{width:176px;height:176px;max-width:100%;border-radius:6px;align-self:center;image-rendering:auto}.avatar-crop label{display:flex;gap:12px;align-items:center;font-size:14px}.avatar-crop input{flex:1;min-width:0;min-height:32px}.avatar-more{margin-top:12px}.avatar-picker footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}.avatar-picker img{box-sizing:border-box}.ref-avatar img,.avatar img,[data-avatar-id] img{display:block;object-fit:cover;width:100%;height:100%;border-radius:inherit}.avatar-profile-button{display:flex;align-items:center;gap:10px;width:100%;text-align:left}.avatar-admin-photo{width:40px;height:40px;display:block;flex-shrink:0;border-radius:6px;overflow:hidden}.avatar-admin-photo img{object-fit:cover;width:100%;height:100%;display:block}@media(max-width:420px){.avatar-grid{gap:6px}.avatar-picker-body{padding:12px}.avatar-picker header,.avatar-picker footer{padding-left:12px;padding-right:12px}.avatar-picker button{padding:8px}.avatar-choice span{font-size:11px}}@media(prefers-color-scheme:dark){.avatar-picker:not([data-avatar-theme=light]){background:#1f2c38;color:#e4edf3;border-color:#4a5c6a}.avatar-picker:not([data-avatar-theme=light]) header,.avatar-picker:not([data-avatar-theme=light]) footer{background:#243543}.avatar-picker:not([data-avatar-theme=light]) button{color:#e4edf3;background:#2d3f4d;border-color:#587080}.avatar-picker:not([data-avatar-theme=light]) button:hover:not(:disabled){background:#385261;color:#fff}.avatar-picker:not([data-avatar-theme=light]) [aria-pressed=true]{background:#304d61;color:#fff}.avatar-preview p{color:#becbd4}.avatar-status{color:#efc08f}}[data-theme=dark] .avatar-picker{background:#1f2c38;color:#e4edf3;border-color:#4a5c6a}[data-theme=dark] .avatar-picker header,[data-theme=dark] .avatar-picker footer{background:#243543}[data-theme=dark] .avatar-picker button{color:#e4edf3;background:#2d3f4d;border-color:#587080}[data-theme=dark] .avatar-preview p{color:#becbd4}

.avatar-picker[open]{display:flex;flex-direction:column;height:min(780px,calc(100dvh - 24px))}.avatar-picker header,.avatar-picker footer{flex-shrink:0}.avatar-picker .avatar-picker-body{flex:1;min-height:0;max-height:none}.avatar-picker[data-avatar-theme=dark] .avatar-save{background:var(--av-accent);color:#fff}
