
:root{--paper:#f8f6f0;--ink:#292c29;--muted:#72756d;--line:#dbddd4;--red:#964a36;--blue:#435d6e}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:5px}a:hover{color:var(--red)}a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:5px}.skip{position:absolute;left:-9999px}.skip:focus{left:20px;top:10px;background:white;padding:15px;z-index:9}
.top{max-width:1160px;margin:auto;padding:26px 30px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:12px}.top a{text-decoration:none}.top span{color:var(--muted)}
.hero{max-width:1050px;margin:0 auto;padding:73px 34px 46px;position:relative}.eyebrow{font-size:12px;color:var(--red);letter-spacing:.12em;margin:0 0 23px}h1{font-family:"Songti SC",STSong,serif;font-size:clamp(36px,4.5vw,56px);font-weight:600;line-height:1.35;letter-spacing:-.025em;margin:0;max-width:850px;text-wrap:balance}.dek{max-width:700px;font-size:18px;line-height:1.85;color:#62675e;margin:24px 0}.meta{display:flex;flex-wrap:wrap;gap:9px 22px;font-size:12px;color:var(--muted);margin-top:29px}.meta time{color:#454f43}
.reading{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:174px minmax(0,780px);gap:55px;padding:0 30px 65px;justify-content:center}.rail{position:relative;padding-top:12px}.toc{position:sticky;top:35px;font-size:12px;line-height:1.7}.toc .label{color:var(--muted);font-size:10px;letter-spacing:.1em;margin-bottom:21px}.toc a{display:flex;gap:13px;margin:0 0 16px;text-decoration:none;color:#6b7065}.toc b{font:15px Georgia,serif;color:var(--red);font-weight:400}.toc a:hover{color:var(--red)}
.prose{min-width:0;font-size:18px;line-height:1.98;overflow-wrap:anywhere}.prose p{margin:0 0 21px}.opening{padding-bottom:13px;border-bottom:1px solid var(--line)}.opening p:first-child{font-size:21px;line-height:1.85;color:#333c30}.lesson{position:relative;padding-top:40px;margin-top:15px;scroll-margin-top:30px}.lesson-head{display:flex;gap:19px;align-items:baseline;margin-bottom:22px}.number{font-family:Georgia,serif;font-size:40px;color:var(--red);font-weight:400;line-height:1}.lesson h2{font-size:25px;line-height:1.5;margin:0;font-weight:620;letter-spacing:-.01em}.concept{font-weight:560;color:#343d31}.takeaway{font-family:"Kaiti SC",STKaiti,"Songti SC",serif;color:var(--red);font-size:19px;line-height:1.7;padding:7px 0 20px;margin-top:19px!important;border-bottom:1px solid var(--line)}
.photo{margin:30px -45px 27px}.photo button{border:0;padding:0;display:block;width:100%;background:transparent;cursor:zoom-in}.photo img{display:block;width:100%;height:auto}.photo figcaption{display:flex;gap:25px;justify-content:space-between;color:var(--muted);font-size:12px;line-height:1.7;padding-top:13px}.photo figcaption span:first-child{max-width:680px}.zoom-hint{white-space:nowrap;color:var(--red);font-size:11px}.photo.paint{margin-left:-70px;margin-right:-70px}.photo.character{background:#eeedeb;padding:15px 15px 0}.photo.character figcaption{padding-bottom:12px}.photo.scene{border:1px solid var(--line);padding:12px;background:#f1f1ed}.photo.scene figcaption{padding:10px 4px 2px}
.tempo{margin:30px 0 23px;color:var(--blue);border-top:1px solid #bcc6c9;border-bottom:1px solid #bcc6c9;padding:19px 0 8px}.tempo .label{font-size:11px;letter-spacing:.07em;margin-bottom:15px}.tempo p{display:grid;grid-template-columns:85px 1fr;gap:20px;margin-bottom:13px;font-size:16px;line-height:1.8}.tempo strong{font-weight:600}.closing{margin-top:46px;scroll-margin-top:30px}.closing h2{font-family:"Songti SC",serif;font-size:29px;line-height:1.5;font-weight:600}.checks{padding:0;margin:22px 0 29px;list-style:none;counter-reset:check}.checks li{counter-increment:check;padding:10px 0 10px 33px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.8;position:relative}.checks li:before{content:counter(check,decimal-leading-zero);position:absolute;left:0;top:11px;font-family:Georgia,serif;color:var(--red);font-size:13px}
.sources{font-size:12px;color:var(--muted);line-height:1.85;margin-top:46px;padding-top:24px;border-top:1px solid var(--line)}.sources h2{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 17px}.sources ol{padding-left:19px;margin:0}.sources li{margin-bottom:15px}.sources small{display:block;font-size:11px;color:#7f817a;margin-top:2px}
.bottom{max-width:1160px;padding:27px 30px 45px;margin:auto;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:25px;font-size:12px;color:var(--muted)}.bottom a{color:var(--red);text-decoration:none}
dialog{width:calc(100% - 48px);max-width:1680px;max-height:94vh;border:0;padding:14px;background:#f8f6f0;color:var(--ink)}dialog::backdrop{background:#101510d9}dialog img{display:block;max-width:100%;max-height:calc(90vh - 85px);width:auto;height:auto;margin:auto;object-fit:contain}.dialog-bar{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px;padding:0 0 12px}.dialog-bar p{margin:0}.close{border:1px solid #c5c8be;background:transparent;padding:8px 15px;cursor:pointer;color:var(--ink);font:inherit;white-space:nowrap}
@media(max-width:1080px){.reading{grid-template-columns:145px minmax(0,700px);gap:25px}.photo,.photo.paint{margin-left:0;margin-right:0}.hero{max-width:950px}.toc{font-size:11px}}
@media(max-width:760px){.top{padding:21px 22px;font-size:11px}.hero{padding:42px 22px 30px}h1{font-size:35px;line-height:1.43}.dek{font-size:17px;margin:19px 0}.meta{font-size:11px;gap:9px 16px;margin-top:22px}.reading{display:block;padding:0 22px 45px}.rail{padding:0 0 30px}.toc{position:static;display:grid;grid-template-columns:1fr 1fr;column-gap:15px;font-size:12px}.toc .label{grid-column:1/-1;margin-bottom:14px}.toc a{gap:10px;margin-bottom:12px}.prose{font-size:17px;line-height:1.95}.opening p:first-child{font-size:19px}.lesson{padding-top:31px;margin-top:12px}.lesson-head{gap:14px;align-items:flex-start;margin-bottom:19px}.number{font-size:33px;line-height:1.3}.lesson h2{font-size:22px;line-height:1.55}.takeaway{font-size:18px}.photo,.photo.paint{margin:24px 0}.photo figcaption{font-size:11px;gap:14px}.zoom-hint{font-size:10px}.photo.character,.photo.scene{padding:8px 8px 0}.photo.scene figcaption{padding-bottom:8px}.tempo p{grid-template-columns:63px 1fr;gap:10px;font-size:15px}.closing{margin-top:33px}.closing h2{font-size:26px}.sources{margin-top:33px}.bottom{padding:25px 22px 35px;font-size:11px;line-height:1.9}dialog{width:calc(100% - 20px);padding:10px}.dialog-bar{font-size:11px}.dialog-bar p{max-width:220px}.close{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{.top,.rail,.bottom,.zoom-hint,dialog{display:none}.hero{padding-top:0}.reading{display:block}.prose{font-size:12pt}.lesson h2{font-size:18pt}.photo{break-inside:avoid;max-width:680px;margin-left:auto!important;margin-right:auto!important}.photo button{cursor:default}.lesson{padding-top:20px}.sources{font-size:9pt}body{background:#fff}}

:root[data-theme="dark"] .dek{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] .meta time{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] .toc a{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] .opening p:first-child{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] .concept{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] .photo.character{background:var(--site-surface,#252525)}
:root[data-theme="dark"] .photo.scene{background:var(--site-surface,#252525)}
:root[data-theme="dark"] .sources small{color:var(--site-ink,#ededed)}
:root[data-theme="dark"] dialog{background:var(--site-surface,#252525)}
:root[data-theme="dark"] body{background:var(--site-surface,#252525)}
