/* ============================================================
   基础层：重置、排版、氛围背景、焦点与动效降级
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: var(--lh-body);
  letter-spacing: .02em;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: var(--lh-tight);
  letter-spacing: -.01em;
  margin: 0;
}
p { margin: 0; }
a { color: var(--color-accent); text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
ul { margin: 0; padding: 0; list-style: none; }

/* 数字统一等宽，列表里的编号/计数才不会跳动 */
.num, .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

/* ---------- 焦点可见（键盘可达）---------- */
:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* ---------- 氛围层：纸面的暖光晕 + 纤维颗粒 ---------- */
.atmosphere {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(58rem 38rem at 6% -14%, rgba(211, 188, 142, .30), transparent 62%),
    radial-gradient(48rem 34rem at 98% 2%, rgba(63, 127, 108, .10), transparent 58%),
    radial-gradient(64rem 42rem at 50% 112%, rgba(165, 116, 31, .07), transparent 60%);
}
.atmosphere::after {
  content: ""; position: absolute; inset: 0; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}
/* 极细档案格线，弱化纯色平铺（浅底上用深色低透明） */
.grain-lines {
  position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .5;
  background-image:
    repeating-linear-gradient(90deg, rgba(74, 71, 64,.030) 0 1px, transparent 1px 88px),
    repeating-linear-gradient(0deg, rgba(74, 71, 64,.024) 0 1px, transparent 1px 88px);
}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(165, 116, 31, .28);
  border: 3px solid transparent; background-clip: padding-box; border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover { background: rgba(165, 116, 31, .48); background-clip: padding-box; }

/* ---------- 入场序列（3-6 组错峰）---------- */
.reveal { opacity: 0; transform: translateY(16px); }
.reveal.in {
  opacity: 1; transform: none;
  transition: opacity var(--dur-base) var(--ease-out),
              transform var(--dur-base) var(--ease-out);
}
.reveal:nth-child(2) { transition-delay: 70ms; }
.reveal:nth-child(3) { transition-delay: 140ms; }
.reveal:nth-child(4) { transition-delay: 210ms; }
.reveal:nth-child(5) { transition-delay: 280ms; }

/* ---------- 动效降级 ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}
