:root {
  --bg: #f4f0e7;          /* 设计稿 yc-paper */
  --panel: #fbf8f1;       /* yc-panel */
  --card: #fcfaf5;        /* yc-card */
  --line: #e2d9c8;        /* yc-line */
  --ink: #26221c;         /* yc-text */
  --muted: #7d7463;       /* yc-muted 加深(审查 P1:小字对比度过 WCAG AA) */
  --gold: #b8925a;        /* yc-gold */
  --gold-soft: #ebdcc0;
  --accent: #7a6a45;
  --dark: #211e18;        /* 黑金卡 */
  --dark2: #2e2a22;
  --nav-bg: #211E18;      /* 顶栏/侧栏黑金底 */
  --nav-bg2: #2C2820;     /* 深栏上的按钮/头像底、hover */
  --nav-active: #38311F;  /* 侧栏选中项底 */
  --nav-line: #3A3327;    /* 深栏分隔线 */
  --nav-text: #EFE6D2;    /* 深栏主文字 */
  --nav-soft: #CBBD9E;    /* 深栏次文字/未选导航 */
  --nav-muted: #9C9079;   /* 深栏弱文字/分组标题 */
  --thumb-bg: #1C1A16;    /* 缩略图深色留边 */
  --danger: #b0533f;
  --success: #4e8c6a;     /* 成功色令牌(admin「界面配置」主题卡可改;theme 覆盖即生效) */
  --base-font: 16px;      /* 基础字号令牌(同上,给未显式定尺寸的文本用) */
  --glow: 0 14px 36px -18px rgba(184, 146, 90, .55);   /* 金色辉光 */
  --radius: 12px;
  --radius-control: 8px;
  --radius-button: 9px;
  --radius-card: 12px;
  --radius-panel: 14px;
  --radius-dialog: 16px;
  --radius-pill: 999px;
  --font-body: "Segoe UI Variable", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  --font-display: "Noto Serif SC", "Source Han Serif SC", serif;
  --font-size-body: 14px;
  --font-size-small: 12px;
  --font-size-title: 22px;
  --workspace-ms: 240ms;
  --workspace-easing: cubic-bezier(.2,.8,.2,1);
  --r-card: 20px;
  --titlebar-h: 34px;      /* 无边框壳全局标题栏高度(仿 Windows 标题栏) */
}
* { box-sizing: border-box; margin: 0; }
body {
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  background: var(--bg); color: var(--ink); height: 100vh; overflow: hidden;
}
.hidden { display: none !important; }
.muted { color: var(--muted); font-size: 12px; }
.spacer { flex: 1; }
button { cursor: pointer; font: inherit; border: none; background: none; color: inherit; }
button, a, input, textarea, select { outline: none; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--gold); outline-offset: 2px;
}
.nav-item, .primary, .pill, .icon-btn, .send-btn { min-height: 44px; }
.nav-item-featured { background: color-mix(in srgb, var(--gold-soft) 72%, transparent); }
.nav-count {
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--radius-pill);
  background: var(--gold); color: #fff; font-size: 11px; display: inline-flex;
  align-items: center; justify-content: center; font-style: normal;
}
.ni { width: 18px; height: 18px; flex: 0 0 auto; }
.novice-guide {
  margin: 0 18px 12px; border: 1px solid var(--line); border-radius: var(--radius-panel);
  background: var(--card); padding: 16px;
}
.novice-guide-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin-bottom: 12px;
}
.novice-guide-head > div { display: flex; flex-direction: column; gap: 4px; }
.novice-guide-head b { font-family: var(--font-display); font-size: 17px; }
.agent-start {
  margin-bottom: 22px; padding: 4px 0 22px; border-bottom: 1px solid var(--line);
}
.agent-start-eyebrow { color: var(--gold); font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.agent-start h1 { margin: 7px 0 5px; font: 700 28px/1.25 var(--font-display); }
.agent-start-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
.agent-start-card {
  min-height: 154px; padding: 16px; display: grid; grid-template-columns: 1fr; gap: 10px;
  text-align: left; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--card);
}
.agent-start-card:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: var(--shadow-soft); }
.agent-start-card > i { width: 34px; height: 34px; padding: 8px; border-radius: 11px; color: var(--nav-bg); background: var(--gold); }
.agent-start-card span { display: flex; flex-direction: column; gap: 6px; }
.agent-start-card b { font: 700 16px/1.3 var(--font-display); word-break: keep-all; overflow-wrap: normal; }
.agent-start-card small { color: var(--muted); font-size: 13px; }
.agent-start-card strong { grid-column: 1 / -1; color: var(--gold); font-size: 13px; }
.guide-step { color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.guide-material {
  display: flex; align-items: center; gap: 12px; padding: 12px 0;
  border-top: 1px solid var(--line);
}
.guide-material > svg { width: 20px; height: 20px; color: var(--muted); flex: 0 0 auto; }
.guide-material.selected > svg { color: var(--success); }
.guide-material-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.guide-material-copy b { font-size: 13px; }
.guide-material-copy span { color: var(--muted); font-size: 11px; line-height: 1.5; }
.guide-shot-list { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.guide-shot-list span {
  display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px;
  border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--panel);
}
.guide-shot-list b { font-size: 11px; }
.guide-shot-list em { color: var(--gold); font-size: 10px; font-style: normal; }
.asset-ref > svg { width: 24px; height: 24px; color: var(--gold); flex: 0 0 auto; }
.output-downloads { display: flex; gap: 8px; margin-top: 10px; }
.guide-material-actions { display: flex; gap: 6px; flex: 0 0 auto; }
.guide-material-actions .pill { min-height: 36px; padding: 5px 10px; font-size: 12px; }
.guide-truth-note {
  display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px;
  border-radius: var(--radius-control); background: var(--gold-soft); color: var(--accent);
  font-size: 11px; line-height: 1.6;
}
.guide-truth-note > svg { width: 16px; height: 16px; flex: 0 0 auto; margin-top: 1px; }
.support-card { width: 100%; height: 100%; display: flex; flex-direction: column; }
.support-layout { min-height: 0; flex: 1; display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; }
.ticket-list, .ticket-detail, .ticket-form {
  min-height: 0; overflow: auto; border: 1px solid var(--line); border-radius: var(--radius-panel);
  background: #fff; padding: 14px;
}
.ticket-list { display: flex; flex-direction: column; gap: 8px; }
.ticket-row { min-height: 92px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-card); text-align: left; display: flex; flex-direction: column; gap: 6px; }
.ticket-row.active { border-color: var(--gold); background: var(--gold-soft); }
.ticket-row-top { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; }
.ticket-row-top em { color: var(--gold); font-style: normal; }
.ticket-row > span:nth-child(2) { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ticket-row small, .ticket-head small { color: var(--muted); font-size: 10px; }
.ticket-empty { height: 100%; min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--muted); text-align: center; }
.ticket-detail { display: flex; flex-direction: column; }
.ticket-head { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.ticket-head > div { display: flex; flex-direction: column; gap: 4px; }
.ticket-status { align-self: flex-start; padding: 5px 9px; border-radius: var(--radius-pill); background: var(--gold-soft); font-size: 11px; }
.ticket-status.closed { background: var(--bg); color: var(--muted); }
.ticket-thread { flex: 1; min-height: 0; overflow: auto; padding: 16px 0; display: flex; flex-direction: column; gap: 12px; }
.ticket-msg { max-width: 76%; padding: 11px 13px; border-radius: var(--radius-card); background: var(--gold-soft); }
.ticket-msg.admin { align-self: flex-start; background: color-mix(in srgb, var(--success) 12%, #fff); }
.ticket-msg.user { align-self: flex-end; }
.ticket-msg p { margin-top: 5px; white-space: pre-wrap; line-height: 1.6; }
.ticket-msg small { color: var(--muted); font-size: 10px; }
.ticket-reply { display: flex; gap: 8px; align-items: flex-end; padding-top: 12px; border-top: 1px solid var(--line); }
.ticket-reply textarea { min-height: 44px; flex: 1; resize: none; }
.ticket-form { display: flex; flex-direction: column; gap: 12px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 80ms !important; animation-duration: 80ms !important; }
}
.primary, #btn-recharge {
  background: linear-gradient(180deg, #c9a56a, #ad8850); color: #fff;
  border-radius: 999px; padding: 9px 20px; font-weight: 700; letter-spacing: .02em;
  box-shadow: var(--glow); transition: filter .15s, transform .1s;
}
.primary:hover, #btn-recharge:hover { filter: brightness(1.06); }
.primary:active, #btn-recharge:active { transform: scale(.98); }
.ghost { color: var(--muted); padding: 6px 12px; border-radius: 8px; }
.ghost:hover { background: var(--gold-soft); }
.ghost.small { font-size: 12px; }
.pill {
  border: 1px solid var(--line); border-radius: 999px; padding: 5px 14px;
  background: var(--panel); font-size: 13px;
}
.primary, .ghost, .pill, .icon-btn, .conv-new, .detail-back {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
}
.primary svg, .ghost svg, .pill svg, .icon-btn svg, .conv-new svg, .detail-back svg {
  width: 16px; height: 16px; stroke-width: 1.8;
}
.pill:hover { border-color: var(--gold); color: var(--gold); }
.error { color: var(--danger); font-size: 13px; }

/* 登录 */
.login-wrap { height: 100vh; display: flex; align-items: center; justify-content: center; }
.login-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 16px;
  padding: 36px; width: 340px; display: flex; flex-direction: column; gap: 14px;
}
.login-card input {
  border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; font: inherit;
  background: #fff;
}
/* chat_first(设计帧 F/E)下资产区收成 312 轨道:头部那排按钮必须换行 + 收窄。
   ⛔别删:不换行时 4 个按钮硬挤 276px,「新建文件夹」会被压成一个字一行(实测高 114px)。
   设计稿的 Rail Head 只有标题+图标,但导出/上传是真功能,⛔不能为了像设计就藏掉(铁律3),
   于是让它老实换到第二行。 */
body.chat-first .library-head { flex-wrap: wrap; gap: 6px; }
body.chat-first .library-head h2 { white-space: nowrap; }
body.chat-first .library-head .pill,
body.chat-first .library-head .upload-label { font-size: 12px; padding: 4px 10px; }
body.chat-first .folders { gap: 6px; }
body.chat-first .folder { min-width: 88px; padding: 8px 10px; font-size: 12px; }

/* 电子员工市场(设计帧「封面页」):分类 tab + 3 列卡片网格 */
.market-card { width: 1080px; max-width: 94vw; }
.market-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.market-head h3 { margin: 0; }
.market-head-right { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.market-mine { font-size: 13px; color: var(--gold); font-weight: 600; cursor: default; }
.market-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.market-tab {
  padding: 6px 14px; border-radius: 999px; font-size: 13px; color: var(--muted);
  border: 1px solid var(--line); background: var(--panel);
}
.market-tab:hover { color: var(--ink); }
.market-tab.active { background: var(--gold-soft); color: var(--accent); border-color: var(--gold); font-weight: 700; }
.market-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 900px) { .market-grid { grid-template-columns: repeat(2, 1fr); } }
.market-card-item {
  border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px;
  background: var(--card); display: flex; flex-direction: column; gap: 10px;
}
.market-card-item.coming { opacity: .72; }
.mk-top { display: flex; align-items: center; gap: 10px; }
.mk-avatar {
  width: 40px; height: 40px; border-radius: 11px; color: #fff; font-weight: 800; font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
.mk-name { font-size: 14px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mk-badge {
  font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px;
  background: var(--gold-soft); color: var(--accent);
}
.mk-pitch { font-size: 12.5px; color: var(--text2, var(--muted)); line-height: 1.5; min-height: 38px; }
.mk-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 2px; }
.mk-status { font-size: 12px; color: var(--muted); }
.mk-status.ok { color: var(--success); font-weight: 700; }
.mk-status.locked { color: var(--accent); display: inline-flex; align-items: center; gap: 5px; }
.mk-status.locked > svg { width: 14px; height: 14px; }
.mk-price { font-size: 14px; font-weight: 800; color: var(--ink); }
.experts-compare {
  margin-top: 4px; text-align: center; font-size: 12px; padding: 10px;
  background: var(--gold-soft); border-radius: 10px;
}

/* 电子员工详情页(设计帧「详情页」):左样例右定价 */
.detail-card { width: 1040px; max-width: 94vw; }
.market-drawer .detail-card {
  width: min(820px, 100%); max-width: none; height: 100%; max-height: none;
  border: 1px solid var(--line); border-radius: var(--radius-dialog); box-shadow: var(--shadow); padding: 24px;
}
.detail-back { align-self: flex-start; color: var(--muted); }
.detail-cols { display: flex; gap: 22px; }
@media (max-width: 820px) { .detail-cols { flex-direction: column; } }
.detail-left { flex: 0 0 320px; display: flex; flex-direction: column; gap: 12px; }
.detail-privacy { display: flex; align-items: center; gap: 7px; }
.detail-privacy > svg { width: 16px; height: 16px; color: var(--success); }
.detail-avatar {
  border-radius: 16px; height: 220px; color: #fff; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px;
}
.da-mark { font-size: 64px; font-weight: 800; font-family: var(--serif, inherit); }
.da-name { font-size: 15px; font-weight: 700; opacity: .95; }
.detail-sample-label { font-size: 12px; }
.detail-sample {
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px;
  font-size: 12.5px; line-height: 1.7; color: var(--ink);
}
.detail-privacy { font-size: 11.5px; padding: 8px 10px; background: var(--panel); border-radius: 8px; }
.detail-right { flex: 1; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.detail-title { font-size: 20px; font-weight: 800; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.detail-pitch { font-size: 13px; line-height: 1.6; }
.detail-features { display: flex; flex-direction: column; gap: 8px; }
.detail-feat { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--ink); }
.df-dot {
  flex: 0 0 auto; width: 18px; height: 18px; border-radius: 6px; background: var(--gold-soft);
  color: var(--accent); font-size: 11px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700;
}
.detail-hire-label { font-size: 13px; font-weight: 700; color: var(--ink); margin-top: 4px; }
.detail-cycles { display: flex; gap: 10px; }
.cycle-card {
  position: relative; flex: 1; text-align: left; border: 1px solid var(--line); border-radius: 12px;
  padding: 12px 14px; background: var(--card); display: flex; flex-direction: column; gap: 3px;
}
.cycle-card.active { border-color: var(--gold); background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold); }
.cycle-best {
  position: absolute; top: -1px; right: -1px; background: var(--gold); color: #fff;
  font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 0 12px 0 10px;
}
.cycle-label { font-size: 12.5px; color: var(--muted); }
.cycle-price { font-size: 22px; font-weight: 800; color: var(--ink); }
.cycle-price span { font-size: 12px; font-weight: 400; color: var(--muted); margin-left: 2px; }
.cycle-sub { font-size: 11px; }
.detail-actions { display: flex; gap: 10px; align-items: center; margin-top: 4px; }
.detail-actions .primary { flex: 1; padding: 12px; font-size: 14px; }
.detail-foot { font-size: 11px; line-height: 1.5; }

/* 顶栏账户图标(用户中心/积分流水/任务中心):点开弹窗。紧凑,不抢积分/充值的位置 */
.icon-btn {
  position: relative; width: 34px; height: 32px; border-radius: 9px; font-size: 17px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent;
}
.icon-btn:hover { background: var(--gold-soft); border-color: var(--line); }
.icon-btn .badge {
  position: absolute; top: -2px; right: -2px; min-width: 15px; height: 15px; padding: 0 3px;
  border-radius: 999px; background: var(--danger); color: #fff; font-size: 10px; line-height: 15px;
}
/* 任务中心弹窗:7 列表格,要比默认 modal 宽 */
.tasks-modal-card { width: 760px; max-width: 92vw; }
.uc-modal-card { width: 640px; max-width: 92vw; }
.modal-head { display: flex; align-items: center; gap: 10px; }
.modal-head b { font-size: 15px; }

/* 用户中心弹窗内容:总览卡 + tab + 账单表。数字全后端来,这里只管排布 */
#user-center-view .uc-body { max-height: 44vh; overflow-y: auto; }
.uc-overview { display: flex; gap: 14px; flex-wrap: wrap; align-items: stretch; margin-bottom: 16px; }
.uc-bal-card {
  background: var(--dark); color: #fff; border-radius: 16px; padding: 18px 22px;
  min-width: 180px; display: flex; flex-direction: column; justify-content: center;
}
.uc-bal-num { font-size: 32px; font-weight: 800; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.uc-bal-card .uc-bal-label { color: #d8c9a8; font-size: 12px; margin-top: 2px; }
.uc-est { display: flex; gap: 12px; }
.uc-est-item {
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  padding: 16px 20px; display: flex; flex-direction: column; gap: 3px; justify-content: center; min-width: 120px;
}
.uc-est-item b { font-size: 22px; font-weight: 800; color: var(--gold); }
.uc-est-item span { font-size: 12px; }
.uc-member {
  align-self: center; padding: 8px 14px; border-radius: 999px; font-size: 12.5px;
  background: var(--gold-soft); color: var(--accent);
}
.uc-member.active { font-weight: 700; }
.uc-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); margin-bottom: 14px; overflow-x: auto; }
.uc-tab {
  flex: 0 0 auto; white-space: nowrap; padding: 8px 12px; font-size: 13px;
  color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.uc-tab:hover { color: var(--ink); }
.uc-tab.active { color: var(--accent); font-weight: 700; border-bottom-color: var(--gold); }
.uc-tab.coming { color: var(--muted); opacity: .55; cursor: default; }
.uc-filter { display: flex; gap: 8px; margin-bottom: 12px; }
.uc-filter .pill.active { border-color: var(--gold); color: var(--gold); font-weight: 700; }
.uc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.uc-table th {
  text-align: left; padding: 8px 10px; color: var(--muted); font-weight: 600; font-size: 12px;
  border-bottom: 1px solid var(--line);
}
.uc-table td { padding: 9px 10px; border-bottom: 1px solid var(--line); }
.uc-table .plus { color: var(--success); font-weight: 700; }
.uc-table .minus { color: var(--danger); font-weight: 700; }
.uc-invite-code { font-size: 14px; margin-bottom: 12px; }
.uc-invite-code b { font-size: 20px; color: var(--gold); letter-spacing: .1em; margin-left: 8px; }
.uc-invite-stats { display: flex; gap: 20px; font-size: 13px; }
.uc-invite-stats b { color: var(--ink); font-size: 16px; margin-left: 4px; }
.uc-hint { padding: 24px 0; font-size: 13px; line-height: 1.6; }

/* 画廊批量选择:选中条常驻在网格上方,选了几张一眼可见 */
.pick-bar {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
  background: var(--gold-soft); border: 1px solid var(--line);
  border-radius: 999px; padding: 6px 10px 6px 16px;
}
.pick-bar .danger { border-color: var(--danger); color: var(--danger); }
.pick-bar .danger:hover { background: var(--danger); color: #fff; }
.asset-card { position: relative; }
/* 勾选框:平时半隐,悬停或已选时实体——不打扰看图,但要找得到 */
.pick-wrap {
  position: absolute; top: 8px; left: 8px; z-index: 2; padding: 4px;
  background: rgba(255, 255, 255, .82); border-radius: 8px;
  opacity: 0; transition: opacity .12s;
}
.asset-card:hover .pick-wrap, .asset-card.picked .pick-wrap { opacity: 1; }
.pick-wrap input { width: 16px; height: 16px; accent-color: var(--gold); cursor: pointer; }
.asset-card.picked { outline: 2px solid var(--gold); outline-offset: -2px; }
/* 微信支付二维码:留白是扫码识别率的一部分,别把码压太小(≥200px 手机才好扫) */
.pay-qr-box { display: flex; justify-content: center; padding: 12px 0; }
.pay-qr {
  width: 220px; height: 220px; background: #fff; border-radius: 12px;
  padding: 10px; border: 1px solid var(--line);
}
/* 验证码行:输入框占满,发码按钮定宽不被挤扁(倒计时文案比按钮文案长) */
.sms-row { display: flex; gap: 8px; }
.sms-row input { flex: 1; min-width: 0; }
.sms-row button { flex: 0 0 auto; white-space: nowrap; padding: 10px 12px; }
.brand { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.brand-mark {
  background: linear-gradient(135deg, #c9a56a, #a6814c); color: #fff;
  width: 28px; height: 28px; border-radius: 10px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center; font-size: 14px;
  box-shadow: 0 6px 14px -6px rgba(184, 146, 90, .7);
}
/* 图形标(ui_configs.brand.logo);与字标同尺寸同圆角,两者互斥,换标只换配置不动样式 */
.brand-logo {
  width: 28px; height: 28px; border-radius: 10px; vertical-align: middle;
  box-shadow: 0 6px 14px -6px rgba(46, 42, 34, .45);
}

/* 布局 */
.app { display: flex; flex-direction: column; height: 100vh; }
.topbar {
  display: flex; align-items: center; justify-content: space-between;
  height: 65px; flex: 0 0 65px; padding: 0 20px;
  background: var(--nav-bg); border-bottom: 1px solid var(--nav-line);
}
.topbar-right { display: flex; align-items: center; gap: 12px; }
.topbar .brand { color: var(--nav-text); }
.topbar .muted { color: var(--nav-muted); }
.topbar .ghost, #nav-handle { color: var(--nav-soft); }
.topbar .ghost:hover, .topbar .icon-btn:hover { background: var(--nav-bg2); border-color: var(--nav-line); }

/* ===== 无边框桌面壳:全局窗口标题栏(仿 Windows 标题栏) =====
   单一标题栏,登录/主界面共用,永远在窗口最顶一条:整条可拖动、双击最大化/还原,右侧三键。
   ⛔窗口三键只此一处(#app-titlebar 内);内容顶栏不再当拖拽区。仅壳模式显示,浏览器版零影响。 */
.win-titlebar { display: none; }
body.shell-frameless .win-titlebar {
  display: flex; align-items: center; justify-content: space-between;
  position: fixed; top: 0; left: 0; right: 0; height: var(--titlebar-h);
  padding: 0 0 0 14px; box-sizing: border-box;
  background: var(--nav-bg); border-bottom: 1px solid var(--nav-line);
  -webkit-app-region: drag; z-index: 1000; user-select: none;
}
.win-titlebar-brand { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13px; color: var(--nav-text); }
.win-titlebar-brand .brand-mark { width: 20px; height: 20px; border-radius: 7px; font-size: 12px; box-shadow: none; }
.win-titlebar-brand .brand-logo { width: 20px; height: 20px; border-radius: 7px; box-shadow: none; }
/* 壳模式:内容整体下移一条标题栏,躲开固定标题栏(body 100vh + overflow:hidden,必须扣掉高度,否则出滚动条) */
body.shell-frameless .login-wrap,
body.shell-frameless .app { height: calc(100vh - var(--titlebar-h)); margin-top: var(--titlebar-h); }
/* Pencil 定稿在窗口标题栏下仍保留产品级导航品牌，浏览器版与壳保持同一结构。 */

/* 窗口三键:仿 Windows 几何(满高矩形、无圆角),配色仍随应用;关闭悬停转红 */
.win-controls { display: flex; align-items: center; -webkit-app-region: no-drag; }
.win-btn {
  -webkit-app-region: no-drag; width: 46px; height: var(--titlebar-h); border: 0;
  background: transparent; color: var(--nav-soft); border-radius: 0;
  display: grid; place-items: center; cursor: pointer; transition: background .12s, color .12s;
}
.win-btn:hover { background: var(--nav-bg2); color: var(--nav-text); }
.win-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.win-close:hover { background: var(--danger); color: #fff; }
.win-btn svg { width: 13px; height: 13px; pointer-events: none; stroke-width: 1.5; }
/* 最大化/还原图标随窗口态切换(仿 Windows) */
.win-btn .ic-restore { display: none; }
body.win-maximized .win-btn .ic-max { display: none; }
body.win-maximized .win-btn .ic-restore { display: inline; }
.points { background: var(--gold-soft); border-radius: 999px; padding: 5px 14px; font-size: 13px; }
/* 今日对话额度(T11 §8.10.4:商家侧可见性;low=快用完时变琥珀) */
.quota-pill {
  border: 1px solid var(--nav-line); border-radius: 999px; padding: 4px 12px; font-size: 12px;
  color: var(--nav-soft); background: var(--nav-bg2); white-space: nowrap;
}
.quota-pill.low { border-color: #c8862f; color: #a5691b; background: #fbf1df; font-weight: 700; }
.body { flex: 1; display: flex; min-height: 0; }

/* 侧栏 */
.sidebar {
  width: 184px; flex-shrink: 0; background: var(--nav-bg); border-right: 1px solid var(--nav-line);
  padding: 14px 10px; display: flex; flex-direction: column; gap: 2px;
}
.nav-group-title { font-size: 11px; color: var(--nav-muted); margin: 10px 6px 4px; }
.nav-item {
  text-align: left; padding: 8px 10px; border-radius: 8px; font-size: 14px;
  color: var(--nav-soft); text-decoration: none; display: flex; align-items: center; gap: 10px;
}
.nav-item:hover { background: var(--nav-active); }
.nav-item.active { background: var(--nav-active); color: var(--gold); font-weight: 600; }
#nav-toggle { color: var(--nav-soft); }
#nav-toggle:hover { background: var(--nav-bg2); }

/* 资产区 */
.library { flex: 1; min-width: 340px; padding: 18px; overflow-y: auto; }
.body { overflow-x: auto; }
@media (max-width: 1100px) { .chat { width: 300px; } }
.library-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.library-head h2 { font-size: 20px; }
.upload-label { display: inline-flex; align-items: center; }
.folders { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.folder {
  border: 1px solid var(--line); background: var(--panel); border-radius: var(--radius);
  padding: 12px 16px; min-width: 110px; cursor: pointer; font-size: 13px;
}
.folder.active { border-color: var(--gold); background: var(--gold-soft); }
.folder .count { color: var(--muted); font-size: 11px; margin-top: 4px; }
.asset-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px;
}
.asset-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden;
}
/* 缩略图封面:默认 9:16,任意源图 contain 全图可见(不裁切),深色留边(呼应黑金);视频带首帧封面+播放角标 */
.asset-card .thumb { position: relative; aspect-ratio: 9 / 16; background: var(--thumb-bg); overflow: hidden; display: block; }
.asset-card .thumb img, .asset-card .thumb video {
  width: 100%; height: 100%; object-fit: contain; display: block; background: var(--thumb-bg);
}
.asset-card .thumb .play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 44px; height: 44px; border-radius: 50%; background: var(--nav-text);
  color: var(--thumb-bg); display: flex; align-items: center; justify-content: center;
  font-size: 15px; padding-left: 3px; pointer-events: none;
}
.asset-card .thumb .dur:not(:empty) {
  position: absolute; right: 6px; bottom: 6px; background: var(--nav-bg);
  color: var(--nav-text); font-size: 10.5px; line-height: 1.4; padding: 1px 6px; border-radius: 6px;
}
.asset-card .name {
  padding: 8px 10px 2px; min-height: 40px; font-size: 13px; overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.asset-card .time { padding: 0 10px 8px; font-size: 11px; color: var(--muted); }
.asset-card .del { float: right; color: var(--muted); font-size: 12px; }
.asset-card .del:hover { color: var(--danger); }
.asset-card .mv { float: right; color: var(--muted); font-size: 11px; }
.asset-card .mv:hover { color: var(--gold); }
.folder { position: relative; }
.folder .fdel {
  position: absolute; top: 4px; right: 6px; color: var(--muted); font-size: 13px;
  display: none;
}
.folder:hover .fdel { display: block; }
.folder .fdel:hover { color: var(--danger); }
.empty { color: var(--muted); padding: 40px 0; text-align: center; grid-column: 1/-1; }
/* 款组头:横跨整行,把「我的作品」按款(锚平铺图)切成一段一段 */
.style-group-head {
  grid-column: 1/-1; display: flex; align-items: baseline; gap: 8px;
  padding: 6px 2px; border-bottom: 1px solid var(--line);
}
.style-group-head .sg-name { font-size: 14px; font-weight: 600; }
.style-group-head .sg-count { font-size: 11px; color: var(--muted); }

/* 对话面板 */
.chat {
  width: 360px; flex-shrink: 0; border-left: 1px solid var(--line); background: var(--panel);
  display: flex; flex-direction: column; min-height: 0;
}
/* 会话 tab 条(设计帧「屏9」/「F·Conv Tabs」)。
   ⛔ tab 多了要横向滚,绝不换行也绝不压缩——被挤成竖排字是这块以前最难看的地方。 */
.conv-tabs {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 10px 0; border-bottom: 1px solid var(--line);
}
.conv-tabs.empty { padding-bottom: 8px; }
.conv-tab-list {
  display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none;
  flex: 0 1 auto; min-width: 0;
}
.conv-tab-list::-webkit-scrollbar { display: none; }
.conv-tab {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: 0 0 auto;
  border: 1px solid var(--line); border-bottom: none;
  border-radius: 10px 10px 0 0; padding: 6px 10px; font-size: 12.5px;
  background: var(--panel); color: var(--muted);
}
.conv-tab:hover { color: var(--ink); }
.conv-tab.active {
  background: var(--card); color: var(--ink); font-weight: 700;
  border-color: var(--gold); box-shadow: inset 0 2px 0 var(--gold);
}
.conv-tab .ct-x { color: var(--muted); font-size: 13px; padding: 0 2px; border-radius: 4px; }
.conv-tab .ct-x:hover { background: var(--danger); color: #fff; }
/* 会话角标(真实数据):● 在拍呼吸点、产出数金色小徽标 */
.conv-tab .ct-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--danger); display: inline-block; margin: 0 4px; animation: ct-breathe 1.4s ease-in-out infinite; }
.conv-tab .ct-out { font-size: 11px; color: var(--gold); background: var(--gold-soft); border-radius: 8px; padding: 0 5px; margin: 0 3px; }
.conv-tab .ct-expert { color: var(--gold); font-size: 10px; font-weight: 700; }
.conv-tab .ct-child { min-width: 16px; padding: 0 4px; border-radius: 999px; background: var(--gold-soft); color: var(--gold-deep); font-size: 10px; }
@keyframes ct-breathe { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.conv-new { flex: 0 0 auto; white-space: nowrap; color: var(--gold); font-size: 12.5px; padding: 6px 8px; }
.conv-new:hover { text-decoration: underline; }
/* ⛔条上每个非 tab 的东西都要 nowrap + 不参与收缩:360px 侧栏里少写一个,
   它就被压成竖排字(「归档查看」实测被挤成两行高 43px)。这条 tab 条自己就栽过一次。 */
.conv-tabs > .spacer { flex: 1 1 auto; min-width: 0; }
.conv-tabs #btn-archived { flex: 0 0 auto; white-space: nowrap; padding: 4px 6px; }
.chat-head {
  padding: 12px 14px; border-bottom: 1px solid var(--line); font-weight: 600;
  display: flex; align-items: center; gap: 8px;
}
/* 换人浮层:贴着对话头部右侧落下,只列在职员工 */
.chat { position: relative; }
.agent-switch {
  position: absolute; top: 92px; right: 12px; z-index: 30; min-width: 148px;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 18px 40px -20px rgba(33, 30, 24, .5); padding: 6px; overflow: hidden;
}
.agent-switch-row {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
  padding: 7px 8px; border-radius: 8px; font-size: 13px; white-space: nowrap;
}
.agent-switch-row:hover { background: var(--gold-soft); }
.as-mark {
  width: 22px; height: 22px; border-radius: 7px; color: #fff; font-size: 12px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
/* 头部只剩身份 + 状态 + 换人 + 定制:会话控件已挪去 tab 条,这里永远不该再挤 */
.agent-title { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.agent-title b { font-size: 14px; white-space: nowrap; }
.agent-title em { font-style: normal; font-size: 11px; }
.agent-avatar {
  background: var(--gold); color: #fff; width: 26px; height: 26px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
}
.dot { width: 8px; height: 8px; border-radius: 50%; margin-left: auto; }
.dot.online { background: var(--success); }
.dot.offline { background: #c9b99a; }
.chat-log { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.msg { max-width: 85%; padding: 11px 14px; border-radius: 12px; font-size: 13px; line-height: 1.65; white-space: pre-wrap; }
.msg.agent { background: var(--card); border: 1px solid var(--line); border-radius: 4px 16px 16px 16px; align-self: flex-start; }
.msg.user {
  background: var(--gold-soft); color: #7a5c2e; font-weight: 600;
  border-radius: 16px 4px 16px 16px; align-self: flex-end;
}
.msg.error { border-color: var(--danger); color: var(--danger); }
.msg .retry { color: var(--gold); font-size: 12px; margin-top: 6px; display: inline-block; }
.draft-assets, .asset-refs { display: flex; gap: 8px; flex-wrap: wrap; padding: 8px 12px 0; }
.asset-ref {
  display: flex; align-items: center; gap: 8px; max-width: 220px; padding: 6px 9px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--card); font-size: 12px;
}
.asset-ref img, .asset-ref video { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; background: var(--bg); }
.asset-ref span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attachment-ref { color: inherit; font: inherit; cursor: pointer; text-align: left; }
.attachment-ref > svg { width: 24px; height: 24px; color: var(--gold); flex: 0 0 auto; }
.attachment-remove { font-size: 18px; line-height: 1; color: var(--muted); padding: 2px; }
.message-attachments { padding: 8px 0 0; }
/* Composer(设计稿 component/Composer:大圆角输入框内嵌📷 + 圆角金色↑钮 + 底部人话 hint) */
.chat-input { display: flex; align-items: center; gap: 10px; padding: 10px 12px 4px; border-top: 1px solid var(--line); }
.input-field {
  flex: 1; display: flex; align-items: center; gap: 8px; background: #fff;
  border: 1px solid var(--line); border-radius: 16px; padding: 6px 12px;
  box-shadow: 0 4px 14px -6px rgba(33, 30, 24, .15); transition: border-color .15s;
}
.input-field:focus-within { border-color: var(--gold); }
.input-field textarea {
  flex: 1; resize: none; border: none; outline: none; padding: 6px 0;
  font: inherit; font-size: 13.5px; background: transparent; max-height: 96px;
}
.icon-btn { font-size: 17px; line-height: 1; padding: 4px; border-radius: 8px; flex-shrink: 0; }
.icon-btn:hover { background: var(--gold-soft); }
.send-btn {
  width: 44px; height: 44px; border-radius: 14px; flex-shrink: 0;
  background: linear-gradient(180deg, #c9a56a, #ad8850); color: #fff;
  font-size: 19px; font-weight: 700; box-shadow: var(--glow);
  transition: filter .15s, transform .1s;
}
.send-btn:hover { filter: brightness(1.06); }
.send-btn:active { transform: scale(.95); }
.composer-hint { text-align: center; font-size: 11px; color: var(--muted); padding: 4px 12px 10px; }

/* T12 商用:维护条 / 协议同意条 / 备案页脚 */
.maint-bar {
  background: #fbf1df; color: #a5691b; border-bottom: 1px solid #e6cfa4;
  text-align: center; padding: 8px 12px; font-size: 13px; font-weight: 700;
}
.consent-bar {
  background: var(--panel); border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 10px; padding: 8px 18px; font-size: 12.5px;
}
.consent-bar a { color: var(--gold); }
.consent-bar .pill { margin-left: auto; }
.login-slogan { text-align: center; font-size: 13px; margin-top: -6px; }
.login-slogan:empty { display: none; }
.login-legal { text-align: center; font-size: 12px; }
.login-legal a { color: var(--gold); }
.icp-footer { text-align: center; font-size: 11px; line-height: 1.7; }
.icp-footer a { color: inherit; }

/* 公告横幅 + 报价确认卡 */
.banner {
  background: var(--gold-soft); color: var(--accent); text-align: center;
  padding: 6px 12px; font-size: 13px; border-bottom: 1px solid var(--line);
}
.quote-card {
  margin: 10px 12px 0; border: 1px solid var(--gold); border-radius: 12px;
  background: var(--dark); color: var(--nav-soft); padding: 12px; font-size: 13px;
  display: flex; flex-direction: column; gap: 6px;
}
.quote-card .quote-title, .quote-card b { font-weight: 600; color: var(--gold); }
.quote-card .muted { color: var(--nav-soft); }
.quote-card .approve { align-self: flex-start; padding: 5px 14px; font-size: 13px; }

/* 弹层 */
.modal {
  position: fixed; inset: 0; background: rgba(61, 54, 41, .35);
  display: flex; align-items: center; justify-content: center; z-index: 10;
}
.modal-card {
  background: var(--panel); border-radius: 16px; padding: 26px; width: 400px;
  display: flex; flex-direction: column; gap: 14px; max-height: 80vh; overflow-y: auto;
}
.modal-card.wide { width: 560px; }
.agent-home-content { display: contents; }
.ui-dialog { z-index: 1200; }
#ui-dialog .modal-card { width: min(420px, calc(100vw - 32px)); }
.ui-dialog-message { margin: 12px 0 18px; white-space: pre-wrap; overflow-wrap: anywhere; }
.ui-dialog .text-input { width: 100%; margin: 0 0 18px; }
.ui-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; }
.agent-diagnostic {
  margin: 10px 12px 0; padding: 12px; border: 1px solid var(--danger);
  border-radius: var(--radius-card); background: var(--card);
}
.agent-diagnostic > div:first-child { display: flex; flex-direction: column; gap: 4px; }
.agent-diagnostic code { display: block; margin: 10px 0; color: var(--muted); overflow-wrap: anywhere; }
.agent-diagnostic-actions { display: flex; gap: 8px; }
.packages { display: flex; flex-direction: column; gap: 10px; }
.package {
  border: 1px solid var(--line); border-radius: var(--radius); padding: 14px;
  display: flex; justify-content: space-between; align-items: center; cursor: pointer;
  width: 100%; text-align: left; font-size: inherit; /* 审查 P1:真按钮语义下保持原观感 */
}
.package:hover { border-color: var(--gold); }
.package .pts { font-weight: 600; color: var(--accent); }
#recharge-modal .packages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#recharge-modal .package {
  min-height: 126px; align-items: flex-start; align-content: space-between; flex-direction: column; gap: 10px;
  border-radius: var(--radius-card); background: var(--card);
}
#recharge-modal .pkg-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; width: 100%; }
#recharge-modal .pkg-name { font-family: var(--font-display); font-size: 16px; }
#recharge-modal .pkg-price { font-weight: 800; }
#recharge-modal .pkg-total { color: var(--gold); font-weight: 800; }
#recharge-modal .pkg-est { font-size: 12px; }
#recharge-modal .custom-amount-row { padding: 14px; border: 1px solid var(--line); border-radius: var(--radius-card); }
@media (max-width: 1100px) {
  #recharge-modal .packages { grid-template-columns: 1fr; }
}
.table { width: 100%; border-collapse: collapse; font-size: 13px; }
.table th, .table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line); }
.table .plus { color: var(--success); }
.table .minus { color: var(--danger); }

/* 任务中心 */
.badge {
  background: var(--gold); color: #fff; border-radius: 999px; font-size: 11px;
  padding: 1px 7px; margin-left: 6px; display: inline-block;
}
.task-filter { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.task-filter .pill.active { border-color: var(--gold); background: var(--gold-soft); color: var(--accent); }
.task-status { border-radius: 999px; padding: 2px 10px; font-size: 12px; white-space: nowrap; }
.task-status.queued { background: var(--gold-soft); color: var(--accent); }
.task-status.running { background: #e3edd9; color: #5a9e6f; }
.task-status.done { background: #eee6d8; color: var(--ink); }
.task-status.failed { background: #f3e0da; color: var(--danger); }
.task-bar {
  width: 90px; height: 6px; border-radius: 999px; background: var(--gold-soft);
  display: inline-block; margin-right: 8px; vertical-align: middle; overflow: hidden;
}
.task-bar i { display: block; height: 100%; background: var(--gold); border-radius: 999px; }

/* ===== 三期增量:客户档案 / 文案助手 / 会员套餐 / 邀请返利(统一奶油金体系,集中追加) ===== */
.member-badge {
  background: var(--gold-soft); border: 1px solid var(--gold); color: var(--accent);
  border-radius: 999px; padding: 4px 12px; font-size: 12px; white-space: nowrap;
}
.pill.tiny { padding: 3px 10px; font-size: 12px; }
.view-hint {
  color: var(--accent); font-size: 12px; margin-bottom: 14px;
  background: var(--gold-soft); border-radius: 8px; padding: 8px 12px; display: inline-block;
}
.text-input {
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
  font: inherit; background: #fff;
}
.text-input.grow { flex: 1; min-width: 160px; }
.row-line { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.modal-card select {
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
  font: inherit; background: #fff; color: var(--ink);
}

/* 客户档案 */
.customer-list { display: flex; flex-direction: column; gap: 12px; }
.customer-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 12px 14px; display: grid; grid-template-columns: 56px 1fr auto;
  gap: 12px; align-items: center;
}
.customer-photo {
  width: 56px; height: 56px; border-radius: 10px; background: var(--gold-soft);
  color: var(--accent); display: flex; align-items: center; justify-content: center;
  font-size: 20px; overflow: hidden; flex-shrink: 0;
}
.customer-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.customer-info { min-width: 0; }
.customer-name { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.customer-size {
  background: var(--gold-soft); color: var(--accent); border-radius: 999px;
  font-size: 11px; padding: 1px 8px; font-weight: 400;
}
.customer-ops { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.customer-feedback {
  grid-column: 1 / -1; border-top: 1px dashed var(--line); padding-top: 8px;
  display: flex; flex-direction: column; gap: 6px; font-size: 12px;
}
.fb-line { display: flex; align-items: center; gap: 8px; color: var(--muted); }

/* 作品卡片动作行(文案 / 客户反馈) */
.card-actions { display: flex; gap: 6px; padding: 0 10px 10px; }

/* 文案助手 */
.copy-content {
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg);
  padding: 12px 14px; font-size: 13px; line-height: 1.7; white-space: pre-wrap;
  max-height: 240px; overflow-y: auto;
}
.copy-content.empty { color: var(--muted); text-align: center; }
.copy-versions { display: flex; flex-direction: column; gap: 6px; max-height: 160px; overflow-y: auto; }
.copy-version {
  border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px;
  font-size: 12px; color: var(--muted); cursor: pointer;
}
.copy-version:hover { border-color: var(--gold); }
.copy-version.active { border-color: var(--gold); background: var(--gold-soft); color: var(--accent); }

/* 会员套餐(充值弹层内) */
.package.plan .cycle-badge {
  background: var(--gold-soft); color: var(--accent); border-radius: 999px;
  font-size: 11px; padding: 1px 8px; margin-right: 4px;
}
.package.plan.featured { border-color: var(--gold); background: var(--gold-soft); }
.package.plan.featured .cycle-badge { background: var(--gold); color: #fff; }

/* 邀请有礼 */
.invite-code-box {
  display: flex; align-items: center; gap: 10px; background: var(--gold-soft);
  border: 1px dashed var(--gold); border-radius: var(--radius); padding: 12px 16px;
}
.invite-code-box span {
  font-size: 22px; letter-spacing: 4px; font-weight: 700; color: var(--accent);
  flex: 1; user-select: all;
}
.invite-stats { display: flex; gap: 10px; }
.invite-stats > div {
  flex: 1; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 10px; text-align: center; display: flex; flex-direction: column; gap: 4px;
}
.invite-stats b { font-size: 18px; color: var(--accent); }
.invite-stats span { font-size: 11px; color: var(--muted); }

/* ============ 设计稿落地:黑金细节 / 金色辉光 / 字重对比(2026-07-17) ============ */
/* 登录页金色光晕背景 + 大圆角卡 */
.login-wrap {
  background:
    radial-gradient(420px circle at 22% 28%, rgba(184, 146, 90, .12), transparent 60%),
    radial-gradient(480px circle at 82% 76%, rgba(201, 165, 106, .10), transparent 62%),
    var(--bg);
}
.login-card { border-radius: 28px; box-shadow: 0 40px 90px -55px rgba(33, 30, 24, .45); }
/* 积分/价格用 tabular 粗数字 */
.points b { font-variant-numeric: tabular-nums; font-weight: 800; letter-spacing: .01em; }
.package .pts, .quote-card b { font-variant-numeric: tabular-nums; }
/* 会员身份徽标:黑金 */
.member-badge {
  background: linear-gradient(135deg, var(--dark), var(--dark2)) !important;
  color: #f0e0c0 !important; border: 1px solid rgba(184, 146, 90, .5);
  box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .5); font-weight: 700;
}
/* 会员主推卡:黑金 + 辉光；不缩放，避免突破网格单元。 */
.package.plan.featured {
  background: linear-gradient(160deg, var(--dark), var(--dark2)) !important;
  border: 1px solid rgba(184, 146, 90, .5) !important;
  box-shadow: var(--glow), 0 24px 52px -24px rgba(0, 0, 0, .55);
  color: #f2e8d6;
}
.package.plan.featured .pts,
.package.plan.featured .price { color: #f2e8d6; }
.package.plan.featured .cycle-badge {
  background: linear-gradient(180deg, #c9a56a, #ad8850) !important; color: #fff !important;
}
/* 作品卡大圆角 + 辉光 hover */
.asset-card { border-radius: var(--r-card); transition: transform .15s, box-shadow .15s; }
.asset-card:hover { transform: translateY(-4px); box-shadow: var(--glow); }
/* 报价确认卡 hover 辉光 */
.quote-card { box-shadow: 0 10px 30px -18px rgba(184, 146, 90, .5); }


/* hidden 属性必须赢过 .nav-item 的 display 规则(商户绝不该看到后台入口) */
.nav-item[hidden], [hidden] { display: none !important; }

/* ===== 对话即工作台(任务书 T3–T6)===== */

/* 快捷任务 chips(文案来自 ui_configs.copy.quick_actions;首个为主 chip 金色高亮) */
.chips { display: flex; gap: 8px; flex-wrap: wrap; padding: 8px 12px 0; }
.chips .pill { background: #fff; }
.chips .pill.primary {
  background: var(--gold-soft); border-color: rgba(184, 146, 90, .45);
  color: #7a5c2e; font-weight: 700;
}
/* 建议按钮(智能体回复里的「▸ 」行与编号选项 → 可点,任务书 §8.6/8.8) */
.sug-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.sug-chips .pill { background: #fff; font-size: 12px; padding: 4px 12px; }
.sug-chips .pill:hover { background: var(--gold-soft); color: #7a5c2e; }
/* 「用这件」:画廊卡上的资产引用按钮(设计稿 D/E 屏) */
.card-actions .pill.use {
  background: var(--gold-soft); border-color: rgba(184, 146, 90, .45);
  color: #7a5c2e; font-weight: 700;
}

/* 聊天内传图:kind 三选浮层 */
.chat-input { position: relative; }
.kind-pop {
  position: absolute; bottom: 100%; left: 10px; margin-bottom: 6px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
  padding: 8px; display: flex; gap: 6px; z-index: 30; box-shadow: var(--glow);
}
.kind-pop .pill.active { border-color: var(--gold); color: var(--gold); }

/* 回复内媒体(任务书 T17:图/视频混排 + 勾选 + 悬停重拍 + lightbox) */
.msg img.reply-img {
  max-width: 100%; border-radius: 10px; display: block;
  background: #eee6d8; min-height: 60px; cursor: zoom-in;
}
.msg video.reply-video { max-width: 100%; border-radius: 10px; display: block; background: #211e18; }
.rmedia { position: relative; margin-top: 6px; }
.rmedia .ck {
  position: absolute; top: 6px; left: 6px; width: 20px; height: 20px; border-radius: 50%;
  background: rgba(255, 255, 255, .85); border: 1px solid var(--line); color: transparent;
  font-size: 12px; display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.rmedia.sel .ck { background: var(--gold); border-color: var(--gold); color: #fff; }
.rmedia .ck svg { width: 12px; height: 12px; }
.rmedia.sel img, .rmedia.sel video { outline: 2px solid var(--gold); outline-offset: -2px; }
.rmedia .retake {
  position: absolute; right: 6px; bottom: 6px; display: none;
  background: rgba(33, 30, 24, .85); color: #fff; border-radius: 999px;
  font-size: 11px; padding: 4px 10px;
}
.rmedia:hover .retake { display: inline-flex; align-items: center; gap: 5px; }
.rmedia .retake svg { width: 12px; height: 12px; }
.media-batch {
  display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 12px;
  background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px;
}
.media-batch .dl {
  margin-left: auto; background: linear-gradient(180deg, #c9a56a, #ad8850); color: #fff;
  border-radius: 999px; padding: 4px 13px; font-weight: 700; font-size: 12px;
}
.media-batch a { color: var(--gold); cursor: pointer; }
/* 大图预览 */
.lightbox {
  position: fixed; inset: 0; z-index: 95; background: rgba(33, 30, 24, .88);
  display: flex; align-items: center; justify-content: center; gap: 14px;
}
.lightbox img, .lightbox video { max-width: 82vw; max-height: 86vh; border-radius: 12px; }
.lb-nav {
  color: #f2e8d6; font-size: 42px; padding: 10px 16px; border-radius: 12px; flex-shrink: 0;
}
.lb-nav:hover { background: rgba(255, 255, 255, .12); }
/* §13.4 · 专家发言身份条(拍摄师是前台,其余专家发言时亮明身份) */
.speaker { display: flex; align-items: center; gap: 6px; margin: 8px 0 2px; }
.speaker .sm {
  width: 20px; height: 20px; border-radius: 7px; color: #fff; font-size: 10px; font-weight: 700;
  font-family: "Noto Serif SC", serif; display: grid; place-items: center; flex-shrink: 0;
}
.speaker .sn { font-size: 11.5px; color: var(--muted); font-weight: 700; }
.msg.agent.by-expert { border-top-left-radius: 6px; }

/* T16 · 我的电子员工(市场) */
.experts-list { display: flex; flex-direction: column; gap: 10px; }
.expert-card {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 14px; background: var(--card);
}
.expert-card.coming { background: var(--panel); opacity: .85; }
.expert-card .em {
  width: 40px; height: 40px; border-radius: 13px; color: #fff; font-weight: 700; font-size: 16px;
  font-family: "Noto Serif SC", serif; display: grid; place-items: center; flex-shrink: 0;
}
.expert-card .ec { flex: 1; min-width: 0; }
.expert-card .en { font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.expert-card .ep { font-size: 12px; color: var(--muted); line-height: 1.6; }
.expert-card .epain { font-size: 11.5px; color: var(--muted); font-style: italic; }
.expert-card .price { font-size: 13px; font-weight: 700; color: #7a5c2e; white-space: nowrap; }
.expert-badge {
  font-size: 10px; padding: 1px 7px; border-radius: 999px;
  background: var(--gold-soft); color: #7a5c2e; font-weight: 700;
}
.expert-badge.ok { background: #e7f3ec; color: #4e8c6a; }
.experts-compare {
  text-align: center; padding: 10px; border-radius: 10px;
  background: var(--gold-soft); color: #7a5c2e; font-weight: 700; font-size: 12.5px;
}

/* T16 · 定制我的拍摄师 */
.persona-avatars { display: flex; gap: 8px; flex-shrink: 0; }
.persona-avatars .pa {
  width: 44px; height: 44px; border-radius: 14px; color: #fff; font-size: 17px; font-weight: 700;
  font-family: "Noto Serif SC", serif; display: grid; place-items: center; cursor: pointer;
  border: 2px solid transparent;
}
.persona-avatars .pa.sel { border-color: var(--ink); }
.persona-styles { display: flex; gap: 10px; }
.persona-styles .ps {
  flex: 1; border: 1px solid var(--line); border-radius: 12px; padding: 12px;
  cursor: pointer; background: #fff; text-align: left;
}
.persona-styles .ps.sel { border: 1.5px solid var(--gold); background: var(--gold-soft); }
.persona-styles .ps b { display: block; font-size: 13px; margin-bottom: 4px; }
.persona-styles .ps span { font-size: 11.5px; color: var(--muted); line-height: 1.5; }
.persona-styles .ps.sel b { color: #7a5c2e; }
.persona-fb {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
}
.persona-fb b { font-size: 12.5px; }
.pref-toggle { display: flex; align-items: center; gap: 8px; font-size: 12.5px; cursor: pointer; }
.pref-toggle input { accent-color: var(--gold); }
.grow { flex: 1; min-width: 0; }

/* T21 · 对比滑块(协议驱动:回复行「对比:A vs B」) + 规格弹出 + 分享海报 */
.cmp { position: relative; margin-top: 6px; border-radius: 10px; overflow: hidden; background: #eee6d8; }
.cmp img { width: 100%; display: block; }
.cmp .cmp-top { position: absolute; inset: 0; width: 50%; overflow: hidden; }
.cmp .cmp-top img { width: 100%; height: 100%; object-fit: cover; object-position: left; }
.cmp .cmp-bar { position: absolute; top: 0; bottom: 0; width: 3px; background: #fff; left: 50%; }
.cmp .cmp-knob {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 34px; height: 34px; border-radius: 50%; background: #fff; color: #7a5c2e;
  display: flex; align-items: center; justify-content: center; font-weight: 700;
  box-shadow: 0 4px 12px -2px rgba(33, 30, 24, .35); pointer-events: none; font-size: 14px;
}
.cmp input[type="range"] {
  position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; margin: 0;
}
.cmp .cmp-tag {
  position: absolute; top: 8px; font-size: 11px; font-weight: 700; color: #fff;
  background: rgba(33, 30, 24, .7); border-radius: 999px; padding: 2px 9px;
}
.cmp .cmp-tag.l { left: 8px; }
.cmp .cmp-tag.r { right: 8px; background: rgba(184, 146, 90, .9); }
.spec-pop {
  display: flex; flex-direction: column; gap: 6px; margin-top: 8px;
  border: 1px solid var(--gold); border-radius: 10px; background: var(--panel); padding: 10px;
}
.spec-pop label { display: flex; align-items: center; gap: 8px; font-size: 12.5px; cursor: pointer; }
.spec-pop input { accent-color: var(--gold); }
.spec-pop .go { align-self: flex-end; }
#poster-canvas { width: 100%; border-radius: 12px; border: 1px solid var(--line); }

/* 回到最新 + 思考中呼吸 */
.back-latest {
  position: absolute; z-index: 55; left: 50%; bottom: 132px; transform: translateX(-50%);
  background: var(--dark); color: #f2e8d6; border-radius: 999px; padding: 6px 14px;
  font-size: 12px; box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .5);
}
@keyframes breathe { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.msg.thinking { animation: breathe 1.6s ease-in-out infinite; }

/* T5 · 收起导航(56px 图标条;真图标 + title 提示全名,审查 P1 修正) */
.sidebar, #assets-view, .chat { transition: width .3s ease, flex-basis .3s ease; }
.nav-item .ni { font-style: normal; margin-right: 8px; }
body.nav-collapsed .sidebar { width: 56px; padding: 14px 6px; }
body.nav-collapsed .nav-item { padding: 8px 10px; width: 44px; }
body.nav-collapsed .nav-item .nl { display: none; }
body.nav-collapsed .nav-item .ni { margin-right: 0; font-size: 17px; }
body.nav-collapsed .nav-group-title { visibility: hidden; height: 6px; margin: 4px 0 0; }
body.nav-collapsed .badge { display: none; }

/* 方案 A：智能体主页面 / 业务页面两态。现有真实业务容器只换壳，不复制 API 与事件。 */
.topbar, .sidebar, .chat { position: relative; z-index: 20; }
.sidebar, #assets-view, .chat, .workspace-page {
  transition: width var(--workspace-ms) var(--workspace-easing),
              flex-basis var(--workspace-ms) var(--workspace-easing),
              opacity var(--workspace-ms) var(--workspace-easing),
              transform var(--workspace-ms) var(--workspace-easing);
}
body.nav-collapsed .sidebar { width: 64px; padding: 14px 10px; }
body.nav-collapsed .nav-item { width: 44px; height: 44px; padding: 0; justify-content: center; }
body.nav-collapsed .nav-count { display: none; }
body.agent-home #assets-view { flex: 0 0 clamp(320px, 25vw, 360px); min-width: 320px; }
body.agent-home .chat { width: auto; flex: 1; max-width: none; }
body.agent-home .chat-log,
body.agent-home .chat-input,
body.agent-home .chips,
body.agent-home .draft-assets,
body.agent-home .composer-hint,
body.agent-home #quote-cards,
body.agent-home .novice-guide { max-width: 780px; width: calc(100% - 32px); margin-left: auto; margin-right: auto; }
body.workspace-page-open .sidebar { width: 184px; padding: 14px 10px; }
body.workspace-page-open .nav-item { width: auto; justify-content: flex-start; padding: 8px 10px; }
body.workspace-page-open .nav-item .nl { display: inline; }
body.workspace-page-open .nav-group-title { visibility: visible; height: auto; margin: 10px 6px 4px; }
body.workspace-page-open .chat {
  width: 420px; flex: 0 0 420px;
  margin: 0; border: 0; border-radius: 0; overflow: hidden;
  background: #fffcf6;
  box-shadow: -12px 0 30px -28px rgba(33, 30, 24, .7);
}
body.workspace-page-open .conv-tabs,
body.workspace-page-open .chat-head { background: var(--nav-bg); color: var(--nav-text); border-color: var(--nav-line); }
body.workspace-page-open .chat-head .muted { color: var(--nav-muted); }
body.workspace-page-open .chat-head .pill { background: var(--gold); color: var(--nav-bg); border-color: var(--gold); }
body.workspace-page-open .input-field { min-height: 52px; border: 2px solid var(--gold); border-radius: var(--radius-panel); }
body.workspace-page-open .chat-input { padding: 12px 16px 6px; border-top-color: var(--gold); background: #fffcf6; }
body.workspace-page-open .composer-hint { background: #fffcf6; }
.workspace-page {
  position: fixed; top: var(--workspace-top, 99px); left: 184px; right: 420px; bottom: 0; inset-block-end: 0;
  z-index: 8; background: transparent; align-items: stretch; justify-content: stretch;
  border-radius: 0; overflow: hidden;
}
#expert-detail-modal.market-drawer {
  position: fixed; top: var(--workspace-top, 76px); left: 200px; right: 436px; bottom: 16px; z-index: 11;
  justify-content: flex-end; align-items: stretch; padding: 10px;
  background: color-mix(in srgb, var(--nav-bg) 22%, transparent); border-radius: var(--radius-dialog);
}
.workspace-page .modal-card,
.workspace-page .modal-card.wide,
.workspace-page .market-card,
.workspace-page .detail-card {
  width: 100%; max-width: none; height: 100%; max-height: none; padding: 26px 28px;
  border: 1px solid var(--line); border-radius: var(--radius-dialog); box-shadow: none;
}
.workspace-page .modal-head { min-height: 44px; }
.asset-detail-page { min-height: 100%; padding: 28px; background: var(--bg); overflow: auto; }
.asset-detail-head { min-height: 56px; display: flex; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.asset-detail-head h1 { margin: 0; font-family: var(--font-display); font-size: 28px; }
.asset-detail-head p { margin: 5px 0 0; }
.asset-detail-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: 16px; }
.asset-detail-media { min-height: 560px; border-radius: var(--radius-panel); overflow: hidden; background: var(--gold-soft); display: grid; place-items: center; }
.asset-detail-media img, .asset-detail-media video { width: 100%; height: 100%; max-height: 660px; object-fit: contain; background: #1f1b16; }
.asset-detail-info { min-height: 560px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-panel); background: var(--panel); }
.asset-detail-kind { color: var(--gold); font-size: 12px; letter-spacing: .08em; }
.asset-detail-info h1 { font-family: var(--font-display); font-size: 27px; margin: 10px 0 22px; }
.asset-detail-meta { display: grid; }
.asset-detail-meta > div { display: flex; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.asset-detail-meta span { color: var(--muted); }
.asset-detail-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.create-model-layout { display: grid; grid-template-columns: minmax(240px, .7fr) minmax(380px, 1.3fr); gap: 16px; }
.create-model-reference, .create-model-form { min-height: 570px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-panel); background: var(--panel); }
.create-model-reference { display: flex; flex-direction: column; gap: 8px; cursor: pointer; }
#create-model-preview { height: 320px; display: grid; place-items: center; overflow: hidden; border-radius: 10px; background: var(--gold-soft); color: var(--muted); }
#create-model-preview > svg { width: 52px; height: 52px; }
#create-model-preview img { width: 100%; height: 100%; object-fit: cover; }
.create-model-form { display: flex; flex-direction: column; gap: 22px; padding: 28px; }
.create-model-form h2 { margin: 0; font-family: var(--font-display); font-size: 24px; }
.create-model-form label { display: grid; gap: 8px; }
.create-model-submit { margin-top: auto; display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
.create-model-submit .error { margin-right: auto; }
@media (max-width: 1100px) {
  body.workspace-page-open .chat { width: 360px; flex-basis: 360px; }
  .workspace-page, .market-drawer { right: 376px; }
  #expert-detail-modal.market-drawer { right: 376px; }
  .asset-detail-layout, .create-model-layout { grid-template-columns: 1fr; }
  .asset-detail-media, .asset-detail-info, .create-model-reference, .create-model-form { min-height: 360px; }
}

/* T4 · chat_first:一条竖线滑动,画廊收窄为 312px 轨道,对话原地舒展 */
body.chat-first #assets-view { flex: 0 0 312px; min-width: 312px; overflow-y: auto; }
body.chat-first .chat { width: auto; flex: 1; max-width: none; }
body.chat-first .chat-log { max-width: 760px; width: 100%; margin: 0 auto; }
body.chat-first .chat-input, body.chat-first .chips, body.chat-first .draft-assets,
body.chat-first .composer-hint, body.chat-first #quote-cards { max-width: 760px; margin: 0 auto; width: 100%; }
body.chat-first.agent-home #assets-view { flex: 0 0 clamp(320px, 25vw, 360px); min-width: 320px; }
body.chat-first.agent-home .chat {
  width: auto; min-width: 0; max-width: none; flex: 1;
}
body.chat-first.agent-home .chat-log,
body.chat-first.agent-home .chat-input,
body.chat-first.agent-home .chips,
body.chat-first.agent-home .draft-assets,
body.chat-first.agent-home .composer-hint,
body.chat-first.agent-home #quote-cards { width: 100%; max-width: none; }
/* 业务页的智能体是固定右栏；本规则必须晚于 chat-first，避免其 flex:1 抢满页面。 */
body.chat-first.workspace-page-open .chat {
  width: 420px; min-width: 420px; max-width: 420px; flex: 0 0 420px;
}
body.chat-first.workspace-page-open:not(.workspace-overlay-open) #assets-view {
  flex: 1 1 auto; min-width: 340px;
}
body.chat-first.workspace-overlay-open #assets-view {
  width: auto; min-width: 0; flex: 1 1 auto; padding: 0; opacity: 0;
  overflow: hidden; pointer-events: none;
}
body.workspace-page-open #agent-start { display: none; }
body.chat-first.workspace-page-open .chat-log,
body.chat-first.workspace-page-open .chat-input,
body.chat-first.workspace-page-open .chips,
body.chat-first.workspace-page-open .draft-assets,
body.chat-first.workspace-page-open .composer-hint,
body.chat-first.workspace-page-open #quote-cards { width: 100%; max-width: none; }
@media (max-width: 1100px) {
  body.chat-first.workspace-page-open .chat {
    width: 360px; min-width: 360px; max-width: 360px; flex-basis: 360px;
  }
}
body.chat-first #assets-view .asset-grid {
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px;
}
body.chat-first #assets-view .library-head h2 { font-size: 16px; }

/* T10 · 万能收料箱弹层(设计稿「服装档案·万能收料箱」) */
.intake-card { width: 640px; }
.intake-head { display: flex; justify-content: space-between; align-items: flex-start; }
.intake-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; min-height: 130px; border: 1.5px dashed var(--gold); border-radius: 14px;
  background: var(--bg); cursor: pointer; text-align: center; padding: 14px;
}
.intake-drop:hover { background: var(--gold-soft); }
.intake-drop-title { font-weight: 700; font-size: 14.5px; }
.intake-queue { display: flex; flex-direction: column; gap: 8px; max-height: 220px; overflow-y: auto; }
.intake-row {
  display: flex; align-items: center; gap: 10px; border: 1px solid var(--line);
  border-radius: 10px; padding: 9px 12px; background: #fff; font-size: 13px;
}
.intake-row .tag {
  background: var(--bg); color: var(--muted); border-radius: 999px;
  font-size: 10.5px; padding: 1px 7px; flex-shrink: 0;
}
.intake-row .st { margin-left: auto; font-size: 12px; color: var(--muted); text-align: right; }
.intake-row.ok .st { color: #4e8c6a; }
.intake-row.bad { border-color: var(--gold); background: var(--panel); }
.intake-pick { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.intake-pick label {
  position: relative; width: 76px; height: 76px; border: 1.5px solid var(--line);
  border-radius: 10px; overflow: hidden; cursor: pointer; flex-shrink: 0;
}
.intake-pick img { width: 100%; height: 100%; object-fit: cover; display: block; background: #eee6d8; }
.intake-pick input { position: absolute; top: 4px; right: 4px; accent-color: var(--gold); }
.intake-pick label:has(input:checked) { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }

/* T18 · 全窗拖拽遮罩 + 画廊资产拖入对话(两种拖拽两张脸,详见任务书 §17.1) */
.drop-overlay {
  position: fixed; inset: 0; z-index: 90; display: flex; align-items: center;
  justify-content: center; background: rgba(244, 240, 231, .92);
}
.drop-zone {
  width: min(72vw, 560px); min-height: 300px; border: 2px dashed var(--gold);
  border-radius: 20px; background: rgba(255, 255, 255, .55);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; pointer-events: none;
}
.drop-icon { font-size: 40px; }
.drop-title { font-size: 21px; font-weight: 700; font-family: "Noto Serif SC", serif; }
.chat.asset-target {
  outline: 2.5px solid var(--gold); outline-offset: -4px;
  background: linear-gradient(rgba(184, 146, 90, .07), rgba(184, 146, 90, .07)), var(--panel);
  border-radius: 12px;
}
.asset-drop-pill {
  position: absolute; z-index: 60; left: 50%; top: 42%; transform: translateX(-50%);
  background: rgba(33, 30, 24, .9); color: #fff; border-radius: 999px;
  padding: 12px 18px; font-size: 13.5px; font-weight: 700; white-space: nowrap;
  box-shadow: 0 10px 24px -6px rgba(33, 30, 24, .4); pointer-events: none;
}
.chat { position: relative; }

/* T6 · 响应式与流式(用户显式偏好>自动断点在 JS;这里管布局降级) */
#nav-handle, #gallery-handle { display: none; }
.edge-handle {
  position: fixed; left: 0; top: 45%; z-index: 45; writing-mode: vertical-rl;
  background: var(--panel); border: 1px solid var(--line); border-left: none;
  border-radius: 0 10px 10px 0; padding: 12px 6px; font-size: 13px; color: var(--muted);
}
.msg { max-width: 88%; }

@media (max-width: 1023px) {
  /* 画廊轨(chat-first)收为屏边把手 + 覆盖式抽屉,对话独占 */
  body.chat-first #gallery-handle { display: block; }
  body.chat-first #assets-view {
    position: fixed; left: 0; top: 0; bottom: 0; width: min(86vw, 420px);
    transform: translateX(-105%); transition: transform .3s ease; z-index: 40;
    background: var(--bg); box-shadow: 12px 0 40px -18px rgba(0, 0, 0, .35);
    min-width: 0; padding-top: 60px;
  }
  body.chat-first.gallery-open #assets-view { transform: none; }
  body.chat-first.agent-home .chat { width: auto; min-width: 0; max-width: none; flex: 1; }
}

@media (max-width: 767px) {
  /* 单列对话:导航折叠进顶栏汉堡(覆盖式),composer 吸底,chips 横向滚动。
     审查 P0-3:任务中心/客户档案与资产区同等待遇——全部升为全屏覆盖层,绝不与对话并排挤压 */
  #nav-handle { display: inline-block; }
  .sidebar {
    position: fixed; left: 0; top: 0; bottom: 0; width: 200px; z-index: 50;
    transform: translateX(-105%); transition: transform .3s ease;
    box-shadow: 12px 0 40px -18px rgba(0, 0, 0, .35);
  }
  body.nav-open .sidebar { transform: none; }
  .library {
    display: none; position: fixed; inset: 0; z-index: 40; background: var(--bg);
    padding: 60px 14px 14px; min-width: 0; overflow-y: auto;
  }
  #tasks-view:not(.hidden), #customers-view:not(.hidden) { display: block; }
  body:not(.chat-first) #gallery-handle, body.chat-first #gallery-handle { display: block; }
  body.gallery-open #assets-view:not(.hidden) { display: block; }
  .library-head { flex-wrap: wrap; row-gap: 6px; }
  .library-head h2 { white-space: nowrap; font-size: 17px; }
  .chat { width: auto !important; flex: 1; }
  .chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .topbar { flex-wrap: wrap; gap: 6px; padding: 8px 10px; }
  .topbar-right { gap: 6px; }
}
@media (max-width: 700px) {
  .agent-start-grid { grid-template-columns: 1fr; }
}

/* ============ 新增波:账户安全 / 回收站 / 叮嘱 / 支付 / 公告 / 帮助 / 养成 / 许愿 ============ */
/* 复用既有 .modal/.modal-card/.pill/.package/.table/.task-status 等;这里只补新结构的排版 */
.login-forgot { display: block; text-align: center; font-size: 12px; margin-top: 4px; }
.login-forgot:hover { color: var(--gold); }
.nav-dot {
  min-width: 16px; height: 16px; padding: 0 4px; margin-left: auto;
  background: var(--danger); color: #fff; font-size: 10px; line-height: 16px;
  text-align: center; border-radius: 9px;
}
/* 支付渠道 + 自定义档 + 会员周期 */
.pay-channel-row, .membership-cycles { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.custom-amount-row { margin: 10px 0; }
.mp-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; width: 100%; }
.mp-name { min-width: 0; overflow-wrap: anywhere; }
.mp-price { margin-left: auto; white-space: nowrap; font-weight: 800; }
.mp-benefits { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.mp-benefit { font-size: 11px; color: var(--muted); border: 1px solid var(--line); border-radius: 8px; padding: 1px 7px; }
/* 断线重连条(复用 .maint-bar 底样式,只改配色) */
.net-bar { background: var(--danger); color: #fff; }
/* 更新器为云端通用渲染器；壳只发送机械状态，不拥有任何业务弹窗。 */
.update-panel { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 24px; background: rgba(33,30,24,.34); }
.update-card { width: min(460px, 100%); border: 1px solid var(--line); border-radius: var(--r-card); background: var(--panel); box-shadow: 0 24px 70px rgba(33,30,24,.22); padding: 22px; }
.update-head { display: flex; align-items: center; gap: 10px; }
.update-head h2 { margin: 0; font-size: 18px; }
.update-head svg { color: var(--gold); }
.update-card p { line-height: 1.65; white-space: pre-wrap; }
.update-progress { height: 7px; overflow: hidden; border-radius: var(--radius-pill); background: var(--line); margin: 18px 0; }
.update-progress span { display: block; height: 100%; width: 0; background: var(--gold); transition: width .2s ease; }
.update-actions { display: flex; align-items: center; gap: 8px; margin-top: 20px; }
/* 用户中心:账户安全 / 设置 */
.uc-sec-block { margin-bottom: 18px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.uc-sec-block .text-input { max-width: 320px; }
.sec-device-list { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.sec-device { display: flex; align-items: center; gap: 10px; font-size: 13px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.sec-dev-op { margin-left: auto; }
.ord-ops { display: flex; gap: 6px; }
/* 回收站 */
.trash-list { display: flex; flex-direction: column; gap: 6px; }
.trash-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.trash-name { flex: 1; }
.trash-ops { display: flex; gap: 6px; }
/* 帮助中心 */
.help-cats { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.help-list { display: flex; flex-direction: column; gap: 8px; }
.faq-row { border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 12px; }
.faq-q { font-weight: 600; cursor: pointer; }
.faq-q::before { content: "▸ "; color: var(--gold); }
.faq-row.open .faq-q::before { content: "▾ "; }
.faq-a { display: none; margin-top: 6px; white-space: pre-wrap; line-height: 1.7; }
.faq-row.open .faq-a { display: block; }
/* 公告中心 */
.ann-list { display: flex; flex-direction: column; gap: 12px; }
.ann-card { border: 1px solid var(--line); border-radius: var(--r-card); padding: 12px 14px; }
.ann-card { cursor: pointer; }
.ann-card.unread { border-color: var(--gold); background: var(--gold-soft); }
.ann-head { display: flex; align-items: center; gap: 8px; }
.ann-head b { font-size: 14px; }
.ann-cat { font-size: 11px; color: var(--gold); border: 1px solid var(--gold); border-radius: 8px; padding: 0 6px; }
.ann-time { margin-left: auto; }
.ann-body { margin-top: 6px; font-size: 13px; line-height: 1.7; white-space: pre-wrap; }
.ann-media { display: block; max-width: 100%; border-radius: var(--radius); margin-top: 8px; }
.ann-cta { display: inline-block; margin-top: 10px; }
.ann-detail { height: 100%; overflow-y: auto; }
.ann-detail-head { margin: 14px 0 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.ann-detail-head > div { display: flex; align-items: center; gap: 10px; }
.ann-detail-head h2 { margin: 16px 0 0; font-family: var(--font-display); font-size: clamp(24px, 3vw, 34px); }
.ann-detail-copy { max-width: 760px; font-size: 14px; line-height: 1.9; white-space: pre-wrap; }
.ann-detail-media { display: block; max-width: min(760px, 100%); margin-top: 20px; border-radius: var(--r-card); }
.ann-detail-cta { display: inline-block; margin-top: 24px; text-decoration: none; }
/* 对话归档 */
.archive-card { display: flex; flex-direction: column; }
.archive-tools { display: flex; align-items: center; gap: 10px; margin: 16px 0; }
.archive-tools .text-input { min-width: 220px; flex: 1; }
.archive-filters { display: flex; gap: 8px; }
.archive-filters .active { background: var(--ink); border-color: var(--ink); color: var(--panel); }
.archive-list { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 10px; overflow-y: auto; }
.archive-row { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--panel); }
.archive-icon { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border-radius: var(--radius); background: var(--gold-soft); color: var(--ink); }
.archive-icon svg { width: 19px; }
.archive-info { min-width: 0; flex: 1; }
.archive-name { display: flex; align-items: center; gap: 8px; }
.archive-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-display); font-size: 17px; }
.archive-name span { color: var(--muted); font-size: 11px; }
.archive-info small { display: block; margin-top: 4px; color: var(--muted); }
.archive-info p { margin: 7px 0 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.archive-restore { flex: 0 0 auto; }
@media (max-width: 900px) {
  .archive-tools { align-items: stretch; flex-direction: column; }
  .archive-tools .text-input { width: 100%; min-width: 0; }
}
/* 特别叮嘱回声 */
.dna-echo { display: flex; flex-direction: column; gap: 8px; }
.dna-echo-row { border-left: 3px solid var(--gold); padding: 4px 10px; }
.dna-distilled { font-weight: 600; }
.dna-raw { font-size: 12px; }
/* 许愿 */
.wish-tabs { display: flex; gap: 8px; margin-bottom: 12px; }
.wish-cats { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.wish-sat { display: flex; gap: 2px; }
.sat-star { width: 36px; height: 36px; color: var(--line); background: none; line-height: 1; }
.sat-star svg { width: 20px; height: 20px; }
.sat-star.on { color: var(--gold); }
.sat-star.on svg { fill: currentColor; }
.wish-wall { display: flex; flex-direction: column; gap: 8px; }
.wish-wall-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.ww-content { flex: 1; display: grid; gap: 5px; font-size: 13px; }
.wish-status { width: max-content; border: 1px solid var(--line); border-radius: var(--radius-pill); padding: 2px 8px; font-size: 11px; color: var(--muted); }
.wish-admin-reply { border-left: 2px solid var(--gold); padding-left: 8px; color: var(--muted); }
.vote.voted { background: var(--gold); color: #fff; border-color: var(--gold); }