/* Real plan artwork stays crisp and visible beside the member's own photo. */
.am {align-items: center; gap: 14px;}
.am-trigger {padding: 0; border: 0; background: transparent;}
.am-plan-avatar {--am-ring: #75b9ff; position: relative; display: inline-flex; padding: 3px; border-radius: 50%; background: linear-gradient(145deg, #c0ecff, var(--am-ring) 46%, #1c5fba); box-shadow: inset 0 1px 0 #ffffff70;}
.am-plan-avatar > .am-avatar {border: 2px solid #101621; box-sizing: content-box;}
.am-plan-free {--am-ring: #a0b8d2; background: linear-gradient(145deg, #d5e4f1, #8299b2 48%, #384c68);}
.am-plan-basic {--am-ring: #68b6ff;}
.am-plan-plus {--am-ring: #a69aff; background: linear-gradient(145deg, #cbd6ff, #a69aff 48%, #576cae);}
.am-plan-pro {--am-ring: #c0deff; background: linear-gradient(145deg, #f2f8ff, #a8d4ff 48%, #3984cf);}
.am-plan-badge {position: absolute; right: -6px; bottom: -4px; display: grid; place-items: center; width: 23px; height: 23px; padding: 2px; border: 1px solid #c1dcff64; border-radius: 50%; background: #15233a; box-shadow: 0 2px 6px #0005;}
.am-plan-badge img {display: block; width: 18px; height: 18px; object-fit: contain;}
.am-trigger:hover .am-plan-avatar {filter: brightness(1.1);}
.am-header-export {display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 0 17px; border: 1px solid #6fd0ffb3; border-radius: 999px; background: linear-gradient(#6fd0ff, #35b4ff 12%, #0089ff 52%, #024069); color: #fff; font: inherit; font-size: 12px; font-weight: 600; line-height: 1; cursor: pointer; box-shadow: inset 0 1px 2px #ffffffd9, inset 0 -2px 3px #0007, 0 3px 0 #02406980, 0 8px 18px #0089ff1f; transition: filter 150ms ease, transform 150ms ease;}
.am-header-export:hover {filter: brightness(1.1);}
.am-header-export:active {transform: scale(.97);}
.am-header-export:focus-visible {outline: 2px solid #a9dfff; outline-offset: 3px;}
.am-photo-controls {display: grid; justify-items: start; gap: 8px; max-width: 270px;}
.am-photo-controls > input {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);}
.am-photo-actions {display: flex; flex-wrap: wrap; gap: 7px;}
.am-photo-controls .am-error, .am-photo-controls .am-success {margin: 0;}
.am-photo-controls .am-hint {font-size: 11px; line-height: 1.55;}
@media (max-width: 600px) {.am {gap: 10px;} .am-header-export {padding: 0 12px; gap: 6px; min-height: 34px;} .am-plan-badge {right: -4px; bottom: -3px;}}