/* 六智宝库 - 公共样式（所有页面共用） */

/* ---- 颜色变量 ---- */
:root {
  --bg: #F2E8D2;
  --surface: #FAF1DC;
  --surface-2: #E8D6B0;
  --fg: #2C1F12;
  --muted: #6F5A47;
  --border: rgba(44,31,18,0.10);
  --primary: #C73E2A;
  --accent: #1E6B6E;
  --font-sans: 'Inter','PingFang SC','Hiragino Sans GB','Microsoft YaHei','Source Han Sans SC',system-ui,sans-serif;
  /* 卡片比页面底色更亮，才能从方格纸上"浮"起来（--bg 与 --surface 只差 8/255） */
  --card: #FCF6E7;
  --card-border: rgba(44,31,18,0.13);
  --card-shadow: 0 1px 2px rgba(44,31,18,.05), 0 14px 32px -22px rgba(44,31,18,.40);
  --radius: 14px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---- 滚动入场（页面脚本添加 .is-in；include.js 有 1.6s 兜底）----
   各页可覆写；首页 index.css / 术语页 glossary.css 有自己的版本，加载更晚故优先级更高 */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
  transition-delay: var(--d, 0s);
}
.reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---- 基础重置 ---- */
* { margin:0; padding:0; box-sizing:border-box; }
html, body {
  color:var(--fg);
  font-family:var(--font-sans);
}
/* html 兜底纯色，避免橡皮筋回弹时露出格子外的空白 */
html { background:var(--bg); }

/* ---- 亚麻纸质感背景 + 微弱方格线（纸质笔记感）----
   与解读页基准 home/antacid.html 的对应设计令牌完全一致 */
body {
  background-color: var(--bg);
  background-image:
    radial-gradient(circle at 15% 20%, rgba(199,62,42,0.07) 0%, transparent 38%),
    radial-gradient(circle at 85% 80%, rgba(30,107,110,0.07) 0%, transparent 38%),
    linear-gradient(rgba(44,31,18,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(44,31,18,0.04) 1px, transparent 1px);
  background-size: auto, auto, 28px 28px, 28px 28px;
  background-attachment: fixed;
}

/* ---- 页面头部 ---- */
.page-header {
  padding:3rem 1.5rem 2rem;
  max-width:1100px;
  margin:0 auto;
}
.page-header h1 {
  font-family:'Fraunces','Songti SC','Source Han Serif SC','SimSun',serif;
  font-size:clamp(1.8rem,4vw,2.5rem);
  font-weight:700;
  margin-bottom:0.5rem;
}
.page-header p { color:var(--muted); font-size:1rem; }

/* ---- 页头小标（场景色由 --tone 下发，未设置时用主色）---- */
.page-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .12em;
  color: var(--tone, var(--primary));
  padding: .32rem .72rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tone, var(--primary)) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--tone, var(--primary)) 22%, transparent);
  margin-bottom: .85rem;
}
.page-eyebrow i {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--tone, var(--primary));
}

/* ---- 返回链接 ---- */
.back-link {
  display:inline-flex;
  align-items:center;
  gap:0.3rem;
  color:var(--accent);
  text-decoration:none;
  font-size:0.9rem;
  margin-top:1rem;
  padding:0.5rem 1rem;
  border:1px solid var(--border);
  border-radius:6px;
  transition:background .15s;
}
.back-link:hover { background:var(--surface-2); }

/* ---- 敬请期待卡片 ---- */
.coming-soon {
  max-width:600px;
  margin:2rem auto 4rem;
  text-align:center;
  padding:2rem;
  background:var(--surface);
  border-radius:12px;
  border:1px dashed var(--border);
}
.coming-soon h2 { font-size:1.4rem; margin-bottom:0.75rem; }
.coming-soon p { color:var(--muted); line-height:1.6; }