/* 史与思 · 吴国盛学术工作四十年纪念
   三个板块各用一套图版：年谱是晒图，导论是铜版插图，评传是器物与印刷（共 36 种，见 plates.py、plates_series.py）。
   页面骨架统一，图版决定纸色、墨色与强调色；页眉是面包屑，滚动长卷时跟着当前一屏换色、接上当前一节。 */

@font-face { font-family: "WGS Display"; src: url("fonts/wgs-display.woff2") format("woff2"); font-weight: 900; font-display: swap; }
@font-face { font-family: "IM Fell English"; src: url("fonts/im-fell-english-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IM Fell English"; src: url("fonts/im-fell-english-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }

:root {
  --f-disp: "WGS Display", "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", serif;
  --f-body: "Noto Serif SC", "Source Han Serif SC", "Source Han Serif CN", "Songti SC", "STSong", "SimSun", serif;
  --f-ui: system-ui, -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --f-num: "IM Fell English", "Georgia", "Times New Roman", serif;
  --ink: #1d2126; --ink-2: #4b5058; --ink-3: #737983; --rule: rgba(29, 33, 38, .15);
  --paper: #f1f2ef; --accent: #1d4f9c;
  --pl-bg: #0d2a5e; --pl-ink: #eef0ea; --pl-sub: rgba(238, 240, 234, .74); --pl-mark: #b9c9e6; --pl-acc: #d9d074;
  --bar-h: 54px;
  color-scheme: light;
}
/* 图版配色（与 plates.py 一致） */
[data-plate="qian"]  { --pl-bg: #dcd8cd; --pl-ink: #1b1a17; --pl-sub: #4a4842; --pl-mark: #3d3b36; --pl-acc: #c0392b; --paper: #f2f1ec; --accent: #a3301f; --accent-d: #e2836f; }
[data-plate="lan"]   { --pl-bg: #0d2a5e; --pl-ink: #eef0ea; --pl-sub: #b9c4d8; --pl-mark: #b9c9e6; --pl-acc: #d9d074; --paper: #eef1f4; --accent: #1d4f9c; --accent-d: #8fb0e6; }
[data-plate="ye"]    { --pl-bg: #1e3527; --pl-ink: #e8eee0; --pl-sub: #b6c4ad; --pl-mark: #b5cc9e; --pl-acc: #d8c96e; --paper: #eff2ea; --accent: #2d6a43; --accent-d: #93c7a2; }
[data-plate="tong"]  { --pl-bg: #2f2210; --pl-ink: #f3e6c8; --pl-sub: #cdbb97; --pl-mark: #cfa45b; --pl-acc: #ecc87e; --paper: #f3efe6; --accent: #86561a; --accent-d: #e0b36d; }
[data-plate="gao"]   { --pl-bg: #ece9dc; --pl-ink: #1f1f1d; --pl-sub: #4b4b45; --pl-mark: #3a8a63; --pl-acc: #c0392b; --paper: #f0f1ea; --accent: #2c7552; --accent-d: #86c9a6; }
[data-plate="hai"]   { --pl-bg: #0e3942; --pl-ink: #e2f0ee; --pl-sub: #a9c9c6; --pl-mark: #86c2bd; --pl-acc: #e7c26c; --paper: #ecf3f2; --accent: #11626d; --accent-d: #7fc9cf; }
[data-plate="shi"]   { --pl-bg: #e6e2da; --pl-ink: #23201d; --pl-sub: #4f4a44; --pl-mark: #3a3632; --pl-acc: #9a3a21; --paper: #f1f0ec; --accent: #8a341f; --accent-d: #e09a7f; }
[data-plate="zi"]    { --pl-bg: #391646; --pl-ink: #f2e9f4; --pl-sub: #cdb9d4; --pl-mark: #d6b673; --pl-acc: #ecd59b; --paper: #f1eef4; --accent: #69288a; --accent-d: #c79be0; }
[data-plate="di"]    { --pl-bg: #0b1630; --pl-ink: #f2efe6; --pl-sub: #b8bccb; --pl-mark: #9cc3e4; --pl-acc: #d9b48a; --paper: #f2efe9; --accent: #6b4a2e; --accent-d: #d8b48e; }
[data-plate="guang"] { --pl-bg: #ece8df; --pl-ink: #1c2433; --pl-sub: #4a5263; --pl-mark: #2d3a4f; --pl-acc: #b8862b; --paper: #f2f2ee; --accent: #2e4a78; --accent-d: #9db7e6; }
[data-plate="zhu"]   { --pl-bg: #e9e2d2; --pl-ink: #161514; --pl-sub: #4a4640; --pl-mark: #2b2826; --pl-acc: #b3291b; --paper: #f2efe8; --accent: #a1281b; --accent-d: #e88a7c; }
[data-plate="dang"]  { --pl-bg: #3b2c20; --pl-ink: #efe3cf; --pl-sub: #cdbb9f; --pl-mark: #c8a982; --pl-acc: #e3c38c; --paper: #f2eee7; --accent: #78502e; --accent-d: #dcb68c; }

/* 只用浅色：不随系统切换深色 */
:root { color-scheme: light; }

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 18px; line-height: 1.95; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: .22em; text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent); }
a:hover { text-decoration-color: currentColor; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--ink); color: var(--paper); padding: 6px 12px; font-family: var(--f-ui); font-size: 14px; }
.skip:focus { top: 12px; }
.num { font-family: var(--f-num); font-variant-numeric: oldstyle-nums; }

[id] { scroll-margin-top: calc(var(--bar-h) + 12px); }

/* ---------- 顶栏：面包屑与三个板块，取当前图版的颜色 ---------- */
.bar { position: sticky; top: 0; z-index: 50; height: var(--bar-h); background: var(--pl-bg); color: var(--pl-ink); border-bottom: 1px solid color-mix(in srgb, var(--pl-ink) 14%, transparent); transition: background-color .45s ease, color .45s ease, border-color .45s ease; }
.bar .in { max-width: 1240px; height: 100%; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; gap: 22px; }
.trail { flex: 1 1 auto; min-width: 0; font-family: var(--f-ui); font-size: 14.5px; line-height: 1.4; }
.trail ol { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; min-width: 0; white-space: nowrap; }
.trail li { display: flex; align-items: center; flex: none; min-width: 0; color: var(--pl-sub); }
.trail li + li::before { content: "›"; flex: none; padding: 0 .6em; font-size: 1.15em; line-height: 1; opacity: .7; }
.trail a { color: inherit; text-decoration: none; }
.trail a:hover { color: var(--pl-ink); }
.trail .home a { display: flex; align-items: center; gap: 9px; color: var(--pl-ink); }
.trail .mark { display: block; width: 26px; height: 26px; flex: none; }
.trail .home b { font-family: var(--f-disp); font-weight: 900; font-size: 17px; letter-spacing: .04em; }
.trail .page { color: var(--pl-ink); flex: 0 1 auto; }
.trail li.sec { flex: none; }
.trail .page > span, .trail .now > a { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.trail .no { margin-right: .55em; }
.trail .now { flex: 0 4 auto; }
.trail .now > a { color: var(--pl-ink); opacity: .82; }
.trail .now > a:hover { opacity: 1; }
.secs-nav { margin-left: auto; flex: none; display: flex; gap: 20px; font-family: var(--f-ui); font-size: 15px; }
.secs-nav a { color: var(--pl-sub); text-decoration: none; padding: 4px 0; border-bottom: 1px solid transparent; }
.secs-nav a:hover { color: var(--pl-ink); }
.secs-nav a.on { color: var(--pl-ink); border-bottom-color: var(--pl-acc); }

/* ---------- 图版条：章节页的开头 ---------- */
.plate { position: relative; overflow: hidden; background: var(--pl-bg); color: var(--pl-ink); }
.plate-art { position: absolute; right: 0; top: 0; height: 100%; width: auto; max-width: none; pointer-events: none; user-select: none; }
.plate .in { position: relative; max-width: 1240px; margin: 0 auto; padding: 64px 28px 54px; min-height: min(54vh, 500px); display: flex; flex-direction: column; justify-content: flex-end; }
.plate .kicker { font-family: var(--f-ui); font-size: 14px; color: var(--pl-sub); margin: 0 0 10px; }
.plate .kicker a { color: inherit; text-decoration: none; }
.plate .kicker a:hover { color: var(--pl-ink); }
.plate h1 { font-family: var(--f-disp); font-weight: 900; font-size: clamp(38px, 5.2vw, 70px); line-height: 1.12; letter-spacing: .01em; margin: 0; max-width: 11em; word-break: keep-all; overflow-wrap: anywhere; text-wrap: balance; }
.plate .syn { max-width: 34em; margin: 18px 0 0; font-size: 17px; line-height: 1.85; color: var(--pl-sub); }
.plate .cap { position: absolute; right: 28px; bottom: 14px; font-family: var(--f-ui); font-size: 12px; color: var(--pl-sub); opacity: .85; }
/* 晒图自带标题栏，不再另标图版说明 */
.plate[data-plate^="bp"] .cap, .period[data-plate^="bp"] .cap { display: none; }
.plate .scrim { position: absolute; inset: 0; background: linear-gradient(90deg, var(--pl-bg) 0%, var(--pl-bg) 34%, color-mix(in srgb, var(--pl-bg) 55%, transparent) 60%, transparent 82%); pointer-events: none; }

/* ---------- 阅读区 ---------- */
.reading { max-width: 1240px; margin: 0 auto; padding: 46px 28px 80px; display: grid; grid-template-columns: minmax(0, 40em) 14rem; justify-content: space-between; gap: 64px; }
.reading.noside { grid-template-columns: minmax(0, 46em); justify-content: center; }
article.text { min-width: 0; }
article.text p { margin: 0 0 1.05em; text-align: justify; text-justify: inter-ideograph; }
article.text h2 { font-family: var(--f-disp); font-weight: 900; font-size: 25px; line-height: 1.4; margin: 2.4em 0 .9em; letter-spacing: .01em; }
article.text h2::before { content: ""; display: block; width: 2.2em; height: 3px; background: var(--accent); margin: 0 0 .7em; }
article.text h3 { font-family: var(--f-body); font-weight: 700; font-size: 19px; margin: 1.8em 0 .6em; }
article.text blockquote { margin: 1.4em 0; padding: .1em 0 .1em 1.2em; border-left: 2px solid var(--accent); color: var(--ink-2); font-size: 17px; }
article.text ul, article.text ol { padding-left: 1.4em; }
article.text li { margin: .25em 0; }
article.text hr { border: 0; border-top: 1px solid var(--rule); margin: 2.4em 0; }
article.text strong { font-weight: 700; }
article.text table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.6; margin: 1.4em 0; display: block; overflow-x: auto; }
article.text th, article.text td { border-bottom: 1px solid var(--rule); padding: .45em .6em; text-align: left; vertical-align: top; }
article.text th { font-family: var(--f-ui); font-weight: 600; color: var(--ink-2); border-bottom-color: var(--ink-3); }
a.footnote-ref, sup a { text-decoration: none; }
sup { line-height: 0; font-size: .62em; }
sup a { font-family: var(--f-ui); font-variant-numeric: lining-nums; font-size: .92em; color: var(--accent); padding: 0 .08em; }
.related { margin: 0 0 2.2em; padding: 12px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); font-family: var(--f-ui); font-size: 14px; line-height: 1.7; display: flex; flex-wrap: wrap; gap: 4px 18px; }
.related b { font-weight: 600; color: var(--ink-2); flex-basis: 100%; }
.related a { color: var(--accent); text-decoration: none; }
.related a:hover { text-decoration: underline; }
.footnote { margin-top: 3.4em; padding-top: 1.4em; border-top: 1px solid var(--rule); font-size: 15px; line-height: 1.75; color: var(--ink-2); }
.footnote .notes-h { font-family: var(--f-disp); font-weight: 900; font-size: 19px; color: var(--ink); margin: 0 0 1em; }
.footnote .notes-h::before { display: none; }
.footnote hr { display: none; }
.footnote ol { padding-left: 2.2em; margin: 0; }
.footnote li { margin: 0 0 .45em; overflow-wrap: anywhere; }
.footnote li::marker { font-family: var(--f-ui); font-variant-numeric: lining-nums; color: var(--ink-3); }
.footnote-backref { text-decoration: none; margin-left: .3em; }
.fn-pop { position: absolute; z-index: 80; max-width: min(30rem, calc(100vw - 16px)); background: var(--paper); color: var(--ink-2); border: 1px solid var(--rule); border-top: 3px solid var(--accent); box-shadow: 0 10px 30px rgba(0, 0, 0, .14); padding: 12px 14px; font-size: 14.5px; line-height: 1.7; overflow-wrap: anywhere; }
.fn-pop b { font-family: var(--f-ui); font-variant-numeric: lining-nums; color: var(--accent); }
.fn-pop .footnote-backref { display: none; }

.toc { position: sticky; top: calc(var(--bar-h) + 28px); align-self: start; font-family: var(--f-ui); font-size: 14px; line-height: 1.55; max-height: calc(100vh - var(--bar-h) - 56px); overflow: auto; }
.toc .h { color: var(--ink-3); margin: 0 0 10px; font-size: 13px; }
.toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--rule); }
.toc li a { display: block; padding: 5px 0 5px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--ink-2); text-decoration: none; }
.toc li a:hover { color: var(--accent); }
.toc li a.on { color: var(--ink); border-left-color: var(--accent); }
.toc .dl { display: inline-block; margin-top: 22px; color: var(--accent); }

/* 上一章、下一章：用相邻章节的图版 */
.pager { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 4em 0 0; }
.pager a { position: relative; overflow: hidden; display: block; min-height: 120px; padding: 16px 18px; background: var(--pl-bg); color: var(--pl-ink); text-decoration: none; font-family: var(--f-disp); font-weight: 900; font-size: 19px; line-height: 1.4; }
.pager a img { position: absolute; right: 0; top: 0; height: 100%; width: auto; opacity: .55; pointer-events: none; }
.pager a span { position: relative; display: block; }
.pager a .lab { font-family: var(--f-ui); font-weight: 400; font-size: 13px; color: var(--pl-sub); margin-bottom: 6px; }
.pager a.nx { text-align: right; grid-column: 2; }
.pager a:hover span:last-child { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }

/* ---------- 书目页：每章一张图版 ---------- */
.sheet { max-width: 1240px; margin: 0 auto; padding: 48px 28px 90px; }
.sheet .lead { max-width: 40em; margin: 0 0 40px; color: var(--ink-2); }
.sheet .lead .btns { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 12px; }
.prints { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 36px; }
.print a.pic { position: relative; display: block; aspect-ratio: 5 / 2; overflow: hidden; background: var(--pl-bg); }
.print a.pic img { position: absolute; right: 0; top: 0; height: 100%; width: auto; }
.print a.pic .no { position: absolute; left: 16px; bottom: 12px; font-family: var(--f-ui); font-size: 13px; color: var(--pl-sub); }
.print h2 { font-family: var(--f-disp); font-weight: 900; font-size: 23px; line-height: 1.35; margin: 14px 0 6px; }
.print h2 a { color: var(--ink); text-decoration: none; }
.print h2 a:hover { color: var(--accent); }
.print p { margin: 0; font-size: 15.5px; line-height: 1.8; color: var(--ink-2); }
.print .meta { font-family: var(--f-ui); font-size: 13px; color: var(--ink-3); margin-top: 6px; }
.apx { margin-top: 56px; border-top: 1px solid var(--rule); padding-top: 22px; }
.apx h2 { font-family: var(--f-disp); font-weight: 900; font-size: 21px; margin: 0 0 12px; }
.about { max-width: 40em; }
.about p { margin: 0 0 14px; font-size: 16px; line-height: 1.85; color: var(--ink-2); }
.apx ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 24px; font-size: 16px; }
.sheet .total { font-family: var(--f-ui); font-size: 13px; color: var(--ink-3); margin-top: 34px; }

.btn { display: inline-block; font-family: var(--f-ui); font-size: 15px; line-height: 1; padding: 13px 18px; border: 1px solid currentColor; color: var(--accent); text-decoration: none; background: transparent; border-radius: 2px; }
.btn:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.btn.solid { background: var(--accent); border-color: var(--accent); color: var(--paper); }
.btn.solid:hover { filter: brightness(1.08); background: var(--accent); }

/* ---------- 首页（年谱） ---------- */
.hero { position: relative; overflow: hidden; background: var(--pl-bg); color: var(--pl-ink); min-height: calc(100svh - var(--bar-h)); }
.hero .sky { position: absolute; right: 170px; top: 50%; height: 88%; width: auto; max-width: none; transform: translateY(-50%); opacity: .82; pointer-events: none; }
.hero .scrim { position: absolute; inset: 0; background: linear-gradient(90deg, var(--pl-bg) 0%, var(--pl-bg) 30%, color-mix(in srgb, var(--pl-bg) 50%, transparent) 52%, transparent 70%); pointer-events: none; }
.hero .in { position: relative; max-width: 1240px; margin: 0 auto; padding: 72px 28px 64px; min-height: calc(100svh - var(--bar-h)); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: center; }
.hero .who { font-family: var(--f-ui); font-size: 15px; letter-spacing: .12em; color: var(--pl-sub); margin: 0 0 10px; }
.hero .career { font-family: var(--f-disp); font-weight: 900; font-size: clamp(34px, 4.4vw, 60px); line-height: 1.2; letter-spacing: .02em; margin: 0 0 14px; color: var(--pl-ink); }
.hero .career span { display: block; }
.hero .yrs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin: 0 0 24px; color: var(--pl-ink); }
.hero .yrs .num { font-family: var(--f-num); font-size: clamp(26px, 3vw, 38px); line-height: 1; }
.hero .yrs i { font-style: italic; color: var(--pl-acc); padding: 0 .12em; }
.hero .yrs small { font-family: var(--f-ui); font-size: 14px; color: var(--pl-sub); }
.hero .lede { max-width: 31em; font-size: 18px; line-height: 1.95; margin: 0 0 26px; }
.hero blockquote { margin: 0 0 30px; padding: 0 0 0 20px; border-left: 2px solid var(--pl-acc); max-width: 30em; }
.hero blockquote p { margin: 0; font-size: 21px; line-height: 1.7; font-weight: 600; }
.hero blockquote cite { display: block; margin-top: 8px; font-style: normal; font-family: var(--f-ui); font-size: 13px; line-height: 1.6; color: var(--pl-sub); }
.hero .cta { display: flex; flex-wrap: wrap; gap: 12px; }
.hero .cta .btn { color: var(--pl-ink); }
.hero .cta .btn.solid { background: var(--pl-ink); color: var(--pl-bg); border-color: var(--pl-ink); }
.vtitle { writing-mode: vertical-rl; font-family: var(--f-disp); font-weight: 900; font-size: clamp(56px, min(8vw, 11.5svh), 108px); line-height: 1.08; letter-spacing: .24em; margin: 0; display: flex; flex-direction: column; gap: .18em; align-self: center; }
.vtitle span { display: block; }
.vtitle span:last-child { margin-top: 1.1em; text-shadow: 0 0 18px rgba(6, 22, 58, .5); }
.vtitle i { font-style: normal; display: inline-block; opacity: 0; animation: ink-in .7s ease forwards; }
@keyframes ink-in { from { opacity: 0; filter: blur(6px); } to { opacity: 1; filter: none; } }

.hero .portrait { position: absolute; right: calc(250px + max(0px, (100% - 1240px) / 2)); bottom: 0; height: min(80%, 640px); margin: 0; pointer-events: none; }
.hero.has-portrait .lede { max-width: 25em; }
.hero.has-portrait blockquote { max-width: 22em; }
.hero .portrait img { position: relative; height: 100%; width: auto; display: block; filter: drop-shadow(0 18px 40px rgba(0,0,0,.28)); -webkit-mask-image: linear-gradient(to bottom, #000 80%, transparent 100%); mask-image: linear-gradient(to bottom, #000 80%, transparent 100%); }
.hero .portrait::before { content: ""; position: absolute; left: 50%; top: 38%; width: 118%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(242,210,124,.30) 0%, rgba(242,210,124,.10) 45%, transparent 70%); }
.hero.has-portrait .sky { opacity: .28; }
.hero .bgsky { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% 72%; pointer-events: none; }
.hero.has-bg .scrim { background: linear-gradient(90deg, color-mix(in srgb, var(--pl-bg) 84%, transparent) 0%, color-mix(in srgb, var(--pl-bg) 70%, transparent) 30%, color-mix(in srgb, var(--pl-bg) 30%, transparent) 46%, transparent 60%); }

/* 时段 */
.period { position: relative; overflow: hidden; background: var(--pl-bg); color: var(--pl-ink); }
.period .art { position: absolute; right: 0; top: 50%; height: min(100%, 640px); width: auto; max-width: none; transform: translateY(-50%); opacity: .95; pointer-events: none; }
.period .scrim { position: absolute; inset: 0; background: linear-gradient(90deg, var(--pl-bg) 0%, var(--pl-bg) 40%, color-mix(in srgb, var(--pl-bg) 60%, transparent) 64%, transparent 86%); }
.period .in { position: relative; max-width: 1240px; margin: 0 auto; padding: 96px 28px 88px; min-height: 86vh; display: flex; flex-direction: column; justify-content: center; }
.period .span { font-family: var(--f-num); font-size: clamp(22px, 2.4vw, 32px); line-height: 1; margin: 0 0 12px; color: var(--pl-sub); }
.period .span i { font-style: italic; color: var(--pl-acc); padding: 0 .1em; }
.period h2 { font-family: var(--f-disp); font-weight: 900; font-size: clamp(36px, 4.8vw, 66px); line-height: 1.2; margin: 0 0 24px; max-width: 12em; }
.period .body { max-width: 33em; }
.period .moment { margin: 0 0 22px; }
.period .moment h3 { font-family: var(--f-body); font-weight: 700; font-size: 19px; margin: 0 0 4px; }
.period .moment h3 .num { color: var(--pl-acc); font-weight: 400; margin-right: .5em; }
.period .moment p { margin: 0; font-size: 17px; line-height: 1.9; }
.period .moment q { display: block; quotes: "“" "”"; margin: 10px 0 0; font-weight: 600; }
.period .moment .src { font-family: var(--f-ui); font-size: 12.5px; color: var(--pl-sub); margin-top: 4px; line-height: 1.6; }
.period .events { list-style: none; margin: 4px 0 24px; padding: 14px 0 0; border-top: 1px solid color-mix(in srgb, var(--pl-ink) 22%, transparent); font-family: var(--f-ui); font-size: 14px; line-height: 1.6; color: var(--pl-sub); display: grid; gap: 6px; max-width: 34em; }
.period .events .num { color: var(--pl-ink); font-size: 15px; margin-right: .7em; }
.period .go { display: flex; flex-wrap: wrap; gap: 8px 22px; font-family: var(--f-ui); font-size: 15px; }
.period .go a { color: var(--pl-ink); text-decoration-color: var(--pl-acc); }
.period .cap { position: absolute; right: 28px; bottom: 14px; font-family: var(--f-ui); font-size: 12px; color: var(--pl-sub); }

/* 右侧的年份刻度 */
.dial { position: fixed; right: 16px; top: 50%; transform: translateY(-50%); z-index: 40; display: grid; padding: 8px 7px; border-radius: 20px; background: rgba(14, 16, 20, .46); font-family: var(--f-num); font-size: 14px; transition: opacity .3s; }
.dial.away { opacity: 0; pointer-events: none; }
.dial a { position: relative; display: grid; place-items: center; width: 22px; height: 28px; text-decoration: none; }
.dial a::after { content: ""; width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(242, 240, 234, .78); background: transparent; }
.dial a span { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); white-space: nowrap; padding: 0 7px; border-radius: 2px; background: rgba(14, 16, 20, .78); color: #f2f0ea; line-height: 1.6; opacity: 0; transition: opacity .2s; pointer-events: none; }
.dial:hover a span, .dial a:focus-visible span, .dial a.on span { opacity: 1; }
.dial a.on::after { background: var(--dot, #d9d074); border-color: var(--dot, #d9d074); box-shadow: 0 0 0 3px rgba(242, 240, 234, .18); }

/* 纸面上的段落 */
.sec { padding: 92px 0; }
.sec .in { max-width: 1240px; margin: 0 auto; padding: 0 28px; }
.sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 40px; align-items: end; margin: 0 0 40px; }
.sec-head h2 { font-family: var(--f-disp); font-weight: 900; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.2; margin: 0; }
.sec-head p { margin: 0; color: var(--ink-2); font-size: 16px; max-width: 34em; }
.sec + .sec { border-top: 1px solid var(--rule); }


/* 讲演 */
.media { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 44px; }
.media li { padding: 13px 0; border-top: 1px solid var(--rule); font-size: 16.5px; line-height: 1.6; }
.media .meta { font-family: var(--f-ui); font-size: 13px; color: var(--ink-3); margin-top: 3px; }

/* 年谱 */
.tl-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; font-family: var(--f-ui); }
.tl-filter button { font: inherit; font-size: 14px; padding: 6px 13px; border: 1px solid var(--rule); background: transparent; color: var(--ink-2); cursor: pointer; border-radius: 2px; }
.tl-filter button.on { border-color: var(--ink); color: var(--ink); }
.timeline { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 56px; }
.tl-item { break-inside: avoid; display: grid; grid-template-columns: 4.6em minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid var(--rule); }
.tl-item.hide { display: none; }
.tl-item .y { font-family: var(--f-num); font-size: 19px; line-height: 1.35; display: flex; align-items: baseline; gap: 7px; }
.tl-item .y::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--dot, var(--ink-3)); flex: none; transform: translateY(-2px); }
.tl-item .y small { font-family: var(--f-ui); font-size: 12px; color: var(--ink-3); }
.tl-item .t { font-weight: 700; font-size: 16px; line-height: 1.55; }
.tl-item .tag { font-family: var(--f-ui); font-size: 12px; color: var(--ink-3); margin-left: .6em; font-weight: 400; }
.tl-item .d { font-size: 14.5px; line-height: 1.7; color: var(--ink-2); }
.tl-item .d a { font-family: var(--f-ui); font-size: 13px; margin-left: .4em; white-space: nowrap; }
.tl-more { font-family: var(--f-ui); font-size: 14px; margin-top: 22px; display: flex; gap: 22px; }

/* 两扇门 */
.doors { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.door { position: relative; overflow: hidden; background: var(--pl-bg); color: var(--pl-ink); min-height: 400px; display: flex; flex-direction: column; justify-content: flex-end; padding: 48px 40px; text-decoration: none; }
.door img { position: absolute; right: -4%; bottom: 0; height: 82%; width: auto; max-width: none; opacity: .5; }
.door .scrim { position: absolute; inset: 0; background: linear-gradient(90deg, var(--pl-bg) 0%, var(--pl-bg) 42%, color-mix(in srgb, var(--pl-bg) 40%, transparent) 75%, transparent 100%); }
.door > div { position: relative; max-width: 26em; }
.door h2 { font-family: var(--f-disp); font-weight: 900; font-size: clamp(30px, 3.2vw, 42px); line-height: 1.2; margin: 0 0 12px; }
.door p { margin: 0 0 18px; font-size: 16.5px; line-height: 1.85; color: var(--pl-sub); }
.door .go { font-family: var(--f-ui); font-size: 15px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-acc); align-self: flex-start; }
.door:hover .go { border-bottom-width: 2px; }

/* 页脚：地平线 */
.foot { position: relative; overflow: hidden; background: var(--pl-bg); color: var(--pl-ink); }
.foot img { position: absolute; left: 50%; bottom: 0; width: max(1200px, 100%); transform: translateX(-50%); height: auto; opacity: .95; }
.foot .in { position: relative; max-width: 1240px; margin: 0 auto; padding: 120px 28px 40px; min-height: 300px; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 26px; font-family: var(--f-ui); font-size: 14px; }
.foot .sig { font-family: var(--f-body); font-size: 16px; margin-right: auto; }
.foot a { color: var(--pl-ink); text-decoration-color: color-mix(in srgb, var(--pl-ink) 40%, transparent); }

/* 导论、评传的书目页：与年谱首页一样分屏滚动，每章一屏 */
.ixhero .in { min-height: calc(100svh - var(--bar-h)); padding-top: 72px; padding-bottom: 72px; }
.ixhero .body, .chap .body { max-width: 36em; }
.ixhero .kick { font-family: var(--f-ui); font-size: 15px; color: var(--pl-sub); margin: 0 0 14px; }
.ixhero .kick a { color: inherit; }
.ixhero h1 { font-family: var(--f-disp); font-weight: 900; font-size: clamp(46px, 6.4vw, 88px); line-height: 1.12; letter-spacing: .04em; margin: 0 0 12px; }
.ixhero .sub { font-size: clamp(17px, 1.7vw, 21px); letter-spacing: .22em; color: var(--pl-sub); margin: 0 0 26px; }
.ixhero .lead { font-size: 17px; line-height: 1.95; margin: 0 0 26px; }
.ixhero .cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 34px; }
.ixhero .cta .btn { color: var(--pl-ink); }
.ixhero .cta .btn.solid { background: var(--pl-ink); color: var(--pl-bg); border-color: var(--pl-ink); }
.ixtoc { list-style: none; margin: 0; padding: 16px 0 0; border-top: 1px solid color-mix(in srgb, var(--pl-ink) 22%, transparent); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 28px; font-size: 15px; line-height: 1.55; }
.ixtoc a { color: var(--pl-ink); text-decoration: none; display: flex; gap: .7em; }
.ixtoc a:hover { text-decoration: underline; text-decoration-color: var(--pl-acc); }
.ixtoc .no { flex: none; font-family: var(--f-ui); font-size: 13px; color: var(--pl-sub); padding-top: .15em; min-width: 3.4em; }
.chap .span { font-family: var(--f-ui); font-size: 15px; letter-spacing: .14em; color: var(--pl-sub); margin: 0 0 12px; line-height: 1.4; }
.chap .span small { margin-left: 1.4em; font-size: 13px; letter-spacing: 0; }
.chap h2 { max-width: 20em; }
.chap h2 a { color: inherit; text-decoration: none; }
.chap h2 a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: var(--pl-acc); }
.chap .pre { margin: 0 0 14px; font-size: 17px; line-height: 1.95; }
.chap .pull { margin: 22px 0 24px; padding: 0 0 0 18px; border-left: 2px solid var(--pl-acc); }
.chap .pull p { margin: 0; font-size: 18.5px; line-height: 1.75; font-weight: 600; }
.chap .pull cite { display: block; margin-top: 6px; font-style: normal; font-family: var(--f-ui); font-size: 12.5px; color: var(--pl-sub); }
.chap .secs { list-style: none; margin: 0 0 22px; padding: 14px 0 0; border-top: 1px solid color-mix(in srgb, var(--pl-ink) 22%, transparent); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 24px; font-family: var(--f-ui); font-size: 14px; line-height: 1.55; counter-reset: sec; }
.chap .secs li { counter-increment: sec; display: flex; gap: .6em; }
.chap .secs li::before { content: counter(sec); flex: none; min-width: 1.2em; color: var(--pl-sub); font-family: var(--f-num); font-size: 15px; }
.chap .secs a { color: var(--pl-sub); text-decoration: none; }
.chap .secs a:hover { color: var(--pl-ink); text-decoration: underline; }
.chap .go { margin-top: 6px; }
.chap .go a.read { display: inline-block; padding: 12px 22px; background: var(--pl-ink); color: var(--pl-bg); font-weight: 700; font-size: 16px; text-decoration: none; letter-spacing: .04em; }
.chap .go a.read:hover { filter: brightness(1.1); }
.chap .also { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 20px; margin-top: 16px; font-family: var(--f-ui); font-size: 14px; }
.chap .also span { color: var(--pl-sub); }
.chap .also a { color: var(--pl-ink); text-decoration-color: var(--pl-acc); }
.ixtail { padding-top: 64px; }
.ixtail .btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 40px 0 0; }

/* ---------- 窄屏 ---------- */
@media (max-width: 1100px) {
  .reading { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .toc { display: none; }
  .dial { display: none; }
  .apx ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1081px) and (max-width: 1240px) {
  .hero .portrait { right: calc(12vw + 70px); height: 58%; }
}
@media (min-width: 761px) and (max-width: 1080px) {
  .hero .in { grid-template-columns: 1fr; gap: 26px; }
  .vtitle { writing-mode: horizontal-tb; flex-direction: column; font-size: clamp(48px, 8vw, 72px); gap: 0; order: -1; align-self: start; line-height: 1.15; letter-spacing: .04em; }
  .vtitle span:last-child { margin-top: 0; }
  .hero .scrim { background: color-mix(in srgb, var(--pl-bg) 30%, transparent); }
  .hero .portrait { right: 50%; transform: translateX(50%); height: 420px; }
  .hero.has-portrait .in { padding-bottom: 430px; }
}
@media (max-width: 760px) {
  body { font-size: 17px; line-height: 1.9; }
  .bar .in { padding: 0 16px; gap: 12px; }
  .trail { font-size: 13.5px; }
  .trail li + li::before { padding: 0 .42em; }
  .trail .home b { display: none; }
  .trail .mark { width: 24px; height: 24px; }
  .trail .no + .t { display: none; }
  .trail li.page { flex: none; }
  .trail .no { margin-right: 0; }
  .secs-nav { gap: 12px; font-size: 14px; white-space: nowrap; }
    .plate .in { padding: 40px 16px 34px; min-height: 300px; }
  .plate-art { opacity: .45; }
  .plate .scrim { background: linear-gradient(90deg, var(--pl-bg) 0%, color-mix(in srgb, var(--pl-bg) 70%, transparent) 70%, transparent 100%); }
  .plate .syn { font-size: 15.5px; }
  .plate .cap { right: 16px; bottom: 8px; }
  .reading { padding: 30px 16px 60px; }
  article.text p { text-align: left; }
  article.text h2 { font-size: 22px; }
  .pager { grid-template-columns: 1fr; }
  .pager a.nx { grid-column: 1; }
  .sheet { padding: 32px 16px 64px; }
  .prints { grid-template-columns: 1fr; gap: 34px; }
  .apx ul { grid-template-columns: 1fr; }
  .hero .in { grid-template-columns: 1fr; padding: 44px 16px 48px; gap: 26px; }
  .vtitle { writing-mode: horizontal-tb; flex-direction: column; font-size: clamp(40px, 12vw, 64px); gap: 0; order: -1; align-self: start; line-height: 1.15; letter-spacing: .04em; }
  .vtitle span:last-child { margin-top: 0; }
  .hero .sky { right: -120px; height: 70%; top: 34%; opacity: .32; }
  .hero .scrim { background: color-mix(in srgb, var(--pl-bg) 30%, transparent); }
  .hero .portrait { right: 50%; transform: translateX(50%); height: 330px; }
  .hero.has-bg .scrim { background: color-mix(in srgb, var(--pl-bg) 45%, transparent); }
  .hero .bgsky { object-position: 30% 85%; }
  .hero.has-portrait .in { padding-bottom: 340px; }
  .period .in { padding: 64px 16px 60px; min-height: 0; }
  .period .art { opacity: .35; }
  .period .scrim { background: color-mix(in srgb, var(--pl-bg) 40%, transparent); }
  .ixtoc, .chap .secs { grid-template-columns: 1fr; }
  .ixhero .in { padding-top: 48px; padding-bottom: 52px; }
  .chap .pre { font-size: 16.5px; }
  .sec { padding: 64px 0; }
  .sec .in { padding: 0 16px; }
  .sec-head { grid-template-columns: 1fr; gap: 10px; }
  .media { grid-template-columns: 1fr; }
  .timeline { columns: 1; }
  .doors { grid-template-columns: 1fr; }
  .door { min-height: 320px; padding: 36px 20px; }
  .foot .in { padding: 90px 16px 28px; }
}

/* 图版配色：由 plates.py 生成 */
[data-plate="qian"] { --pl-bg: #dcd8cd; --pl-ink: #1b1a17; --pl-sub: #4a4842; --pl-mark: #3d3b36; --pl-acc: #c0392b; --paper: #f2f1ec; --accent: #a3301f; --accent-d: #e2836f; }
[data-plate="lan"] { --pl-bg: #0d2a5e; --pl-ink: #eef0ea; --pl-sub: #b9c4d8; --pl-mark: #b9c9e6; --pl-acc: #d9d074; --paper: #eef1f4; --accent: #1d4f9c; --accent-d: #8fb0e6; }
[data-plate="ye"] { --pl-bg: #1e3527; --pl-ink: #e8eee0; --pl-sub: #b6c4ad; --pl-mark: #b5cc9e; --pl-acc: #d8c96e; --paper: #eff2ea; --accent: #2d6a43; --accent-d: #93c7a2; }
[data-plate="tong"] { --pl-bg: #2f2210; --pl-ink: #f3e6c8; --pl-sub: #cdbb97; --pl-mark: #cfa45b; --pl-acc: #ecc87e; --paper: #f3efe6; --accent: #86561a; --accent-d: #e0b36d; }
[data-plate="gao"] { --pl-bg: #ece9dc; --pl-ink: #1f1f1d; --pl-sub: #4b4b45; --pl-mark: #3a8a63; --pl-acc: #c0392b; --paper: #f0f1ea; --accent: #2c7552; --accent-d: #86c9a6; }
[data-plate="hai"] { --pl-bg: #0e3942; --pl-ink: #e2f0ee; --pl-sub: #a9c9c6; --pl-mark: #86c2bd; --pl-acc: #e7c26c; --paper: #ecf3f2; --accent: #11626d; --accent-d: #7fc9cf; }
[data-plate="shi"] { --pl-bg: #e6e2da; --pl-ink: #23201d; --pl-sub: #4f4a44; --pl-mark: #3a3632; --pl-acc: #9a3a21; --paper: #f1f0ec; --accent: #8a341f; --accent-d: #e09a7f; }
[data-plate="zi"] { --pl-bg: #391646; --pl-ink: #f2e9f4; --pl-sub: #cdb9d4; --pl-mark: #d6b673; --pl-acc: #ecd59b; --paper: #f1eef4; --accent: #69288a; --accent-d: #c79be0; }
[data-plate="di"] { --pl-bg: #0b1630; --pl-ink: #f2efe6; --pl-sub: #b8bccb; --pl-mark: #9cc3e4; --pl-acc: #d9b48a; --paper: #f2efe9; --accent: #6b4a2e; --accent-d: #d8b48e; }
[data-plate="guang"] { --pl-bg: #ece8df; --pl-ink: #1c2433; --pl-sub: #4a5263; --pl-mark: #2d3a4f; --pl-acc: #b8862b; --paper: #f2f2ee; --accent: #2e4a78; --accent-d: #9db7e6; }
[data-plate="zhu"] { --pl-bg: #e9e2d2; --pl-ink: #161514; --pl-sub: #4a4640; --pl-mark: #2b2826; --pl-acc: #b3291b; --paper: #f2efe8; --accent: #a1281b; --accent-d: #e88a7c; }
[data-plate="dang"] { --pl-bg: #e6dfd0; --pl-ink: #2a231b; --pl-sub: #5a4d3c; --pl-mark: #6b5a45; --pl-acc: #a8432d; --paper: #f2eee7; --accent: #78502e; --accent-d: #dcb68c; }
[data-plate="bp1983"] { --pl-bg: #123a73; --pl-ink: #eef3f8; --pl-sub: #b9cbe6; --pl-mark: #9fbfe6; --pl-acc: #f2d27c; --paper: #eef2f6; --accent: #1f4f96; --accent-d: #9fbfe6; }
[data-plate="bp1990"] { --pl-bg: #3a2516; --pl-ink: #f3e7d3; --pl-sub: #d6bf9c; --pl-mark: #cfb08a; --pl-acc: #e9c27a; --paper: #f3efe7; --accent: #7a4a26; --accent-d: #e0b07a; }
[data-plate="bp1996"] { --pl-bg: #eee9df; --pl-ink: #3b3a8c; --pl-sub: #5a5980; --pl-mark: #7d7cc0; --pl-acc: #c0392b; --paper: #f2f1ec; --accent: #3f3d96; --accent-d: #a9a8e6; }
[data-plate="bp1999"] { --pl-bg: #e7e5df; --pl-ink: #1d1d1f; --pl-sub: #55544f; --pl-mark: #6b6a66; --pl-acc: #b8432f; --paper: #f1f0ec; --accent: #a63d2b; --accent-d: #e2836f; }
[data-plate="bp2007"] { --pl-bg: #0f4652; --pl-ink: #e8f4f3; --pl-sub: #a9cfcd; --pl-mark: #8cc5c4; --pl-acc: #f0c36c; --paper: #ecf3f2; --accent: #13626e; --accent-d: #7fc9cf; }
[data-plate="bp2013"] { --pl-bg: #efe6d6; --pl-ink: #5a3b22; --pl-sub: #6e5640; --pl-mark: #a07b55; --pl-acc: #2f6b8f; --paper: #f3efe7; --accent: #7a4a26; --accent-d: #d8a878; }
[data-plate="bp2016"] { --pl-bg: #1c2a5e; --pl-ink: #edf0fb; --pl-sub: #b9c2e6; --pl-mark: #a6b3e3; --pl-acc: #ef8f74; --paper: #eff0f6; --accent: #2c3f8f; --accent-d: #a6b3e3; }
[data-plate="bp2024"] { --pl-bg: #0c1d36; --pl-ink: #eef2f7; --pl-sub: #b4c0d4; --pl-mark: #9fb5d3; --pl-acc: #e8c77a; --paper: #eff1f4; --accent: #24477a; --accent-d: #9fb5d3; }
[data-plate="bpshu"] { --pl-bg: #17457f; --pl-ink: #eef4fa; --pl-sub: #bcd0ea; --pl-mark: #a8c6ea; --pl-acc: #f2d27c; --paper: #eef2f6; --accent: #1f4f96; --accent-d: #a8c6ea; }
[data-plate="bpcoda"] { --pl-bg: #0d2f4f; --pl-ink: #eef3f8; --pl-sub: #b2c8dc; --pl-mark: #9cc0dd; --pl-acc: #f4d47a; --paper: #eef2f5; --accent: #1d4d78; --accent-d: #9cc0dd; }
[data-plate="anxiang"] { --pl-bg: #e9e4d8; --pl-ink: #1f1b16; --pl-sub: #4f4840; --pl-mark: #5b5246; --pl-acc: #b5432e; --paper: #f3f1ec; --accent: #9c3a26; --accent-d: #e08a73; }
[data-plate="qiuzhu"] { --pl-bg: #e3e6e1; --pl-ink: #1c2421; --pl-sub: #46524d; --pl-mark: #4d5a54; --pl-acc: #2f6f5e; --paper: #f0f2ef; --accent: #2a6656; --accent-d: #86c4ae; }
[data-plate="meng"] { --pl-bg: #ebe6d6; --pl-ink: #2a2418; --pl-sub: #574e3c; --pl-mark: #6a5f45; --pl-acc: #5f8a3a; --paper: #f3f1ea; --accent: #4f7a2e; --accent-d: #a7cf86; }
[data-plate="gui"] { --pl-bg: #e8e2d3; --pl-ink: #1e1c18; --pl-sub: #514b40; --pl-mark: #5c5649; --pl-acc: #b07a1c; --paper: #f3f0e9; --accent: #8f6214; --accent-d: #e0b45e; }
[data-plate="tiao"] { --pl-bg: #e2e2df; --pl-ink: #18191b; --pl-sub: #45484c; --pl-mark: #4a4d52; --pl-acc: #a8452c; --paper: #f1f1ef; --accent: #96402a; --accent-d: #e08a73; }
[data-plate="yi"] { --pl-bg: #e7e3da; --pl-ink: #1d1c1a; --pl-sub: #4d4941; --pl-mark: #575248; --pl-acc: #b07a1c; --paper: #f3f1ec; --accent: #2f4f8a; --accent-d: #9db7e6; }
[data-plate="qiuyi"] { --pl-bg: #e5e1d6; --pl-ink: #1d1b17; --pl-sub: #4e4a40; --pl-mark: #5a5446; --pl-acc: #2e6f86; --paper: #f2f0ea; --accent: #2a6478; --accent-d: #86c2d6; }
[data-plate="cidian"] { --pl-bg: #e8e3d6; --pl-ink: #1f1c18; --pl-sub: #524b40; --pl-mark: #5f574a; --pl-acc: #9a3a26; --paper: #f3f1ec; --accent: #8a3424; --accent-d: #e08a73; }
[data-plate="ka"] { --pl-bg: #e4ddcd; --pl-ink: #22201c; --pl-sub: #57503f; --pl-mark: #6a6252; --pl-acc: #a33a2a; --paper: #f2efe8; --accent: #8f3424; --accent-d: #e08a73; }
[data-plate="hun"] { --pl-bg: #10203a; --pl-ink: #f0e6cc; --pl-sub: #c9bb98; --pl-mark: #c9a861; --pl-acc: #e2c27a; --paper: #f1efe8; --accent: #7a5a1e; --accent-d: #e2c27a; }
[data-plate="shu"] { --pl-bg: #ebe5d3; --pl-ink: #2b2a20; --pl-sub: #545246; --pl-mark: #5f6b3c; --pl-acc: #b8432f; --paper: #f3f1e9; --accent: #5b6a2c; --accent-d: #b9cf86; }
[data-plate="huo"] { --pl-bg: #1d1612; --pl-ink: #f3e8d6; --pl-sub: #cdb89a; --pl-mark: #b89a74; --pl-acc: #f0b04a; --paper: #f3efe8; --accent: #8a5a1c; --accent-d: #f0b04a; }
[data-plate="pai"] { --pl-bg: #d9d4c6; --pl-ink: #1c1b19; --pl-sub: #4a4842; --pl-mark: #4d4a44; --pl-acc: #c0392b; --paper: #f2f1ec; --accent: #a3301f; --accent-d: #e2836f; }
[data-plate="xing"] { --pl-bg: #0b1630; --pl-ink: #f2efe6; --pl-sub: #b8bccb; --pl-mark: #9cc3e4; --pl-acc: #d9b48a; --paper: #f2efe9; --accent: #6b4a2e; --accent-d: #d8b48e; }