/* ============================================================
   纸张纹理 / 背景 / 装饰动效
   ============================================================ */

/* —— 颗粒纹理（grain）—— */
.bg-grain {
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.3 0 0 0 0 0.2 0 0 0 0 0.1 0 0 0 0.55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
}

/* —— 角落渐暗 —— */
.bg-vignette {
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: var(--vignette-opacity);
  background:
    radial-gradient(ellipse at 50% 0%, transparent 30%, rgba(60,40,10,0.18) 100%),
    radial-gradient(ellipse at 0% 100%, rgba(60,40,10,0.12), transparent 50%),
    radial-gradient(ellipse at 100% 100%, rgba(60,40,10,0.12), transparent 50%);
}

/* —— 四角印章 —— */
.bg-corner-stamp {
  position: fixed;
  width: 110px; height: 110px;
  color: var(--seal);
  opacity: 0.22;
  pointer-events: none;
  z-index: 0;
}
.bg-corner-stamp--tl { top: 18px; left: 18px; transform: rotate(-8deg); }
.bg-corner-stamp--br { bottom: 18px; right: 18px; transform: rotate(6deg); color: var(--gold); }
.bg-corner-stamp svg { width: 100%; height: 100%; }

body > * { position: relative; z-index: 1; }

/* —— 入场：标题打字机 —— */
.masthead__main {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  border-right: 2px solid var(--seal);
  animation: typing 1.2s steps(3) 0.1s forwards, caret 0.9s step-end 1.4s infinite;
  width: 0;
}
@keyframes typing { to { width: 1.2em; } }
@keyframes caret { 50% { border-color: transparent; } }

/* —— 打字机逐行（lead 文本）—— */
.search-section__lead {
  opacity: 0;
  animation: fadeUp .6s var(--ease) .8s forwards;
}
@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.search-form {
  opacity: 0;
  animation: fadeUp .6s var(--ease) 1.1s forwards;
}

/* —— 侧栏历史逐条入场 —— */
.sidebar__item {
  opacity: 0;
  animation: fadeIn .4s var(--ease) forwards;
}
@keyframes fadeIn { to { opacity: 1; } }

/* —— 卡片悬停浮起 —— */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .masthead__main { width: auto; border: 0; }
}

/* —— 历史项 hover 印章印记 —— */
.sidebar__item:active::before {
  content: "查";
  position: absolute; left: -2px; top: 50%; transform: translateY(-50%) rotate(-6deg);
  color: var(--seal);
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 22px;
  opacity: 0.3;
  pointer-events: none;
}

/* —— 详情展开后印章加盖 —— */
.card__detail.is-open ~ .card__seal { opacity: 0.9; }

/* —— loading 印章呼吸 —— */
.status--loading .status__text {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-mute);
  animation: pulse 1.4s var(--ease) infinite;
}
@keyframes pulse { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }