.account-page { max-width: 1040px; margin: 0 auto 20px; }
.account-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.account-eyebrow { color: var(--blue); font-size: 11px; margin: 0 0 4px; }
.account-heading h1 { font-size: 26px; margin: 0 0 6px; }
.account-description { color: var(--ink-2); font-size: 12px; margin: 0; }
.account-nav { display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid var(--line); padding-bottom: 12px; margin-bottom: 16px; }
.account-nav a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 8px; color: var(--ink-2); text-decoration: none; font-size: 12px; }
.account-nav a:hover { color: var(--blue); background: rgba(var(--theme-secondary-rgb), .06); }
.account-nav a[aria-current="page"] { background: var(--blue); color: white; }
.account-page .btn { font-size: 12px; }
.account-content > .container { padding: 0; max-width: none; }
.account-content .row { --bs-gutter-x: 14px; --bs-gutter-y: 12px; }
.account-profile .account-content > .row > .col-md-8,
.account-password .account-content > .container > .row > .col-md-6,
.account-security .account-content > .row > .col-md-6 { width: 100%; max-width: 700px; }
.account-page .card-header { padding: 12px 16px; color: var(--ink) !important; }
.account-page .card-header h4 { font-size: 16px; }
.account-page .card-header .bi { color: var(--blue); }
.account-page .card-body, .account-page .card-body.p-4 { padding: 16px !important; }
.account-page .card-footer { padding: 10px 16px; }
.account-page .form-label { font-size: 12px; margin-bottom: 6px; }
.account-page .form-control, .account-page .form-select { font-size: 13px; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); color: var(--ink); }
.account-page .form-text, .account-page .small { font-size: 11px; }
.account-page .alert { padding: 10px 12px; font-size: 12px; line-height: 1.7; }
.account-page .mb-3 { margin-bottom: 12px !important; }
.account-password .card-body > p { color: var(--ink-2); font-size: 12px; }
.account-password .form-control-plaintext { background: rgba(var(--theme-secondary-rgb), .06) !important; color: var(--ink); font-size: 13px; border: 0; }
.account-profile .avatar-preview-container { position: relative; overflow: hidden; border-radius: 50%; border: 2px solid var(--line); display: inline-block; }
.account-profile .avatar-preview-container img { width: 100%; height: 100%; display: block; object-fit: cover; }
.account-profile .account-avatar-stage { max-width: 100%; border-color: var(--line) !important; background: var(--paper) !important; }
.account-profile #avatar-preview-container { padding: 12px; border-radius: 10px; background: rgba(var(--theme-secondary-rgb), .04); }
.account-profile #avatar-preview-container p { font-size: 11px; color: var(--ink-2); }
.account-profile .img-thumbnail { border-color: var(--line); background: var(--card); }
.account-about .card-body.text-center { background: linear-gradient(115deg, rgba(var(--theme-secondary-rgb), .06), var(--brand-soft)); padding: 22px 16px !important; }
.account-about .card-body h4 { font-family: var(--sans); font-size: 14px; }
.account-about .card-body { font-size: 13px; line-height: 1.7; }
.account-about .card-header h3 { font-size: 16px; }
.account-about .card h5 { font-size: 14px; }
.account-mcp .mcp-settings-shell { max-width: none; padding-bottom: 0 !important; }
.account-mcp .card { margin-bottom: 14px !important; }
.account-mcp .mcp-config-box { border-radius: 10px; overflow: hidden; }
.account-mcp pre { max-width: 100%; overflow-x: auto; font-size: 12px; }
.account-mcp h4 { font-size: 17px; }
.account-mcp h5 { font-size: 15px; }
.account-mcp p, .account-mcp li { font-size: 12px; line-height: 1.7; }
.account-mcp .nav-link { font-size: 12px; }
.account-mcp .nav-link.active { background: var(--blue); color: white; }
@media (max-width: 600px) {
 .account-nav { gap: 4px; }
 .account-nav a { padding: 7px 9px; }
 .account-page .card-body, .account-page .card-body.p-4 { padding: 14px !important; }
 .account-about .d-flex > span:last-child { min-width: 0; overflow-wrap: anywhere; }
}
.account-profile form > .row:first-of-type > .col-md-6 { width: 100%; }
/* 账户中心：导航标签与页头依次入场，卡片入场由 motion.css 负责。 */
.account-page .account-nav > * { animation: fttSlideInStart var(--motion-duration) var(--motion-ease) backwards; }
.account-page .account-nav > *:nth-child(2) { animation-delay: calc(var(--motion-stagger-step) * 1); }
.account-page .account-nav > *:nth-child(3) { animation-delay: calc(var(--motion-stagger-step) * 2); }
.account-page .account-nav > *:nth-child(n + 4) { animation-delay: calc(var(--motion-stagger-step) * 3); }
.account-page .account-heading { animation: fttFadeIn var(--motion-duration-slow) var(--motion-ease) backwards; }
.account-page .account-eyebrow,
.account-page .account-description { animation: fttFadeIn var(--motion-duration-slow) var(--motion-ease) 0.08s backwards; }

/* ------------------------------------------------------------------ 更新日志徽标 */
/* 不使用 Bootstrap 的 bg-* 语义色。主题层 handbook.css 只覆盖了
   bg-primary/success/danger/warning/info/secondary 六种，一旦用到 bg-dark 就会落到
   Bootstrap 的 .bg-dark(#212529) 背景，而徽标文字色来自 handbook 的
   .badge{color:var(--slate)} 即 --theme-text(#18191c)，近黑字压近黑底对比度不足
   1.1:1，字完全看不清。这里改为页面自有的淡色底 + 同色深字，每类对比度均 >= 4.5:1，
   同时显式处理垂直居中与等宽对齐。 */
.account-about .update-log-card .log-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* 父行是 .d-flex，默认 align-items:stretch 会把徽标拉满整行高度，
       文字便贴顶而不居中；贴紧自身高度后文字才会在框内居中。 */
    align-self: flex-start;
    flex: 0 0 auto;
    min-width: 86px;
    padding: 3px 10px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}

.account-about .log-badge--feature  { background: rgba(22, 163, 74, 0.12);  color: #166534; border-color: rgba(22, 163, 74, 0.24); }
.account-about .log-badge--improve  { background: rgba(0, 174, 236, 0.12);  color: #0369a1; border-color: rgba(0, 174, 236, 0.24); }
.account-about .log-badge--ui       { background: rgba(251, 114, 153, 0.14); color: #be185d; border-color: rgba(251, 114, 153, 0.28); }
.account-about .log-badge--fix      { background: rgba(220, 38, 38, 0.10);  color: #b91c1c; border-color: rgba(220, 38, 38, 0.22); }
.account-about .log-badge--security { background: rgba(124, 58, 237, 0.12); color: #6d28d9; border-color: rgba(124, 58, 237, 0.24); }
.account-about .log-badge--deploy   { background: rgba(217, 119, 6, 0.12);  color: #92400e; border-color: rgba(217, 119, 6, 0.24); }
.account-about .log-badge--docs     { background: #eef0f2;                  color: #4b5563; border-color: #e2e5e9; }