*{box-sizing:border-box}
:root{--ink:#c5cfca;--dim:#8c9e99;--dark:#03171a;--red:#c95045;--gold:#c5ae7c;--line:#687c7155;--top:2.9dvh;--band:4.35dvh;--foot:4.2dvh}
html,body{margin:0;height:100%;overflow:hidden;background:#1c3232}
body{font-family:Georgia,"Noto Serif SC","Songti SC","SimSun",serif;color:var(--ink)}
button,input{font-family:inherit}button{color:inherit;border:0;background:none;cursor:pointer}button:disabled{opacity:.32;cursor:default}a{color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,#stage:focus-visible{outline:2px solid #e4c681;outline-offset:3px}
[hidden]{display:none!important}.filter-defs{position:absolute;pointer-events:none}
.exhibition{height:100dvh;display:grid;grid-template-rows:var(--top) var(--band) minmax(0,1fr) var(--foot) 1dvh;overflow:hidden;background:#1c3232;position:relative}
.top-line,.bottom-line{position:relative;background:#e2dc38;z-index:15}
.top-line{border-bottom:.72dvh solid var(--red)}.bottom-line{border-top:1px solid #b7a529}
.top-margin,.bottom-margin{position:relative;z-index:9;pointer-events:none}
.top-margin .brand,.bottom-margin span{display:none}
.top-actions{position:absolute;right:18px;top:0;height:100%;display:flex;align-items:center;gap:20px;font:14px "Microsoft YaHei",sans-serif;opacity:.7}
.top-actions button{pointer-events:auto;padding:4px 0}.top-actions:hover,.top-actions:focus-within{opacity:1}
#colorStack{position:absolute;left:1vw;top:1.35dvh;height:3dvh;display:flex;gap:.62vw;overflow:hidden;pointer-events:none}
#colorStack span{display:block;width:3.45vw;min-width:25px;height:5.7dvh;border-radius:1.35vw 1.35vw 0 0}
#colorStack span:nth-child(1){background:#4b282b}
#colorStack span:nth-child(2){background:#183851}
#colorStack span:nth-child(3){background:#566665}
.exhibition>main{position:relative;min-height:0;display:grid;grid-template-columns:32.95% 33.55% 33.5%;background:var(--dark)}
.text-field,#sidebar{min-width:0;overflow:hidden;background:var(--dark);position:relative}
.left-field{grid-column:1;scrollbar-width:thin;scrollbar-color:#526d65 transparent}
#sidebar{grid-column:3}
.sidebar-scroll{height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#526d65 transparent}
.ambient-copy{margin-top:9.3dvh;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(25px,2.32vw,70px);line-height:1.15;color:#64747b;opacity:.57;pointer-events:none;user-select:none;overflow:hidden}
.marquee-row{width:100%;overflow:hidden;height:1.15em}
.marquee-track{display:flex;width:max-content;will-change:transform;animation:drift var(--duration,75s) linear infinite;animation-delay:var(--delay,0s)}
.marquee-track span{white-space:pre;display:block;flex:none;padding-right:2em}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.page-paused .marquee-track{animation-play-state:paused}
.gallery{position:absolute;inset:calc(-1 * var(--band)) 0 calc(-1 * var(--foot));z-index:5;pointer-events:none;overflow:hidden}
#stage{position:absolute;inset:0;overflow:hidden;pointer-events:none;touch-action:none}
#world{position:absolute;transform-origin:0 0;pointer-events:auto;cursor:grab;isolation:isolate}
#stage.dragging #world{cursor:grabbing}
#whole{display:block;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
#focusVeil{position:absolute;inset:0;background:#051012;opacity:0;transition:opacity .3s;pointer-events:none}
#world.has-focus #focusVeil{opacity:.78}
#focusAsset{position:absolute;pointer-events:none;z-index:2;filter:url(#glassPaint);image-rendering:auto;user-select:none}
#hotspots{position:absolute;inset:0}
.hotspot{position:absolute;padding:0;border:1px solid transparent;touch-action:none}
.hotspot:hover{border-color:#f4ddb570;background:#ffe6ad08}
.hotspot.selected{border-color:#e7d19a60}
.hotspot span{position:absolute;left:0;top:0;transform:scale(var(--badgeScale,1));transform-origin:top left;font:14px/1.3 Georgia,serif;color:#ead29e;background:#102025ef;border:1px solid #b6a57370;padding:1px 3px;min-width:18px}
.hide-labels .hotspot span{display:none}
.view-top,.view-bottom{position:absolute;z-index:4;pointer-events:none;font-family:"Microsoft YaHei",sans-serif}
.view-top{top:calc(var(--band) + 16px);left:18px;right:18px;display:flex;justify-content:space-between;align-items:center;font-size:14px}
.view-top>*{background:#132025e0;padding:8px 10px}
.view-top button{pointer-events:auto;font:14px Georgia,serif}
#viewTitle{opacity:0}.is-reading #viewTitle{opacity:1}.switch{display:none}
.view-bottom{bottom:18px;right:18px;display:flex;align-items:flex-end;flex-direction:column;gap:8px}
.view-bottom p{font-size:14px;margin:0;color:#9dadab;background:#132025e6;padding:6px 10px}
.zoom-controls{display:flex;align-items:center;background:#132025f2;border:1px solid #d2b77b45;pointer-events:auto;height:42px}
.zoom-controls button{width:39px;height:40px;font-size:22px}
.zoom-controls button:hover{background:#ffffff12}
.zoom-controls output{font:14px Georgia,serif;width:48px;text-align:center}
.zoom-controls i{height:19px;border-left:1px solid #bcb29244}
#minimap{position:absolute;bottom:116px;right:18px;width:48px;height:auto;aspect-ratio:661/1030;background:#152024;border:1px solid #c4b89250;padding:0;overflow:hidden;pointer-events:auto;opacity:.7;z-index:4}
#minimap img{width:100%;height:100%;object-fit:contain}
#map-rect{position:absolute;border:1px solid #e5bf7b;background:#eed09c20;max-width:100%;max-height:100%;pointer-events:none}
#loadState{position:absolute;inset:0;display:grid;place-items:center;font:15px "Microsoft YaHei",sans-serif;background:#242a2b;color:#b9b3a1}
.is-reading .left-field,.is-reading #sidebar{z-index:6;background:#061b1ff5;overflow-y:auto}
.is-reading .gallery{z-index:5}
.is-reading #world::before{opacity:0}
.is-reading #colorStack{opacity:.5}
#detail,.reading-inner{padding:35px 30px 55px}
.back{padding:0;font:14px "Microsoft YaHei",sans-serif;color:#9badaa;margin:0 0 22px;display:inline-block}
.detail-heading{display:flex;align-items:center;gap:18px;margin-bottom:17px}
#detailLetter{font:62px/1 Georgia,serif;color:var(--gold)}
.detail-heading h1{font-size:27px;font-weight:400;margin:0;letter-spacing:1px}
.kicker{font:13px/1.6 "Microsoft YaHei",sans-serif;letter-spacing:1px;color:#91a29f;margin:0 0 9px}
#detailImageButton{width:100%;height:180px;background:#21303450;display:grid;place-items:center;padding:9px;border:1px solid #92a19f33}
#detailImage{max-width:100%;height:155px;object-fit:contain;filter:url(#glassPaint)}
#detail p,.reading-inner p{font-size:16px;line-height:1.85;color:#b8c5bf;margin:8px 0 20px}
#detail h2,.reading-inner h3{font:14px/1.5 "Microsoft YaHei",sans-serif;letter-spacing:1px;color:#c8b588;margin:25px 0 7px}
#source,#leftSource{font:14px/1.8 "Microsoft YaHei",sans-serif;color:#beae89;text-underline-offset:5px}
.story-nav{margin-top:28px;padding-top:17px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font:14px "Microsoft YaHei",sans-serif;gap:8px}
.story-nav button{padding:8px 0}.story-nav span{font:13px Georgia,serif;color:#95a29b}
.reading-inner h2{font-size:31px;line-height:1.4;font-weight:400;color:#d5d8ce;margin:12px 0 29px}
.left-quote{font-size:clamp(22px,2.6vw,39px);line-height:1.65;color:#829a94;margin:60px 0 40px;letter-spacing:2px}
dialog{position:fixed;max-width:610px;width:calc(100% - 40px);max-height:90dvh;overflow:auto;background:#132327;color:#cad0c5;border:1px solid #bba67860;padding:40px;box-shadow:0 20px 80px #0008}
dialog::backdrop{background:#030a0ed4;backdrop-filter:blur(4px)}
dialog h1{font-size:30px;font-weight:400;margin:10px 0 25px}
dialog p{font-size:16px;line-height:1.9}
dialog blockquote{margin:28px 0;color:#c6b288;font-size:23px}
.dialog-close,.index-close{position:absolute;right:14px;top:8px;font-size:29px}
.about-credit{font:14px/1.8 "Microsoft YaHei",sans-serif;border-top:1px solid var(--line);padding-top:20px}
.index-heading{display:flex;justify-content:space-between;align-items:center}
.index-heading h2{font-size:25px;font-weight:400}.index-heading span{font:14px "Microsoft YaHei",sans-serif;color:#96a49d}
.tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:12px}
.tabs button{padding:10px 16px;font-size:16px;border-bottom:2px solid transparent;color:#91a39e}
.tabs button[aria-selected=true]{border-color:#c2ad7e;color:#e1decc}
.chapter{border-bottom:1px solid var(--line)}
.chapter-head{display:flex;align-items:center;width:100%;gap:14px;text-align:left;padding:15px 0}
.chapter-no{font:25px Georgia,serif;color:#ad9971}
.chapter-head strong{font-size:17px;font-weight:400}
.chapter-head small{display:block;font:14px "Microsoft YaHei",sans-serif;color:#91a39c;margin-top:5px}
.chevron{margin-left:auto;font-size:20px;color:#84958e}
.chapter-items{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;padding-bottom:16px}
.letter-button{border:1px solid #7e918680;font:22px Georgia,serif;min-height:42px}
.letter-button:hover,.letter-button.active{background:#647d713f;border-color:#d4bd87;color:#f4e1b8}
.search{display:flex;gap:12px;border:1px solid var(--line);padding:12px;margin:18px 0}
.search input{width:100%;min-width:0;background:none;border:0;color:#cad0c5;font:16px "Microsoft YaHei",sans-serif}
#alphabet{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
#noResults{font-size:14px;color:#99a49f}
@media(max-width:850px){
 #detail,.reading-inner{padding:25px 18px 50px}
 .detail-heading{gap:10px}#detailLetter{font-size:42px}.detail-heading h1,.reading-inner h2{font-size:23px}
 .left-quote{margin:35px 0;font-size:25px}
}
@media(max-width:600px){
 :root{--top:2dvh;--band:4dvh;--foot:3dvh}
 .top-line{border-bottom:.5dvh solid var(--red)}
 .exhibition>main{grid-template-columns:15% 70% 15%}
 .top-actions{right:10px;gap:14px;font-size:13px}
 #colorStack{left:7px;top:1dvh;gap:5px;height:3dvh}
 #colorStack span{width:25px;min-width:25px;height:39px;border-radius:10px 10px 0 0}
 .ambient-copy{font-size:25px;line-height:1.14;margin-top:10dvh}
 .view-top{left:8px;right:8px;top:calc(var(--band) + 9px)}#viewTitle{display:none}
 .view-bottom{right:9px;bottom:9px}.view-bottom p{display:none}
 .zoom-controls{height:39px}.zoom-controls button{width:33px;height:37px;font-size:21px}
 .zoom-controls output{width:43px;font-size:14px}#minimap{width:32px;height:auto;right:9px;bottom:57px}
 .is-reading .exhibition>main{grid-template-columns:1fr 1fr;grid-template-rows:52% 48%}
 .is-reading .gallery{bottom:48%;top:calc(-1 * var(--band))}
 .is-reading .left-field{grid-column:1;grid-row:2;border-top:1px solid var(--line)}
 .is-reading #sidebar{grid-column:2;grid-row:2;border-top:1px solid var(--line)}
 #detail,.reading-inner{padding:15px 13px 35px}
 .back{font-size:14px;margin-bottom:12px}#detailLetter{font-size:34px}
 .detail-heading h1,.reading-inner h2{font-size:20px}.kicker{font-size:12px}
 #detailImageButton{height:125px}#detailImage{height:106px}
 .left-quote{font-size:21px;margin:28px 0}
 .story-nav{flex-wrap:wrap;font-size:14px}
 dialog{padding:30px 22px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.marquee-track{animation:none!important;transform:none!important}}

/* Keep navigation above the reading panes, with one-screen-pixel selection outlines. */
.view-top{top:calc(var(--top) + var(--band) + 16px);z-index:12}
.view-bottom{bottom:calc(1dvh + 18px);z-index:12}
#minimap{bottom:calc(1dvh + 116px);z-index:12}
.hotspot{border-width:var(--border-width,1px)}
.hide-labels .hotspot:hover{border-color:transparent;background:transparent}
@media(max-width:600px){.view-top{top:calc(var(--top) + var(--band) + 9px)}.view-bottom{bottom:calc(1dvh + 9px)}#minimap{bottom:calc(1dvh + 57px)}}