/* Generated by tools/sync-account-menu.mjs; edit shared/account-menu.css. */
.am-trigger { display: inline-block; flex: none; max-width: 180px; min-height: 44px; padding: 9px 16px; border: 1px solid #495258; border-radius: 24px; background: rgb(255 255 255 / 3.5%); color: #f1f3f3; font: inherit; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.am-trigger:hover, .am-trigger[aria-expanded="true"] { background: rgb(255 255 255 / 7%); border-color: #89939a; }
.am-trigger:focus-visible { outline: 2px solid #d2e0e5; outline-offset: 4px; }
.am-trigger[hidden] { display: none !important; }
.am-popover { position: fixed; inset: auto; box-sizing: border-box; width: min(296px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; margin: 0; padding: 16px; border: 1px solid #495258; border-radius: 8px; background: #191d20; color: #f1f3f3; font-family: 'Google Sans Flex', 'Noto Sans TC', sans-serif; font-size: 14px; font-weight: 500; line-height: 1.5; letter-spacing: 0; box-shadow: 0 12px 36px rgb(0 0 0 / 28%); }
.am-popover:popover-open { animation: am-arrive 180ms ease-out; }
.am-heading { display: flex; align-items: center; gap: 8px; }
.am-name { flex: 1; min-width: 0; font-size: 17px; font-weight: 650; overflow-wrap: anywhere; }
.am-popover .am-close { display: grid; place-items: center; flex: none; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 4px; color: #acb5ba; background: transparent; cursor: pointer; }
.am-roles { display: flex; flex-wrap: wrap; gap: 8px; }
.am-role { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 3px 8px; border-radius: 6px; border: 1px solid; font-size: 12px; font-weight: 600; }
.am-role svg { width: 14px; height: 14px; }
.am-admin { color: #ff9bab; border-color: rgb(255 113 135 / 48%); background: rgb(146 33 52 / 22%); box-shadow: 0 0 18px rgb(255 72 103 / 15%); }
.am-creator { color: #a9d9ff; border-color: rgb(96 179 238 / 40%); background: rgb(96 179 238 / 8%); box-shadow: 0 0 18px rgb(96 179 238 / 12%); }
.am-state { margin: 8px 0 16px; color: #acb5ba; font-size: 12px; }
.am-popover .am-command { display: flex; align-items: center; justify-content: flex-start; gap: 12px; box-sizing: border-box; width: 100%; min-height: 44px; padding: 10px 8px; border: 0; border-top: 1px solid #303639; border-radius: 0; color: #f1f3f3; background: transparent; font: inherit; font-size: 14px; text-align: left; text-decoration: none; cursor: pointer; }
.am-popover .am-command svg { flex: none; }
.am-popover .am-signout { color: #ffabb3; }
.am-popover .am-command:hover, .am-popover .am-close:hover { background: rgb(255 255 255 / 5%); }
.am-popover :is(button,a):focus-visible { outline: 2px solid #d2e0e5; outline-offset: 2px; }
.am-popover button:disabled { opacity: .5; cursor: wait; }
.am-status { margin: 8px 0 0; color: #ffabb3; font-size: 12px; overflow-wrap: anywhere; }
.am-status:empty { display: none; }
@keyframes am-arrive { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) { .am-trigger { max-width: 140px; padding-inline: 12px; } }
@media (max-width: 380px) { .am-trigger { max-width: 126px; } }