:root {
  color-scheme:dark;
  --bg:#080b12; --surface:#101725; --surface-2:#151e2f; --surface-3:#1b2639;
  --text:#f4f7fb; --muted:#9ba9bc; --quiet:#718096; --border:#263349;
  --gold:#e0b93d; --gold-soft:rgba(224,185,61,.11); --success:#34d399; --danger:#fb7185; --warning:#fbbf24;
  --shadow:0 24px 70px rgba(0,0,0,.35); --radius:16px;
  --scrollbar-thumb:rgba(148,163,184,.34); --scrollbar-thumb-hover:rgba(224,185,61,.52); --scrollbar-track:rgba(255,255,255,.025);
  font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",system-ui,sans-serif;
}
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scrollbar-width:thin; scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track); }
*::-webkit-scrollbar { width:9px; height:9px; }
*::-webkit-scrollbar-track { background:var(--scrollbar-track); }
*::-webkit-scrollbar-thumb { min-height:44px; border:2px solid transparent; border-radius:99px; background:var(--scrollbar-thumb); background-clip:padding-box; }
*::-webkit-scrollbar-thumb:hover { background:var(--scrollbar-thumb-hover); background-clip:padding-box; }
*::-webkit-scrollbar-corner { background:transparent; }
*::-webkit-scrollbar-button { display:none; width:0; height:0; }
html,body { min-height:100%; margin:0; }
body { background:var(--bg); color:var(--text); font-size:14px; line-height:1.5; }
button,input,select { font:inherit; }
button { cursor:pointer; }
a { color:inherit; }
:is(button,a,input,select):focus-visible { outline:2px solid #f6d365; outline-offset:2px; }
.account-app { min-height:100dvh; background:radial-gradient(circle at 12% -8%,rgba(224,185,61,.08),transparent 24%),var(--bg); }
.account-topbar { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:68px; padding:10px clamp(18px,3vw,42px); border-bottom:1px solid var(--border); background:rgba(8,11,18,.94); backdrop-filter:blur(14px); }
.account-brand { display:inline-flex; align-items:center; gap:11px; text-decoration:none; }
.account-brand-mark { display:grid; place-items:center; width:38px; height:38px; border:1px solid rgba(224,185,61,.35); border-radius:11px; color:var(--gold); background:var(--gold-soft); }
.account-brand svg,.account-nav svg,.logout-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.account-brand > span:last-child { display:grid; gap:1px; }
.account-brand strong { font-size:15px; }
.account-brand small { color:var(--quiet); font-size:11px; }
.account-topbar-actions { display:flex; align-items:center; gap:8px; }
.button,.icon-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border:1px solid transparent; border-radius:10px; padding:0 14px; text-decoration:none; font-weight:650; transition:background-color .18s ease,border-color .18s ease,opacity .18s ease; }
.button.primary { color:#171407; background:var(--gold); }
.button.secondary { color:var(--text); border-color:var(--border); background:var(--surface-2); }
.button.quiet { color:var(--muted); background:transparent; }
.button.danger { color:#fecdd3; border-color:rgba(251,113,133,.3); background:rgba(251,113,133,.08); }
.button:disabled { cursor:not-allowed; opacity:.48; }
.icon-button { display:none; width:44px; padding:0; color:var(--muted); background:var(--surface-2); font-size:25px; }

.account-layout { display:grid; grid-template-columns:260px minmax(0,1fr); width:min(100%,1440px); min-height:calc(100dvh - 68px); margin:0 auto; }
.account-sidebar { position:sticky; top:68px; display:flex; flex-direction:column; height:calc(100dvh - 68px); padding:24px 18px; border-right:1px solid var(--border); }
.account-identity { display:grid; grid-template-columns:48px minmax(0,1fr); align-items:center; gap:12px; min-height:70px; padding:10px; }
.user-avatar { display:grid; place-items:center; width:48px; height:48px; overflow:hidden; border:1px solid rgba(224,185,61,.35); border-radius:14px; color:var(--gold); background:var(--gold-soft); font-size:18px; font-weight:800; }
.user-avatar img { width:100%; height:100%; object-fit:cover; }
.account-identity strong,.account-identity small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-identity strong { font-size:14px; }
.account-identity small { margin-top:3px; color:var(--quiet); font-size:11px; }
.skeleton { display:block; border-radius:8px; background:linear-gradient(90deg,var(--surface-2),var(--surface-3),var(--surface-2)); background-size:200% 100%; animation:skeleton 1.3s ease infinite; }
.skeleton.avatar { width:48px; height:48px; border-radius:14px; }
.skeleton.line { width:120px; height:12px; margin:5px 0; }.skeleton.line.short { width:74px; }
@keyframes skeleton { to { background-position:-200% 0; } }
.account-nav { display:grid; gap:5px; margin-top:20px; }
.account-nav button,.logout-button { display:flex; align-items:center; gap:11px; width:100%; min-height:46px; border:1px solid transparent; border-radius:11px; padding:0 12px; color:var(--muted); background:transparent; text-align:left; }
.account-nav button:hover { color:var(--text); background:var(--surface-2); }
.account-nav button[aria-current="page"] { color:#f8e8ac; border-color:rgba(224,185,61,.24); background:var(--gold-soft); }
.logout-button { margin-top:auto; color:#fda4af; }
.logout-button:hover { background:rgba(251,113,133,.08); }

.account-content { min-width:0; padding:clamp(24px,4vw,52px); }
.content-header { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; max-width:1080px; margin:0 auto 26px; }
.eyebrow { margin:0 0 7px; color:var(--gold); font-size:11px; font-weight:750; letter-spacing:.09em; }
.content-header h1 { margin:0; font-size:clamp(25px,3vw,34px); letter-spacing:-.025em; }
.content-header p:last-child { margin:7px 0 0; color:var(--muted); }
.sync-status { display:inline-flex; align-items:center; min-height:30px; border:1px solid var(--border); border-radius:99px; padding:0 10px; color:var(--quiet); background:var(--surface); font-size:11px; white-space:nowrap; }
.sync-status.ready { color:#a7f3d0; border-color:rgba(52,211,153,.28); background:rgba(52,211,153,.07); }
.content-body { max-width:1080px; margin:0 auto; }
.page-loading,.empty-state { display:grid; place-items:center; gap:12px; min-height:280px; border:1px solid var(--border); border-radius:var(--radius); color:var(--muted); background:var(--surface); }
.page-loading span { width:28px; height:28px; border:3px solid var(--border); border-top-color:var(--gold); border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

.overview-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr); gap:14px; }
.panel { min-width:0; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.panel-body { padding:20px; }
.membership-card { position:relative; min-height:220px; overflow:hidden; padding:26px; background:linear-gradient(145deg,#171d28,#111827 65%); }
.membership-card::after { content:""; position:absolute; right:-60px; top:-90px; width:260px; height:260px; border:1px solid rgba(224,185,61,.18); border-radius:50%; box-shadow:0 0 0 46px rgba(224,185,61,.03); }
.membership-card > * { position:relative; z-index:1; }
.membership-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.plan-badge,.status-badge { display:inline-flex; align-items:center; min-height:28px; border:1px solid rgba(224,185,61,.3); border-radius:99px; padding:0 10px; color:#f5dc80; background:var(--gold-soft); font-size:11px; font-weight:750; }
.membership-card h2 { margin:22px 0 4px; font-size:34px; }
.membership-card p { margin:0; color:var(--muted); }
.membership-facts { display:flex; flex-wrap:wrap; gap:24px; margin-top:28px; }
.membership-facts span,.metric span,.info-row span { display:block; color:var(--quiet); font-size:11px; }
.membership-facts strong,.metric strong,.info-row strong { display:block; margin-top:4px; font-variant-numeric:tabular-nums; }
.quick-actions { display:grid; align-content:start; gap:10px; padding:20px; }
.quick-actions h2,.section-heading h2 { margin:0; font-size:17px; }
.quick-actions p,.section-heading p { margin:4px 0 10px; color:var(--muted); font-size:12px; }
.quick-action { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:54px; border:1px solid var(--border); border-radius:11px; padding:0 13px; color:var(--text); background:var(--surface-2); text-decoration:none; }
.quick-action small { color:var(--quiet); }
.metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:14px; }
.metric { padding:18px; }
.metric strong { font-size:18px; }
.section-stack { display:grid; gap:16px; }
.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 20px 0; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:20px; }
.form-field { display:grid; gap:7px; }
.form-field.full { grid-column:1/-1; }
.form-field > span { color:#dce4ef; font-size:12px; font-weight:650; }
.form-field input,.form-field select { width:100%; min-height:46px; border:1px solid var(--border); border-radius:10px; padding:0 12px; color:var(--text); background:#0c1320; }
.form-field input:focus,.form-field select:focus { border-color:var(--gold); outline:0; box-shadow:0 0 0 3px rgba(224,185,61,.1); }
.field-help { margin:0; color:var(--quiet); font-size:11px; }
.form-actions { display:flex; justify-content:flex-end; gap:8px; padding:0 20px 20px; }
.profile-avatar-editor { display:flex; align-items:center; gap:16px; padding:20px; border-bottom:1px solid var(--border); }
.profile-avatar-editor .user-avatar { width:72px; height:72px; border-radius:20px; font-size:25px; }
.info-list { display:grid; }
.info-row { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:62px; padding:10px 20px; border-bottom:1px solid var(--border); }
.info-row:last-child { border-bottom:0; }
.info-row strong { text-align:right; overflow-wrap:anywhere; }

/* Account security center */
.security-page { gap:24px; }
.security-overview { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; padding:24px; overflow:hidden; background:linear-gradient(135deg,rgba(224,185,61,.1),var(--surface) 54%); }
.security-overview-icon,.security-card-icon,.security-action-icon,.dialog-title-icon { display:grid; place-items:center; flex:0 0 auto; color:var(--gold); border:1px solid rgba(224,185,61,.28); background:var(--gold-soft); }
.security-overview-icon { width:58px; height:58px; border-radius:17px; }
.security-overview svg,.security-contact-card svg,.security-action-row svg,.security-dialog svg,.captcha-dialog svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.security-kicker { color:var(--gold); font-size:11px; font-weight:750; letter-spacing:.06em; }
.security-overview h2 { margin:4px 0 3px; font-size:22px; }
.security-overview p { max-width:680px; margin:0; color:var(--muted); font-size:12px; }
.security-overview-action { align-self:center; white-space:nowrap; }
.security-checks { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.security-checks span,.security-state,.security-primary-method { display:inline-flex; align-items:center; gap:5px; min-height:28px; border:1px solid rgba(251,191,36,.24); border-radius:99px; padding:0 9px; color:#fde68a; background:rgba(251,191,36,.07); font-size:11px; font-weight:700; white-space:nowrap; }
.security-checks span.done,.security-state.success { color:#a7f3d0; border-color:rgba(52,211,153,.26); background:rgba(52,211,153,.07); }
.security-state.warning { color:#fde68a; }
.security-checks svg,.security-state svg { width:14px; height:14px; }
.security-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 2px 12px; }
.security-section-heading h2 { margin:0; font-size:17px; }
.security-section-heading p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.security-primary-method { color:var(--muted); border-color:var(--border); background:var(--surface); }
.security-contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.security-contact-card { display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; min-width:0; min-height:190px; border:1px solid var(--border); border-radius:var(--radius); padding:20px; background:var(--surface); transition:border-color .18s ease,background-color .18s ease; }
.security-contact-card:hover { border-color:#35445e; background:var(--surface-2); }
.security-card-icon { width:44px; height:44px; border-radius:13px; }
.security-card-copy { min-width:0; }
.security-card-title { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.security-card-title h3,.security-action-row h3 { margin:0; font-size:15px; }
.security-card-copy > strong { display:block; max-width:100%; margin-top:13px; overflow-wrap:anywhere; color:var(--text); font-size:16px; }
.security-card-copy > p,.security-action-row p { margin:5px 0 0; color:var(--muted); font-size:12px; }
.security-contact-card > .button { grid-column:1/-1; justify-self:end; align-self:end; min-width:112px; }
.security-action-list { overflow:hidden; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.security-action-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:14px; min-height:96px; padding:18px 20px; }
.security-action-row + .security-action-row { border-top:1px solid var(--border); }
.security-action-icon { width:42px; height:42px; border-radius:12px; }
.security-action-icon.danger { color:#fda4af; border-color:rgba(251,113,133,.28); background:rgba(251,113,133,.08); }
.security-action-row.danger-zone { grid-template-columns:auto minmax(0,1fr) auto; background:linear-gradient(90deg,rgba(251,113,133,.045),transparent 54%); }

.security-dialog,.captcha-dialog { width:min(calc(100% - 32px),540px); max-height:min(820px,calc(100dvh - 32px)); overflow:auto; border:1px solid var(--border); border-radius:18px; padding:0; color:var(--text); background:var(--surface); box-shadow:var(--shadow); }
.security-dialog::backdrop,.captcha-dialog::backdrop { background:rgba(3,6,12,.78); backdrop-filter:blur(5px); }
.security-sheet,.captcha-sheet { display:grid; margin:0; }
.dialog-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:24px 24px 20px; border-bottom:1px solid var(--border); }
.dialog-title-group { display:flex; align-items:flex-start; gap:13px; min-width:0; }
.dialog-title-icon { width:42px; height:42px; border-radius:12px; }
.dialog-eyebrow { margin:0 0 3px!important; color:var(--gold)!important; font-size:10px!important; font-weight:750; letter-spacing:.08em; }
.dialog-header h2 { margin:0; font-size:20px; }
.dialog-header p { margin:5px 0 0; color:var(--muted); font-size:12px; }
.dialog-close,.password-toggle { display:grid; place-items:center; flex:0 0 auto; border:1px solid var(--border); color:var(--muted); background:var(--surface-2); }
.dialog-close { width:42px; height:42px; border-radius:11px; font-size:24px; line-height:1; }
.dialog-close:hover,.password-toggle:hover { color:var(--text); border-color:#3b4b66; }
.dialog-step { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; margin:20px 24px 0; border:1px solid rgba(224,185,61,.18); border-radius:12px; padding:11px 13px; background:var(--gold-soft); }
.dialog-step > span { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#171407; background:var(--gold); font-size:11px; font-weight:800; }
.dialog-step strong { font-size:12px; }.dialog-step small { color:var(--muted); font-size:10px; }
.dialog-form { display:grid; gap:17px; padding:20px 24px; }
.current-binding { display:flex; align-items:center; justify-content:space-between; gap:16px; border:1px solid var(--border); border-radius:11px; padding:12px 13px; background:var(--surface-2); }
.current-binding span { color:var(--quiet); font-size:11px; }.current-binding strong { overflow-wrap:anywhere; font-size:12px; text-align:right; }
.verification-input,.password-input { position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.verification-input .button { min-width:112px; }
.password-input { gap:0; }
.password-input input { padding-right:52px; }
.password-toggle { position:absolute; top:2px; right:2px; width:42px; height:42px; border:0; border-left:1px solid var(--border); border-radius:0 8px 8px 0; }
.password-toggle svg { width:18px; height:18px; }
.field-error { min-height:0; color:#fda4af; font-size:11px; }
.field-error:empty { display:none; }
.form-field input[aria-invalid="true"] { border-color:rgba(251,113,133,.78); box-shadow:0 0 0 3px rgba(251,113,133,.09); }
.form-field input[readonly] { color:var(--muted); background:var(--surface-2); }
.dialog-message { display:none; min-height:42px; border:1px solid var(--border); border-radius:10px; padding:10px 12px; color:var(--muted); background:var(--surface-2); font-size:12px; }
.dialog-message:not(:empty) { display:block; }
.dialog-message.error { color:#fecdd3; border-color:rgba(251,113,133,.3); background:rgba(251,113,133,.07); }
.dialog-message.success { color:#a7f3d0; border-color:rgba(52,211,153,.28); background:rgba(52,211,153,.07); }
.dialog-actions { display:flex; justify-content:flex-end; gap:8px; padding:16px 24px 24px; border-top:1px solid var(--border); }
.password-rules { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin:0; padding:0; list-style:none; }
.password-rules li { display:flex; align-items:center; gap:5px; color:var(--quiet); font-size:10px; }
.password-rules li::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--quiet); }
.password-rules li[data-state="valid"] { color:#a7f3d0; }.password-rules li[data-state="valid"]::before { background:var(--success); }
.security-impact-note { display:flex; align-items:flex-start; gap:9px; border:1px solid rgba(251,191,36,.2); border-radius:10px; padding:11px 12px; color:#fde68a; background:rgba(251,191,36,.06); font-size:11px; }
.security-impact-note svg { flex:0 0 auto; width:17px; height:17px; }
.logout-impact { margin:22px 24px; border:1px solid rgba(251,113,133,.24); border-radius:13px; padding:17px; background:rgba(251,113,133,.055); }
.logout-impact h3 { margin:0 0 12px; font-size:14px; }
.logout-impact ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:0; padding:0; list-style:none; color:#fecdd3; font-size:12px; }
.logout-impact li { display:flex; align-items:center; gap:7px; }.logout-impact li svg { width:15px; height:15px; }
.logout-impact p { margin:14px 0 0; color:var(--muted); font-size:11px; }
.button.danger.solid { color:#fff; border-color:#be4055; background:#b93b51; }
.captcha-sheet { padding:0; }
.captcha-sheet > .form-field { margin:18px 24px; }
.captcha-image { display:grid; place-items:center; min-height:112px; margin:20px 24px 0; overflow:hidden; border:1px solid var(--border); border-radius:12px; background:#fff; }
.captcha-image svg { width:100%; max-width:260px; height:96px; }

.plan-switch { display:inline-grid; grid-template-columns:repeat(2,1fr); gap:3px; padding:3px; border-radius:10px; background:var(--surface-2); }
.plan-switch button { min-height:36px; border:0; border-radius:8px; padding:0 14px; color:var(--muted); background:transparent; }
.plan-switch button.active { color:var(--text); background:var(--surface-3); }
.plan-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:20px; }
.plan-card { display:grid; gap:15px; min-width:0; border:1px solid var(--border); border-radius:14px; padding:20px; background:var(--surface-2); }
.plan-card.recommended { border-color:rgba(224,185,61,.45); background:linear-gradient(145deg,rgba(224,185,61,.08),var(--surface-2)); }
.plan-card header { display:flex; justify-content:space-between; gap:12px; }
.plan-card h3 { margin:0; font-size:20px; }.plan-card p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.plan-price { font-size:30px; font-weight:800; }.plan-price small { color:var(--muted); font-size:12px; font-weight:500; }
.plan-features { display:grid; gap:8px; margin:0; padding:0; list-style:none; color:var(--muted); font-size:12px; }
.plan-features li::before { content:"✓"; margin-right:8px; color:var(--success); }
.order-list { display:grid; gap:10px; padding:20px; }
.order-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:16px; min-height:70px; border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--surface-2); }
.order-row strong,.order-row small { display:block; }.order-row small { margin-top:4px; color:var(--quiet); }
.order-amount { text-align:right; font-variant-numeric:tabular-nums; }
.status-badge.paid { color:#a7f3d0; border-color:rgba(52,211,153,.28); background:rgba(52,211,153,.07); }
.status-badge.failed { color:#fecdd3; border-color:rgba(251,113,133,.28); background:rgba(251,113,133,.07); }
.referral-code { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:20px; }
.referral-code input { min-height:46px; border:1px solid var(--border); border-radius:10px; padding:0 12px; color:var(--text); background:#0c1320; }

.toast-host { position:fixed; right:18px; bottom:18px; z-index:100; display:grid; gap:8px; }
.toast { max-width:360px; border:1px solid var(--border); border-radius:11px; padding:11px 14px; color:var(--text); background:var(--surface-3); box-shadow:var(--shadow); }
.toast.error { border-color:rgba(251,113,133,.35); }
.payment-dialog { width:min(calc(100% - 32px),560px); max-height:min(820px,calc(100dvh - 32px)); overflow:auto; border:1px solid var(--border); border-radius:18px; padding:0; color:var(--text); background:var(--surface); box-shadow:var(--shadow); }
.payment-dialog::backdrop { background:rgba(3,6,12,.74); backdrop-filter:blur(5px); }
.payment-sheet { display:grid; gap:18px; padding:24px; }
.payment-sheet header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }.payment-sheet h2 { margin:0; font-size:21px; }.payment-sheet p { margin:5px 0 0; color:var(--muted); }
.payment-qr { display:grid; place-items:center; min-height:210px; border-radius:14px; background:#fff; }.payment-qr img { width:200px; height:200px; }
.payment-detail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.payment-detail div { min-width:0; padding:12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); }.payment-detail span,.payment-detail strong { display:block; }.payment-detail span { color:var(--quiet); font-size:11px; }.payment-detail strong { margin-top:5px; overflow-wrap:anywhere; }
.payment-address { grid-column:1/-1; }.payment-actions { display:flex; justify-content:flex-end; gap:8px; }

body.account-embedded .account-topbar { min-height:62px; }
body.account-embedded .account-brand small,body.account-embedded .account-topbar-actions > a { display:none; }
body.account-embedded .icon-button { display:inline-flex; }
body.account-admin-embedded .account-topbar-actions .icon-button { display:none; }
body.account-embedded .account-layout { min-height:calc(100dvh - 62px); }
body.account-embedded .account-sidebar { top:62px; height:calc(100dvh - 62px); }

/* 主站嵌入模式复用账户逻辑，但继承主站的克制浅色产品语言。 */
body.account-main-embedded:not(.account-main-dark) {
  color-scheme:light;
  --bg:#faf8f3; --surface:#ffffff; --surface-2:#f3f0e8; --surface-3:#eae6dc;
  --text:#1c1b19; --muted:#625e56; --quiet:#777268; --border:#e3ded3;
  --gold:#2f5d54; --gold-soft:#e4eeea; --success:#277158; --danger:#b2434f; --warning:#9a6816;
  --shadow:0 8px 24px rgba(28,27,25,.12);
  --scrollbar-thumb:rgba(47,93,84,.28); --scrollbar-thumb-hover:rgba(47,93,84,.52); --scrollbar-track:rgba(47,93,84,.035);
}
body.account-main-embedded:not(.account-main-dark) .account-app { background:var(--bg); }
body.account-main-embedded:not(.account-main-dark) .account-topbar { background:rgba(250,248,243,.96); }
body.account-main-embedded:not(.account-main-dark) .account-brand-mark,
body.account-main-embedded:not(.account-main-dark) .user-avatar { border-color:rgba(47,93,84,.25); }
body.account-main-embedded:not(.account-main-dark) .button.primary { color:#fff; }
body.account-main-embedded:not(.account-main-dark) .account-nav button[aria-current="page"] { color:var(--accent,#234841); border-color:rgba(47,93,84,.2); }
body.account-main-embedded:not(.account-main-dark) .membership-card { background:#fff; }
body.account-main-embedded:not(.account-main-dark) .membership-card::after { border-color:rgba(47,93,84,.14); box-shadow:0 0 0 46px rgba(47,93,84,.025); }
body.account-main-embedded:not(.account-main-dark) .plan-badge,
body.account-main-embedded:not(.account-main-dark) .status-badge { color:#234841; border-color:rgba(47,93,84,.24); }
body.account-main-embedded:not(.account-main-dark) .form-field > span { color:var(--text); }
body.account-main-embedded:not(.account-main-dark) .form-field input,
body.account-main-embedded:not(.account-main-dark) .form-field select,
body.account-main-embedded:not(.account-main-dark) .referral-code input { color:var(--text); background:#fff; }
body.account-main-embedded:not(.account-main-dark) .form-field input:focus,
body.account-main-embedded:not(.account-main-dark) .form-field select:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(47,93,84,.1); }
body.account-main-embedded:not(.account-main-dark) .status-badge.paid,
body.account-main-embedded:not(.account-main-dark) .sync-status.ready { color:#1f6a50; }
body.account-main-embedded:not(.account-main-dark) .button.danger,
body.account-main-embedded:not(.account-main-dark) .logout-button { color:#a63b48; }
body.account-main-embedded:not(.account-main-dark) .security-overview { background:linear-gradient(135deg,rgba(47,93,84,.08),#fff 58%); }
body.account-main-embedded:not(.account-main-dark) .security-overview-icon,
body.account-main-embedded:not(.account-main-dark) .security-card-icon,
body.account-main-embedded:not(.account-main-dark) .security-action-icon,
body.account-main-embedded:not(.account-main-dark) .dialog-title-icon { border-color:rgba(47,93,84,.24); }
body.account-main-embedded:not(.account-main-dark) .security-contact-card:hover { border-color:rgba(47,93,84,.35); }
body.account-main-embedded:not(.account-main-dark) .security-kicker,
body.account-main-embedded:not(.account-main-dark) .dialog-eyebrow { color:#2f5d54!important; }
body.account-main-embedded:not(.account-main-dark) .security-checks span,
body.account-main-embedded:not(.account-main-dark) .security-state.warning { color:#85550d; border-color:rgba(154,104,22,.28); background:rgba(154,104,22,.07); }
body.account-main-embedded:not(.account-main-dark) .security-checks span.done,
body.account-main-embedded:not(.account-main-dark) .security-state.success { color:#1f6a50; border-color:rgba(39,113,88,.25); background:rgba(39,113,88,.07); }
body.account-main-embedded:not(.account-main-dark) .dialog-step { border-color:rgba(47,93,84,.2); background:var(--gold-soft); }
body.account-main-embedded:not(.account-main-dark) .dialog-step > span { color:#fff; }
body.account-main-embedded:not(.account-main-dark) .security-impact-note { color:#805510; border-color:rgba(154,104,22,.24); background:rgba(154,104,22,.07); }
body.account-main-embedded:not(.account-main-dark) .logout-impact { background:rgba(178,67,79,.055); }
body.account-main-embedded:not(.account-main-dark) .logout-impact ul { color:#9d3744; }
body.account-main-embedded:not(.account-main-dark) .dialog-close,
body.account-main-embedded:not(.account-main-dark) .password-toggle { background:#f3f0e8; }

@media (max-width:820px) {
  .account-topbar { min-height:60px; padding:8px 14px; }
  .account-brand small,.account-topbar-actions > a { display:none; }
  .icon-button { display:inline-flex; }
  .account-layout { display:block; min-height:calc(100dvh - 60px); }
  .account-sidebar { position:static; display:block; height:auto; padding:12px 14px 0; border-right:0; }
  body.account-embedded .account-sidebar { top:auto; height:auto; }
  .account-identity { display:none; }
  .account-nav { display:flex; gap:6px; margin:0; padding-bottom:10px; overflow-x:auto; scrollbar-width:none; }
  .account-nav::-webkit-scrollbar { display:none; }
  .account-nav button { flex:0 0 auto; width:auto; min-height:44px; white-space:nowrap; }
  .account-nav svg { display:none; }
  .logout-button { display:none; }
  .account-content { padding:22px 14px max(28px,env(safe-area-inset-bottom)); }
  .content-header { margin-bottom:18px; }.content-header h1 { font-size:25px; }.content-header p:last-child { font-size:12px; }
  .overview-hero,.plan-grid { grid-template-columns:1fr; }
  .security-overview { grid-template-columns:auto minmax(0,1fr); }
  .security-overview-action { grid-column:1/-1; width:100%; }
  .security-contact-grid { grid-template-columns:1fr; }
  .security-action-row { grid-template-columns:auto minmax(0,1fr) auto; }
  .security-action-row > .security-state { grid-column:2; justify-self:start; }
  .security-action-row > .button { grid-column:3; grid-row:1/3; }
  .security-action-row.danger-zone { grid-template-columns:auto minmax(0,1fr) auto; }
  .metric-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }.form-field.full { grid-column:auto; }
  .order-row { grid-template-columns:1fr auto; }.order-row .status-badge { grid-column:2; grid-row:1; }.order-amount { grid-column:1/-1; text-align:left; }
  .payment-dialog { width:100%; max-width:none; max-height:100dvh; height:100dvh; margin:0; border:0; border-radius:0; }
}

@media (max-width:480px) {
  body { font-size:16px; }
  .account-brand > span:last-child strong { font-size:14px; }
  .sync-status { display:none; }
  .membership-card h2 { font-size:28px; }
  .membership-facts { gap:14px; }
  .section-heading { align-items:stretch; flex-direction:column; }
  .security-page { gap:20px; }
  .security-overview { grid-template-columns:1fr; padding:20px; }
  .security-overview-icon { width:48px; height:48px; }
  .security-checks { display:grid; grid-template-columns:1fr; }
  .security-checks span { justify-content:flex-start; }
  .security-section-heading { align-items:flex-start; flex-direction:column; }
  .security-contact-card { min-height:0; padding:17px; }
  .security-card-title { align-items:flex-start; flex-direction:column; }
  .security-contact-card > .button { justify-self:stretch; width:100%; min-height:48px; }
  .security-action-row,.security-action-row.danger-zone { grid-template-columns:auto minmax(0,1fr); padding:16px; }
  .security-action-row > .security-state { grid-column:2; }
  .security-action-row > .button,.security-action-row.danger-zone > .button { grid-column:1/-1; grid-row:auto; width:100%; min-height:48px; }
  .security-dialog,.captcha-dialog { width:100%; max-width:none; max-height:100dvh; height:100dvh; margin:0; border:0; border-radius:0; }
  .security-sheet { min-height:100dvh; grid-template-rows:auto 1fr auto; }
  .security-sheet.contact-sheet,.captcha-sheet { min-height:100dvh; grid-template-rows:auto auto 1fr auto; }
  .dialog-header { padding:18px 16px; }
  .dialog-title-icon { display:none; }
  .dialog-step { grid-template-columns:auto minmax(0,1fr); margin:16px 16px 0; }.dialog-step small { grid-column:2; }
  .dialog-form { align-content:start; padding:18px 16px; }
  .verification-input { grid-template-columns:1fr; }.verification-input .button { width:100%; min-height:48px; }
  .dialog-actions { position:sticky; bottom:0; flex-direction:column-reverse; padding:14px 16px max(14px,env(safe-area-inset-bottom)); background:var(--surface); }
  .dialog-actions .button { width:100%; min-height:48px; }
  .password-rules { grid-template-columns:1fr; }
  .logout-impact { margin:18px 16px; }.logout-impact ul { grid-template-columns:1fr; }
  .captcha-sheet > .form-field { margin:18px 16px; }.captcha-image { margin:18px 16px 0; }
  .form-actions,.payment-actions { flex-direction:column-reverse; }.form-actions .button,.payment-actions .button { width:100%; min-height:48px; }
  .profile-avatar-editor { align-items:flex-start; flex-direction:column; }
  .info-row { align-items:flex-start; flex-direction:column; gap:4px; }.info-row strong { text-align:left; }
  .referral-code { grid-template-columns:1fr; }.referral-code .button { min-height:48px; }
  .payment-detail { grid-template-columns:1fr; }.payment-address { grid-column:auto; }
}

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; } }