:root {
  --book-ink: #202a2a;
  --book-muted: #71807d;
  --book-paper: #f4f1e9;
  --book-page: #fffdf8;
  --book-line: #dedbd1;
  --book-green: #236b5c;
  --book-green-soft: #ece9e1;
  --book-rust: #b75d38;
  --book-shadow: 0 18px 50px rgba(38, 50, 46, .08);
}
body.dark-theme {
  --book-ink: #f2eee6;
  --book-muted: #bdbab2;
  --book-paper: #202124;
  --book-page: #292a2e;
  --book-line: #4a4b50;
  --book-green: #9bc4b2;
  --book-green-soft: #34363a;
  --book-rust: #e6a17f;
  --text-color: #f2eee6;
  --muted-color: #bdbab2;
  --card-bg: #292a2e;
  --prompt-bg: #303136;
  --border-color: #4a4b50;
  --bg-color: #202124;
  --card-hover: #36373b;
  --accent-color: #9bc4b2;
  --tag-color: #e6a17f;
  --prompt-border: #9bc4b2;
  --book-shadow: 0 18px 50px rgba(0, 0, 0, .2);
}

html { scroll-behavior: smooth; overflow-x: hidden; }
article h2, article h3 { scroll-margin-top: 92px; }
body {
  background: var(--book-paper) !important;
  color: var(--book-ink) !important;
  font-family: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif !important;
  line-height: 1.95 !important;
  overflow-x: hidden;
  overflow-wrap: anywhere;
}
body.dark-theme .book-topbar,
body.dark-theme .site-header,
body.dark-theme .topbar,
body.dark-theme .course-head,
body.dark-theme .hero,
body.dark-theme .book-hero { background: var(--book-page) !important; }
body.dark-theme .book-card,
body.dark-theme .book-article,
body.dark-theme article { background: transparent !important; }
body.dark-theme .book-article code,
body.dark-theme article code { background: transparent !important; color: #f2c4a5 !important; }
body.dark-theme .book-article a,
body.dark-theme article a,
body.dark-theme .home-doc-links a { color: var(--book-green) !important; }
body.dark-theme .book-article th,
body.dark-theme article th { background: var(--book-green-soft) !important; color: var(--book-ink) !important; }
body.dark-theme .book-article td,
body.dark-theme article td { color: var(--book-ink) !important; }
body.dark-theme .prompt-description { color: var(--book-muted) !important; }
body.dark-theme .prompt-tag { color: var(--book-rust) !important; }

.book-topbar,
.site-header,
.topbar {
  background: rgba(255, 253, 248, .94) !important;
  border-bottom: 1px solid var(--book-line) !important;
  backdrop-filter: blur(12px);
}
.book-topbar-inner,
.site-header-inner,
.topbar-inner {
  width: min(1180px, calc(100% - 48px)) !important;
  min-height: 72px !important;
  margin: 0 auto !important;
}
.book-brand,
.site-brand,
.brand { color: var(--book-ink) !important; font-weight: 700 !important; letter-spacing: .04em !important; }
.book-nav,
nav { gap: 20px !important; }
.book-nav a,
.site-back,
.top-link,
nav a { color: var(--book-muted) !important; text-decoration: none !important; }
.book-nav a:hover,
.site-back:hover,
.top-link:hover,
nav a:hover { color: var(--book-green) !important; }
.theme-toggle { border:1px solid var(--book-line); background:transparent; color:var(--book-muted); padding:7px 12px; border-radius:4px; font:inherit; font-size:13px; cursor:pointer; }
.theme-toggle:hover { color:var(--book-green); border-color:var(--book-green); }
.theme-toggle { min-width:78px; margin-left:6px; padding:7px 14px; border-radius:999px; white-space:nowrap; text-align:center; }
.plain-header .theme-toggle { margin-left:4px; }

.book-hero,
.course-head,
.hero {
  background: var(--book-paper) !important;
  border-bottom: 1px solid var(--book-line) !important;
}
.book-hero-inner,
.course-head > main,
.hero-grid { width: min(1080px, calc(100% - 48px)) !important; margin: 0 auto !important; }
.home-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:72px; align-items:end; }
.home-hero-note { padding:22px 0 0 22px; border-left:3px solid var(--book-green); color:var(--book-muted); }
.home-hero-note span { display:block; margin-bottom:10px; color:var(--book-rust); font-size:13px; letter-spacing:.1em; }
.home-hero-note strong { display:block; color:var(--book-ink); font-family:"Noto Serif SC","Songti SC",serif; font-size:20px; line-height:1.6; }
.home-hero-note p { margin:6px 0 0; font-size:14px; }
.book-kicker,
.eyebrow { color: var(--book-rust) !important; letter-spacing: .16em !important; }
.book-title,
.course-head h1,
.hero h1 { color: var(--book-ink) !important; font-family: "Noto Serif SC", "Songti SC", serif !important; font-weight: 700 !important; letter-spacing: .02em !important; line-height: 1.35 !important; }
.book-lead,
.course-head .lead,
.hero-copy { color: var(--book-muted) !important; line-height: 2 !important; }

.book-layout,
.layout {
  width: min(1080px, calc(100% - 48px)) !important;
  margin: 0 auto !important;
  grid-template-columns: 190px minmax(0, 760px) !important;
  gap: 64px !important;
  padding: 52px 0 88px !important;
}
.book-toc,
aside { position: sticky !important; top: 90px !important; align-self: start !important; }
.book-toc h2,
aside h2 { color: var(--book-ink) !important; font-size: 14px !important; letter-spacing: .08em !important; }
.book-toc a,
aside a { display: block !important; padding: 4px 0 !important; color: var(--book-muted) !important; font-size: 13px !important; line-height: 1.7 !important; text-decoration: none !important; }
.book-toc a:hover,
aside a:hover { color: var(--book-green) !important; }

.book-article,
article {
  min-width: 0 !important;
  background: transparent !important;
  padding: 0 0 76px !important;
  box-shadow: none !important;
  border: 0 !important;
}
.book-article h2,
article h2 { margin: 52px 0 18px !important; padding-top: 24px !important; border-top: 1px solid var(--book-line) !important; color: var(--book-ink) !important; font-family: "Noto Serif SC", "Songti SC", serif !important; font-size: 27px !important; line-height: 1.55 !important; }
.book-article h3,
article h3 { margin: 34px 0 12px !important; color: var(--book-green) !important; font-size: 21px !important; line-height: 1.6 !important; }
.book-article h4,
article h4 { color: var(--book-ink) !important; font-size: 17px !important; }
.book-article p,
article p { margin: 1em 0 !important; }
.book-article blockquote,
article blockquote { background: var(--book-green-soft) !important; border-left: 3px solid var(--book-green) !important; color: #4f625d !important; }
.book-article pre,
article pre { background: #2b2d31 !important; border-left: 4px solid var(--book-rust) !important; border-radius: 3px !important; font-family: "Noto Sans Mono", "SFMono-Regular", monospace !important; line-height: 1.8 !important; }
article pre { overflow: hidden !important; white-space: pre-wrap !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
.book-article code,
article code { background: #f0eee6 !important; color: #76503b; }
.book-article pre code,
article pre code { background: transparent !important; color: #f0f5f1 !important; }
.book-article table,
article table { border-color: var(--book-line) !important; }
.book-article th,
.book-article td,
article th,
article td { border-color: var(--book-line) !important; }
article table { table-layout: fixed !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
article th, article td { overflow-wrap: anywhere !important; word-break: break-word !important; }
.book-article th,
article th { background: var(--book-green-soft) !important; }

.book-shelf { width: min(1080px, calc(100% - 48px)); margin: 0 auto; padding: 70px 0 100px; }
.book-shelf-intro { margin-bottom: 28px; }
.book-shelf-intro span { display:block; margin-bottom:6px; color:var(--book-rust); font-size:13px; letter-spacing:.12em; }
.book-shelf-intro strong { display:block; color:var(--book-ink); font-family:"Noto Serif SC","Songti SC",serif; font-size:26px; font-weight:700; }
.book-shelf-intro p { max-width:650px; margin:6px 0 0; color:var(--book-muted); }
.book-shelf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.book-card { display: flex; flex-direction: column; min-height: 310px; padding: 30px; background: var(--book-page); border: 1px solid var(--book-line); box-shadow: var(--book-shadow); text-decoration: none; color: var(--book-ink); }
.book-card:hover { border-color: var(--book-green); transform: translateY(-2px); transition: .2s ease; }
.book-card .number { color: var(--book-rust); font-size: 13px; letter-spacing: .12em; }
.book-card h2 { margin: 26px 0 10px; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 28px; line-height: 1.45; }
.book-card p { margin: 0; color: var(--book-muted); line-height: 1.9; }
.book-card .read { margin-top: auto; padding-top: 26px; color: var(--book-green); font-size: 14px; }
.book-shelf-note { margin-top: 42px; padding-top: 22px; border-top: 1px solid var(--book-line); color: var(--book-muted); }
.book-shelf-note h2 { margin: 0 0 8px; color: var(--book-ink); font-size: 20px; }
.book-shelf-note p { margin: 0; }
.home-image-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:52px; padding-top:28px; border-top:1px solid var(--book-line); }
.home-image-strip figure { margin:0; }
.home-image-strip img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; filter:saturate(.82); }
.home-image-strip figcaption { padding-top:8px; color:var(--book-muted); font-size:13px; }

/* Plain Chinese course index: directory first, decoration second. */
.plain-header { background:var(--book-page) !important; border-bottom:1px solid var(--book-line) !important; }
.plain-header-inner { width:min(1120px,calc(100% - 48px)); min-height:64px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.plain-brand { color:var(--book-ink); font-weight:700; text-decoration:none; letter-spacing:.03em; }
.plain-header nav { display:flex; align-items:center; gap:20px; }
.plain-header nav a { color:var(--book-muted); font-size:14px; text-decoration:none; }
.plain-header nav a:hover { color:var(--book-green); }
.home-doc { width:min(920px,calc(100% - 48px)); margin:0 auto; padding:78px 0 96px; }
.home-doc-head { max-width:720px; padding-bottom:34px; border-bottom:1px solid var(--book-line); }
.home-doc-label { margin:0 0 16px; color:var(--book-rust); font-size:13px; letter-spacing:.12em; }
.home-doc-head h1 { margin:0; color:var(--book-ink); font-family:"Noto Serif SC","Songti SC",serif; font-size:clamp(38px,5vw,58px); font-weight:700; line-height:1.35; letter-spacing:0; }
.home-doc-head p:last-child { max-width:620px; margin:16px 0 0; color:var(--book-muted); font-size:18px; line-height:2; }
.home-doc-index { display:grid; grid-template-columns:repeat(3,1fr); max-width:720px; padding:25px 0 30px; border-bottom:1px solid var(--book-line); }
.home-doc-index div { padding-right:24px; border-right:1px solid var(--book-line); }
.home-doc-index div + div { padding-left:24px; }
.home-doc-index div:last-child { border-right:0; }
.home-doc-index span { display:block; color:var(--book-muted); font-size:13px; }
.home-doc-index strong { display:block; margin-top:4px; color:var(--book-ink); font-family:"Noto Serif SC","Songti SC",serif; font-size:18px; font-weight:700; }
.home-doc-courses, .home-doc-links { max-width:820px; margin-top:48px; }
.home-doc-courses h2, .home-doc-links h2 { margin:0 0 14px; color:var(--book-ink); font-family:"Noto Serif SC","Songti SC",serif; font-size:23px; font-weight:700; }
.course-row { display:grid; grid-template-columns:56px minmax(0,1fr) 100px; gap:20px; align-items:center; padding:22px 0; border-top:1px solid var(--book-line); color:var(--book-ink); text-decoration:none; }
.course-row:last-child { border-bottom:1px solid var(--book-line); }
.course-row:hover .course-info strong, .course-row:hover .course-arrow { color:var(--book-green); }
.course-no { color:var(--book-rust); font-family:ui-monospace,monospace; font-size:14px; }
.course-info strong { display:block; font-family:"Noto Serif SC","Songti SC",serif; font-size:20px; line-height:1.5; }
.course-info small { display:block; margin-top:4px; color:var(--book-muted); font-size:14px; line-height:1.7; }
.course-arrow { color:var(--book-muted); font-size:13px; text-align:right; white-space:nowrap; }
.home-doc-links a { display:block; padding:10px 0; border-top:1px solid var(--book-line); color:var(--book-green); font-size:14px; text-decoration:none; }
.home-doc-links a:last-child { border-bottom:1px solid var(--book-line); }
body.dark-theme .plain-header { background:var(--book-page) !important; }

@media (max-width: 800px) {
  .plain-header-inner, .home-doc { width:min(100% - 28px,920px); }
  .plain-header-inner { min-height:60px; align-items:flex-start; padding:14px 0; }
  .plain-header nav { gap:8px 12px; flex-wrap:wrap; justify-content:flex-end; }
  .home-doc { padding:48px 0 70px; }
  .home-doc-index { grid-template-columns:1fr; gap:14px; }
  .home-doc-index div, .home-doc-index div + div { padding:0 0 12px; border-right:0; border-bottom:1px solid var(--book-line); }
  .home-doc-index div:last-child { padding-bottom:0; border-bottom:0; }
  .course-row { grid-template-columns:38px minmax(0,1fr); gap:12px; }
  .course-arrow { grid-column:2; text-align:left; }
}

/* The image gallery is a working reference library inside the same book. */
.container { max-width:1080px !important; margin:0 auto !important; padding:54px 24px 80px !important; }
.container h1 { max-width:780px !important; margin:0 0 12px !important; padding:0 !important; border:0 !important; text-align:left !important; color:var(--book-ink) !important; font-family:"Noto Serif SC","Songti SC",serif !important; font-size:clamp(34px,5vw,58px) !important; line-height:1.35 !important; }
.container .intro { max-width:760px !important; margin:0 0 36px !important; color:var(--book-muted) !important; font-size:18px !important; }
.container .category { margin:0 0 48px !important; padding:0 0 34px !important; background:transparent !important; border-bottom:1px solid var(--book-line) !important; box-shadow:none !important; }
.container .category-title { margin:0 0 22px !important; padding:0 0 10px !important; color:var(--book-ink) !important; border-bottom:2px solid var(--book-green) !important; font-family:"Noto Serif SC","Songti SC",serif !important; font-size:24px !important; line-height:1.5 !important; }
.container .prompt-grid { grid-template-columns:repeat(auto-fit,minmax(270px,1fr)) !important; gap:16px !important; }
.container .prompt-card { background:var(--book-page) !important; border:1px solid var(--book-line) !important; border-left:4px solid var(--book-green) !important; border-radius:4px !important; box-shadow:none !important; }
.container .prompt-card:hover { border-color:var(--book-green) !important; }
.container .prompt-tag { color:var(--book-rust) !important; font-weight:700 !important; }
.container .prompt-description { color:var(--book-muted) !important; }
.container .prompt-image { border-radius:3px !important; }

footer { background: transparent !important; border-top: 1px solid var(--book-line) !important; color: var(--book-muted) !important; }

@media (max-width: 800px) {
  .book-topbar-inner, .site-header-inner, .topbar-inner, .book-hero-inner, .course-head > main, .hero-grid, .book-layout, .layout, .book-shelf { width: min(100% - 28px, 1080px) !important; }
  .book-layout, .layout { display: block !important; }
  .book-toc, aside { display: none !important; }
  .book-article, article { padding: 0 0 52px !important; box-shadow: none !important; }
  .book-shelf-grid { grid-template-columns: 1fr; }
  .book-card { min-height: 260px; padding: 24px; }
  .home-hero-grid { grid-template-columns:1fr; gap:28px; }
  .home-hero-note { padding:16px 0 0; border-top:3px solid var(--book-green); border-left:0; }
  .home-image-strip { grid-template-columns:1fr; gap:22px; }
  .theme-toggle { padding:6px 9px; }
}