/* Account UI is isolated from both classic and clear business layouts.
   Design language: soft blue workspace, card-based sections, adaptive dialog
   width per view, sticky dialog header, full-screen sheet on phones. */
.yan-workspace-bar{display:flex;gap:20px;align-items:center;justify-content:space-between;padding:14px 18px;margin:0 0 18px;border:1px solid #dce4f2;border-radius:16px;background:linear-gradient(135deg,#fbfdff,#fff 55%);color:#253047;box-shadow:0 3px 16px #24365808;}
.yan-workspace-heading{min-width:0;flex:1}.yan-workspace-heading strong{font-size:16px;overflow-wrap:anywhere}.yan-workspace-heading p{margin:6px 0 0;font-size:12px;line-height:1.7;color:#66768f}
.yan-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* 账户条在左侧导航里的形态（桌面）。
   2026-10-19：原先它横在主区顶部、宽度撑满整页，把首屏挡掉一大条；
   搬进侧栏后又带着卡片边框/阴影浮在侧栏中间，和扁平导航格格不入。
   现在去掉所有卡片装饰，只保留一条细分隔线 + 紧凑身份行，和下方
   「账户与设置」入口一起由 .sidebar-footer 吸底。 */
.yan-workspace-bar--sidebar{flex-direction:column;align-items:stretch;gap:6px;padding:10px 4px 8px;margin:0;border:0;border-top:1px solid rgba(15,23,42,.10);border-radius:0;background:transparent;box-shadow:none;position:static}
.yan-workspace-bar--sidebar .yan-workspace-heading strong{font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.yan-workspace-bar--sidebar .yan-workspace-heading p{margin:2px 0 0;font-size:11px;line-height:1.5;color:#64748b}
/* 侧栏只有 184–224px 宽，那句「账户、会员、钱包与设置都在「我的钱包」里」
   必然被截断成「账户、会员、钱包与设置都…」——在侧栏里直接不显示，
   这句话本来就是在主区顶栏当说明用的。 */
.yan-workspace-bar--sidebar .yan-workspace-heading p{display:none}
.yan-workspace-bar--sidebar .yan-actions{gap:6px;margin-top:2px}
.yan-workspace-bar--sidebar .yan-actions:empty{display:none}
.yan-workspace-bar--sidebar .yan-button{flex:1 1 auto;min-height:32px;padding:4px 8px;font-size:12px;border-radius:8px}
/* 「报告」按钮和侧栏里的「数据分析报告」是同一个去处（都跳 #reports），
   在侧栏里同时出现只是重复；移动端账户条回到主区顶栏，那时它仍是唯一入口。 */
.yan-workspace-bar--sidebar .yan-button[data-nav-entry="reports"]{display:none}
.yan-button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 16px;background:#fff;color:#435879;border:1px solid #cbd6e8;border-radius:10px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.yan-button:hover{background:#f1f5ff;border-color:#b3c6f4}
.yan-button:active{transform:scale(.98)}
.yan-button:disabled{opacity:.5;cursor:not-allowed}
.yan-primary{background:linear-gradient(135deg,#2f5ae0,#3b82f6);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(47,90,224,.28)}
.yan-primary:hover{background:linear-gradient(135deg,#2a4fc4,#2f6ee8);border-color:transparent}
.yan-danger{color:#a52d38;border-color:#e6c7cb;background:#fffafa}
.yan-danger:hover{background:#fdf1f2;border-color:#dba8ae}

/* ── Dialog shell ─────────────────────────────────────────────── */
.yan-workspace-dialog,.yan-confirm-dialog{width:min(1060px,calc(100vw - 48px));max-height:calc(100dvh - 48px);border:1px solid #d9e2ef;border-radius:20px;padding:0;background:#fff;color:#253047;font-family:inherit;box-shadow:0 24px 90px #18274040;overflow:auto;z-index:20000}
.yan-confirm-dialog{width:min(440px,calc(100vw - 32px));z-index:20001;padding:0}
.yan-workspace-dialog::backdrop,.yan-confirm-dialog::backdrop{background:#0f1c33a6;backdrop-filter:blur(3px)}
.yan-workspace-dialog[open],.yan-confirm-dialog[open]{display:block}

/* Content-driven width: narrow views keep a focused column. */
.yan-workspace-dialog[data-view="login"],
.yan-workspace-dialog[data-view="register"],
.yan-workspace-dialog[data-view="settings"],
.yan-workspace-dialog[data-view="agent"],
.yan-workspace-dialog[data-view="app"]{width:min(620px,calc(100vw - 48px))}

.yan-workspace-dialog>header,.yan-confirm-dialog>header{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 24px 14px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #e6ecf5}
.yan-workspace-dialog h2,.yan-confirm-dialog h2{font-size:20px;font-weight:800;letter-spacing:-.01em;margin:0}
.yan-workspace-dialog h3{font-size:16px;font-weight:750;margin:0 0 12px}
.yan-workspace-dialog nav{display:flex;gap:6px;padding:14px 24px 2px;flex-wrap:wrap}
.yan-workspace-dialog nav .yan-button{background:transparent;border:0;color:#5a6b86;font-weight:650;padding:8px 15px;border-radius:999px}
.yan-workspace-dialog nav .yan-button:hover{background:#eef3fb;color:#2854cc}
.yan-workspace-dialog nav [aria-current="true"]{background:linear-gradient(135deg,#2f5ae0,#3b82f6);color:#fff;box-shadow:0 5px 14px rgba(47,90,224,.30)}
.yan-workspace-dialog nav [aria-current="true"]:hover{background:linear-gradient(135deg,#2a4fc4,#2f6ee8);color:#fff}
.yan-workspace-dialog>header+nav{border-bottom:0}
.yan-workspace-dialog>#yanWorkspaceFeedback{margin:14px 24px 0}
.yan-workspace-dialog>#yanWorkspaceContent{padding:18px 24px 26px}

.yan-close{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:999px;background:transparent;color:#66768f;font-size:16px;line-height:1;cursor:pointer;transition:background .15s ease,color .15s ease}
.yan-close:hover{background:#fdecec;color:#b3414e}
.yan-confirm-dialog{position:relative}
.yan-confirm-dialog>header{padding:18px 22px 0;border-bottom:0}
.yan-confirm-dialog>header .yan-close{position:absolute;top:14px;right:14px}

/* ── Forms & shared bits ──────────────────────────────────────── */
.yan-field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#4b5c77;margin-bottom:14px;min-width:0}
.yan-field input,.yan-field textarea,.yan-search select{font:inherit;min-height:44px;border:1px solid #cad5e6;border-radius:10px;padding:10px 12px;color:#253047;background:#fff;width:100%;box-sizing:border-box;transition:border-color .15s ease,box-shadow .15s ease}
.yan-field input:focus,.yan-field textarea:focus,.yan-search select:focus{outline:0;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.16)}
.yan-field textarea{min-height:90px;resize:vertical}
.yan-auth-form{max-width:100%;display:grid;gap:6px}
.yan-auth-form .yan-primary{width:100%;min-height:46px;margin-top:6px}
.yan-auth-form>.yan-button:not(.yan-primary){border:0;background:transparent;color:#315edb;text-decoration:underline;text-underline-offset:3px;min-height:38px;justify-self:center}
.yan-auth-form>.yan-button:not(.yan-primary):hover{background:transparent;color:#254ab1}
.yan-checkbox{display:flex;align-items:center;gap:8px;font-size:13px;margin:8px 0 18px}
.yan-muted{font-size:13px;color:#6a7890;line-height:1.8}
.yan-inline-error,.yan-error{color:#9b3441!important;background:#fff1f1;padding:10px;border-radius:10px}
.yan-inline-error:empty{display:none}
#yanWorkspaceFeedback{padding:12px 14px;border-radius:12px;background:#eff5ff;line-height:1.7;font-size:13px}
#yanWorkspaceFeedback[hidden]{display:none}

/* ── Projects ─────────────────────────────────────────────────── */
.yan-search{display:flex;flex-wrap:wrap;align-items:end;gap:10px;margin-bottom:18px}
.yan-search .yan-field{flex:1 1 220px;margin:0}
.yan-search select{width:auto;max-width:100%}
.yan-project-list{display:grid;gap:14px}
.yan-project-card{border:1px solid #dce4f0;border-radius:14px;padding:18px;min-width:0;background:#fff;transition:box-shadow .16s ease,border-color .16s ease}
.yan-project-card:hover{border-color:#c3d4f0;box-shadow:0 8px 24px rgba(23,43,77,.08)}
.yan-project-card h3,.yan-project-card p{overflow-wrap:anywhere}
.yan-project-card small{display:block;color:#7c899f;margin:12px 0}
.yan-badge{display:inline-block;font-size:11px;margin-left:8px;padding:3px 9px;border-radius:999px;background:#edf5f0;color:#248050;font-weight:700}
.yan-project-card details{border-top:1px solid #e5eaf2;margin-top:14px;padding-top:10px}
.yan-project-card summary{cursor:pointer;font-size:13px;color:#526582;padding:6px 0}
.yan-resource-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #eef1f6;font-size:12px;overflow-wrap:anywhere}
.yan-resource-row>span{flex:1;min-width:0}
.yan-empty{padding:24px;text-align:center;background:#f6f8fc;border:1px dashed #cfdaf0;border-radius:14px;color:#748197}

/* ── Wallet ───────────────────────────────────────────────────── */
.yan-balance{font-size:30px;font-weight:800;color:#2f5ae0;letter-spacing:-.02em;margin:4px 0 8px!important}
.yan-redeem{display:flex;align-items:end;gap:12px;padding:18px 20px;border:1px solid #dce4f0;border-radius:14px;background:#f8fbff;margin:16px 0 22px}
.yan-redeem .yan-field{margin:0;flex:1}
.yan-records{display:grid;gap:0;border:1px solid #e3e9f4;border-radius:14px;overflow:hidden}
.yan-records p{padding:11px 14px;background:#fff;border-bottom:1px solid #eef1f6;font-size:12px;overflow-wrap:anywhere;margin:0}
.yan-records p:last-child{border-bottom:0}
.yan-records p:nth-child(even){background:#fafcfe}
.yan-purchase-note{background:#edf5ff;color:#335786;border:1px solid #c4d9f5;border-radius:12px;padding:12px;font-size:13px;line-height:1.8}

/* ── Account settings ─────────────────────────────────────────── */
.yan-settings-overview{padding:22px;border:1px solid #dce4f0;border-radius:18px;background:linear-gradient(135deg,#f4f8ff,#fff 60%)}
.yan-settings-identity{display:flex;align-items:center;gap:14px}
.yan-avatar{display:grid;width:52px;height:52px;place-items:center;border-radius:16px;background:linear-gradient(135deg,#244bb5,#3b82f6);color:#fff;font-size:22px;font-weight:800;box-shadow:0 8px 18px rgba(36,75,181,.30)}
.yan-settings-identity h3,.yan-settings-identity p{margin:0}
.yan-settings-identity h3{font-size:18px}
.yan-settings-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.yan-stat{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid #dfe7f3;border-radius:14px;background:#fff}
.yan-stat strong{font-size:17px;font-weight:800;color:#203f70}
.yan-stat span{font-size:11px;font-weight:700;letter-spacing:.06em;color:#7c899f;text-transform:uppercase}
.yan-settings-shortcuts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:16px}
.yan-settings-shortcuts .yan-button{background:#fff;border-color:#d5e0f0}
.yan-current-project{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding:14px 16px;border:1px solid #cadcf4;border-radius:14px;background:#fff}
.yan-current-project strong{color:#203f70;font-size:14px}.yan-current-project p{flex:1 1 260px;margin:0}.yan-current-project .yan-button{margin-left:auto}
.yan-workspace-quick-link{border-color:#b9cdee;color:#25549a}
.yan-card{padding:20px;border:1px solid #dce4f0;border-radius:16px;background:#fff;margin-top:16px}
.yan-card .yan-actions{margin-top:14px}
.yan-settings-feature{max-width:680px;padding:24px;border:1px solid #dce4f0;border-radius:18px;background:linear-gradient(135deg,#f8fbff,#fff)}
.yan-settings-feature-icon{display:grid;width:44px;height:44px;place-items:center;margin-bottom:14px;border-radius:13px;background:linear-gradient(135deg,#2f5ae0,#3b82f6);color:#fff;font-size:14px;font-weight:800;box-shadow:0 8px 18px rgba(47,90,224,.28)}
.yan-settings-feature h3{margin-top:0}

/* ── Compact account summary in the top bar ───────────────────── */
.yan-settings-menu{position:relative}
.yan-settings-menu>summary{list-style:none;user-select:none}
.yan-settings-menu>summary::-webkit-details-marker{display:none}
.yan-settings-menu>summary::after{content:'⌄';margin-left:8px;font-size:12px}
.yan-settings-menu[open]>summary{background:#eef3ff;color:#2854cc;border-color:#b3c6f4}
.yan-settings-menu-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:1000;display:grid;width:250px;padding:8px;background:#fff;border:1px solid #d6e0ee;border-radius:14px;box-shadow:0 18px 46px #14213d26}
.yan-settings-menu-panel .yan-button{justify-content:flex-start;width:100%;border:0;background:transparent}
.yan-settings-menu-panel .yan-button:hover{background:#f2f6ff}

@media (prefers-reduced-motion: reduce){
  .yan-button,.yan-close,.yan-project-card,.yan-field input,.yan-field textarea,.yan-search select{transition:none}
}

/* ── Mobile: full-screen sheet ────────────────────────────────── */
@media(max-width:720px){
  .yan-workspace-bar{padding:14px;display:block}
  .yan-workspace-bar .yan-actions{margin-top:14px}
  .yan-workspace-bar .yan-button{flex:1 1 auto;min-height:44px}
  .yan-workspace-dialog,.yan-confirm-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0;box-shadow:none}
  .yan-workspace-dialog>header,.yan-confirm-dialog>header{padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px}
  .yan-workspace-dialog nav{padding:12px 16px 2px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .yan-workspace-dialog nav::-webkit-scrollbar{display:none}
  .yan-workspace-dialog nav .yan-button{white-space:nowrap;flex:0 0 auto}
  .yan-workspace-dialog>#yanWorkspaceFeedback{margin:12px 16px 0}
  .yan-workspace-dialog>#yanWorkspaceContent{padding:16px 16px calc(24px + env(safe-area-inset-bottom,0px))}
  .yan-button{min-height:44px}
  .yan-search{display:grid;grid-template-columns:minmax(0,1fr)}
  .yan-search select{width:100%}
  .yan-redeem{flex-direction:column;align-items:stretch}
  .yan-resource-row{flex-direction:column;align-items:stretch}
  .yan-resource-row span{width:100%}
  .yan-project-card{padding:14px}
  .yan-actions{gap:6px}
  .yan-actions .yan-button{flex:1 1 auto}
  .yan-settings-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yan-settings-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yan-current-project .yan-button{margin-left:0;width:100%}
  .yan-settings-menu{flex:1 1 auto}
  .yan-settings-menu>summary{width:100%}
  .yan-settings-menu-panel{position:fixed;left:8px;right:8px;top:auto;bottom:78px;width:auto;max-height:55dvh;overflow:auto}
  .yan-auth-form .yan-primary{min-height:48px}
}

/* ── Refactor C: Account center 3-tab layout (hash-routed) ────────── */
.yan-account-center{
  --acct-card-bg:#fff;
  --acct-card-border:#dce4f0;
  --acct-text:#253047;
  --acct-text-muted:#6a7890;
  --acct-text-soft:#435879;
  --acct-accent:#2f5ae0;
  --acct-accent-soft:#eef3ff;
  width:min(1100px,calc(100vw - 48px));
  max-width:calc(100vw - 48px);
  margin:24px auto;
  padding:0 16px;
  color:var(--acct-text);
  font:inherit;
  box-sizing:border-box;
}
.yan-account-center *{box-sizing:border-box}
.yan-acct-identity{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:18px;
  align-items:center;
  padding:22px 24px;
  border:1px solid var(--acct-card-border);
  border-radius:18px;
  background:linear-gradient(135deg,#f4f8ff,#fff 60%);
  box-shadow:0 4px 16px rgba(15,40,90,.04);
}
.yan-acct-identity__avatar{
  width:64px;height:64px;border-radius:18px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#244bb5,#3b82f6);
  color:#fff;font-size:24px;font-weight:800;
  box-shadow:0 8px 20px rgba(36,75,181,.30);
  flex-shrink:0;
}
.yan-acct-identity__name{
  font-size:18px;font-weight:700;margin:0;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.yan-acct-identity__sub{
  font-size:13px;color:var(--acct-text-muted);margin:6px 0 0;line-height:1.6;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.yan-acct-identity__token{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12px;background:#eef3ff;color:#244bb5;
  border:1px solid #c8d6f0;border-radius:8px;
  padding:3px 8px;cursor:pointer;
  position:relative;
}
.yan-acct-identity__token[data-full]:hover::after{
  content:attr(data-full);position:absolute;left:0;top:calc(100% + 4px);
  background:#1f2937;color:#fff;font-size:11px;line-height:1.4;
  padding:6px 10px;border-radius:8px;white-space:nowrap;z-index:50;
  box-shadow:0 6px 20px rgba(0,0,0,.18);
}
.yan-acct-identity__balance{
  display:flex;flex-direction:column;align-items:flex-end;gap:6px;
}
.yan-acct-identity__balance strong{font-size:26px;font-weight:800;color:var(--acct-accent);letter-spacing:-.02em}
.yan-acct-identity__balance small{font-size:12px;color:var(--acct-text-muted)}

.yan-acct-token-state{
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:600;
  padding:3px 10px;border-radius:999px;
}
.yan-acct-token-state::before{
  content:'';width:8px;height:8px;border-radius:50%;
  display:inline-block;
}
.yan-acct-token-state[data-state="valid"]   {background:#dcfce7;color:#166534;}
.yan-acct-token-state[data-state="valid"]::before   {background:#16a34a;}
.yan-acct-token-state[data-state="expiring"]{background:#fef3c7;color:#92400e;}
.yan-acct-token-state[data-state="expiring"]::before{background:#d97706;}
.yan-acct-token-state[data-state="invalid"] {background:#fee2e2;color:#991b1b;}
.yan-acct-token-state[data-state="invalid"]::before {background:#dc2626;}

/* ── 会员标识（2026-10-21）─────────────────────────────────────────
   会员身份要在**一眼能看见的地方**体现：身份卡的头像与昵称旁、
   工作区顶栏的用户名旁都挂同一枚徽章。
   配色用金色（区别于普通账户的蓝），胶囊 + 皇冠图标，鼠标悬停显示有效期。 */
.yan-member-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:999px;
  font-size:12px;font-weight:700;letter-spacing:.02em;
  color:#7a4b06;
  background:linear-gradient(135deg,#fff6dd 0%,#ffe9b3 55%,#ffd884 100%);
  border:1px solid #f0cd88;
  box-shadow:0 4px 12px rgba(184,128,26,.20);
  white-space:nowrap;vertical-align:middle;
}
.yan-member-badge i{font-size:12px;color:#b8801a;line-height:1;}
.yan-member-badge--mini{padding:2px 8px;font-size:11px;}
/* 头像会员光环：金色描边 + 金色底 */
.yan-acct-identity.is-member .yan-acct-identity__avatar{
  background:linear-gradient(135deg,#f9d976 0%,#e5ab2a 45%,#b8801a 100%);
  box-shadow:0 0 0 3px #fff, 0 0 0 5px rgba(224,168,13,.55), 0 10px 24px rgba(184,128,26,.32);
}
/* 顶栏身份区（yanWorkspaceRole）本来就放角色徽章，会员时换成金色 */
.yan-workspace-role[data-role="member"]{
  background:linear-gradient(135deg,#fff6dd,#ffe4a8);
  color:#7a4b06;border:1px solid #f0cd88;
}
@media(max-width:720px){
  .yan-member-badge{font-size:11px;padding:2px 8px;}
}

.yan-acct-tabs{
  display:flex;gap:4px;
  margin:18px 0 0;
  padding:4px;border:1px solid var(--acct-card-border);
  border-radius:14px;background:#fff;
  width:fit-content;
}
.yan-acct-tab{
  border:0;background:transparent;
  font:inherit;font-size:14px;font-weight:600;
  color:var(--acct-text-muted);
  padding:10px 18px;border-radius:10px;
  cursor:pointer;transition:background .15s ease,color .15s ease;
  display:inline-flex;align-items:center;gap:8px;
}
.yan-acct-tab:hover{background:var(--acct-accent-soft);color:var(--acct-accent)}
.yan-acct-tab.is-active{background:linear-gradient(135deg,#2f5ae0,#3b82f6);color:#fff;box-shadow:0 4px 12px rgba(47,90,224,.25)}
.yan-acct-tab__count{
  display:inline-block;min-width:20px;height:20px;
  border-radius:999px;background:rgba(255,255,255,.25);
  font-size:11px;font-weight:700;padding:0 7px;line-height:20px;text-align:center;
}
.yan-acct-tab:not(.is-active) .yan-acct-tab__count{background:#eef3ff;color:var(--acct-accent)}

.yan-acct-panel{
  margin-top:18px;
  display:grid;gap:18px;
}

.yan-acct-card{
  background:var(--acct-card-bg);
  border:1px solid var(--acct-card-border);
  border-radius:16px;
  padding:20px 22px;
  box-shadow:0 2px 10px rgba(15,40,90,.04);
}
.yan-acct-card__title{
  display:flex;align-items:center;justify-content:space-between;
  margin:0 0 14px;font-size:16px;font-weight:700;
}
.yan-acct-card__title small{font-size:12px;color:var(--acct-text-muted);font-weight:400}

/* sparkline */
.yan-acct-sparkline{
  display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
}
.yan-acct-sparkline svg{display:block;width:100%;height:64px}
.yan-acct-sparkline__legend{
  font-size:12px;color:var(--acct-text-muted);line-height:1.6;
  display:flex;flex-direction:column;gap:4px;
}
.yan-acct-sparkline__legend strong{color:var(--acct-text);font-size:14px}

/* points codes table */
.yan-acct-table{width:100%;border-collapse:collapse;font-size:13px}
.yan-acct-table th,.yan-acct-table td{
  padding:10px 12px;border-bottom:1px solid #eef1f6;text-align:left;
  white-space:nowrap;
}
.yan-acct-table th{font-size:12px;color:var(--acct-text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.yan-acct-table td:first-child{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.yan-acct-table tr:last-child td{border-bottom:0}

.yan-acct-status-tag{
  display:inline-block;font-size:11px;font-weight:700;
  padding:2px 9px;border-radius:999px;
}
.yan-acct-status-tag[data-status="active"]  {background:#dcfce7;color:#166534}
.yan-acct-status-tag[data-status="used"]    {background:#e0e7ff;color:#3730a3}
.yan-acct-status-tag[data-status="expired"] {background:#f1f5f9;color:#475569}

/* workspace tab list */
.yan-acct-section{margin-bottom:20px}
.yan-acct-section__heading{
  display:flex;align-items:baseline;justify-content:space-between;
  margin:0 0 12px;font-size:14px;font-weight:700;color:var(--acct-text);
}
.yan-acct-section__heading small{font-size:12px;color:var(--acct-text-muted);font-weight:400}
.yan-acct-workspace-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;
}
.yan-acct-workspace-item{
  display:flex;flex-direction:column;gap:8px;
  padding:14px;border:1px solid #e7edf7;border-radius:12px;background:#fff;
  cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease;
  min-width:0;
}
.yan-acct-workspace-item:hover{border-color:#b9cdee;box-shadow:0 6px 18px rgba(23,43,77,.08);transform:translateY(-1px)}
.yan-acct-workspace-item__title{
  font-size:14px;font-weight:600;color:var(--acct-text);
  margin:0;line-height:1.4;overflow:hidden;
  text-overflow:ellipsis;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.yan-acct-workspace-item__meta{
  display:flex;align-items:center;gap:8px;font-size:11px;color:var(--acct-text-muted);
  flex-wrap:wrap;
}
.yan-acct-workspace-item__progress{
  display:flex;align-items:center;gap:6px;font-size:11px;color:var(--acct-text-soft);
}
.yan-acct-workspace-item__bar{
  flex:1;height:5px;background:#eef3ff;border-radius:999px;overflow:hidden;
}
.yan-acct-workspace-item__bar span{
  display:block;height:100%;background:linear-gradient(90deg,#2f5ae0,#3b82f6);
}
.yan-acct-mode-badge{
  display:inline-block;font-size:10px;font-weight:700;
  padding:2px 7px;border-radius:6px;background:#eef3ff;color:#244bb5;
  letter-spacing:.02em;
}

/* orders tab */
.yan-acct-subtabs{
  display:flex;gap:6px;flex-wrap:wrap;
  padding:6px;margin-bottom:14px;
  border:1px solid var(--acct-card-border);border-radius:12px;background:#fff;
  width:fit-content;
}
.yan-acct-subtab{
  border:0;background:transparent;font:inherit;font-size:13px;font-weight:600;
  color:var(--acct-text-muted);padding:8px 14px;border-radius:8px;cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;
}
.yan-acct-subtab:hover{background:var(--acct-accent-soft);color:var(--acct-accent)}
.yan-acct-subtab.is-active{background:linear-gradient(135deg,#2f5ae0,#3b82f6);color:#fff}

.yan-acct-orders-list{display:grid;gap:12px}

/* Reuse AdminComponents card classes inside this surface */
.yan-account-center .ds-order-card{box-shadow:0 1px 2px rgba(15,40,90,.05)}
.yan-account-center .ds-order-card:hover{border-color:var(--ds-border-strong)}

/* Empty state for any account center card */
.yan-acct-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:32px 16px;text-align:center;color:var(--acct-text-soft);
  background:#f8fbff;border:1px dashed #cfdaf0;border-radius:14px;
}
.yan-acct-empty i{font-size:32px;color:var(--acct-text-muted)}
.yan-acct-empty h5{font-size:14px;font-weight:600;color:var(--acct-text);margin:0}
.yan-acct-empty p{font-size:12px;color:var(--acct-text-muted);margin:0;max-width:360px;line-height:1.5}

/* responsive */
@media(max-width:720px){
  .yan-account-center{width:100vw;max-width:100vw;margin:0;padding:12px}
  .yan-acct-identity{grid-template-columns:auto 1fr;padding:16px;gap:12px}
  .yan-acct-identity__balance{grid-column:1 / -1;align-items:flex-start;border-top:1px dashed #d2dcec;padding-top:12px}
  .yan-acct-tabs{width:100%;overflow-x:auto;flex-wrap:nowrap}
  .yan-acct-tab{flex:0 0 auto;padding:8px 14px;font-size:13px}
  .yan-acct-workspace-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .yan-acct-tab,.yan-acct-workspace-item,.yan-acct-subtab{transition:none}
}

/* ── 钱包三段：余额卡 → 获取积分 → 明细 ──────────────────────────────
   之前管理员分支整块跳过充值/兑换，tab 看起来像一张单据而不是钱包。
   现在两类账号共用同一套骨架，只有「获取积分」那一段内容不同。 */
.yan-wallet-balance{border:1px solid #c9dcff;border-radius:16px;background:linear-gradient(135deg,#f4f8ff,#fff 60%);padding:16px 18px;margin-bottom:14px}
.yan-wallet-balance .yan-wallet-balance__value{font-size:32px;font-weight:800;letter-spacing:-.02em;margin:4px 0 6px;color:#253047}
.yan-wallet-section{border:1px solid #dce4f2;border-radius:16px;background:#fff;padding:16px 18px;margin-bottom:14px}
.yan-wallet-section h3{margin:0 0 8px;font-size:15px;font-weight:750;color:#253047}
.yan-wallet-section .yan-records p{margin:0 0 8px;font-size:13px;line-height:1.7;color:#435879}
.yan-wallet-section .yan-redeem{margin-top:12px;display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.yan-wallet-section .yan-redeem .yan-field{flex:1 1 220px;min-width:0}

/* ── 会员页三层结构：状态条 → 档位卡 → 明细表 ────────────────────────
   顺序即决策顺序：先确认"我现在是什么状态"，再"选哪一档"，最后核对细节。
   价���和购买动作同处档位卡内（看价和决定放一起）；明细表里一个按钮都没有，
   避免"月费行下面挂个开通"这种价格与动作错位的点法。 */
.yan-mp-section-title{font-size:15px;font-weight:750;margin:22px 0 10px;color:#253047}
.yan-mp-note{margin:14px 0 0;font-size:12px;line-height:1.7;color:#66768f}

/* ① 状态条 */
.yan-mp-status{border:1px solid #dce4f2;border-radius:16px;background:linear-gradient(135deg,#fbfdff,#fff 55%);padding:16px 18px;margin-bottom:4px}
.yan-mp-status.is-guest{background:linear-gradient(135deg,#f4f8ff,#fff 60%);border-color:#c9dcff}
.yan-mp-status__plan{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:800;color:#253047;letter-spacing:-.01em}
.yan-mp-quota{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.yan-mp-quota__cell{border:1px solid #eef2f7;border-radius:12px;padding:10px 12px;background:#fff}
.yan-mp-quota__value{font-weight:700;font-size:15px;margin-top:2px}
/* 额度类资源天生是"用掉多少"的问题，只给「120 / 200」用户得自己心算。 */
.yan-mp-meter{margin-top:6px;height:5px;border-radius:999px;background:#eef2f7;overflow:hidden}
.yan-mp-meter>span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2f5ae0,#3b82f6)}

/* ② 档位卡 */
.yan-mp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.yan-mp-card{display:flex;flex-direction:column;border:1px solid #dce4f2;border-radius:16px;background:#fff;padding:16px 18px}
.yan-mp-card.is-current{border-color:#9dbcff;box-shadow:0 0 0 3px #e8f0ff}
.yan-mp-card__name{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:#253047}
.yan-mp-card__price{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-top:10px;color:#253047}
.yan-mp-card__list{list-style:none;margin:12px 0 14px;padding:0;font-size:13px;color:#435879;line-height:1.9}
/* 年付优惠：省多少钱 + 相当于几折。裸的「年付 ¥899」用户看不出便宜没，
   要自己拿 899×12 心算；把差额和折数一起给出来才不用算。 */
.yan-mp-save{color:#1f7a3d;font-weight:600}
.yan-mp-card__actions{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.yan-mp-card__actions .yan-button{flex:1 1 auto;min-width:104px}

/* ③ 明细对照表：只做对比，不放按钮 */
.yan-mp-table-wrap{overflow-x:auto;border:1px solid #dce4f2;border-radius:14px;background:#fff}
.yan-mp-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px;min-width:520px}
.yan-mp-table thead th{position:sticky;top:0;background:#fbfdff;border-bottom:1px solid #dce4f2;padding:12px 14px;text-align:left;font-weight:700;color:#253047;font-size:14px}
.yan-mp-table thead th.yan-mp-corner{background:#f4f6fb;color:#5a6b86;font-weight:600;font-size:12px;width:130px;min-width:130px}
.yan-mp-table tbody tr+tr th,.yan-mp-table tbody tr+tr td{border-top:1px solid #eef2f7}
.yan-mp-table .yan-mp-rowlabel{text-align:left;color:#5a6b86;font-weight:600;background:#fbfdff;padding:10px 14px;width:130px;min-width:130px;font-size:12px}
.yan-mp-table .yan-mp-td{padding:10px 14px;vertical-align:middle;color:#253047}
.yan-mp-table .yan-mp-th.is-current,.yan-mp-table .yan-mp-td.is-current{background:#eef4ff}
.yan-mp-table .yan-mp-th strong,.yan-mp-table .yan-mp-td strong{font-weight:700}
.yan-mp-table .yan-mp-td .yan-button{font-size:12px;min-height:34px;padding:6px 10px}

/* ④ Agent 接口权限：会员页要能看到「这个档，AI 能替我做什么」。
   权限清单可能很长（最多 13 项），所以用卡片 + 列表，不用对照表那套宽表格。 */
.yan-mp-api__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-top:4px}
.yan-mp-api__card{border:1px solid #dce4f2;border-radius:16px;background:#fff;padding:14px 16px}
.yan-mp-api__card.is-current{border-color:#9dbcff;box-shadow:0 0 0 3px #e8f0ff}
.yan-mp-api__title{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:#253047;margin-bottom:6px}
.yan-mp-api__head{font-size:13px;color:#253047;margin-bottom:2px}
.yan-mp-api__list{list-style:none;margin:8px 0 0;padding:0;font-size:12px;color:#435879;line-height:1.85}
.yan-mp-api__list>li{padding-left:14px;position:relative}
.yan-mp-api__list>li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:#9dbcff}
.yan-mp-api__list strong{font-weight:650;color:#253047}


/* 账户横幅压缩（2026-10-18）：身份行 = 用户名 + 角色徽章；状态说明桌面单行省略，
   手机端仍换行完整展示（移动端由 media query 恢复 display:block 布局）。 */
.yan-workspace-role{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.02em;vertical-align:middle;background:#eef3ff;color:#2f4fa8;border:1px solid #d3e0fb}
.yan-workspace-role[data-role="admin"]{background:#fff6e6;color:#8a5a12;border-color:#f0dcb4}
.yan-workspace-role[data-role="guest"]{background:#f3f5f9;color:#5a6a85;border-color:#e0e6ef}
@media (min-width:768px){
  .yan-workspace-bar{padding:10px 16px;margin:0 0 12px;border-radius:14px}
  .yan-workspace-heading p{margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* 账户与设置信息分组（2026-10-18） */
.yan-settings-group{margin-top:14px}
.yan-settings-group-label{display:block;margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.06em;color:#7a879c;text-transform:uppercase}
.yan-settings-group .yan-settings-shortcuts{margin-top:0}

/* 游客 / 账户功能对照表（2026-10-18） */
.yan-feature-matrix{margin-top:18px}
.yan-feature-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:12px}
.yan-feature-table th,.yan-feature-table td{padding:8px 10px;border-bottom:1px solid #e6ecf6;text-align:left;vertical-align:top}
.yan-feature-table th{font-size:11px;letter-spacing:.04em;color:#6b7a92;font-weight:700;background:#f7f9fd}
.yan-feature-table tr:last-child td{border-bottom:0}
@media (max-width:767.98px){.yan-feature-table th,.yan-feature-table td{padding:7px 8px;font-size:11.5px}}

/* ── 邀请返现（用户端账户视角）────────────────────────────────────────
   一条完整流程的视觉骨架：我的邀请码 → 分享 → 邀请记录 → 返现明细 →
   到账（转入积分 / 申请打款）。层级刻意压成三层：
     ① 邀请码与链接（要分享的东西，最显眼）
     ② 返现总览（四个数字，回答"我能拿多少、什么时候能拿"）
     ③ 记录与明细（回答"谁来了、到哪一步了"）
   桌面是居中的窄栏，窄屏铺满整屏 —— 邀请链接经常在手机上转发。 */
.yan-referral-dialog{
  width:min(760px,calc(100vw - 32px));
  max-height:calc(100dvh - 40px);
  border:1px solid #d9e2ef;
  border-radius:20px;
  padding:0;
  background:#f7f9fd;
  color:#253047;
  font-family:inherit;
  box-shadow:0 24px 90px #18274040;
  overflow:hidden;
  z-index:20010;
}
.yan-referral-dialog::backdrop{background:#0f1c33a6;backdrop-filter:blur(3px)}
.yan-referral-dialog[open]{display:flex;flex-direction:column}
.yan-referral-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:16px 20px;background:#fff;border-bottom:1px solid #e3e9f4;flex:0 0 auto;
}
.yan-referral-head h2{margin:2px 0 0;font-size:17px;font-weight:800;letter-spacing:-.01em}
.yan-referral-body{
  padding:16px 20px 24px;overflow-y:auto;display:flex;flex-direction:column;gap:14px;min-height:0;
}
.yan-ref-card{margin:0}
.yan-ref-card h3{margin:0 0 8px;font-size:15px;font-weight:750}
.yan-ref-card h4{
  margin:12px 0 6px;font-size:12px;font-weight:700;color:#66768f;letter-spacing:.04em;
}
.yan-ref-label{color:#66768f}
.yan-ref-code{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.yan-ref-code code{
  flex:1 1 220px;min-width:0;padding:8px 12px;border:1px solid #dce4f2;border-radius:10px;
  background:#f4f6fb;color:#253047;font-size:13px;word-break:break-all;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.yan-ref-code .yan-button{min-height:34px;padding:6px 12px;font-size:12px}
/* 四个数字：累计 / 待结算 / 可使用 / 已到账 */
.yan-ref-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.yan-ref-stat{
  border:1px solid #e3e9f4;border-radius:12px;padding:10px 12px;background:#fff;
  display:flex;flex-direction:column;gap:2px;
}
.yan-ref-stat b{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;color:#253047}
.yan-ref-stat span{font-size:12px;color:#66768f}
.yan-ref-stat small{font-size:11px;color:#93a1b8}
.yan-ref-wallet .yan-muted{margin-top:0}
/* 钱包余额卡下的"累计获得"来源拆分 */
.yan-wallet-sources{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:8px;
  padding-top:8px;border-top:1px dashed #e3e9f4;font-size:12px;
}
.yan-wallet-sources span:last-child{color:#435879}
/* 拆分积分码的结果区：码要**留在页面上**（重绘也不能丢），并且能一键复制。 */
.yan-split-result{
  margin-top:10px;padding:10px 12px;border:1px solid #cfe6d8;border-radius:10px;background:#f4fbf6;
}
.yan-split-result__code{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0;
}
.yan-split-result__code code{
  flex:1 1 auto;min-width:0;word-break:break-all;font-size:14px;font-weight:700;color:#1f7a3d;
  background:#fff;border:1px solid #cfe6d8;border-radius:8px;padding:6px 10px;
}
@media (max-width:640px){
  .yan-referral-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .yan-referral-head{padding:14px 16px}
  .yan-referral-body{padding:14px 16px 28px}
  .yan-ref-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yan-ref-stat b{font-size:16px}
}