/* CPWF Auction — the account button, top right of the auction. */
.cpwf-hacct { position: relative; display: inline-flex; align-items: center; font-family: inherit; }
.cpwf-hacct[hidden] { display: none; }
.cpwf-hacct button { font: inherit; margin: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.cpwf-hacct :focus-visible { outline: 2px solid #F0F9FF; outline-offset: 3px; }

/* Signed out: a quiet outlined pill. */
.cpwf-hacct .cpwf-hacct-signin { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px 0 12px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px; background: rgba(255, 255, 255, .06); color: #fff; font-size: 14.5px; font-weight: 600; }
.cpwf-hacct .cpwf-hacct-signin:hover, .cpwf-hacct .cpwf-hacct-signin:focus { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); color: #fff; }

/* Signed in: initial, first name and a caret, like most account menus. */
.cpwf-hacct .cpwf-hacct-btn { display: inline-flex; align-items: center; gap: 8px; padding: 3px 12px 3px 3px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px; color: #fff; font-size: 14.5px; font-weight: 600; transition: background .15s, border-color .15s; }
.cpwf-hacct .cpwf-hacct-btn:hover, .cpwf-hacct .cpwf-hacct-btn:focus, .cpwf-hacct .cpwf-hacct-btn[aria-expanded="true"] { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .5); color: #fff; }
.cpwf-hacct .cpwf-hacct-btn svg { transition: transform .2s; }
.cpwf-hacct .cpwf-hacct-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.cpwf-hacct-av { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #F0F9FF; color: #1F2B4D; font-size: 14px; font-weight: 700; line-height: 1; }
.cpwf-hacct-av.is-lg { width: 44px; height: 44px; font-size: 18px; background: #2E3E6A; color: #fff; }
.cpwf-hacct-name { max-width: 14ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.cpwf-hacct-menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 100000; width: 260px; padding: 8px; background: #fff; border-radius: 14px; box-shadow: 0 1px 2px rgba(15, 23, 42, .08), 0 18px 40px -12px rgba(15, 23, 42, .35); color: #1F2B4D; text-align: left; opacity: 0; transform: translateY(-4px); transition: opacity .16s, transform .16s; }
.cpwf-hacct-menu[hidden] { display: none; }
.cpwf-hacct-menu.is-in { opacity: 1; transform: none; }
.cpwf-hacct-head { display: flex; align-items: center; gap: 12px; padding: 10px 10px 14px; margin-bottom: 6px; border-bottom: 1px solid #E6ECF3; }
.cpwf-hacct-head strong { display: block; font-size: 16px; font-weight: 700; line-height: 1.25; color: #1F2B4D; }
.cpwf-hacct-head span:not(.cpwf-hacct-av) { display: block; font-size: 13.5px; color: #64748B; }
.cpwf-hacct .cpwf-hacct-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 10px; background: none; border: 0; border-radius: 8px; color: #1F2B4D; font-size: 15px; font-weight: 500; text-align: left; }
.cpwf-hacct .cpwf-hacct-item svg { flex: none; color: #5B6B8C; }
.cpwf-hacct .cpwf-hacct-item:hover, .cpwf-hacct .cpwf-hacct-item:focus { background: #F0F5FA; color: #1F2B4D; outline: none; }
.cpwf-hacct .cpwf-hacct-item.is-out { margin-top: 6px; border-top: 1px solid #E6ECF3; border-radius: 0 0 8px 8px; padding-top: 13px; }

@media (max-width: 767px) { .cpwf-hacct-menu { right: -6px; width: min(300px, calc(100vw - 24px)); } }
@media (prefers-reduced-motion: reduce) { .cpwf-hacct-menu, .cpwf-hacct .cpwf-hacct-btn svg { transition: none; } }