/* GoldTracker Cloud 手机端样式
   G4 基准（iPhone 390x844），G8.6 现代金融 App 视觉统一：
   - 深墨蓝主文字、浅灰蓝辅助文字
   - 正收益绿 / 负收益红，金色仅作点缀
   - 浅灰白背景 + 纯白大圆角卡片 + 极轻阴影 */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* =====================
   全局主题色板变量
   ===================== */
:root {
  --font-main: "Roboto", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-condensed: "Roboto Condensed", "Roboto", "PingFang SC", "Microsoft YaHei", sans-serif;
  --bg: #f5f6f8;
  --card: #ffffff;
  --text: #1c2340;
  --text-strong: #131a33;
  --muted: #8b93a7;
  --muted-2: #b6bccb;
  --gold: #b8860b;
  --gold-soft: #faf3e3;
  --positive: #0f9d68; /* 正收益 / 买入 / 盈利：绿 */
  --negative: #e04f3f; /* 负收益 / 卖出 / 亏损：红 */
  --positive-soft: #e7f7f0;
  --negative-soft: #fdeceb;
  /* G8.6.1：低饱和 muted slate blue 主色（替代过重的黑蓝） */
  --navy: #5a6a8c;
  --navy-2: #4d5d7f;
  --border: #eceef2;
  --shadow-card: 0 1px 2px rgba(28, 35, 64, 0.04), 0 4px 14px rgba(28, 35, 64, 0.05);
  --shadow-float: 0 4px 12px rgba(28, 35, 64, 0.08);
  --shadow-nav: 0 2px 6px rgba(28, 35, 64, 0.05), 0 8px 24px rgba(28, 35, 64, 0.08);
  --asset-card-bg: #ffffff;
  --asset-card-text: #131a33;
  --asset-card-secondary: #8b93a7;
  --asset-divider: rgba(19, 26, 51, 0.18);
  --asset-icon-bg: rgba(19, 26, 51, 0.1);
  --control-bg: #eef0f4;
  --control-active-bg: #ffffff;
  --input-bg: #f8f9fb;
  --nav-bg: rgba(255, 255, 255, 0.985);
  --nav-border: rgba(28, 35, 64, 0.06);
  --nav-fade: rgba(245, 246, 248, 0.95);
  --focus-ring: rgba(28, 35, 64, 0.08);
  --mask-bg: rgba(233, 235, 240, 0.72);
  --mask-border: rgba(28, 35, 64, 0.06);
  --auth-bg-start: #f8f9fb;
  --auth-bg-end: #eef1f6;
  --bottom-nav-rendered-height: 50px;
  --bottom-nav-bottom-offset: 10px;
  --bottom-content-gap: 48px;
  --bottom-content-safe-space: calc(
    var(--bottom-nav-rendered-height)
    + var(--bottom-nav-bottom-offset)
    + var(--bottom-content-gap)
    + env(safe-area-inset-bottom)
  );
}

[data-theme="dark"] {
  --bg: #101214;
  --card: #1b1d1f;
  --text: #d7d7d7;
  --text-strong: #f5f5f5;
  --muted: #a3a3a3;
  --muted-2: #777b80;
  --gold: #ffc928;
  --gold-soft: rgba(255, 201, 40, 0.12);
  --positive: #21b879;
  --negative: #ff544a;
  --positive-soft: rgba(33, 184, 121, 0.14);
  --negative-soft: rgba(255, 84, 74, 0.14);
  --navy: #ffc928;
  --navy-2: #d9a900;
  --border: rgba(255, 255, 255, 0.08);
  --shadow-card: 0 6px 22px rgba(0, 0, 0, 0.3);
  --shadow-float: 0 4px 14px rgba(0, 0, 0, 0.28);
  --shadow-nav: 0 8px 24px rgba(0, 0, 0, 0.38);
  --asset-card-bg: #ffc928;
  --asset-card-text: #151515;
  --asset-card-secondary: #4d4328;
  --asset-divider: rgba(21, 21, 21, 0.18);
  --asset-icon-bg: rgba(21, 21, 21, 0.1);
  --control-bg: #24272a;
  --control-active-bg: #34373a;
  --input-bg: #24272a;
  --nav-bg: rgba(25, 27, 29, 0.985);
  --nav-border: rgba(255, 255, 255, 0.08);
  --nav-fade: rgba(16, 18, 20, 0.95);
  --focus-ring: rgba(255, 201, 40, 0.18);
  --mask-bg: rgba(35, 35, 35, 0.72);
  --mask-border: rgba(255, 255, 255, 0.1);
  --auth-bg-start: #101214;
  --auth-bg-end: #181a1c;
}

/* G8.6.4 追加：纵向滚动条出现/消失不再改变视口可用宽度，
   页面容器居中基准保持稳定（交易数据多/少时横向位置一致） */
html {
  scrollbar-gutter: stable;
}

html,
/* =====================
   全局基础样式
   ===================== */
body {
  height: 100%;
}

body {
  font-family: var(--font-main);
  background: var(--bg);
/* 文字颜色：主文字颜色 */
  color: var(--text-strong);
  -webkit-font-smoothing: antialiased;
/* G8.6.4：禁止任何页面产生横向滚动/偏移（交易页长金额或备注不再撑宽页面） */
  overflow-x: hidden;
}

.page-content {
  max-width: 480px;
  margin: 0 auto;
  padding: 16px 16px var(--bottom-content-safe-space);
  min-height: 100dvh;
}

/* 首页：一屏展示，禁止滚动 */
/* =====================
   首页 - 一屏布局
   ===================== */
/* G8.5.1：允许首页内容随投资收益卡片自然上下滚动，
   避免内容被固定底部导航遮挡；底部安全距离由 .page-content 通用 padding 提供 */
.page-home .page-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.page-header h1 {
/* 字体大小：页面主标题 */
  font-size: 26px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 800;
  color: var(--text-strong);
  letter-spacing: -0.2px;
}

.header-sub {
/* 字体大小：文字 */
  font-size: 12.5px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-top: 4px;
}

.page-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 4px;
}

.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 18px;
  box-shadow: var(--shadow-card);
}

.card-title {
/* 字体大小：卡片标题 */
  font-size: 18px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 800;
/* 文字颜色：主文字颜色 */
  color: var(--text-strong);
/* 字间距：标题修饰 */
  letter-spacing: 0;
  margin-bottom: 8px;
}

/* 行情 */
/* =====================
   行情页 - 行情价格
   ===================== */
.quote-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
}

.quote-label {
/* 字体大小：行情页名称 */
  font-size: 14px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
}

.quote-value {
/* 字体大小：行情页价格数字 */
  font-size: 32px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-family: var(--font-main);
  letter-spacing: -0.3px;
  color: var(--text-strong);
}

.quote-sub {
/* 字体大小：行情页单位 */
  font-size: 15px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-left: 4px;
  font-weight: 500;
}

/* 资产 */
.stat-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
}

.stat-row span {
/* 字体大小：资产项名称 */
  font-size: 14px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
}

.stat-row strong {
/* 字体大小：资产数值 */
  font-size: 20px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
}

/* G8.6.2：收益金额按正负着色（正绿 / 负红 / 0 中性灰），
   修复 .stat-row strong 深色覆盖导致收益行全黑的问题 */
.stat-row.positive strong {
  color: var(--positive);
}

.stat-row.negative strong {
  color: var(--negative);
}

.stat-row.zero strong {
  color: var(--muted);
}

/* 收益 */
/* =====================
   首页 - 收益模块
   ===================== */
.profit-card {
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 12px 16px;
}

.profit-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
}

.profit-row span {
/* 字体大小：收益项名称 */
  font-size: 14px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
}

.profit-row strong {
/* 字体大小：收益数字 */
  font-size: 20px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
}

.positive {
/* 文字颜色：正收益绿色 */
  color: var(--positive);
}

.negative {
/* 文字颜色：负收益红色 */
  color: var(--negative);
}

/* 交易页 */
/* =====================
   通用按钮
   ===================== */
.btn-primary {
  background: linear-gradient(150deg, #d3a028 0%, #c69218 58%, #b57f10 100%);
  color: #fff;
  border: none;
  border-radius: 14px;
  padding: 13px 18px;
/* 字体大小：按钮文字 */
  font-size: 16px;
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(181, 127, 16, 0.22);
  text-decoration: none;
  cursor: pointer;
}

.btn-primary:active {
  background: linear-gradient(150deg, #bd8f20 0%, #ad7f13 58%, #9d700d 100%);
}

/* =====================
   交易页面 - 统计
   ===================== */
.stats-row {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.stats-card {
  flex: 1;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px 8px;
  text-align: center;
  box-shadow: var(--shadow-card);
}

.stats-card .num {
/* 字体大小：统计数字 */
  font-size: 18px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
  white-space: nowrap;
}

.stats-card .lbl {
/* 字体大小：统计标签 */
  font-size: 12.5px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-top: 4px;
}

/* =====================
   交易页面 - 交易列表
   ===================== */
/* G8.6.5：交易页顶部统计区 sticky 固定，列表在其下方滚动 */
.transaction-sticky-header {
  position: sticky;
  top: 0;
  z-index: 30;
  margin: -16px -16px 0;
  padding: 16px 16px 10px;
  background: var(--bg);
  box-shadow: 0 6px 12px -8px rgba(28, 35, 64, 0.12);
}

.transaction-sticky-header .alert {
  margin-bottom: 10px;
}

.txn-list {
  list-style: none;
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.txn-item {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: var(--shadow-card);
}

/* G8.6.5.2：swipe 容器覆盖 .txn-item 的 padding/border/shadow，
   保证 content 完整覆盖 reveal（默认状态绝不露底、无裁切） */
.txn-swipe {
  position: relative;
  overflow: hidden;
  padding: 0;
  border: none;
  box-shadow: none;
  border-radius: 18px;
  background: var(--card);
}

.txn-swipe-reveal {
  position: absolute;
  inset: 0 0 0 auto;
  width: 128px;
  display: flex;
  z-index: 0;
}

.swipe-action {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  color: #fff;
  font-size: 14px;   /* 按钮字号*/
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  padding: 0 4px;
  margin: 6px 2px;
  border-radius: 12px;
}

.swipe-edit {
  background: #7c8aa5;
  margin-left: 4px;
}

.swipe-delete {
  background: var(--negative);
  margin-right: 4px;
}

.swipe-delete-form {
  flex: 1;
  display: flex;
  margin: 0;
}

.txn-swipe-content {
  position: relative;
  z-index: 1;
  width: 100%;
  min-width: 100%;
  box-sizing: border-box;
  background: var(--card);
  border-radius: 18px;
  padding: 16px;
  touch-action: pan-y;
  transform: translateX(0);
  transition: transform 0.18s ease;
  cursor: grab;
  will-change: transform;
}

.txn-swipe.open .txn-swipe-content {
  transform: translateX(-128px);
}

.txn-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.txn-date {
/* 字体大小：交易日期 */
  font-size: 16.5px;
/* 字重：交易日期 */
  font-weight: 700;
/* 文字颜色：辅助文字颜色 */
  color: var(--text-strong);
}

.badge {
/* 字体大小：交易类型徽标 */
  font-size: 14px;
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
  padding: 2px 10px;
  border-radius: 999px;
}

.badge-buy {
  background: var(--positive-soft);
/* 文字颜色：正收益绿色 */
  color: var(--positive);
}

.badge-sell {
  background: var(--negative-soft);
/* 文字颜色：负收益红色 */
  color: var(--negative);
}

.txn-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
/* G8.6.4：单元格最小宽度为 0，避免长数值/备注把网格撑出主容器 */
  min-width: 0;
}

.txn-cell {
  min-width: 0;
}

.txn-cell .k {
/* 字体大小：交易明细字段名 */
  font-size: 13px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
}

.txn-cell .v {
/* 字体大小：交易明细数值 */
  font-size: 17px;
/* 字重：重点数字加粗（700） */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
  overflow-wrap: anywhere;
}

.txn-note {
/* 字体大小：交易备注 */
  font-size: 14px;
/* 行高：备注文字行距 */
  line-height: 1.5;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-top: 8px;
}

.empty {
  background: var(--card);
  border: 1px dashed var(--muted-2);
  border-radius: 16px;
  padding: 30px 16px;
  text-align: center;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
/* 字体大小：空状态提示文字 */
  font-size: 14.5px;
}

/* 行情页 */
.chart-placeholder {
  margin-top: 12px;
  background: var(--card);
  border: 1px dashed var(--muted-2);
  border-radius: 16px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
/* 字体大小：文字 */
  font-size: 14px;
}

/* G10.0：行情页历史走势图（手机竖屏：宽100%、高250px） */
.chart-box {
  width: 100%;
  height: 250px;
  position: relative;
}

#gold-history-chart {
  width: 100% !important;
  height: 250px !important;
}

.gold-chart-empty {
  text-align: center;
  color: var(--muted);
  font-size: 14px;
  padding: 12px 0;
}

/* G10.1：行情页体验优化（主次卡片层级、涨跌、周期/品种切换） */
/* G8.6.3.3：行情页卡片垂直间距与首页/交易页卡片间距风格一致 */
.page-market .card + .card {
  margin-top: 16px;
}

.market-primary .quote-value {
  /* G8.6.3.1：国内/国际报价卡片价格同级显示（继承 .quote-value 32px） */
}

.market-secondary .quote-value {
  /* G8.6.3.1：国际黄金与国内黄金保持同一字号 */
}

.market-change {
  font-size: 14px;
  margin-top: 4px;
  color: var(--muted);
}

/* G8.6.3.1：行情页涨跌颜色按正负显示（涨绿 / 跌红 / 持平与无数据灰） */
.market-change.positive {
  color: var(--positive);
}

.market-change.negative {
  color: var(--negative);
}

.bank-gold-updated {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12.5px;
}

.bank-gold-table {
  margin-top: 12px;
}

.bank-gold-head,
.bank-gold-row {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(76px, 1fr) minmax(76px, 1fr);
  gap: 8px;
  align-items: center;
}

.bank-gold-head {
  padding: 0 2px 8px;
  color: var(--muted);
  font-size: 12px;
}

.bank-gold-head span:nth-child(n + 2),
.bank-gold-price {
  text-align: right;
}

.bank-gold-row {
  padding: 10px 2px;
  border-top: 1px solid var(--border);
  font-size: 13.5px;
}

.bank-gold-product {
  min-width: 0;
  line-height: 1.4;
  font-family: var(--font-main);
  font-size: 15px;
  font-weight: 700;
}

.bank-gold-price {
  white-space: nowrap;
  font-family: var(--font-condensed);
  font-size: 17px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.bank-gold-empty {
  padding: 14px 2px 4px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 13.5px;
  text-align: center;
}

.seg-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 14px 0;
/* G8.6.4 追加：窄屏下分段控件可收缩，避免撑出卡片产生横向滚动 */
  min-width: 0;
}

.seg-control {
  display: flex;
  background: var(--control-bg);
  border-radius: 12px;
  padding: 3px;
  min-width: 0;
  flex: 1 1 auto;
}

.seg-btn {
  flex: 1;
  border: none;
  background: transparent;
  border-radius: 10px;
  padding: 7px 10px;
  font-size: 13.5px;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
  min-width: 0;
}

.seg-btn.active {
  background: var(--control-active-bg);
  color: var(--navy);
  font-weight: 600;
  box-shadow: 0 1px 3px var(--focus-ring);
}

/* 行情走势图时间范围：宽屏均匀铺开，窄屏保持单行横向滚动。 */
#period-seg {
  justify-content: space-between;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}

#series-seg,
#period-seg {
  width: 100%;
}

#period-seg::-webkit-scrollbar {
  display: none;
}

#period-seg .seg-btn {
  flex: 0 0 auto;
  min-width: 52px;
}

/* 设置页（iOS 分组设置风格：浅灰背景 + 分组小标题 + 白色圆角卡片 + 一行式设置项） */
.setting-header {
  text-align: center;
}

.setting-groups {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 18px;
}

.setting-group-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  margin: 0 6px 8px;
}

.setting-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: var(--shadow-card);
  overflow: hidden;
}

.setting-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
}

.setting-theme-row {
  flex-wrap: wrap;
}

.theme-control {
  display: flex;
  flex: 0 0 144px;
  padding: 3px;
  border-radius: 12px;
  background: var(--control-bg);
}

.theme-option {
  flex: 1;
  border: 0;
  border-radius: 9px;
  padding: 7px 10px;
  background: transparent;
  color: var(--muted);
  font-family: var(--font-main);
  font-size: 13.5px;
  cursor: pointer;
}

.theme-option.active {
  background: var(--control-active-bg);
  color: var(--gold);
  font-weight: 700;
  box-shadow: 0 1px 3px var(--focus-ring);
}

.setting-label {
/* 字体大小：设置项名称 */
  font-size: 16.5px;
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
  color: var(--text-strong);
}

/* 设置项左侧区域：图标 + 标题统一左对齐（三个设置项一致） */
.setting-leading {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  color: var(--muted);
}

.setting-icon {
  flex: none;
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
}

.setting-value {
  font-size: 14px;
  color: var(--text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.setting-value-muted {
  color: var(--muted);
  font-weight: 500;
}

.setting-arrow {
/* 文字颜色：浅灰箭头（纯展示，无跳转逻辑） */
  color: var(--muted-2);
  font-size: 20px;
  line-height: 1;
}

/* G8.5.2 退出登录：独立白色圆角卡片 + 居中红字（保留原退出逻辑） */
.setting-card-danger .btn-logout {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 16px;
  padding: 16px;
  color: var(--negative);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.setting-card-danger .btn-logout:active {
  background: var(--control-bg);
}

/* 底部 Tab 导航（固定，无顶部导航/侧边菜单） */
/* =====================
   底部 Tab 导航
   ===================== */
.bottom-nav-mask {
  position: fixed;
  z-index: 99;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(
    var(--bottom-nav-rendered-height)
    + var(--bottom-nav-bottom-offset)
    + env(safe-area-inset-bottom)
  );
  background: var(--bg);
  pointer-events: none;
}

.bottom-nav {
  position: fixed;
  z-index: 100;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--bottom-nav-bottom-offset) + env(safe-area-inset-bottom));
  width: calc(100% - 32px);
  max-width: 448px;
  height: var(--bottom-nav-rendered-height);
  margin: 0 auto;
  background: var(--nav-bg);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
  border: 0.5px solid var(--nav-border);
  border-radius: 20px;
  box-shadow: var(--shadow-nav);
  display: flex;
}

/* G8.6.5：底部导航形成明确遮挡层，内容滚动到其后方不再透出 */
.bottom-nav::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -18px;
  height: 18px;
  background: linear-gradient(to top, var(--nav-fade), transparent);
  pointer-events: none;
}

.nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  text-decoration: none;
/* 字体大小：文字 */
  font-size: 11px;
  transition: color 0.15s ease;
}

.nav-icon {
/* G8.6.6：线性 SVG 图标（统一尺寸，跟随 currentColor） */
  display: block;
  width: 24px;
  height: 24px;
  line-height: 0;
}

.nav-icon svg {
  display: block;
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
}

.nav-item.active {
  color: var(--text-strong);
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
}

.nav-item.active .nav-icon {
  transform: translateY(-1px);
}

/* G6：交易录入表单、提示条、操作按钮 */
.btn-block {
  display: block;
  width: 100%;
  text-align: center;
}

.btn-link {
/* 文字颜色：深蓝强调文字颜色 */
  color: var(--navy);
  text-decoration: none;
/* 字体大小：按钮文字 */
  font-size: 16px;
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
}

.btn-mini {
  display: inline-block;
  background: var(--gold-soft);
/* 文字颜色：金色强调文字颜色 */
  color: var(--gold);
  border: none;
  border-radius: 999px;
  padding: 8px 14px;
/* 字体大小：按钮文字 */
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.btn-delete {
  background: none;
  border: 1px solid #f0c4bc;
/* 文字颜色：负收益红色 */
  color: var(--negative);
  border-radius: 999px;
  padding: 4px 12px;
/* 字体大小：按钮文字 */
  font-size: 14px;
/* 字重：按钮文字 */
  font-weight: 600;
}

.alert {
  border-radius: 14px;
  padding: 12px 14px;
/* 字体大小：提示条文字 */
  font-size: 14px;
  margin-bottom: 12px;
}

.alert-success {
  background: var(--positive-soft);
/* 文字颜色：正收益绿色 */
  color: var(--positive);
}

.alert-error {
  background: var(--negative-soft);
/* 文字颜色：负收益红色 */
  color: var(--negative);
}

.alert-warn {
  background: #fdf6e8;
/* 文字颜色：文字颜色 */
  color: #a06a10;
}

.txn-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 14px;
}

/* =====================
   通用表单
   ===================== */
.form-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form-label {
/* 字体大小：表单标签 */
  font-size: 14.5px;
/* 文字颜色：辅助文字颜色 */
  color: var(--text);
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 500;
}

.form-input {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px 16px;
/* 字体大小：表单输入文字 */
  font-size: 17px;
  background: var(--input-bg);
/* 文字颜色：主文字颜色 */
  color: var(--text-strong);
  transition: border-color 0.15s ease, background 0.15s ease;
}

.form-input:focus {
  outline: none;
  border-color: var(--navy);
  background: var(--card);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

/* G8.1.2：数字输入框隐藏步进按钮，保持简洁（不影响移动端小数键盘） */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.type-switch {
  display: flex;
  gap: 12px;
}

.type-option {
  flex: 1;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px 12px;
  text-align: center;
/* 字体大小：类型切换选项 */
  font-size: 15.5px;
/* 字重：标签/按钮中等加粗（600） */
  font-weight: 600;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  background: var(--input-bg);
}

.type-option:has(input:checked) {
  border-color: var(--navy);
/* 文字颜色：深蓝强调文字颜色 */
  color: var(--navy);
  background: #fff;
  box-shadow: var(--shadow-float);
}

.txn-delete-form {
  margin-top: 10px;
  text-align: right;
}

/* G9.0.1：首页资产总览样式（仅新增类，保留既有浅色主题） */
/* =====================
   首页 - 黄金资产卡片
   ===================== */
.asset-hero {
  text-align: center;
  padding: 16px 16px 14px;
}

.asset-hero .card-title {
  margin-bottom: 8px;
}

.hero-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
}

.hero-amount {
/* 字体大小：首页当前价值数字 */
  font-size: 36px;
/* 字重：重点数字超粗（800） */
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* G12.0：首页资产隐私眼睛按钮（卡片右上角，不改变布局尺寸） */
.asset-hero-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.eye-btn {
  background: none;
  border: none;
  font-size: 16px;
  line-height: 1;
  padding: 2px 4px;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.9);
}

.hero-unit {
/* 字体大小：首页金额单位 */
  font-size: 14px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
}

.hero-label {
/* 字体大小：首页指标标签 */
  font-size: 13px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-bottom: 2px;
}

.hero-stats {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-top: 10px;
}

.hero-stat {
  text-align: center;
}

.hero-stat .k {
  display: block;
/* 字体大小：首页字段名 */
  font-size: 14px; /* 持有/成本：字体大小 */
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-bottom: 2px;
}

.hero-stat .v {
/* 字体大小：首页持有/成本数字 */
  font-size: 17px;
/* 字重：标题/重点数字加粗（700） */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* G8.6.3.2：首页隐私金额遮挡（不再使用 **** 替换）
   - 金额文本保留在 DOM，仅隐藏文字可见性
   - 伪元素覆盖金额区域，半透明浅色遮挡块 + 柔和圆角
   - 深色资产卡（.asset-hero）与白色收益卡分别适配 */
.privacy-masked {
  position: relative;
  color: transparent !important;
  text-shadow: none !important;
  -webkit-user-select: none;
  user-select: none;
  white-space: nowrap;
}

.privacy-masked::after {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: 2;
  border-radius: 10px;
  background: var(--mask-bg);
  box-shadow: inset 0 0 0 0.5px var(--mask-border);
}

/* G9.0.3 视觉统一：资产卡已改白卡，隐私遮挡沿用标准浅色遮罩（深金底时代的深色卡适配已移除） */
.asset-hero .privacy-masked::after {
  background: var(--mask-bg);
  box-shadow: inset 0 0 0 0.5px var(--mask-border);
}

/* =====================
   首页 - 今日行情
   ===================== */
.price-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.price-line {
/* G8.6.8：三列网格统一垂直居中，两行对齐一致 */
  display: grid;
  grid-template-columns: auto 1fr auto;
  column-gap: 8px;
  align-items: center;
  padding: 2px 0;
  min-width: 0;
}

.price-name {
/* 字体大小：今日行情名称 */
  font-size: 14px;
  font-weight: 500;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  white-space: nowrap;
}

.price-change {
/* G8.6.8：涨跌字号调大，三列垂直居中、两行一致 */
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  white-space: nowrap;
  text-align: right;
  min-width: 0;
  justify-self: end;
  letter-spacing: -0.3px; /* 缩短 $-100.2(-29%) 的字间距*/
}

.price-change.positive {
  color: var(--positive);
}

.price-change.negative {
  color: var(--negative);
}

.price-value {
/* 字体大小：今日行情价格数字 */
  font-size: 23px;
/* 字重：重点数字超粗（800） */
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--text-strong);
  white-space: nowrap;
  text-align: right;
}

.price-value-wrap {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  white-space: nowrap;
  min-width: 0;
}

.price-sub {
/* 字体大小：今日行情单位 */
  font-size: 13px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-left: 3px;
  font-weight: 500;
  white-space: nowrap;
}

/* G9.0.3（视觉统一）：资产卡去深金底，改为白卡 + 金色局部点缀（仅首页资产卡） */
.asset-hero {
  background: var(--asset-card-bg);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow-card);
/* 文字颜色：深蓝黑主文字（白卡） */
  color: var(--asset-card-text);
}

.asset-hero .card-title {
/* 文字颜色：深蓝黑主文字 */
  color: var(--asset-card-text);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0px;
}

.asset-hero .hero-label { 
/* 文字颜色：灰色辅助文字（白卡） */
  color: var(--asset-card-secondary);
  font-size: 14px; /* 当前价值：字体大小 */
}

.asset-hero .hero-amount {
/* 文字颜色：深蓝黑主文字（主金额依赖字号/字重突出，不再依赖背景） */
  color: var(--asset-card-text);
/* 字体大小：首页当前价值数字 */
  font-size: 38px;
  letter-spacing: -0.5px;
}

.asset-hero .hero-unit {
/* 文字颜色：金色小单位（白卡） */
  color: var(--asset-card-secondary);
  font-size: 15px;
}

.asset-hero .hero-stat .k {
/* 文字颜色：灰色辅助文字（白卡） */
  color: var(--asset-card-secondary);
}

.asset-hero .hero-stat .v {
/* 文字颜色：深蓝黑主文字 */
  color: var(--asset-card-text);
  font-weight: 700;
}

.asset-hero .hero-stats {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 0.5px solid var(--asset-divider);
}

.asset-hero .eye-btn {
  color: var(--asset-card-text);
  background: var(--asset-icon-bg);
  border-radius: 999px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.asset-hero .eye-icon {
  display: block;
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
}

/* G8.1.1：交易编辑按钮 */
.txn-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.txn-actions .txn-delete-form {
  margin-top: 0;
}

.btn-edit {
  display: inline-block;
  background: none;
  border: 1px solid #d6dae4;
/* 文字颜色：深蓝强调文字颜色 */
  color: var(--navy);
  border-radius: 999px;
  padding: 4px 14px;
/* 字体大小：按钮文字 */
  font-size: 14px;
/* 字重：按钮文字 */
  font-weight: 600;
  text-decoration: none;
}

/* G7：收益分析页 */
/* =====================
   分析页面
   ===================== */
.trend-chart {
  width: 100%;
  height: 160px;
  display: block;
}

.trend-note {
/* 字体大小：趋势说明文字 */
  font-size: 13px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  margin-top: 8px;
}

.monthly-table {
  width: 100%;
  border-collapse: collapse;
/* 字体大小：表格表头文字 */
  font-size: 14px;
}

.monthly-table th {
/* 字体大小：表格表头文字 */
  font-size: 12px;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  text-align: left;
  padding: 6px 4px;
  border-bottom: 1px solid var(--border);
}

.monthly-table th:not(:first-child),
.monthly-table td:not(:first-child) {
  text-align: right;
}

.monthly-table td {
  padding: 8px 4px;
  border-bottom: 1px solid var(--border);
  font-variant-numeric: tabular-nums;
}

.empty-cell {
  text-align: center !important;
/* 文字颜色：辅助文字颜色 */
  color: var(--muted);
  padding: 20px 4px !important;
}

/* G3 认证：登录/注册页与用户状态栏（最小样式，不改版） */
.auth-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 24px; background: linear-gradient(180deg, var(--auth-bg-start) 0%, var(--auth-bg-end) 100%); }
.auth-card { width: 100%; max-width: 360px; background: var(--card); border: 1px solid var(--border); border-radius: 22px; padding: 32px 26px; box-shadow: var(--shadow-card); }
.auth-card h1 { font-size: 24px; margin: 0 0 4px; color: var(--text-strong); font-weight: 800; letter-spacing: -0.3px; }
.auth-sub { margin: 0 0 24px; color: var(--muted); font-size: 13.5px; }
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-label { display: flex; flex-direction: column; gap: 8px; font-size: 14px; font-weight: 500; color: var(--text); }
.auth-label input { height: 48px; border: 1px solid var(--border); border-radius: 14px; padding: 0 14px; font-size: 16px; background: var(--input-bg); color: var(--text-strong); transition: border-color 0.15s ease, background 0.15s ease; }
.auth-label input:focus { outline: none; border-color: var(--navy); background: var(--card); box-shadow: 0 0 0 3px var(--focus-ring); }
.auth-link { margin: 20px 0 0; text-align: center; font-size: 14px; }
[data-theme="dark"] .auth-link a,
[data-theme="dark"] .auth-link a:visited,
[data-theme="dark"] .auth-link a:hover,
[data-theme="dark"] .auth-link a:active,
[data-theme="dark"] .auth-link a:focus { color: #ffffff; }
/* G8.5 分析页 AI 行情分析占位 */
.placeholder-card { text-align: center; padding: 44px 24px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.placeholder-badge { width: 52px; height: 52px; border-radius: 16px; background: var(--gold-soft); color: var(--gold); display: flex; align-items: center; justify-content: center; font-size: 26px; margin-bottom: 6px; box-shadow: var(--shadow-float); }
.placeholder-text { font-size: 16.5px; font-weight: 700; color: var(--text-strong); margin: 0; }
.placeholder-sub { font-size: 13.5px; color: var(--muted); margin: 0; }
/* =====================
   平板 / 大屏响应式（Bug 修复）
   根因：.page-content 全局 max-width:480px、.bottom-nav 全局 max-width:448px，
   且无任何媒体查询，导致平板/大屏仍按手机宽度居中显示。
   方案：三档 viewport 宽度响应（按宽度、不按设备型号）：
   - 手机 <=600px：保持既有布局（基础规则不变）；
   - 平板竖屏 601px~900px：主体与底部导航适度加宽（仍单列、紧凑）；
   - 大屏/PC >900px：单列，适度放宽，内容不无限拉宽。
   ===================== */

/* >=601px：投资收益 6 行改为 2x3 紧凑网格，
   避免宽卡片下标签/金额左右过度分离、中间出现大段空白。
   :has() 不支持时优雅回退为原有单列 space-between 行。 */
@media (max-width: 600px) {
  .page-home .asset-hero {
    padding: 11px 16px 10px;
  }

  .page-home .asset-hero .card-title {
    margin-bottom: 2px;
  }

  .page-home .asset-hero .hero-label {
    margin-bottom: 0;
    line-height: 1.2;
  }

  .page-home .asset-hero .hero-value {
    line-height: 1;
  }

  .page-home .asset-hero .hero-stats {
    margin-top: 7px;
    padding-top: 7px;
  }

  .page-home .asset-hero .hero-stat .k {
    margin-bottom: 0;
    line-height: 1.25;
  }

  .page-home .asset-hero .hero-stat .v {
    line-height: 1.2;
  }
}

@media (min-width: 601px) {
  .card:has(> .stat-row) {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 40px;
    row-gap: 2px;
  }
  .card:has(> .stat-row) .card-title {
    grid-column: 1 / -1;
  }
  .card:has(> .stat-row) .stat-row {
    padding: 8px 0 8px 4px;
  }
}

/* 平板竖屏（601px ~ 900px）：主体 680px、底部导航与主体内容边缘对齐（648px） */
@media (min-width: 601px) and (max-width: 900px) {
  :root {
    --bottom-nav-rendered-height: 65px;
  }

  .page-content {
    max-width: 680px;
  }
  .bottom-nav {
    max-width: 648px;
  }

  /* G9.2.2.1 平板视觉优化：呼吸感、卡片内部空间、字体/间距比例 */
  .page-home .page-content {
    gap: 16px;
  }
  .page-home .card {
    padding: 22px 24px;
  }
  .card-title {
    margin-bottom: 14px;
  }

  /* 今日行情：金额更突出；行内容限宽居中，避免名称与报价左右距离过大 */
  .price-row {
    max-width: 540px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .price-value {
    font-size: 24px;
  }

  /* 黄金资产总览：内部上下间距增加，主数字保持突出 */
  .asset-hero .hero-stats {
    margin-top: 18px;
    padding-top: 14px;
  }

  /* 黄金投资收益：2x3 网格行列间距与数值字号微调 */
  .card:has(> .stat-row) {
    column-gap: 48px;
    row-gap: 6px;
  }
  .card:has(> .stat-row) .stat-row {
    padding: 10px 0;
  }
  .stat-row strong {
    font-size: 21px;
  }

  /* 底部导航：平板尺寸（高度 58px、图标/文字略增、间距均衡） */
  .bottom-nav {
    border-radius: 22px;
  }
  .nav-item {
    gap: 2px;
  }
  .nav-icon,
  .nav-icon svg {
    width: 26px;
    height: 26px;
  }
  .nav-label {
    font-size: 12px;
  }
}

/* 大屏 / PC（>900px）：保持单列，内容不无限拉宽 */
@media (min-width: 901px) {
  .page-content {
    max-width: 760px;
  }
  .bottom-nav {
    max-width: 728px;
  }
}
/* =====================
   G10.0 分析页（AI 分析情报 Mock 原型，公共信息）
   ===================== */
.page-analysis .ai-bias {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--gold);
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 10px;
}
.page-analysis .ai-headline {
  font-size: 17px;
  font-weight: 700;
  color: var(--text-strong);
  line-height: 1.5;
  margin-bottom: 8px;
}
.page-analysis .ai-summary {
  font-size: 14.5px;
  color: var(--text);
  line-height: 1.65;
}
.page-analysis .ai-updated {
  margin-top: 10px;
  font-size: 12.5px;
  color: var(--muted);
}
.page-analysis .ai-driver-item {
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.page-analysis .ai-driver-item:last-child {
  border-bottom: none;
}
.page-analysis .ai-driver-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-strong);
  margin-bottom: 4px;
}
.page-analysis .ai-driver-text {
  font-size: 14px;
  color: var(--text);
  line-height: 1.65;
}
.page-analysis .ai-factors-group {
  margin-bottom: 14px;
}
.page-analysis .ai-factors-group:last-child {
  margin-bottom: 0;
}
.page-analysis .ai-factors-head {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 6px;
}
.page-analysis .ai-factors-bullish {
  color: var(--positive);
}
.page-analysis .ai-factors-pressure {
  color: var(--negative);
}
.page-analysis .ai-factors-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-analysis .ai-factors-list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  color: var(--text);
  line-height: 1.7;
}
.page-analysis .ai-factors-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 11px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--muted-2);
}
.page-analysis .ai-event {
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.page-analysis .ai-event:last-child {
  border-bottom: none;
}
.page-analysis .ai-event-time {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--gold);
  margin-bottom: 4px;
}
.page-analysis .ai-event-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-strong);
  margin-bottom: 4px;
}
.page-analysis .ai-event-text,
.page-analysis .ai-event-why {
  font-size: 14px;
  color: var(--text);
  line-height: 1.65;
}
.page-analysis .ai-event-why {
  color: var(--muted);
  margin-top: 2px;
}
.page-analysis .ai-event-empty {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.65;
}
.page-analysis .ai-analysis p {
  font-size: 14.5px;
  color: var(--text);
  line-height: 1.7;
  margin-bottom: 12px;
}
.page-analysis .ai-analysis p:last-child {
  margin-bottom: 0;
}
.page-analysis .ai-analysis strong {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--text-strong);
}
.page-analysis .ai-disclaimer {
  margin-top: 14px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.6;
}
/* =====================
   G10.0 分析页字体优化
   面向普通用户阅读体验
   ===================== */

.page-analysis .ai-bias {
  font-size: 18px;/*状态标签*/
}

.page-analysis .ai-headline {
  font-size: 19px;/*一句话标题*/
  line-height: 1.6;
}

.page-analysis .ai-summary {
  font-size: 18px; /*摘要*/
  line-height: 1.8;
}

.page-analysis .ai-updated {
  font-size: 14px;/*更新时间*/
}

.page-analysis .ai-driver-title {
  font-size: 19px;/*因素标题*/
}

.page-analysis .ai-driver-text {
  font-size: 18px;/*因素解释*/
  line-height: 1.8;
}

.page-analysis .ai-factors-head {
  font-size: 19px;/*利好/压力标题*/
}

.page-analysis .ai-factors-list li {
  font-size: 18px;/*列表*/
  line-height: 1.8;
}

.page-analysis .ai-event-time {
  font-size: 17px;/*更新时间*/
}

.page-analysis .ai-event-title {
  font-size: 19px;/*事件标题*/
  font-weight: 700;
}

.page-analysis .ai-event-text,
.page-analysis .ai-event-why {
  font-size: 18px;
  line-height: 1.8;
}

.page-analysis .ai-event-empty {
  font-size: 18px;
}

.page-analysis .ai-analysis p {
  font-size: 18px;
  line-height: 1.9;
}

.page-analysis .ai-analysis strong {
  font-size: 19px;/*解读的标题*/
  font-weight: 700;
}

.page-analysis .ai-disclaimer {
  font-size: 18px;
}
/* =====================
   G10.0 分析页字体优化
   面向普通用户阅读体验
   ===================== */

/* 分析页五个卡片大标题 */
.page-analysis .card-title {
  font-size: 21px;
  font-weight: 800;
}

/* 后面保持你刚才那些设置 */
/* 分析页卡片之间的间距 */
.page-analysis .card + .card {
  margin-top: 16px;
}

/* G10.6 修正版：每份情报期次小标题（早间 / 下午） */
.page-analysis .ai-edition-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  margin: 18px 2px 10px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap; /* 窄屏放不下时整段时间折行，避免横向溢出 */
}
.page-analysis .ai-edition-time {
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  white-space: nowrap; /* 完整更新时间不中途断行 */
}

.price-value,
.quote-value,
.stat-row strong,
.stats-card .num,
.txn-cell .v,
.hero-amount,
.hero-stat .v,
.ai-edition-title,
.ai-edition-time,
.ai-bias,
.ai-event-time,
.quote-sub,
.price-sub {
  font-family: var(--font-condensed);
}

[data-theme="dark"] .nav-item.active {
  color: var(--gold);
}

[data-theme="dark"] .btn-mini {
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
}

[data-theme="dark"] .asset-hero {
  border-color: rgba(255, 201, 40, 0.55);
}

[data-theme="dark"] .asset-hero .privacy-masked::after {
  background: rgba(21, 21, 21, 0.32);
  box-shadow: inset 0 0 0 0.5px rgba(21, 21, 21, 0.18);
}

/* 分析页板块标题左侧小色条（五个板块统一；仅 .page-analysis 作用域，不污染其它页面） */
.page-analysis .card-title.title-view,
.page-analysis .card-title.title-drivers,
.page-analysis .card-title.title-forces,
.page-analysis .card-title.title-events,
.page-analysis .card-title.title-deep {
  display: flex;
  align-items: center;
  gap: 10px;
}
.page-analysis .card-title.title-view::before,
.page-analysis .card-title.title-drivers::before,
.page-analysis .card-title.title-forces::before,
.page-analysis .card-title.title-events::before,
.page-analysis .card-title.title-deep::before {
  content: "";
  flex: none;
  width: 5px;
  height: 22px;
  border-radius: 4px;
}
.page-analysis .card-title.title-view::before {
  background: #b08a3e; /* 今日 AI 观点：低饱和金/琥珀 */
}
.page-analysis .card-title.title-drivers::before {
  background: #6b82a6; /* 今天黄金为什么这样走：低饱和蓝 */
}
.page-analysis .card-title.title-forces::before {
  background: #6f9d80; /* 现在有哪些利好和压力：低饱和绿 */
}
.page-analysis .card-title.title-events::before {
  background: #8478a3; /* 接下来值得留意：低饱和紫灰 */
}
.page-analysis .card-title.title-deep::before {
  background: #a0703f; /* 今日黄金解读：低饱和橙棕 */
}

/* 首页板块标题左侧小色条（三个板块统一；仅 .page-home 作用域，不污染其它页面） */
.page-home .card-title.title-market,
.page-home .card-title.title-asset,
.page-home .card-title.title-profit {
  display: flex;
  align-items: center;
  gap: 10px;
}
.page-home .card-title.title-market::before,
.page-home .card-title.title-asset::before,
.page-home .card-title.title-profit::before {
  content: "";
  flex: none;
  width: 5px;
  height: 22px;
  border-radius: 4px;
}
.page-home .card-title.title-market::before {
  background: #6b82a6; /* 今日行情：低饱和蓝 */
}
.page-home .card-title.title-asset::before {
  background: #b08a3e; /* 黄金资产总览：金/琥珀 */
}
.page-home .card-title.title-profit::before {
  background: #6f9d80; /* 黄金投资收益：低饱和绿 */
}

/* 交易页"添加交易"按钮：透明底 + 金色描边（仅 btn-add-txn，不影响共用按钮） */
.btn-add-txn {
  background: transparent;
  color: var(--gold);
  border: 1px solid var(--gold);
  border-radius: 14px;
  box-shadow: none;
  padding: 8px 18px;
}
.btn-add-txn:hover {
  background: var(--gold-soft);
  color: var(--gold);
}
.btn-add-txn:active {
  background: var(--gold-soft);
  color: var(--gold);
}