/* Account display inherits the existing page palette and type. */
.mp-account{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .75rem;min-width:0;max-width:100%;font:inherit;color:inherit;letter-spacing:normal;text-transform:none}
.mp-account [hidden]{display:none!important}
.mp-account-status{font-size:.875rem;line-height:1.5}
.mp-account-name{max-width:min(28ch,100%);overflow-wrap:anywhere;font-size:1rem;line-height:1.5;font-weight:600}
.mp-account-login,.mp-account-logout{font:inherit;color:inherit;text-decoration:underline;text-underline-offset:.2em;min-height:44px;display:inline-flex;align-items:center;padding:.3rem .5rem}
.mp-account-logout{cursor:pointer;background:transparent;border:1px solid currentColor;border-radius:6px}
.mp-account-logout:disabled{cursor:wait;opacity:.7}
.mp-account :focus-visible{outline:2px solid currentColor;outline-offset:3px}
.mp-account-error{flex-basis:100%;font-size:.875rem;line-height:1.5}
header:has(>.mp-account){flex-wrap:wrap;gap:1rem}
header>.mp-account{margin-inline-start:auto}
@media(max-width:600px){header>.mp-account{flex-basis:100%;margin-inline-start:0}.mp-account-name{max-width:100%;flex:1 1 12ch}}

.mp-account-profile{max-width:32rem;overflow-wrap:anywhere;white-space:normal}.mp-account-profile:not([href]){text-decoration:none;opacity:.8}.mp-account-retry{font:inherit;min-height:44px}

/* Compact portal account disclosure; other page layouts keep their full status. */
.mp-account--compact{position:relative;flex-wrap:nowrap;min-width:44px;gap:0}
.mp-account--compact>.mp-account-status,.mp-account-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.mp-account--compact>.mp-account-login{min-height:44px;padding:0 17px;border:1px solid rgba(167,199,255,.32);border-radius:999px;text-decoration:none;font-size:.85rem;font-weight:600;background:rgba(167,199,255,.07);white-space:nowrap}
.mp-account--compact>.mp-account-login:hover{background:rgba(167,199,255,.15);border-color:#a7c7ff}
.mp-account-disclosure{position:relative}
.mp-account-summary{display:flex;align-items:center;gap:9px;min-height:44px;padding:5px 9px 5px 6px;border:1px solid rgba(173,193,255,.2);border-radius:999px;background:rgba(11,17,30,.72);cursor:pointer;list-style:none}
.mp-account-summary::-webkit-details-marker{display:none}
.mp-account-summary:hover,.mp-account-disclosure[open]>.mp-account-summary{border-color:rgba(167,199,255,.6);background:#121c2d}
.mp-account-avatar{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:#a7c7ff;color:#0a1220;font-size:.8rem;font-weight:700}
.mp-account-summary>.mp-account-name{max-width:12ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;font-size:.84rem;font-weight:500}
.mp-account-chevron{width:6px;height:6px;margin:0 3px 3px;color:#a6b0c9;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);transition:transform .15s}
.mp-account-disclosure[open] .mp-account-chevron{transform:rotate(225deg)}
.mp-account-panel{position:absolute;inset-inline-end:0;top:calc(100% + 10px);z-index:20;width:min(18rem,calc(100vw - 100px));max-height:calc(100dvh - 110px);overflow-y:auto;padding:7px;border:1px solid rgba(173,193,255,.25);border-radius:14px;background:#101827}
.mp-account-panel>a,.mp-account-panel>button{display:flex;align-items:center;width:100%;min-height:44px;margin:0;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:#e9edf7;text-align:start;text-decoration:none;font:inherit;font-size:.86rem;line-height:1.4;cursor:pointer}
.mp-account-panel>a:hover,.mp-account-panel>button:hover{background:#1c2a40}
.mp-account-panel>.mp-account-logout{margin-top:5px;border-top:1px solid rgba(173,193,255,.16);border-radius:0 0 8px 8px;color:#b7c1d6}
.mp-account--compact>.mp-account-error{position:absolute;inset-inline-end:0;top:calc(100% + 10px);z-index:21;width:min(18rem,calc(100vw - 100px));padding:12px;border:1px solid #ad8490;border-radius:10px;background:#241c2c;color:#ffd2da}
@media(max-width:600px){.mp-account-summary{width:44px;padding:7px;border-radius:50%}.mp-account-summary>.mp-account-name,.mp-account-summary>.mp-account-chevron{display:none}.mp-account-avatar{width:28px;height:28px}.mp-account--compact>.mp-account-login{padding:0 12px}}
@media(prefers-reduced-motion:reduce){.mp-account-chevron{transition:none}}

.mp-account-caption{display:block;padding:10px 12px 12px;margin-bottom:3px;border-bottom:1px solid rgba(173,193,255,.16);color:#a6b0c9;font-size:.78rem;line-height:1.5;overflow-wrap:anywhere}