/* ============================================
   智乐园 · AgentWish — 全站设计系统「纸墨」
   三色而已：纸白、墨黑、朱砂。
   无图标、无渐变、无彩块；以字为图，以线为界。
   ============================================ */

:root {
  /* 纸与墨 */
  --paper: #FAF8F4;          /* 纸底 */
  --paper-card: #FFFDF9;     /* 浅一度的纸（卡面） */
  --paper-warm: #F7F3EA;     /* 微暖的纸 */
  --paper-deep: #F3F0E9;     /* 深一度的纸 */
  --ink: #1C1B18;            /* 墨 */
  --ink-soft: #5C5850;       /* 淡墨 */
  --ink-mute: #6B6355;       /* 中墨（过渡） */
  --ink-faint: #918C80;      /* 极淡墨（注脚） */
  --hairline: #E3DED2;       /* 界线 */
  --cinnabar: #9E2F23;       /* 朱砂（唯一点睛色） */
  --cinnabar-deep: #7E251C;  /* 朱砂按下 */
  --cinnabar-soft: #B8524533;

  /* 兼容旧变量名（老页面可能引用）。
     一律回落到纸墨三色 + 墨灰过渡，旧名仍在，但绝不会漏出蓝绿橙。 */
  --c-primary: #9E2F23;
  --c-primary-hover: #7E251C;
  --c-primary-soft: #F3EBE4;
  --c-accent: #9E2F23;
  --c-orient-bg: #F7F3EA;
  --c-orient-ink: #1C1B18;
  --c-orient-cinnabar: #9E2F23;
  --c-orient-gold: #6B6355;
  --c-bg: #FAF8F4;
  --c-bg-subtle: #F3F0E9;
  --c-border: #E3DED2;
  --c-text: #1C1B18;
  --c-text-muted: #5C5850;
  --c-success: #5C5850;
  --c-warning: #6B6355;
  --c-danger: #9E2F23;

  /* 间距 */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-6: 24px; --s-8: 32px; --s-12: 48px; --s-16: 72px;

  --r-sm: 2px; --r-md: 3px; --r-lg: 4px; --r-full: 999px;

  --f-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --f-sans: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", Consolas, monospace;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--f-sans);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.85;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; border-radius: 8px; }

/* 行内朱砂强调（抽取自首页重复内联样式） */
.em-cinnabar { font-style: normal; color: var(--cinnabar); border-bottom: none; }
h1, h2, h3, h4 { font-family: var(--f-serif); font-weight: 600; line-height: 1.4; }
.container { max-width: 1040px; margin: 0 auto; padding: 0 var(--s-6); }

::selection { background: var(--cinnabar); color: var(--paper); }

/* ============ 顶部导航 ============ */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250,248,244,.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--hairline);
}
.site-header .nav-inner {
  display: flex; align-items: center; gap: var(--s-8);
  height: 64px;
}
.brand {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-serif); font-weight: 700; font-size: 19px;
  letter-spacing: .08em; flex-shrink: 0;
}
.brand .logo-dot {
  width: 30px; height: 30px; border-radius: var(--r-md);
  background: var(--paper-deep); overflow: hidden;
  display: grid; place-items: center;
}
.brand .logo-dot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nav-links { display: flex; gap: var(--s-6); flex: 1; }
.nav-links a {
  font-size: 14.5px; color: var(--ink-soft);
  letter-spacing: .04em; padding: 4px 0;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.nav-links a:hover { color: var(--ink); }
.nav-links a.active { color: var(--cinnabar); border-bottom-color: var(--cinnabar); font-weight: 600; }
.nav-me {
  font-size: 13.5px; color: var(--ink-faint);
  letter-spacing: .04em; flex-shrink: 0;
  transition: color .15s;
}
.nav-links .nav-me-in { display: none; }
.nav-me:hover { color: var(--cinnabar); }
.nav-toggle { display: none; background: none; border: none; font-size: 20px; cursor: pointer; color: var(--ink); }

/* ============ 页脚 ============ */
.site-footer {
  border-top: 1px solid var(--hairline);
  background: var(--paper-deep);
  padding: var(--s-12) 0 var(--s-8);
  margin-top: var(--s-16);
  font-size: 13.5px; color: var(--ink-soft);
}
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--s-8); margin-bottom: var(--s-8); }
.footer-grid h4 { font-size: 14px; color: var(--ink); margin-bottom: var(--s-3); letter-spacing: .06em; font-family: var(--f-serif); }
.footer-grid a { display: block; padding: 3px 0; color: var(--ink-soft); }
.footer-grid a:hover { color: var(--cinnabar); }
.footer-bottom {
  border-top: 1px solid var(--hairline); padding-top: var(--s-4);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--s-2);
  font-size: 12.5px; color: var(--ink-faint);
}

/* ============ 章节 ============ */
.section { padding: var(--s-16) 0 0; }
.chapter-no {
  font-family: var(--f-serif); font-size: 13px; color: var(--cinnabar);
  letter-spacing: .5em; margin-bottom: 6px;
}
.section-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: var(--s-2); }
.section-head h2 { font-size: 26px; letter-spacing: .04em; }
.section-head .more { font-size: 13.5px; color: var(--ink-faint); letter-spacing: .04em; }
.section-head .more:hover { color: var(--cinnabar); }
.section-sub {
  color: var(--ink-soft); font-size: 14.5px;
  margin-bottom: var(--s-8); font-family: var(--f-serif);
}

/* ============ 通用组件 ============ */
.btn {
  display: inline-flex; align-items: center; gap: var(--s-2);
  padding: 11px 28px; border-radius: var(--r-sm);
  font-size: 14.5px; letter-spacing: .1em; cursor: pointer;
  border: 1px solid var(--ink); background: transparent; color: var(--ink);
  font-family: var(--f-serif); transition: all .18s;
}
.btn:hover { background: var(--ink); color: var(--paper); }
.btn-primary { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn-primary:hover { background: var(--cinnabar); border-color: var(--cinnabar); }
.btn-ghost { border-color: var(--hairline); color: var(--ink-soft); }
.btn-ghost:hover { border-color: var(--ink); background: transparent; color: var(--ink); }

.card {
  background: var(--paper-card);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: var(--s-6);
  transition: border-color .2s;
}
.card:hover { border-color: var(--ink-faint); }
.card:hover h3 { color: var(--cinnabar); }
.card h3 { transition: color .2s; }

/* 单字记号（替代一切图标） */
.mark {
  width: 40px; height: 40px; flex-shrink: 0;
  border: 1px solid var(--hairline); border-radius: var(--r-sm);
  display: grid; place-items: center;
  font-family: var(--f-serif); font-size: 18px; font-weight: 600;
  color: var(--ink-soft); background: transparent;
  transition: all .2s;
}
.card:hover .mark, a:hover > .mark { border-color: var(--cinnabar); color: var(--cinnabar); }
.mark-solid { background: var(--cinnabar); border-color: var(--cinnabar); color: var(--paper); }
.card:hover .mark-solid { color: var(--paper); }

.tag {
  display: inline-block; padding: 1px 10px;
  font-size: 12px; letter-spacing: .05em;
  color: var(--ink-faint); border: 1px solid var(--hairline);
  border-radius: var(--r-sm); background: transparent;
}
.tag-blue, .tag-green, .tag-amber { color: var(--ink-soft); }
.tag-red, .tag-live { color: var(--cinnabar); border-color: var(--cinnabar-soft); }

.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-6); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-6); }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-4); }

/* 面包屑 */
.breadcrumb { font-size: 12.5px; color: var(--ink-faint); padding: var(--s-4) 0; letter-spacing: .04em; }
.breadcrumb a:hover { color: var(--cinnabar); }
.breadcrumb .sep { margin: 0 8px; opacity: .5; }

/* 页面标题区 */
.page-hero { padding: var(--s-12) 0 var(--s-8); border-bottom: 1px solid var(--hairline); margin-bottom: var(--s-8); }
.page-hero .chapter-no { margin-bottom: 10px; }
.page-hero h1 { font-size: 36px; letter-spacing: .06em; margin-bottom: var(--s-4); }
.page-hero p { color: var(--ink-soft); font-size: 15.5px; max-width: 620px; font-family: var(--f-serif); }

/* 衬线正文块。全局 reset 抹平了 ul/ol 的缩进，此处统一补回，
   免得每页各自重造。纯增量：不加 .prose 的页面一切照旧。 */
.prose { font-family: var(--f-serif); color: var(--ink-soft); font-size: 15.5px; line-height: 2.1; }
.prose > * + * { margin-top: var(--s-4); }
.prose p, .prose li { max-width: 72ch; }
.prose strong, .prose b { color: var(--ink); font-weight: 600; }
.prose em { font-style: normal; color: var(--ink); border-bottom: 1px solid var(--cinnabar-soft); }
.prose a { color: var(--cinnabar); border-bottom: 1px solid var(--cinnabar-soft); }
.prose a:hover { border-bottom-color: var(--cinnabar); }
.prose ul, .prose ol { padding-left: 1.35em; }
.prose li { margin-top: 6px; }
.prose li::marker { color: var(--ink-faint); }
.prose h3 { font-size: 17px; color: var(--ink); letter-spacing: .04em; margin-top: var(--s-8); }
.prose code { font-family: var(--f-mono); font-size: .92em; color: var(--ink); background: var(--paper-deep); padding: 1px 6px; border-radius: var(--r-sm); }

/* 免责声明 */
.disclaimer {
  font-size: 13px; color: var(--ink-soft); line-height: 2;
  border-top: 1px solid var(--hairline);
  padding: var(--s-6) 0 0; margin: var(--s-12) 0 0;
}
.disclaimer::before { content: "附记"; display: block; font-family: var(--f-serif); color: var(--ink-faint); letter-spacing: .3em; font-size: 12px; margin-bottom: 6px; }

/* ============ 响应式 ============ */
@media (max-width: 900px) {
  .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .nav-links {
    display: none; position: absolute; top: 64px; left: 0; right: 0;
    background: var(--paper); flex-direction: column; padding: var(--s-4) var(--s-6);
    gap: var(--s-3); border-bottom: 1px solid var(--hairline);
  }
  .nav-links.open { display: flex; }
  .nav-me {
    display: inline-block; margin-left: auto;
    font-size: 12.5px; line-height: 1; white-space: nowrap;
    padding: 6px 10px; color: var(--ink-soft);
    border: 1px solid var(--hairline); border-radius: var(--r-md);
    max-width: 7em; overflow: hidden; text-overflow: ellipsis;
  }
  .nav-toggle { display: block; margin-left: 8px; }
  .nav-links .nav-me-in { display: block; color: var(--cinnabar); }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .section-head h2 { font-size: 22px; }
  .page-hero h1 { font-size: 28px; }
}

/* ============ 质感增强层（纯增量，不改既有规则；一键可回滚）============ */

/* 纸的肌理：极淡墨点平铺，只让纸底不死板；非渐变彩块，色相仍为零。 */
body {
  background-image: radial-gradient(rgba(28,27,24,.018) 1px, transparent 1.2px);
  background-size: 26px 26px;
}

/* 标题点睛：朱砂竖线，书卷气；全站内容页统一生效。 */
.page-hero h1 { position: relative; padding-left: 20px; }
.page-hero h1::before {
  content: ""; position: absolute; left: 0; top: .1em; bottom: .1em;
  width: 5px; background: var(--cinnabar); border-radius: 1px;
}
.section-head h2 { position: relative; padding-left: 14px; }
.section-head h2::before {
  content: ""; position: absolute; left: 0; top: .18em; bottom: .18em;
  width: 3px; background: var(--cinnabar); border-radius: 1px;
}

/* 卡片 hover：极轻提升 + 淡影（墨色 5%，克制，不破坏"以线为界"）*/
.card { transition: border-color .2s, transform .2s, box-shadow .2s; }
.card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(28,27,24,.05); }
.card:hover .mark { transform: translateY(-1px); }

/* 正文链接：hover 下划线加重（无渐变）*/
.prose a:hover { border-bottom-width: 2px; }

/* 键盘焦点：朱砂可见环，兼顾无障碍与精致感 */
a:focus-visible, button:focus-visible, .btn:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--cinnabar); outline-offset: 2px; border-radius: var(--r-sm);
}

/* 纸墨滚动条：细、墨色、直角（≤4px）*/
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--paper); }
::-webkit-scrollbar-thumb { background: var(--hairline); border: 3px solid var(--paper); border-radius: var(--r-lg); }
::-webkit-scrollbar-thumb:hover { background: var(--ink-faint); }

/* 按钮按下态 */
.btn:active { transform: translateY(1px); }

/* 尊重系统"减弱动效"偏好：关闭平滑滚动与 hover 位移 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .card:hover, .card:hover .mark { transform: none; }
}

/* ============================================================
   暗色模式 · 纸墨反转
   深纸底 / 浅墨字 / 朱砂保留。默认跟随系统，用户可在 nav 手动切换，
   存 localStorage('aw_theme')，优先级高于系统。
   ============================================================ */
:root[data-theme="dark"] {
  --paper: #1B1A17;          /* 深纸底 */
  --paper-card: #24221E;     /* 卡面 */
  --paper-warm: #201E1A;
  --paper-deep: #2B2925;     /* 深一度的纸 */
  --ink: #EDE8DE;            /* 浅墨（正文） */
  --ink-soft: #B8B2A6;       /* 淡墨 */
  --ink-mute: #9A9384;       /* 中墨 */
  --ink-faint: #6F695E;      /* 极淡墨（注脚） */
  --hairline: #3A372F;       /* 界线 */
  --cinnabar: #D8645A;       /* 朱砂（提亮以保对比） */
  --cinnabar-deep: #C9544A;
  --cinnabar-soft: #D8645A33;

  --c-primary: #D8645A;
  --c-primary-hover: #C9544A;
  --c-primary-soft: #3A2A27;
  --c-accent: #D8645A;
  --c-orient-bg: #201E1A;
  --c-orient-ink: #EDE8DE;
  --c-orient-cinnabar: #D8645A;
  --c-orient-gold: #9A9384;
  --c-bg: #1B1A17;
  --c-bg-subtle: #2B2925;
  --c-border: #3A372F;
  --c-text: #EDE8DE;
  --c-text-muted: #B8B2A6;
  --c-success: #B8B2A6;
  --c-warning: #9A9384;
  --c-danger: #D8645A;
}
/* 暗色下纸的肌理点更淡 */
:root[data-theme="dark"] body {
  background-image: radial-gradient(rgba(237,232,222,.022) 1px, transparent 1.2px);
}
/* 暗色下滚动条配深底 */
:root[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--paper); }
:root[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--hairline); border-color: var(--paper); }

/* 主题切换按钮（nav 注入，避开左下返回顶部） */
.aw-theme-toggle {
  flex-shrink: 0; margin-left: 12px;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--f-serif, serif); font-size: 13.5px; letter-spacing: .04em;
  color: var(--ink-faint); background: transparent;
  padding: 5px 10px; cursor: pointer; transition: background .15s, color .15s;
}
.aw-theme-toggle:hover { color: var(--cinnabar); background: rgba(158,47,35,.07); }
/* 太极切换标：点击旋转 180° 翻转黑白，优雅切换明/暗 */
.aw-theme-toggle .taiji {
  position: relative; display: inline-block;
  width: 18px; height: 18px; border-radius: 50%;
  background: linear-gradient(to right, #1C1B18 50%, #FAF8F4 50%);
  transition: transform .55s cubic-bezier(.65,.05,.36,1);
}
.aw-theme-toggle .taiji::before {
  content: ''; position: absolute; top: 0; left: 25%;
  width: 50%; height: 50%; border-radius: 50%; background: #1C1B18;
}
.aw-theme-toggle .taiji::after {
  content: ''; position: absolute; bottom: 0; left: 25%;
  width: 50%; height: 50%; border-radius: 50%; background: #FAF8F4;
}
.aw-theme-toggle .taiji .tj-dot { position: absolute; left: 50%; transform: translateX(-50%); width: 3.5px; height: 3.5px; border-radius: 50%; z-index: 1; }
.aw-theme-toggle .taiji .tj-top { top: 2.75px; background: #FAF8F4; }
.aw-theme-toggle .taiji .tj-bot { bottom: 2.75px; background: #1C1B18; }
@media (prefers-reduced-motion: reduce) { .aw-theme-toggle .taiji { transition: none; } }
@media (max-width: 640px) {
  .aw-theme-toggle { margin-left: auto; font-size: 12.5px; padding: 6px 10px; }
}

/* 跳转链接（a11y）：视觉隐藏，键盘聚焦时显现于顶部 */
.skip-link {
  position: absolute; left: 50%; top: -60px; transform: translateX(-50%);
  background: var(--ink); color: var(--paper);
  padding: 8px 16px; border-radius: var(--r-sm); z-index: 1000;
  font-size: 13px; letter-spacing: .05em; transition: top .18s;
}
.skip-link:focus { top: 8px; }

/* 404 页（纸墨） */
.aw-404 { max-width: 640px; margin: 0 auto; padding: 96px 24px 120px; text-align: center; }
.aw-404 .seal {
  width: 64px; height: 64px; margin: 0 auto 28px;
  background: var(--cinnabar); color: var(--paper);
  display: grid; place-items: center; font-family: var(--f-serif, serif); font-size: 30px;
  border-radius: var(--r-md);
}
.aw-404 h1 { font-size: 44px; letter-spacing: .1em; margin-bottom: 12px; }
.aw-404 .sub { color: var(--ink-soft); font-family: var(--f-serif, serif); font-size: 15.5px; line-height: 2; margin-bottom: 36px; }
.aw-404 .links { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.aw-404 .links a {
  font-size: 14px; letter-spacing: .06em; color: var(--ink);
  border: 1px solid var(--hairline); border-radius: var(--r-sm); padding: 10px 20px;
  transition: color .15s, border-color .15s;
}
.aw-404 .links a:hover { color: var(--cinnabar); border-color: var(--cinnabar); }

/* 打印：去掉导航/浮窗/阴影，省墨易读 */
@media print {
  .site-header, .site-footer, #awBackTop, .aw-theme-toggle,
  .aw-pill, .skip-link, .zhumoling-pet { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  a { color: #000 !important; text-decoration: underline; }
  .card { box-shadow: none !important; border-color: #ccc !important; }
}