.creator-account-popover { position: fixed; z-index: 100; padding: 12px; border: 1px solid #d8cdbb; border-radius: 9px; background: #fffaf0; box-shadow: 0 8px 24px rgba(36,59,74,.16); color: #243b4a; font-family: Georgia, 'Times New Roman', serif; }
.creator-account-popover[hidden] { display: none; }
.creator-account-signout-notice { position: fixed; z-index: 101; display: grid; gap: 12px; width: min(240px, calc(100vw - 32px)); padding: 16px; border: 1px solid #d8cdbb; border-radius: 9px; background: #fffaf0; box-shadow: 0 8px 24px rgba(36,59,74,.16); color: #243b4a; font-family: Georgia, 'Times New Roman', serif; }
.creator-account-signout-notice p { margin: 0; }
.creator-account-signout-notice button { justify-self: end; min-height: 34px; padding: 7px 12px; border: 1px solid #234a73; border-radius: 5px; background: #234a73; color: #fffaf0; font: 700 .83rem/1.2 Inter,Arial,sans-serif; cursor: pointer; }
.creator-account-signout-notice button:hover, .creator-account-signout-notice button:focus-visible { background: #315f8d; }
.creator-account-signout-notice button:focus-visible { outline: 3px solid rgba(177,202,210,.85); outline-offset: 2px; }
.creator-account-trigger { display: inline-flex; align-items: center; justify-content: center; width: 36px; min-width: 36px; height: 36px; min-height: 36px; padding: 0; border: 1px solid rgba(35,74,115,.58); border-radius: 50%; background: #fffaf0; color: #234a73; cursor: pointer; }
.creator-account-trigger:hover, .creator-account-trigger:focus-visible { border-color: #234a73; background: #f3efe6; }
.creator-account-trigger:focus-visible { outline: 3px solid rgba(177,202,210,.85); outline-offset: 2px; }
.creator-account-trigger.is-authenticated { border-color: #234a73; background: #234a73; color: #fffaf0; }
.creator-account-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; pointer-events: none; }
.creator-account-popover-content { display: grid; gap: 10px; }
.creator-account-choices { display: grid; gap: 7px; }
.creator-account-popover button, .creator-account-page { min-height: 34px; padding: 7px 10px; border: 1px solid #234a73; border-radius: 5px; background: #234a73; color: #fffaf0; font: 700 .83rem/1.2 Inter,Arial,sans-serif; text-align: center; text-decoration: none; cursor: pointer; }
.creator-account-page, .creator-account-back { background: transparent !important; color: #234a73 !important; }
.creator-account-recovery-link { min-height: 0 !important; padding: 1px 0 !important; border: 0 !important; background: transparent !important; color: #234a73 !important; font-size: .78rem !important; text-align: left !important; text-decoration: underline; }
.creator-account-popover button:hover, .creator-account-popover button:focus-visible, .creator-account-popover a:hover, .creator-account-popover a:focus-visible { background: #315f8d; color: #fffaf0; }
.creator-account-popover button:focus-visible, .creator-account-popover a:focus-visible, .creator-account-popover input:focus-visible, .creator-account-popover textarea:focus-visible { outline: 3px solid rgba(177,202,210,.85); outline-offset: 2px; }
.creator-account-form { display: grid; gap: 8px; }
.creator-account-form label { display: grid; gap: 4px; color: #243b4a; font: 700 .8rem/1.2 Inter,Arial,sans-serif; }
.creator-account-form label span { font-weight: 400; }
.creator-account-form label small, .creator-account-key-note { color: #5f594f; font: .75rem/1.3 Inter,Arial,sans-serif; font-weight: 400; }
.creator-account-form input, .creator-account-form textarea { width: 100%; min-height: 34px; padding: 6px 8px; border: 1px solid #b9ad99; border-radius: 5px; background: #fffdf8; color: #243b4a; font: .86rem/1.2 Inter,Arial,sans-serif; }
.creator-account-form textarea { min-height: 58px; resize: vertical; }
.creator-account-form > div { display: flex; justify-content: flex-end; gap: 7px; }
.creator-account-credential-mode { display: grid; gap: 5px; margin: 0; padding: 7px; border: 1px solid #d8cdbb; border-radius: 5px; }
.creator-account-credential-mode legend { padding: 0 3px; color: #243b4a; font: 700 .75rem/1.2 Inter,Arial,sans-serif; }
.creator-account-credential-mode label { display: flex; align-items: center; gap: 6px; font-weight: 400; }
.creator-account-credential-mode input { width: auto; min-height: 0; padding: 0; }
.creator-account-password-fields { display: grid; gap: 8px; }
.creator-account-name { margin: 0; color: #234a73; font: 700 .95rem/1.2 Inter,Arial,sans-serif; }
.creator-account-message { min-height: 1.2em; margin: 0; color: #8b3d32; font: .78rem/1.3 Inter,Arial,sans-serif; }
.creator-account-key-label, .creator-account-key-help { margin: 0; font: .8rem/1.35 Inter,Arial,sans-serif; }
.creator-account-key-note { margin: 0; }
.creator-account-key-label { color: #234a73; font-weight: 700; }
.creator-account-key { display: block; overflow-wrap: anywhere; padding: 7px; border: 1px solid #d8cdbb; border-radius: 5px; background: #fffdf8; color: #243b4a; font: .76rem/1.35 ui-monospace, SFMono-Regular, Consolas, monospace; }