/* =====================================================================
   星舰7 证据库 · 子页面亮色主题（详情页 / 自查 / 维权 / 时间线）
   在 site.css 之后加载，把暖米色纸张调改为清蓝白
   ===================================================================== */

:root {
  --paper: #f6f9ff;
  --paper-warm: #eef5ff;
  --card: #ffffff;
  --card-soft: #f8fbff;

  --ink: #0d1e35;
  --ink-2: #3d5171;
  --ink-3: #6f8099;
  --ink-4: #93a3ba;

  --rule: #dde7f5;
  --rule-strong: #c2d3e9;

  --red: #cf2f2f;
  --red-deep: #a82424;
  --red-soft: #fdeeee;
  --navy: #1f6feb;
  --navy-soft: #e9f2ff;
  --gold: #9a6f2a;
  --gold-soft: #fbf3e2;
  --green: #1f7a55;

  --shadow-1: 0 1px 2px rgba(24, 78, 155, 0.05), 0 6px 18px -12px rgba(24, 78, 155, 0.18);
  --shadow-2: 0 1px 2px rgba(24, 78, 155, 0.06), 0 16px 40px -22px rgba(24, 78, 155, 0.26);

  color-scheme: light;
}

body {
  background: var(--paper);
  background-image:
    radial-gradient(900px 460px at 50% -12%, #e8f2ff 0%, rgba(246, 249, 255, 0) 62%),
    radial-gradient(700px 420px at 88% 6%, rgba(15, 163, 192, 0.06) 0%, rgba(246, 249, 255, 0) 60%);
  background-repeat: no-repeat;
  color: var(--ink);
}

body::after {
  opacity: 0.015;
}

/* ---------- 顶栏 ---------- */

.site-head {
  background: rgba(255, 255, 255, 0.82);
  border-bottom: 1px solid var(--rule);
  backdrop-filter: blur(16px) saturate(150%);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
}

.brand {
  color: var(--ink);
}

.nav a {
  color: var(--ink-3);
}

.nav a:hover {
  color: var(--blue, #1f6feb);
}

.progress {
  background: transparent;
}

.progress i {
  background: linear-gradient(90deg, #1f6feb, #12a8c6);
}

/* ---------- 徽标 / 标签 ---------- */

.pill-p0 {
  color: #fff;
  background: var(--red);
}

.pill-p1 {
  color: var(--gold);
  background: var(--gold-soft);
}

.pill-p2 {
  color: var(--navy);
  background: var(--navy-soft);
}

.pill-p3 {
  color: var(--ink-3);
  background: #f1f5fb;
  border: 1px solid var(--rule);
}

.tag {
  color: var(--ink-2);
  background: var(--navy-soft);
  border: 1px solid #d5e4f8;
}

/* ---------- 对照卡 ---------- */

.cmp-card {
  background: var(--card);
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-1);
}

.cmp-head {
  border-bottom: 1px solid var(--rule);
  color: var(--ink-3);
}

.cmp-badge {
  color: var(--red);
  background: var(--red-soft);
  border: 1px solid #f4cccc;
}

.vs-col.diff {
  background: #fff7f7;
  border-left: 1px solid #f4dcdc;
}

.vs-col + .vs-col {
  border-left-color: var(--rule);
}

.vs-tag {
  color: var(--ink-3);
}

.vs-name {
  color: var(--ink);
}

.vs-row + .vs-row {
  border-top: 1px solid var(--rule);
}

.vs-k {
  color: var(--ink-4);
}

.vs-v {
  color: var(--ink-2);
}

.vs-v.warn,
.vs-v.is-warn {
  color: var(--red);
}

.vs-arrow,
.vs-divider {
  color: var(--ink-4);
}

/* ---------- 证据格 ---------- */

.ecell {
  background: var(--card);
  border: 1px solid var(--rule);
}

.ecell:hover {
  border-color: var(--rule-strong);
}

.ecell-box,
.ecell figcaption,
.ecell .cap {
  background: var(--card-soft);
  color: var(--ink-3);
  border-top: 1px solid var(--rule);
}

/* ---------- 进度条 ---------- */

.cp-track {
  background: #e7eefa;
}

.cp-fill {
  background: linear-gradient(90deg, #1f6feb, #12a8c6);
}

.cp-num {
  color: var(--ink);
}

/* ---------- 自查清单 ---------- */

.check-item {
  background: var(--card);
  border: 1px solid var(--rule);
}

.check-item.is-done {
  background: #f2fbf6;
  border-color: #cbe9d9;
}

.check-item.is-done .ci-title {
  color: var(--ink-3);
}

.ci-box {
  background: #fff;
  border-color: var(--rule-strong);
}

.ci-title {
  color: var(--ink);
}

.ci-how {
  color: var(--ink-3);
}

/* ---------- 步骤 / 时间线连线 ---------- */

.step-line {
  background: #dbe6f5;
}

.step-dot {
  background: #fff;
  border: 1px solid var(--rule-strong);
  color: var(--ink-3);
}

.tl-line {
  background: linear-gradient(180deg, #9dc4ff, #dbe6f5);
}

.tl-item time {
  color: var(--ink-4);
}

.tl-dot {
  background: #fff;
  border: 2px solid var(--rule-strong);
}

.tl-hot .tl-dot {
  background: var(--red);
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(207, 47, 47, 0.12);
}

/* ---------- 分享按钮 / 热线 / 模板 ---------- */

.share-btn {
  background: linear-gradient(135deg, #eaf3ff, #f7fbff);
  border: 1px solid #cfe2fa;
  color: var(--ink);
}

.share-btn:hover {
  background: linear-gradient(135deg, #e0eeff, #f2f8ff);
}

.share-btn span {
  color: var(--ink-3);
}

.hotline {
  background: linear-gradient(135deg, #eaf3ff, #f6faff);
  border: 1px solid #cfe2fa;
  color: var(--ink);
}

.hotline-main span {
  color: var(--ink-3);
}

.hotline-main b {
  color: var(--navy);
}

.hotline-call {
  color: #fff;
  background: var(--navy);
  border: 1px solid #145fd6;
}

.tpl {
  background: #f8fbff;
  border: 1px solid var(--rule);
  color: var(--ink-2);
}

.demand {
  background: #f7faff;
  border-left: 2px solid var(--red);
  color: var(--ink-2);
}

.footnote {
  color: var(--ink-4);
}

/* ---------- 页脚 / 分页 ---------- */

footer.wrap {
  border-top: 1px solid var(--rule);
}

footer.wrap p,
footer.wrap .footnote {
  color: var(--ink-4);
}

.pager a {
  background: var(--card);
  border: 1px solid var(--rule);
  color: var(--ink-2);
}

.pager a:hover {
  border-color: var(--rule-strong);
  color: var(--ink);
}

/* ---------- 交互层 ---------- */

.toast {
  background: rgba(13, 30, 53, 0.94);
  color: #fff;
}

.tool {
  background: var(--card);
  border: 1px solid var(--rule);
}

.tool:hover {
  border-color: var(--rule-strong);
}

.tool-title {
  color: var(--ink);
}

.tool-desc {
  color: var(--ink-3);
}

::selection {
  background: rgba(31, 111, 235, 0.18);
  color: var(--ink);
}

@media print {
  body {
    background: #fff !important;
    background-image: none !important;
  }
}
