@charset "UTF-8";
@import url('../assets/fonts/display.css');
:root{--paper:#ece4d3;--ink:#31292a;--coal:#292526;--wine:#6b3741;--line:#c9bcad;--muted:#756864;--gold:#d8bb8e;--serif:HistorySerif,'Songti SC',serif;font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;background:var(--paper);color:var(--ink);font-synthesis:none;scrollbar-color:#a68e80 var(--paper)}*{box-sizing:border-box}body{margin:0}h1,h2,h3,p{margin:0}button{font:inherit;color:inherit;border:0;background:transparent;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.5;cursor:default}button,a,summary{-webkit-tap-highlight-color:#a5775044}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #aa6f3b;outline-offset:4px}h1,h2,h3{font-family:var(--serif);font-weight:600;text-wrap:balance}p{font-size:17px;line-height:1.9}a{color:inherit;text-underline-offset:5px}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}::selection{background:#caae80;color:#211c1d}.skip{position:fixed;top:0;left:0;padding:12px;background:var(--gold);z-index:80;transform:translateY(-120%)}.skip:focus{transform:none}.site-header{height:70px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 22px;border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:25}.wordmark{font-family:var(--serif);font-size:25px;letter-spacing:.09em;min-height:44px;padding:0}.era{margin-left:auto;display:flex;flex-direction:column;text-align:right;gap:4px}.era strong{font-size:11px;font-weight:500}.era span{font-size:10px;color:var(--muted)}.position-link{display:none}.timeline-page{max-width:760px;margin:auto;padding:0 22px}.timeline-intro{padding:32px 0 25px}.timeline-intro h1{font-size:36px;line-height:1.35;letter-spacing:.01em;margin-bottom:15px}.timeline-intro p{font-size:14px;line-height:1.8;color:var(--muted)}.timeline-position{display:flex;align-items:center;justify-content:space-between;padding:15px 0 17px;gap:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:sticky;top:70px;z-index:20;background:var(--paper)}.timeline-position strong{font-size:13px;font-weight:600;display:block;line-height:1.7}.timeline-position small{font-size:10px;display:block;line-height:1.7;color:var(--muted);margin-top:3px}.progress-note{text-align:right;font-size:12px;white-space:nowrap}.history-line{list-style:none;padding:0;margin:0}.time-node{position:relative;display:grid;grid-template-columns:76px 1fr;gap:24px;padding:29px 0 31px}.time-node:before{content:'';position:absolute;left:87px;top:0;bottom:0;width:1px;background:var(--line)}.time-node:after{content:'';position:absolute;left:83px;top:37px;width:9px;height:9px;border:1px solid #aa9889;background:var(--paper);border-radius:50%}.time-node.selected:after{background:var(--wine);border-color:var(--wine);box-shadow:0 0 0 4px var(--paper)}.node-date{padding-top:1px}.node-date time{font-family:var(--serif);font-size:18px;line-height:1.75;font-weight:600;font-variant-numeric:tabular-nums;display:block}.node-date>span{display:block;font-size:10px;line-height:1.6;color:var(--wine);margin-top:10px}.node-content{min-width:0}.phase-title{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;min-height:44px;padding:0;gap:10px}.phase-title h2{font-size:24px;line-height:1.4}.phase-title svg{width:16px;height:16px;transform:rotate(90deg);color:#806d61}.selected .phase-title svg{transform:rotate(-90deg)}.node-event{font-size:11px;line-height:1.7;color:var(--muted);margin:4px 0 14px}.node-image{display:block;position:relative;width:100%;padding:0;text-align:left;margin-top:16px}.node-image img{width:100%;height:126px;object-fit:cover;display:block;object-position:60% 50%}.node-image span{display:block;font-size:9px;line-height:1.7;color:var(--muted);margin-top:7px}.begin{display:flex;align-items:center;justify-content:space-between;gap:15px;background:var(--wine);color:#f6eddb;width:100%;min-height:50px;padding:12px 16px;text-align:left;font-size:15px;font-weight:500;margin-top:18px}.begin svg{width:19px;height:19px}.phase-people{margin-top:23px}.phase-people h3{font-size:13px;font-family:inherit;font-weight:500;margin-bottom:8px;color:var(--muted)}.phase-people>div{display:flex;flex-wrap:wrap;gap:2px 9px}.phase-people button{display:flex;align-items:center;gap:3px;min-height:44px;padding:5px 0;font-size:13px;text-decoration:underline;text-decoration-color:#baa897;text-underline-offset:5px}.phase-people svg{width:12px;height:12px}.node-people-preview{font-size:11px;line-height:1.8;color:var(--muted);margin-top:12px}.phase-context{font-size:14px;line-height:1.85;margin:8px 0 16px}.time-node:not(.selected) .node-content{border-bottom:1px solid var(--line);padding-bottom:20px}.line-ending{padding:16px 0 30px;margin-left:100px;border-top:1px solid var(--line)}.line-ending p{font-family:var(--serif);font-size:19px;line-height:1.7}.line-ending small{font-size:10px;line-height:1.8;color:var(--muted);display:block;margin-top:8px}.line-ending button{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:17px;font-size:12px;text-decoration:underline}.line-ending svg{width:15px}footer{padding:20px 22px calc(22px + env(safe-area-inset-bottom));border-top:1px solid var(--line);font-size:10px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;gap:15px;max-width:1100px;margin:auto}footer button{min-height:44px;font-size:10px;text-decoration:underline}.return-link{min-height:44px;display:flex;align-items:center;gap:7px;padding:0;font-size:13px;white-space:nowrap}.return-link svg{width:19px;height:19px}.event-page .site-header .era{text-align:center}.bookmark{width:44px;height:44px;display:grid;place-items:center;padding:0}.bookmark[aria-pressed=true] svg{fill:var(--gold)}.material-hero{background:var(--coal);color:var(--paper)}.material-view{position:relative}.material-view>img{width:100%;height:360px;object-fit:cover;object-position:62% center;display:block}.material-watch{position:absolute;top:19px;left:22px;display:flex;gap:9px;align-items:center;min-height:44px;padding:10px 14px;background:#292526e8;color:#f4ebdb;font-size:12px}.material-watch svg{width:18px;height:18px;fill:currentColor;stroke-width:0}.material-provenance{position:absolute;bottom:0;left:0;right:0;padding:40px 22px 19px;font-size:10px;line-height:1.8;color:#fff4dd;background:linear-gradient(transparent,#211a16e6)}.material-intro{padding:30px 26px 28px}.material-intro h1{font-size:36px;line-height:1.4;margin-bottom:20px}.material-intro>p{font-size:14px;line-height:1.9;color:#d7c6b3}.read-on{display:flex;align-items:center;gap:24px;font-size:13px;min-height:44px;margin-top:15px;color:#f3d4a6;padding:8px 0}.event-reading{max-width:650px;margin:auto;padding:35px 26px 10px;scroll-margin-top:90px}.reading-section{margin-bottom:44px}.reading-section h2,.people-section h2{font-size:29px;line-height:1.5;margin-bottom:23px}.reading-section>p{margin-bottom:19px}.glossary{display:flex;gap:21px;flex-wrap:wrap;margin:12px 0 16px}.glossary button{min-height:44px;font-size:12px;padding:8px 0;border-bottom:1px dashed #b39881}.location-detail{margin-top:22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.location-detail>summary{font-size:13px;min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:15px;cursor:pointer;padding:15px 0;list-style:none}.location-detail>summary:after{content:'+';font-size:22px;font-weight:300}.location-detail[open]>summary:after{content:'−'}.location-map{padding:22px 18px;background:var(--coal);color:var(--paper);margin-bottom:18px}.map-stage{margin:0}.map-stage svg{width:100%;height:auto;display:block}.map-north{fill:#ddc6aa;font-size:13px}.map-region{fill:#8d7d72;font-size:13px}.map-mountain{fill:none;stroke:#927d70;stroke-width:1;stroke-dasharray:3 5}.map-annotation{fill:#c6ac91;font-size:10px}.map-route{fill:none;stroke:#d8bb8e;stroke-width:1.5;stroke-dasharray:3 4}.map-selected circle{fill:#e5c896}.map-selected text{fill:#efddbc;font-family:var(--serif);font-size:17px;paint-order:stroke;stroke:var(--coal);stroke-width:3px}.map-stage figcaption{font-size:10px;line-height:1.8;color:#dbc5af;border-top:1px solid #645149;padding-top:16px}.map-actors{margin:14px 0}.map-actors button{min-height:50px;display:grid;grid-template-columns:46px 1fr;gap:12px;text-align:left;width:100%;border-bottom:1px solid #6b554a;padding:11px 0}.map-actors strong{font-family:var(--serif);font-size:16px}.map-actors span{font-size:11px;line-height:1.8;color:#e7ceb5}.map-consequence{font-size:13px;line-height:1.9}.place-choices{display:flex;gap:8px;flex-wrap:wrap;margin-top:17px}.place-choices button{min-height:44px;border:1px solid #927965;padding:9px 11px;font-size:11px}.story-piece{margin-bottom:24px}.story-piece small,.factor>small{display:block;font-size:10px;color:var(--muted);margin-bottom:7px}.story-piece p{font-size:17px;line-height:1.9}.source-link{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;width:100%;font-size:12px;border-bottom:1px solid var(--line);padding:8px 0;margin-top:24px}.source-link svg{width:17px;height:17px}.people-section{margin-bottom:42px}.event-people button{display:grid;grid-template-columns:1fr 22px;text-align:left;width:100%;padding:19px 0;border-top:1px solid var(--line);gap:9px;min-height:85px}.event-people strong{font-family:var(--serif);font-size:22px;line-height:1.5}.event-people span{font-size:13px;line-height:1.85;color:var(--muted);grid-column:1}.event-people svg{grid-column:2;grid-row:1/3;align-self:center;width:17px;height:17px}.factor{padding:19px 0 24px;border-bottom:1px solid var(--line)}.factor h3{font-size:22px;line-height:1.5;margin-bottom:10px}.factor p{font-size:16px;line-height:1.9}.evidence-boundary{margin-top:28px}.evidence-boundary h3{font-size:22px;line-height:1.6;margin-bottom:12px}.evidence-boundary p{font-size:14px;line-height:1.9;color:var(--muted)}.event-ending{padding:24px 0 32px;border-top:1px solid var(--line)}.event-ending h2{font-size:29px;line-height:1.5;margin-bottom:18px}.event-ending>p{font-size:14px;line-height:1.9;color:var(--muted)}.event-ending .begin{min-height:56px;margin-top:25px}.next-era{display:grid;grid-template-columns:1fr 24px;width:100%;text-align:left;gap:9px;border-top:1px solid var(--line);margin-top:28px;padding:24px 0;min-height:85px}.next-era>span{font-size:11px;color:var(--muted)}.next-era strong{font-family:var(--serif);font-size:17px;line-height:1.6;grid-column:1}.next-era svg{grid-column:2;grid-row:1/3;align-self:center}.recall-status{font-size:11px!important}.storage-note{font-size:12px;line-height:1.8;background:#e8c79d;padding:14px 17px}.storage-note button{min-height:44px;text-decoration:underline}dialog{padding:24px;border:0;background:var(--paper);color:var(--ink);width:calc(100% - 24px);max-width:620px;max-height:85svh;overflow:auto;overscroll-behavior:contain;box-shadow:0 12px 45px #241c1c60}dialog::backdrop{background:#211a1dcc}.close{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:44px;margin-left:auto;font-size:13px}.close svg{width:18px;height:18px}dialog h2{font-size:29px;line-height:1.5;margin:17px 0 22px}dialog h3{font-size:22px;line-height:1.5;margin:24px 0 14px}dialog p{font-size:15px;line-height:1.9;margin-bottom:17px}dialog video{width:100%;display:block;margin-bottom:18px}dialog a{overflow-wrap:anywhere;font-size:13px;line-height:1.8}.detail-tabs{display:flex;gap:10px;margin:17px 0 25px}.detail-tabs button{padding:10px 14px;min-height:44px;border:1px solid var(--line);font-size:13px}.detail-tabs button[aria-selected=true]{background:var(--wine);color:var(--paper);border-color:var(--wine)}.date-line,.fine{font-size:11px!important;line-height:1.8;color:var(--muted)}.biography{list-style:none;padding:0 0 0 18px;border-left:1px solid var(--line)}.biography time{font-size:12px;color:var(--muted)}.biography p{font-size:14px;margin:8px 0 19px}.detail-source{padding:18px 0;border-top:1px solid var(--line)}.detail-source p{font-size:13px;margin:11px 0}.detail-source h3{margin:0 0 10px}.quiet{min-height:44px;padding:8px 0;text-align:left;text-decoration:underline;font-size:13px}.question-position{font-size:11px!important;color:var(--muted)}.quiz-options{display:grid;gap:12px}.quiz-options button{min-height:65px;border:1px solid var(--line);padding:14px 14px;text-align:left;display:grid;grid-template-columns:18px 1fr;gap:13px;font-size:15px;line-height:1.8}.quiz-options button[aria-pressed=true]{border:2px solid var(--wine);padding:13px;background:#f5eddc}.quiz-options button>span{font-family:Georgia,serif;font-size:20px}.feedback{border-top:1px solid var(--line);margin-top:24px}.feedback button{min-height:44px;font-size:13px;text-decoration:underline}.quiz-options button:disabled{opacity:.7}
@media(max-width:350px){.site-header{padding:0 17px;gap:8px}.timeline-page{padding:0 17px}.timeline-intro h1{font-size:33px}.timeline-intro p{font-size:13px}.time-node{grid-template-columns:68px 1fr;gap:20px}.time-node:before{left:77px}.time-node:after{left:73px}.node-date time{font-size:16px}.phase-title h2{font-size:22px}.node-image img{height:112px}.begin{font-size:14px;padding:12px 13px}.phase-people button{font-size:12px}.line-ending{margin-left:88px}.material-view>img{height:330px}.material-intro{padding:27px 20px}.material-intro h1{font-size:33px}.event-reading{padding-left:20px;padding-right:20px}.reading-section h2,.people-section h2,.event-ending h2{font-size:27px}.era strong{font-size:10px}.era span{font-size:10px}.timeline-position strong{font-size:12px}.progress-note{font-size:11px}.timeline-position small{font-size:9px}}
@media(min-width:760px){.site-header{padding:0 max(28px,calc((100vw - 1100px)/2));height:76px}.position-link{display:block;min-height:44px;font-size:12px;margin-left:25px}.era{text-align:center;margin-left:0}.timeline-page{max-width:940px;padding:0 35px}.timeline-intro{padding:48px 0 35px}.timeline-intro h1{font-size:48px;line-height:1.35}.timeline-intro p{font-size:16px}.timeline-position{top:76px}.time-node{grid-template-columns:140px 1fr;gap:48px;padding:39px 0}.time-node:before{left:163px}.time-node:after{left:159px;top:50px}.node-date time{font-size:25px;line-height:1.6}.node-date>span{font-size:12px}.node-content{max-width:570px}.phase-title h2{font-size:32px}.node-event{font-size:13px}.node-image{max-width:410px}.node-image img{height:205px}.node-image span{font-size:11px}.begin{max-width:410px;min-height:56px}.phase-people h3{font-size:14px}.phase-people button{font-size:15px}.node-people-preview{font-size:13px}.phase-context{font-size:16px}.line-ending{margin-left:188px}.material-hero{display:grid;grid-template-columns:1.6fr 1fr;max-width:1400px;margin:auto;min-height:570px}.material-view>img{height:100%;min-height:570px}.material-provenance{padding-left:35px;font-size:12px}.material-watch{left:35px;top:30px;font-size:14px;min-height:48px}.material-intro{align-self:center;padding:42px}.material-intro h1{font-size:44px}.material-intro p{font-size:16px}.read-on{margin-top:26px;font-size:14px}.event-reading{padding-top:55px}.reading-section h2,.people-section h2,.event-ending h2{font-size:33px}.event-reading p{font-size:18px}.factor p{font-size:17px}.event-people strong{font-size:24px}.event-people span{font-size:15px}.event-ending .begin{max-width:none}footer{padding-left:35px;padding-right:35px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.timeline-intro h1{font-size:34px}.timeline-intro{padding-top:28px;padding-bottom:25px}.date-range time{font-size:16px;line-height:1.8}.node-date time{overflow-wrap:normal;word-break:keep-all}.timeline-position{min-height:70px}.site-header:has(.return-link) .era{text-align:center;margin-left:0}
@media(max-width:350px){.timeline-intro h1{font-size:31px}.date-range time{font-size:14px}.node-image img{height:105px}}
@media(min-width:760px){.timeline-intro h1{font-size:46px}.date-range time{font-size:23px}}

/* Extend the accepted timeline world to the complete learning loop. */
[hidden]{display:none!important}.review-link{min-width:44px;min-height:44px;padding:0;font-size:12px}.node-learning{font-size:10px;line-height:1.8;color:var(--muted);margin-top:9px}.material-map{display:flex;align-items:center;justify-content:center;min-height:360px;padding:28px 24px;color:var(--paper)}.material-map>div{width:100%;max-width:620px}.material-map .map-stage figcaption{font-size:11px;margin-top:16px}.material-map .stage-empty p{font-size:14px;line-height:1.8}.stage-reset{min-height:44px;text-decoration:underline;text-underline-offset:5px;font-size:13px;padding:8px 0}.event-filter{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px;font-size:13px;margin-top:26px}.event-filter select{min-width:0;width:100%;min-height:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:0;padding:8px 11px;font:inherit;font-size:16px}.event-filter select:focus-visible{outline:3px solid #aa6f3b;outline-offset:4px}.filter-hint{margin-top:12px}.relations-heading{font-size:24px;line-height:1.5;margin:37px 0 16px}.relation-row{display:grid;grid-template-columns:minmax(44px,1fr) minmax(110px,1.3fr) minmax(44px,1fr);gap:8px;align-items:center;padding:17px 0;border-top:1px solid var(--line)}.relation-row>button{min-height:44px;padding:5px 0;font-family:var(--serif);font-size:18px;line-height:1.6}.relation-row .relation-link{font-family:inherit;font-size:12px;border-top:1px solid #aa9281;border-bottom:1px solid #aa9281;padding:8px 3px}.relation-link span{display:block}.relation-link small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.event-relations+.fine{margin-top:16px}.takeaway{margin-top:29px}.takeaway h3{font-size:22px;line-height:1.5;margin-bottom:13px}.takeaway p{font-size:15px;line-height:1.9}.takeaway small{display:block;font-size:10px;color:var(--muted);margin-top:12px}.mark-read{margin-top:13px}.review-tabs{display:flex;gap:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0}.review-tabs button{flex:1;min-height:44px;padding:8px;font-size:13px}.review-tabs button[aria-pressed=true]{background:var(--wine);color:var(--paper)}.review-list{list-style:none;margin:0;padding:0}.review-list li{padding:30px 0;border-bottom:1px solid var(--line)}.review-list time{display:block;font-size:12px;color:var(--muted);line-height:1.8}.review-list h2{font-size:25px;line-height:1.5;margin:12px 0}.review-list p{font-size:12px;color:var(--muted);line-height:1.8}.review-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:19px}.review-actions button{min-height:50px;font-size:13px;border:1px solid var(--line);padding:12px;display:flex;align-items:center;justify-content:center;gap:10px}.review-actions button:last-child{background:var(--wine);color:var(--paper);border-color:var(--wine)}.review-actions svg{width:16px;height:16px}.review-empty{padding:32px 0}.review-empty p{font-size:15px}.review-empty button{margin-top:19px;display:flex;align-items:center;gap:13px}.review-boundary{margin:30px 0 40px;line-height:1.9!important}.chosen-order{font-size:12px;line-height:1.8;padding-left:20px;margin:20px 0;color:var(--muted)}dialog .begin{max-width:none}.event-people>p{font-size:14px}.site-header:has(.return-link) .era{min-width:0}.era span{line-height:1.5}.event-page .stage-empty h3{font-size:22px;line-height:1.5;margin-bottom:14px}.event-page .stage-empty p{font-size:14px;line-height:1.8}
@media(max-width:350px){.review-link{font-size:11px}.site-header:has(.review-link){gap:8px}.material-map{min-height:330px;padding:24px 20px}.material-map .map-stage figcaption{font-size:10px}.relation-row{gap:5px;grid-template-columns:minmax(44px,1fr) minmax(108px,1.3fr) minmax(44px,1fr)}.relation-row>button{font-size:16px}.relation-row .relation-link{font-size:11px}.review-list h2{font-size:23px}}
@media(min-width:760px){.review-link{margin-left:25px}.material-map{min-height:570px;padding:45px}.material-map .map-stage figcaption{font-size:12px}.review-page{max-width:760px}.review-list h2{font-size:30px}.relation-row .relation-link{font-size:14px}.relation-row>button{font-size:22px}}

.material-view>img.hongmen-material{object-position:center 16%}
.map-north,.map-region,.map-annotation{stroke:none}
.period-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;padding:24px 0;min-height:84px;border-bottom:1px solid var(--line);text-align:left}.period-heading strong{display:block;font-family:var(--serif);font-size:24px;line-height:1.6}.period-heading small{display:block;font-size:11px;line-height:1.8;color:var(--muted);margin-top:5px}.period-heading svg{width:17px;height:17px;transform:rotate(90deg)}.period-heading[aria-expanded=true] svg{transform:rotate(-90deg)}.period-question{font-size:14px;line-height:1.9;color:var(--muted);padding:23px 0 0}.period-section+.period-section{border-top:1px solid var(--line);margin-top:23px}.material-view>img.artifact-image{object-fit:contain;background:#3d3c38;object-position:center}.inspect-media{width:100%;height:auto;display:block;margin:17px 0}.periods+.line-ending{margin-top:35px}.node-image img{object-fit:cover}.time-node[data-node="han-jin-01"] .node-image img{object-fit:contain;background:#3d3c38}
@media(max-width:350px){.period-heading strong{font-size:21px}.period-heading small{font-size:10px}.period-question{font-size:13px}}

@media(max-width:759px){.timeline-intro{padding:25px 0 20px}.period-heading{padding:16px 0}.period-question{padding-top:12px}}

.artifact-node img{object-fit:contain;background:#3d3c38}
/* Cover-mode safe insets protect the header, reading anchor and dialogs on iPhone. */
:root{--safe-top:env(safe-area-inset-top,0px);--header-height:70px}
body{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.site-header{height:calc(var(--header-height) + var(--safe-top));padding-top:var(--safe-top)}
.timeline-position{top:calc(var(--header-height) + var(--safe-top))}
.event-reading{scroll-margin-top:calc(90px + var(--safe-top))}
.skip{top:var(--safe-top)}
dialog{left:env(safe-area-inset-left,0px);right:env(safe-area-inset-right,0px);top:env(safe-area-inset-top,0px);bottom:env(safe-area-inset-bottom,0px);width:calc(100% - 24px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));max-height:min(85svh,calc(100svh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)))}
@media(min-width:760px){:root{--header-height:76px}}