.velo-account { display: inline-flex; align-items: center; gap: 8px; font: 500 13px/1.2 Inter, "PingFang SC", "Microsoft YaHei", sans-serif; }
.velo-account button { min-height: 34px; padding: 0 12px; border: 1px solid rgba(116, 132, 151, .35); border-radius: 999px; background: rgba(255, 255, 255, .9); color: inherit; cursor: pointer; font: inherit; }
.velo-account button:hover { border-color: #2d77d0; }
.velo-account-name { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.velo-account-credits { padding: 4px 8px; border: 1px solid rgba(31, 101, 214, .28); border-radius: 999px; background: rgba(31, 101, 214, .08); color: #1f65d6; font-size: 12px; font-weight: 700; white-space: nowrap; }
.velo-account-dialog { width: min(420px, calc(100vw - 28px)); padding: 0; border: 1px solid #dce3ea; border-radius: 16px; color: #14233a; background: #fff; box-shadow: 0 24px 70px rgba(20, 35, 58, .2); }
.velo-account-dialog::backdrop { background: rgba(11, 23, 39, .56); }
.velo-account-panel { padding: 24px; font: 14px/1.5 Inter, "PingFang SC", "Microsoft YaHei", sans-serif; }
.velo-account-panel h2 { margin: 0 0 5px; font-size: 22px; }
.velo-account-eyebrow { margin: 0 0 3px; color: #1f65d6; font-size: 12px; font-weight: 700; letter-spacing: .03em; }
.velo-account-sub { margin: 0 0 18px; color: #68768a; }
.velo-account-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 16px; }
.velo-account-tabs button, .velo-account-submit { min-height: 40px; border: 1px solid #dce3ea; border-radius: 9px; background: #f5f8fb; color: #14233a; cursor: pointer; font: inherit; }
.velo-account-tabs button[aria-selected="true"] { border-color: #1f65d6; background: #1f65d6; color: #fff; }
.velo-account-field { display: grid; gap: 5px; margin: 11px 0; color: #68768a; font-size: 12px; }
/* Bulletproof the register-only field hiding: an author `display` rule above must
   never override the [hidden] attribute (e.g. in a browser/extension where UA
   `[hidden]{display:none}` is weaker), or login would wrongly show all four fields. */
.velo-account-field[hidden] { display: none; }
.velo-account-field input { width: 100%; height: 42px; padding: 0 11px; border: 1px solid #dce3ea; border-radius: 9px; background: #fff; color: #14233a; font: 14px inherit; }
.velo-account-submit { width: 100%; margin-top: 8px; border-color: #1f65d6; background: #1f65d6; color: #fff; font-weight: 700; }
.velo-account-submit:disabled { opacity: .55; cursor: wait; }
.velo-account-message { min-height: 21px; margin: 10px 0 0; color: #b23c48; font-size: 12px; }
.velo-account-close { position: absolute; top: 12px; right: 14px; border: 0; background: transparent; color: #68768a; cursor: pointer; font-size: 24px; }