/* ========================================================================== AI Agent book — EPUB stylesheet 与 PDF (ElegantBook cyan theme) 视觉风格保持一致:青色主色、灰底代码块、 提示框式引用、章首页等。参考 learnbyexample 的 EPUB 最佳实践。 ========================================================================== */ :root { color-scheme: light dark; --accent: #008b8b; /* 青色,与 ElegantBook cyan 主题一致 */ --accent-light: #e0f2f2; /* 提示框淡背景 */ --code-bg: #f5f5f5; /* 代码块背景 */ --code-text: #1f2328; /* 代码块前景 */ --border: #d0d7de; /* 普通边框 */ --muted: #57606a; /* 次要文字 */ } /* 暗色模式覆盖(部分阅读器支持 prefers-color-scheme) */ @media (prefers-color-scheme: dark) { :root { --accent-light: #1a2e2e; --code-bg: #161b22; --code-text: #e6edf3; --border: #30363d; --muted: #8b949e; } } /* 注意:老 Kindle (KF8) 和 EPUB2 阅读器不支持 CSS 自定义属性, 整条 var() 声明会被丢弃。因此每个 var() 声明前都写了一条 字面量颜色的兜底声明——不支持的阅读器用字面量,支持的用 var()。 */ /* ── 正文基础 ──────────────────────────────────────────────────────────── */ body { font-family: system-ui, -apple-system, "PingFang SC", "PingFang TC", "Noto Sans CJK SC", "Noto Sans CJK TC", "Source Han Sans", sans-serif; line-height: 1.75; /* 中文书适合稍宽的行距 */ orphans: 2; widows: 2; /* 中文不 justify(避免字间距参差),由阅读器自然左对齐 */ } html[lang="ko"] body, html[xml\:lang="ko"] body { font-family: system-ui, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", "Noto Sans KR", "Noto Sans CJK SC", sans-serif; } /* ── RTL editions ─────────────────────────────────────────────────────── */ html[dir="rtl"] body { text-align: right; } html[lang="ar"] body, html[xml\:lang="ar"] body { text-align: right; font-family: "Noto Naskh Arabic", Amiri, "Noto Sans Arabic", system-ui, sans-serif; } html[lang="he"] body, html[xml\:lang="he"] body { font-family: "Noto Sans Hebrew", "Arial Hebrew", "David Libre", system-ui, sans-serif; } html[dir="rtl"] h3, html[lang="ar"] h3, html[xml\:lang="ar"] h3 { padding-left: 0; padding-right: 0.5em; } html[dir="rtl"] blockquote, html[lang="ar"] blockquote, html[xml\:lang="ar"] blockquote { border-left: 0; border-right: 0.3em solid #008b8b; border-right: 0.3em solid var(--accent); } html[dir="rtl"] pre, html[dir="rtl"] code, html[dir="rtl"] kbd, html[dir="rtl"] samp, html[dir="rtl"] .sourceCode, html[dir="rtl"] .math, html[lang="ar"] pre, html[lang="ar"] code, html[lang="ar"] kbd, html[lang="ar"] samp, html[lang="ar"] .sourceCode, html[lang="ar"] .math { text-align: left; } p { margin: 0 0 0.8em 0; background-color: transparent !important; } /* ── 标题 ──────────────────────────────────────────────────────────────── */ h1, h2, h3, h4, h5, h6 { line-height: 1.3; break-after: avoid; font-weight: 600; } /* H1 = 章标题:每章新起一页 + 居中 + 主色 */ h1 { break-before: recto; /* 章首页:奇数页起(实体书风格) */ font-size: 1.85em; margin: 2.5em 0 1.2em 0; padding-bottom: 0.4em; border-bottom: 2px solid #008b8b; border-bottom: 2px solid var(--accent); color: #008b8b; color: var(--accent); text-align: center; /* 章标题居中(实体书风格) */ letter-spacing: 0.02em; } /* 第一个 h1 不强制分页(避免书开头空白页) */ h1:first-of-type { break-before: auto; } /* H2 = 节标题(如 1.1):稍大、加底部装饰线 */ h2 { font-size: 1.4em; margin: 2em 0 0.8em 0; padding-bottom: 0.25em; border-bottom: 1px solid #d0d7de; border-bottom: 1px solid var(--border); } /* H3 = 子节(如 1.1.1):主色、左缩进 */ h3 { font-size: 1.18em; margin: 1.6em 0 0.6em 0; color: #008b8b; color: var(--accent); padding-left: 0.5em; } h4 { font-size: 1.05em; margin: 1.3em 0 0.5em 0; color: #57606a; color: var(--muted); } /* ── 章节编号弱化(section-header-number)───────────────────────────── */ /* 编号字号变小、颜色变浅,让标题文字更突出。不删除(保留定位意义) */ .section-header-number { font-size: 0.7em; font-weight: 400; color: #57606a; color: var(--muted); vertical-align: 0.15em; margin-right: 0.4em; letter-spacing: 0.05em; } /* H1 章标题里的编号稍大但仍弱化(如 "第 1 章") */ h1 .section-header-number { font-size: 0.5em; display: block; margin-bottom: 0.4em; letter-spacing: 0.2em; } /* 目录里的编号也弱化 */ nav#toc .section-header-number { font-size: 0.85em; color: #57606a; color: var(--muted); font-weight: 400; margin-right: 0.3em; } /* ── 链接 ──────────────────────────────────────────────────────────────── */ a { color: #008b8b; color: var(--accent); text-decoration: none; } /* ── 图片 / 图 ─────────────────────────────────────────────────────────── */ img, svg { display: block; height: auto; margin: 1.2em auto; max-width: 100%; } figure { margin: 1.5em 0; break-inside: avoid; } figcaption { color: #57606a; color: var(--muted); font-size: 0.88em; text-align: center; margin-top: 0.5em; } /* ── 代码块(重点优化:高亮、换行、iBooks 兼容)───────────────────── */ code { font-family: ui-monospace, "SFMono-Regular", "Menlo", "Consolas", "Source Code Pro", monospace; font-size: 0.9em; } /* 行内代码 */ p code, li code { background: #f5f5f5; background: var(--code-bg); color: #1f2328; color: var(--code-text); padding: 0.1em 0.35em; border-radius: 0.25em; word-break: break-word; } /* 代码块 */ pre { background: #f5f5f5; background: var(--code-bg); color: #1f2328; color: var(--code-text); padding: 0.9em 1em; margin: 1em 0; border-radius: 0.4em; border: 1px solid #d0d7de; border: 1px solid var(--border); font-size: 0.85em; line-height: 1.5; /* 关键:自动换行,避免窄屏横向滚动(比 overflow-x 友好) */ white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; } pre code { background: transparent; padding: 0; border-radius: 0; font-size: 1em; /* 与 pre 的换行策略保持一致 */ white-space: pre-wrap; } /* pandoc 把代码块包在 .sourceCode / pre.sourceCode 里 */ pre.sourceCode, div.sourceCode { background: #f5f5f5; background: var(--code-bg); border-radius: 0.4em; } /* Apple Books 已知 bug 修复:sourceCode 溢出 / 截断 (pandoc issue #6242) */ @media screen { .sourceCode { overflow: visible !important; white-space: pre-wrap !important; } } /* ── 表格 ──────────────────────────────────────────────────────────────── */ table { border-collapse: collapse; display: block; /* 小屏可横滚 */ font-size: 0.88em; margin: 1em 0; max-width: 100%; overflow-x: auto; } th, td { border: 1px solid #d0d7de; border: 1px solid var(--border); padding: 0.4em 0.7em; vertical-align: top; } th { background: #e0f2f2; background: var(--accent-light); font-weight: 600; text-align: left; } tbody tr:nth-child(even) { background: rgba(0, 0, 0, 0.02); } /* ── 引用 / 提示框(本书的 experiment_box.lua 产出大量引用)────────── */ blockquote { /* 变成「提示框」而非细左线 */ margin: 1.2em 0; padding: 0.8em 1.2em; border-left: 0.3em solid #008b8b; border-left: 0.3em solid var(--accent); background: #e0f2f2; background: var(--accent-light); border-radius: 0 0.4em 0.4em 0; /* 不要斜体(中文斜体很难看)*/ } blockquote p { margin: 0.4em 0; } blockquote p:first-child { margin-top: 0; } blockquote p:last-child { margin-bottom: 0; } /* 嵌套引用:内部再分层的提示 */ blockquote blockquote { margin: 0.6em 0; border-left-width: 0.2em; } /* ── 列表 ──────────────────────────────────────────────────────────────── */ ul, ol { margin: 0.5em 0 0.8em 0; padding-left: 1.5em; } li { margin: 0.25em 0; } /* ── 水平线(章节分隔)────────────────────────────────────────────── */ hr { border: none; border-top: 1px solid #d0d7de; border-top: 1px solid var(--border); margin: 2em 0; } /* ── 目录(pandoc 自动生成)────────────────────────────────────────── */ nav#toc ol, nav#toc ul, nav#TOC ol, nav#TOC ul { list-style: none; padding-left: 1em; margin: 0.3em 0; } nav#toc > ol.toc, nav#toc > ul, nav#TOC > ol, nav#TOC > ul { padding-left: 0; } nav#toc > ol.toc > li.chapter-group, nav#TOC > ol > li.chapter-group { list-style: none; margin: 2.5em 0; } nav#toc > ol.toc > li.chapter-group > a, nav#TOC > ol > li.chapter-group > a { display: block; font-size: 1.2em; font-weight: bold; margin-bottom: 1em; text-align: center; color: #008b8b; color: var(--accent); text-decoration: none; } /* 目录里的 H2 级项(如 1.1):缩进 + 加粗,作为子项的父级 */ nav#toc details > ol.toc > li, nav#toc li.chapter-group > ol.toc > li, nav#toc li.chapter-group > ol.toc.subsections > li { font-weight: 600; margin: 0.7em 0 0.25em 0; padding: 0.2em 0 0.2em 1.2em; /* 左缩进,让 1.1 比 1 视觉低一层 */ border-bottom: 1px dotted #d0d7de; border-bottom: 1px dotted var(--border); color: #008b8b; color: var(--accent); } /* H3 级目录项(如 1.1.1):更深缩进、常规字重、淡化 */ nav#toc details > ol.toc > li > ol.toc > li, nav#toc li.chapter-group > ol.toc > li > ol.toc > li, nav#toc li.chapter-group > ol.toc.subsections > li > ol.toc > li { font-weight: normal; margin: 0.25em 0; padding-left: 2.5em; /* 比 1.1 更深的缩进 */ font-size: 0.95em; color: #57606a; color: var(--muted); border-bottom: none; } /* 更深层(H4,如 1.1.1.1):进一步缩进 */ nav#toc details > ol.toc > li > ol.toc > li > ol.toc > li, nav#toc li.chapter-group > ol.toc > li > ol.toc > li > ol.toc > li, nav#toc li.chapter-group > ol.toc.subsections > li > ol.toc > li > ol.toc > li { font-size: 0.9em; padding-left: 3.5em; } nav#toc a, nav#TOC a { text-decoration: none; color: inherit; } /* ── 标题页 ────────────────────────────────────────────────────────────── */ /* pandoc 生成的 title page 用 h1.title / p.subtitle / p.author */ .title, h1.title { text-align: center; font-size: 2em; margin: 3em 0 0.5em 0; border-bottom: none; color: #008b8b; color: var(--accent); break-before: auto; } .subtitle { text-align: center; font-size: 1.1em; color: #57606a; color: var(--muted); margin-bottom: 2em; } .author { text-align: center; font-size: 1em; color: #57606a; color: var(--muted); margin: 1em 0; } /* ── 数学公式(pandoc --mathml 输出)────────────────────────────── */ math { font-size: 1.05em; } /* ── 小屏优化(手机阅读器)────────────────────────────────────────── */ @media (max-width: 30em) { body { font-size: 0.95em; } pre { font-size: 0.78em; padding: 0.7em; } h1 { font-size: 1.5em; } h2 { font-size: 1.2em; } table { font-size: 0.82em; } }