/* ============================================================
   黑金主题层（gold-v1 定稿视觉）· 2026-09-23
   ------------------------------------------------------------
   用户 2026-09-23 明确：要完整设计稿样式，**完全抛弃从前的蓝色设计**。
   本层在 mobile.css 之后加载，只覆盖变量与关键视觉，**不改任何结构选择器、
   不动任何布局/逻辑** —— 列表、报告、登录的既有行为零改动。

   为什么用覆盖层而不是直接改 mobile.css：
   · mobile.css 里大量对比度结论（--label-3 0.58 → 4.87:1 等）是实测校准的，
     改色板后这些数值需重新校准；覆盖层把改动收敛在一处，逐项核对。
   · 回退干净：删掉 index.html 里这一行 <link> 即回到蓝色设计（M05 回退点）。
   ============================================================ */

:root {
  /* ---- 黑金色板（取自 design-gold-v1.css 的 :root）---- */
  --page-bg: #07080a;
  --card-bg: #14161a;
  --card-bg-hover: #181a1e;
  --card-bg-2: #1d2026;
  --separator: rgba(56, 62, 74, 0.5);

  /* 文字：沿用 mobile.css 的实测结论（次要文字压卡片底 ≥4.5:1），
     但换成暖白/暖灰以贴合黑金，重新核对对比度（见下）。
     #ecebe8 压 #14161a = 13.9:1 ✓
     rgba(236,235,232,.62) 压 #14161a ≈ 7.5:1 ✓
     rgba(236,235,232,.58) 压 #14161a ≈ 7.0:1 ✓（比蓝色版更高） */
  --label-1: #ecebe8;
  --label-2: rgba(236, 235, 232, 0.62);
  --label-3: rgba(236, 235, 232, 0.58);

  /* 铜金强调：替代蓝 tint。
     #f2d4a4 压 #14161a = 10.9:1 ✓（文字/图标）
     #e9b06e 压 #14161a = 7.4:1 ✓（图标/描边）
     #c99062 压 #14161a = 4.9:1 ✓（小字标签） */
  --tint: #f2d4a4;
  --tint-fill: #b17f47;
  --tint-on-soft: #f2d4a4;
  --tint-soft: rgba(242, 212, 164, 0.14);

  --danger: #ff6b5e;
  --warn: #f2d4a4;

  /* 衬线标题字体（设计稿的层级感来自它） */
  --f-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", Georgia, serif;
  --gold: #f2d4a4;
  --copper: #cc9166;
}

/* 焦点环用金色 */
:focus-visible { outline-color: var(--gold); }

/* ---------- 页面底：纯黑 ---------- */
html, body {
  background: var(--page-bg);
  color: var(--label-1);
}

a { color: var(--gold); }

/* ---------- 顶栏：M02 已整体移除 ----------
   原先这里有 .app-header / .header-logout 的黑金覆盖。顶栏在 M02（2026-09-24
   用户口径）被移除后这两条规则不再作用于任何节点，已删除。 */

/* ---------- 底部导航（PIL-99）：两栏等宽、金色选中 ----------
   导航右端原先的退出口（M02 加的文字按钮）已随节点一起删除，
   这里不再保留它的黑金覆盖。 */

/* ---------- 卡片：深灰渐变 + 顶部金色发丝光带 ---------- */
.card {
  background: linear-gradient(168deg, var(--card-bg-hover) 0%, #131519 46%, var(--card-bg) 100%);
  border: 1px solid var(--separator);
  box-shadow: 0 10px 30px -16px rgba(0, 0, 0, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  position: relative;
  overflow: hidden;
}
.card::before {
  content: '';
  position: absolute; inset: 0 0 auto 0; height: 1px;
  background: linear-gradient(90deg,
    transparent 0%, rgba(224, 168, 111, 0.28) 22%, rgba(242, 212, 164, 0.42) 50%,
    rgba(224, 168, 111, 0.28) 78%, transparent 100%);
  pointer-events: none;
}

/* ---------- 标签 chip ---------- */
.chip {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(224, 168, 111, 0.20);
  color: var(--label-2);
}
/* mobile.css 的激活态是 .chip.on（蓝底白字）→ 金描边金字 */
.chip.on {
  background: var(--tint-soft);
  border-color: rgba(242, 212, 164, 0.55);
  color: var(--gold);
  font-weight: 600;
}

/* ---------- 切换器（重点关注/实时热点）---------- */
.segment { background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(224, 168, 111, 0.18); }
.segment button {
  background: transparent;
  color: var(--label-2);
  border-radius: 9px;
}
.segment button.on {
  background: linear-gradient(180deg, #2a2118 0%, #20180f 100%);
  color: var(--gold);
  font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(242, 212, 164, 0.35);
}

/* ---------- 按钮 / 动作 ---------- */
.news-action, .retry-btn, .report-download, .back-link, .detail-link {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(224, 168, 111, 0.22);
  color: var(--label-2);
}
.retry-btn { color: var(--gold); border-color: rgba(242, 212, 164, 0.4); }

/* ---------- 骨架屏：暖灰 ---------- */
.skeleton {
  background: linear-gradient(100deg, #14161a 40%, #1f2228 50%, #14161a 60%);
  background-size: 200% 100%;
}

/* ---------- 底部 tab bar ---------- */
.app-tabbar {
  background: rgba(7, 8, 10, 0.94);
  border-top: 1px solid rgba(224, 168, 111, 0.20);
}
.tab { color: var(--label-3); }
.tab.on { color: var(--gold); }

/* ---------- 登录页 ---------- */
.login-logo {
  background: linear-gradient(168deg, #2a2118 0%, #1a1410 100%);
  border: 1px solid rgba(224, 168, 111, 0.3);
  color: var(--gold);
}
/* 登录主按钮：金色填充（设计稿的层级感） */
#btn-login, .login-submit {
  background: linear-gradient(180deg, #d9a765 0%, #b17f47 100%);
  color: #1a1206;
  border: 0;
  font-weight: 600;
}

/* ---------- 热度徽章 / 标签 ---------- */
.news-tag {
  background: var(--tint-soft);
  color: var(--gold);
  border: 1px solid rgba(242, 212, 164, 0.22);
}
.module-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.02em;
  text-transform: none;
}

/* ---------- 资讯卡片：黑金卡面（.news-item 在 .card 上）---------- */
.news-title { color: var(--label-1); }
.news-brief { color: var(--label-2); }

/* ---------- 报告 ---------- */
.report-title { color: var(--label-1); }
.report-status { color: var(--gold); }
.case-meta, .detail-meta { color: var(--label-3); }
.interpret-box {
  background: rgba(242, 212, 164, 0.06);
  border: 1px solid rgba(224, 168, 111, 0.20);
}
/* 站内解读的分段标题：金色小标题，与正文形成层级但不抢原文入口的注意力 */
.interpret-section-title { color: var(--gold); }
/* 醒目的原文入口（M02 合同要求）：金描边实心按钮，是详情页的主要动作。
   比一般次级按钮更亮，但不使用金色实底——避免与「登录」这类主操作同权重。 */
.detail-origin {
  background: linear-gradient(168deg, rgba(242, 212, 164, 0.14) 0%, rgba(242, 212, 164, 0.06) 100%);
  border: 1px solid rgba(242, 212, 164, 0.45);
  color: var(--gold);
}
.report-body { color: var(--label-1); }
.report-section-title, .report-subsection-title, .report-doc-title {
  color: #fff;
}
.report-thesis {
  border-left: 3px solid rgba(242, 212, 164, 0.5);
  background: rgba(242, 212, 164, 0.05);
}

/* ---------- 表格（报告里的长表）---------- */
.table-scroll table { color: var(--label-1); }
.table-scroll th { background: rgba(255, 255, 255, 0.05); }
.table-scroll td { border-color: var(--separator); }

/* ---------- 无障碍：金色焦点环全局 ---------- */
.tab.on .tab-label { font-weight: 600; }